init
This commit is contained in:
@@ -1,15 +0,0 @@
|
|||||||
package com.ns.mobile.website.biz.exception;
|
|
||||||
|
|
||||||
public class DuplicateLoginException extends CommonException {
|
|
||||||
|
|
||||||
private static final long serialVersionUID = -1609054675554685549L;
|
|
||||||
|
|
||||||
public DuplicateLoginException() {
|
|
||||||
super(MSG_NOT_LOGIN);
|
|
||||||
}
|
|
||||||
|
|
||||||
public DuplicateLoginException(String message) {
|
|
||||||
super(message);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
@@ -1,27 +0,0 @@
|
|||||||
|
|
||||||
package com.ns.mobile.website.biz.exception;
|
|
||||||
|
|
||||||
import org.springframework.security.core.AuthenticationException;
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 로그인 실패 관련 예외
|
|
||||||
*/
|
|
||||||
public class LoginFailException extends AuthenticationException {
|
|
||||||
|
|
||||||
private static final long serialVersionUID = -4359790706288929704L;
|
|
||||||
|
|
||||||
private LoginFailMessage loginFailMessage;
|
|
||||||
|
|
||||||
public LoginFailException(LoginFailMessage loginFailMessage) {
|
|
||||||
super(loginFailMessage.getMessage());
|
|
||||||
this.loginFailMessage = loginFailMessage;
|
|
||||||
}
|
|
||||||
|
|
||||||
public LoginFailMessage getLoginFailMessage() {
|
|
||||||
return loginFailMessage;
|
|
||||||
}
|
|
||||||
|
|
||||||
public void setLoginFailMessage(LoginFailMessage loginFailMessage) {
|
|
||||||
this.loginFailMessage = loginFailMessage;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,21 +0,0 @@
|
|||||||
package com.ns.mobile.website.biz.exception;
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 로그인 실패 관련 메세지
|
|
||||||
*/
|
|
||||||
public enum LoginFailMessage {
|
|
||||||
|
|
||||||
USER_NOT_FOUND("아이디 또는 비밀번호가 정확하지 않습니다."),
|
|
||||||
USER_USING_STOP("이용이 중지된 회원입니다.");
|
|
||||||
|
|
||||||
private final String message;
|
|
||||||
|
|
||||||
LoginFailMessage(String message) {
|
|
||||||
this.message = message;
|
|
||||||
}
|
|
||||||
|
|
||||||
public String getMessage() {
|
|
||||||
return message;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
@@ -1,13 +0,0 @@
|
|||||||
package com.ns.mobile.website.biz.exception;
|
|
||||||
|
|
||||||
|
|
||||||
public class NoExistsBizException extends CommonException {
|
|
||||||
|
|
||||||
public NoExistsBizException() {
|
|
||||||
super();
|
|
||||||
}
|
|
||||||
|
|
||||||
public NoExistsBizException(String message) {
|
|
||||||
super(message);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,15 +0,0 @@
|
|||||||
package com.ns.mobile.website.biz.exception;
|
|
||||||
|
|
||||||
public class NotAuthException extends BizException {
|
|
||||||
|
|
||||||
private static final long serialVersionUID = 6890799958690708246L;
|
|
||||||
|
|
||||||
public NotAuthException() {
|
|
||||||
super(MSG_NOT_AUTH_ERROR);
|
|
||||||
}
|
|
||||||
|
|
||||||
public NotAuthException(String message) {
|
|
||||||
super(message);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
@@ -1,15 +0,0 @@
|
|||||||
package com.ns.mobile.website.biz.exception;
|
|
||||||
|
|
||||||
public class NotSelectedCafeException extends CommonException {
|
|
||||||
|
|
||||||
private static final long serialVersionUID = -1609054675554685549L;
|
|
||||||
|
|
||||||
public NotSelectedCafeException() {
|
|
||||||
super(MSG_NOT_LOGIN);
|
|
||||||
}
|
|
||||||
|
|
||||||
public NotSelectedCafeException(String message) {
|
|
||||||
super(message);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
@@ -35,25 +35,6 @@ public class SiteExceptionHandler {
|
|||||||
ResponseUtils.htmlAlertAndHistoryBack(response, exception.getMessage());
|
ResponseUtils.htmlAlertAndHistoryBack(response, exception.getMessage());
|
||||||
}
|
}
|
||||||
|
|
||||||
@SneakyThrows
|
|
||||||
@ExceptionHandler(value = {NoExistsBizException.class})
|
|
||||||
public void notExistsBizExceptionHandler(CommonException exception, Model model, HttpServletRequest request, HttpServletResponse response) {
|
|
||||||
|
|
||||||
String message = exception.getMessage();
|
|
||||||
if (SU.isEmpty(message)) {
|
|
||||||
message = "존재하지 않는 회사입니다.";
|
|
||||||
}
|
|
||||||
|
|
||||||
log.info(exception.getMessage());
|
|
||||||
model.addAttribute("exception", exception);
|
|
||||||
|
|
||||||
if (RequestUtils.isApiCall(request)) {
|
|
||||||
ResponseUtils.responseJsonFailMessage(response, "", message);
|
|
||||||
}
|
|
||||||
|
|
||||||
ResponseUtils.htmlAlertAndLocation(request, response, message, "/home");
|
|
||||||
}
|
|
||||||
|
|
||||||
@SneakyThrows
|
@SneakyThrows
|
||||||
@ExceptionHandler(value = {BizApiException.class})
|
@ExceptionHandler(value = {BizApiException.class})
|
||||||
public ResponseEntity<?> apiExcetpionHandler(BizApiException exception, HttpServletRequest request, HttpServletResponse response) {
|
public ResponseEntity<?> apiExcetpionHandler(BizApiException exception, HttpServletRequest request, HttpServletResponse response) {
|
||||||
@@ -74,28 +55,6 @@ public class SiteExceptionHandler {
|
|||||||
ResponseUtils.htmlAlertAndLocation(request, response, NotLoginException.MSG_NOT_LOGIN, Res.URL_LOGIN_PAGE);
|
ResponseUtils.htmlAlertAndLocation(request, response, NotLoginException.MSG_NOT_LOGIN, Res.URL_LOGIN_PAGE);
|
||||||
}
|
}
|
||||||
|
|
||||||
@SneakyThrows
|
|
||||||
@ExceptionHandler(value = {NotSelectedCafeException.class})
|
|
||||||
public void notSelectedCafeExcetpionHandler(NotSelectedCafeException exception, HttpServletRequest request, HttpServletResponse response) {
|
|
||||||
|
|
||||||
if (RequestUtils.isApiCall(request)) {
|
|
||||||
ResponseUtils.responseJsonFailMessage(response, "", NotSelectedCafeException.MSG_NOT_SELECTED_CAFE);
|
|
||||||
}
|
|
||||||
|
|
||||||
ResponseUtils.htmlAlertAndLocation(request, response, NotSelectedCafeException.MSG_NOT_SELECTED_CAFE, Res.URL_HOME);
|
|
||||||
}
|
|
||||||
|
|
||||||
@SneakyThrows
|
|
||||||
@ExceptionHandler(value = {DuplicateLoginException.class})
|
|
||||||
public void duplicateLoginExceptionHandler(DuplicateLoginException exception, HttpServletRequest request, HttpServletResponse response) {
|
|
||||||
|
|
||||||
if (RequestUtils.isApiCall(request)) {
|
|
||||||
ResponseUtils.responseJsonFailMessage(response, "", NotSelectedCafeException.MSG_DUBPLICATE_LOGIN);
|
|
||||||
}
|
|
||||||
|
|
||||||
ResponseUtils.htmlAlertAndLocation(request, response, NotSelectedCafeException.MSG_DUBPLICATE_LOGIN, Res.URL_HOME);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -9,7 +9,6 @@ import org.springframework.beans.factory.annotation.Autowired;
|
|||||||
import org.springframework.core.env.Environment;
|
import org.springframework.core.env.Environment;
|
||||||
import org.springframework.web.servlet.HandlerInterceptor;
|
import org.springframework.web.servlet.HandlerInterceptor;
|
||||||
|
|
||||||
import com.ns.mobile.website.biz.exception.DuplicateLoginException;
|
|
||||||
import com.ns.mobile.website.biz.exception.NotLoginException;
|
import com.ns.mobile.website.biz.exception.NotLoginException;
|
||||||
import com.ns.mobile.website.common.util.AnnotationUtils;
|
import com.ns.mobile.website.common.util.AnnotationUtils;
|
||||||
import com.ns.mobile.website.common.util.DateUtils;
|
import com.ns.mobile.website.common.util.DateUtils;
|
||||||
|
|||||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@@ -1,178 +0,0 @@
|
|||||||
@charset "utf-8";
|
|
||||||
|
|
||||||
html,body {width:100%;margin:0px;padding:0px;font-family:sans-serif;}
|
|
||||||
ul, li{margin:0;padding:0;list-style:none}
|
|
||||||
.container{width:100%;max-width:1400px;margin:0 auto;overflow:visible;}
|
|
||||||
.gallery{margin:50px -20px;box-sizing:border-box;position: relative;}
|
|
||||||
.gallery:after{content:"";display:block;clear:both;visibility: hidden;}
|
|
||||||
.gallery li{width:31%;float:left;box-sizing:border-box;padding:0 20px;margin:0 0 50px 20px; border: 1px solid;}
|
|
||||||
.gallery li img{width:100%;height:auto;}
|
|
||||||
|
|
||||||
@media (max-width:1024px){
|
|
||||||
.container .gallery li{width:50%;}
|
|
||||||
}
|
|
||||||
@media (max-width:480px){
|
|
||||||
.container .gallery li{width:100%;}
|
|
||||||
}
|
|
||||||
|
|
||||||
.mainWrap{
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.img_wrap{
|
|
||||||
width: 1400px;
|
|
||||||
height: 600px;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
/* 롤링 이미지 UL */
|
|
||||||
.rollimgs {
|
|
||||||
list-style: none;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
.rollimgs li{
|
|
||||||
position: absolute;
|
|
||||||
width: 1400px;
|
|
||||||
height: 600px;
|
|
||||||
left: 1400px;
|
|
||||||
}
|
|
||||||
.rollimgs li img{
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rollimgs li.currentroll{
|
|
||||||
left: 0;
|
|
||||||
transition: left .5s ease-in-out, right .5s ease-in-out;
|
|
||||||
}
|
|
||||||
.rollimgs li.prevroll{
|
|
||||||
left: -1400px;
|
|
||||||
transition: left .5s ease-in-out, right .5s ease-in-out;
|
|
||||||
}
|
|
||||||
.rollimgs.reverse li.prevroll{
|
|
||||||
transition: none;
|
|
||||||
}
|
|
||||||
.rollimgs li.nextroll{
|
|
||||||
left: 1400px;
|
|
||||||
display: block;
|
|
||||||
transition: none;
|
|
||||||
}
|
|
||||||
.rollimgs.reverse li.nextroll{
|
|
||||||
transition: left .5s ease-in-out, right .5s ease-in-out;
|
|
||||||
}
|
|
||||||
|
|
||||||
.search-box {max-width: 1440px; margin: 0 auto; z-index: 30; position: relative; border-top: 9px solid #0e3059; box-shadow: 0.845px 1.813px 6.58px 0.42px rgba(0, 0, 0, 0.18);}
|
|
||||||
.search-box .search-heading {padding: 25px 30px; background: #fff;}
|
|
||||||
.search-box .search-heading strong {font-size: 16px; letter-spacing: -0.8px; line-height: 1;}
|
|
||||||
.search-box .search-heading span {color:#666; font-size: 14px; font-weight: 400; display: inline-block; padding: 0 16px 0 18px 0; line-height: 1;}
|
|
||||||
.search-box .search-heading p {display: inline-block; font-size: 14px; letter-spacing: -0.6px; color:#666;}
|
|
||||||
.search-box .search-body {background: #f7f7f7; padding: 47px 42px; display: flex; }
|
|
||||||
.search-box .search-body strong {font-size: 20px; letter-spacing: -1px; display: inline-block; padding-right: 17px;}
|
|
||||||
.search-box .search-body .l,.search-box .search-body .r {display: flex; align-items: center; flex-wrap: wrap;}
|
|
||||||
.search-box .search-body .l {width: 40%;}
|
|
||||||
.search-box .search-body .r {width: 60%;}
|
|
||||||
.search-box .search-body .check-row {display: flex; align-items: center; padding: 0 15px; flex-wrap: wrap; align-items: center;}
|
|
||||||
.search-box .input-wrap {padding: 0 17px;}
|
|
||||||
.search-box .input-wrap {display: inline-block;}
|
|
||||||
.display-wrap { max-width: 1000px; margin: 0 auto}
|
|
||||||
.display1 {
|
|
||||||
position: relative;
|
|
||||||
line-height: 1;
|
|
||||||
position: rleative; margin-bottom: 30px;
|
|
||||||
border-bottom: 1px solid rgba(34,34,34,.3);
|
|
||||||
}
|
|
||||||
.display1 h1 {display: inline-block; font-weight: 700; position: relative; padding-bottom:18px;}
|
|
||||||
.display1 h1:after {content: ''; position: absolute; bottom:0; left:0; height:8px; width: 100%; background: #222; display: inline-block; z-index: 1; }
|
|
||||||
.display1 h1 span.small { font-size: 30px; font-weight: 500; display: inline-block; padding-left: 5px; }
|
|
||||||
.display1 p { font-size: 16px; font-weight: 300; display: inline-block; color:#555; line-height: inherit;}
|
|
||||||
.display1 p b {font-weight: 500;}
|
|
||||||
.display1 p span.dash { display:inline-block; padding: 0 17px;}
|
|
||||||
|
|
||||||
.display1.dispaly1-sub h1 {font-weight: 500;}
|
|
||||||
/* 상품리스트 */
|
|
||||||
.pd_section .max-container {max-width: 1000px; margin: 0 auto; padding-top: 127px;} /* overflow-x: hidden;*/
|
|
||||||
.pd-list {margin: 0 -15px; display: flex; flex-wrap: wrap;}
|
|
||||||
.pd-list:after {content: ''; display: block; overflow: hidden; width: 100%; clear:both;}
|
|
||||||
.pd-list li {width: 33.33333%; float: left; padding: 0 15px; margin: 32px 0;}
|
|
||||||
.pd-list li a {display: inline-block; width: 100%; height:100%; border: 1px solid #dfdfdf; background: #fff;
|
|
||||||
flex-direction: column; justify-content: space-between;
|
|
||||||
}
|
|
||||||
.pd-list li a .top {position: relative;}
|
|
||||||
.pd-list li a .top img {max-width: 100%;}
|
|
||||||
.pd-list li a .top .thumb {width: 100%; max-width: 159px; margin: 0 auto;}
|
|
||||||
.pd-list li a .top .labels {position: absolute; top:0; left:0; transform: translateY(-19px); padding-left: 10px; z-index: 5;}
|
|
||||||
.pd-list li a .top .tel {position: absolute; right:0; top:0; padding: 18px 22px; z-index: 5;}
|
|
||||||
.pd-list li a .top .tel img {display: block;}
|
|
||||||
.pd-list li a .top .tel img+img {margin-top: 10px;}
|
|
||||||
.pd-list li a .top .thumb {padding: 18px 0 0px 0; transform:scale(1); transition: 0.3s; display:inline-block; min-height: 270px; display: flex; align-items: center; justify-content: center;}
|
|
||||||
.pd-list li a .top .txt {padding: 14px 0 32px 0;}
|
|
||||||
.pd-list li a .top strong {font-size: 21px; color:#222; letter-spacing: -1.25px; padding-bottom:18px; display: block; text-align: center; width: 100%; word-break: keep-all;}
|
|
||||||
.pd-list li a .top p {font-size: 18px; letter-spacing: -0.9px; font-weight: 300; text-align: center;}
|
|
||||||
.pd-list li a .top p {white-space: nowrap; text-overflow:ellipsis; padding: 0 15px; line-height: 1; overflow: hidden; line-height: 1.6;}
|
|
||||||
.pd-list li a .bot {position: relative; background:#f7f7f7; padding: 24px 0; text-align: center; border-top: 1px solid #dfdfdf; }
|
|
||||||
.pd-list li a .bot .price1 {font-size: 28px; color:#ff304f; font-weight: 700; letter-spacing: 0.48px;}
|
|
||||||
.pd-list li a .bot .price1 span {font-size: 16px; font-weight: 500; color:#222; display: inline-block; padding-left: 5px; }
|
|
||||||
.pd-list li a .bot .price2 {font-size: 18px; font-weight: 300; letter-spacing: -0.9px; padding-top:13px;}
|
|
||||||
.pd-list li:hover a .top .thumb img {transform:scale(1.1); transform-origin: center; transition: 0.3s; position: relative; z-index: 2;}
|
|
||||||
.pd-list li:hover a {border-color:#0e3059;}
|
|
||||||
.pd-list li:hover a .bot { background: #0e3059;}
|
|
||||||
.pd-list li:hover a .bot .price1 span {color:#fff;}
|
|
||||||
.pd-list li:hover a .bot .price2 {color:#fff;}
|
|
||||||
.pd-list.pd-list-main {padding-top: 10px; min-height:100px; display: flex; flex-wrap: wrap;}
|
|
||||||
|
|
||||||
@media (max-width:950px) {
|
|
||||||
.pd_section .max-container {padding-top: 100px;}
|
|
||||||
.pd-list li {width: 50%; margin: 15px 0;}
|
|
||||||
.pd-list {margin: 0; padding: 0;}
|
|
||||||
.pd-list li {padding: 0 10px;}
|
|
||||||
.pd-list li a .top .labels {padding-left: 3px;}
|
|
||||||
.pd-list li a .top .labels img {width: 45px; max-width: 100%; display: inline-block;}
|
|
||||||
.pd-list li a .top .thumb {max-width: 100px;}
|
|
||||||
.pd-list li a .top .tel {padding: 10px 12px; }
|
|
||||||
.pd-list li a .top .txt {padding: 15px 0 18px 0;}
|
|
||||||
.pd-list li a .top .txt strong {padding-bottom: 10px; font-size: 17px;}
|
|
||||||
.pd-list li a .top .txt p {font-size: 14px;}
|
|
||||||
.pd-list li a .top .tel img {padding-top:7px; max-width: 20px }
|
|
||||||
.pd-list li a .top .tel img+img{margin-top:2px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width:500px) {
|
|
||||||
.pd_section .max-container {padding-top:30px;}
|
|
||||||
.pd-list li a .top .labels img {width: 40px;}
|
|
||||||
.pd-list li a .top .thumb {max-width:75px; min-height: auto;}
|
|
||||||
.pd-list li a .bot {padding: 14px 0;}
|
|
||||||
.pd-list li a .bot .price1 {font-size: 23px;}
|
|
||||||
.pd-list li a .bot .price1 span {font-size: 13px;}
|
|
||||||
.pd-list li a .bot .price2 {font-size: 14px; padding-top: 10 px;}
|
|
||||||
.search-box .search-heading span {display: none;}
|
|
||||||
}
|
|
||||||
|
|
||||||
.main-banner {width: 100%; background: #212f3f; text-align: center; margin-top: 75px; cursor: pointer;
|
|
||||||
-webkit-box-shadow: inset 2px 23px 10px -17px rgba(0,0,0,0.55);
|
|
||||||
-moz-box-shadow: inset 2px 23px 10px -17px rgba(0,0,0,0.55);
|
|
||||||
box-shadow: inset 2px 23px 10px -17px rgba(0,0,0,0.55);
|
|
||||||
}
|
|
||||||
.main-banner .max-container {max-width: 1000px; margin: 0 auto; background:url('')no-repeat center center/cover; height: 100%; padding: 73px 0 57px 0;
|
|
||||||
-webkit-box-shadow: inset 2px 23px 10px -17px rgba(0,0,0,0.55); -moz-box-shadow: inset 2px 23px 10px -17px rgba(0,0,0,0.55); box-shadow: inset 2px 23px 10px -17px rgba(0,0,0,0.55); }
|
|
||||||
.main-banner .max-container img {max-width: 100%;}
|
|
||||||
|
|
||||||
@media (max-width:500px) {
|
|
||||||
.main-banner {margin-top:20px;}
|
|
||||||
.main-banner .max-container {padding: 53px 0 37px 0;}
|
|
||||||
.main-banner .max-container img {padding: 0 20px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
.subpage-banner {text-align: center; background: #ff415d;}
|
|
||||||
.subpage-banner .max-container {max-width: 1100px; margin: 0 auto; margin: 0 auto; background: url('http://luckyphone.kr/images/showcase-bg.png')no-repeat center center/cover; padding: 120px 0;}
|
|
||||||
|
|
||||||
.swiper-container { width: 100%; margin-left: auto; margin-right: auto; }
|
|
||||||
.swiper-slide { background-size: cover; background-position: center; }
|
|
||||||
.gallery-top { height: 418px; width: 100%; }
|
|
||||||
.gallery-thumbs { box-sizing: border-box; padding: 10px 0; margin: 0 auto;}
|
|
||||||
.gallery-thumbs .swiper-wrapper {justify-content: center;}
|
|
||||||
.gallery-thumbs .swiper-slide { height: 100%;background: #fff; border: 1px solid #dfdfdf; width: 110px !important; text-align: center; height: 110px; cursor:pointer}
|
|
||||||
.gallery-thumbs .swiper-slide-thumb-active {border-color:#0e3059;}
|
|
||||||
|
|
||||||
.swiper-slide img {max-height: 100%;}
|
|
||||||
.gallery-thumbs img {max-height: 100%;}
|
|
||||||
File diff suppressed because it is too large
Load Diff
@@ -1,28 +0,0 @@
|
|||||||
@charset "utf-8";
|
|
||||||
|
|
||||||
body .load-wrap {position:fixed;display:none;top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,.3);z-index:99999;align-items:center;justify-content:center;}
|
|
||||||
body.spinner .load-wrap {display:flex;}
|
|
||||||
.load-wrap .load-item {}
|
|
||||||
.load-spinner {position:relative;width:45px;height:45px;margin:0 auto}
|
|
||||||
.bubble-1,
|
|
||||||
.bubble-2 {position:absolute;top:0;width:25px;height:25px;border-radius:100%;background-color: #3e59ee;}
|
|
||||||
.bubble-2 {top:auto;bottom:0}
|
|
||||||
.load-item .spinner {animation:loading 2s linear infinite}
|
|
||||||
.load-item .bubble-1,
|
|
||||||
.load-item .bubble-2 {animation:bounce 2s ease-in-out infinite}
|
|
||||||
.load-item .bubble-2 {animation-delay:-1s}
|
|
||||||
@keyframes loading {
|
|
||||||
100% {
|
|
||||||
transform:rotate(360deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@keyframes bounce {
|
|
||||||
0%,
|
|
||||||
100% {
|
|
||||||
transform:scale(0);
|
|
||||||
}
|
|
||||||
50% {
|
|
||||||
transform:scale(1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@@ -1,650 +0,0 @@
|
|||||||
body,html {transition: 0.3s;}
|
|
||||||
header {width: 100%; background: #0e3059; height: 93px;
|
|
||||||
box-shadow: 0.845px 1.813px 6.58px 0.42px rgba(0, 0, 0, 0.18);
|
|
||||||
-moz-box-shadow: 0.845px 1.813px 6.58px 0.42px rgba(0, 0, 0, 0.18);
|
|
||||||
-webkit-box-shadow: 0.845px 1.813px 6.58px 0.42px rgba(0, 0, 0, 0.18);
|
|
||||||
position: relative; z-index: 100;
|
|
||||||
}
|
|
||||||
header .max-container {max-width: 1030px; margin: 0 auto; padding: 0 15px; position: relative; align-items: center; justify-content: center;; display: flex;}
|
|
||||||
header .logo,header .user {flex-basis: 0;}
|
|
||||||
header .logo {position: absolute;left:0; top:13px}
|
|
||||||
header .logo img {height:59px; width: 59px;}
|
|
||||||
header .user {width: 41px;}
|
|
||||||
header .user {position: relative; cursor: pointer;}
|
|
||||||
header .user .userMenu {background: #0e3059; position: absolute; width: 100%; width: 120px; right:0; margin-top:10px; border-radius: 10px; overflow: hidden;}
|
|
||||||
header .user .userMenu li {padding: 10px 0;}
|
|
||||||
header .user .userMenu li a {padding: 0 15px; display: inline-block; color:#fff;}
|
|
||||||
.userMenu {display: none;}
|
|
||||||
.userMenu.view {display: block;}
|
|
||||||
header nav {height: 100%; position: relative; width: auto;}
|
|
||||||
/* header nav ul li a {color:#fff; font-size: 18px; font-weight: bold; margin: 0 35px; padding: 0 15px;} */
|
|
||||||
/* tst css */
|
|
||||||
header nav ul li a {color:#fff; font-size: 16px; font-weight: bold; margin: 0 15px; padding: 0 15px;}
|
|
||||||
header nav>ul>li {display: inline-block; position: relative; line-height: 93px;}
|
|
||||||
header nav>ul>li>a span {display: inline-block; padding-left: 8px;}
|
|
||||||
header nav>ul>li ul {background: #081f3b;}
|
|
||||||
header nav>ul>li ul.sub-menu {position: absolute; bottom:0; top:100%; width: 100%; height:180px; overflow: hidden; bottom:-35px;
|
|
||||||
box-shadow: 0.845px 1.813px 6.58px 0.42px rgba(0, 0, 0, 0.18);
|
|
||||||
-moz-box-shadow: 0.845px 1.813px 6.58px 0.42px rgba(0, 0, 0, 0.18);
|
|
||||||
-webkit-box-shadow: 0.845px 1.813px 6.58px 0.42px rgba(0, 0, 0, 0.18);
|
|
||||||
background:'';
|
|
||||||
}
|
|
||||||
.sub-menu {display: none;}
|
|
||||||
.sub-menu.view {display: block;}
|
|
||||||
header nav>ul>li ul.sub-menu li {padding:10px 0; background: #081f3b; line-height: 1; }
|
|
||||||
header nav>ul>li ul.sub-menu li+li {border-top: 1px solid rgba(255,255,255,0.1);}
|
|
||||||
header nav>ul>li ul.sub-menu li a {display: inline-block; padding:0 15px; color:#fff; font-weight: 400; font-size: 16px; width: 100%;}
|
|
||||||
header nav ul.sub-menu li:hover {background:#ff415d; color:#fff;}
|
|
||||||
header nav ul.sub-menu li:hover {border-color:#ff415d;}
|
|
||||||
|
|
||||||
@media (max-width:800px) {
|
|
||||||
header {height: auto; padding: 10px 0;}
|
|
||||||
header .logo {position: relative; top:0;}
|
|
||||||
header .max-container {display: block;}
|
|
||||||
header nav>ul { display: block;}
|
|
||||||
header .logo {text-align: center;}
|
|
||||||
header .logo img {height: 100%; max-height: auto; width: 40px;}
|
|
||||||
header .user img {width: 25px;}
|
|
||||||
header .user {position: absolute; right:0; top:0;}
|
|
||||||
header nav>ul {display: flex;}
|
|
||||||
header nav>ul>li {flex-grow: 1; text-align: center;}
|
|
||||||
header nav>ul>li a { padding: 0; margin:0 10px; font-size: 14px;}
|
|
||||||
header nav>ul>li>a span {display: inline-block; padding-left: 4px;}
|
|
||||||
header nav>ul>li>a span img {width: 10px;}
|
|
||||||
header nav>ul>li {line-height: 2;}
|
|
||||||
header nav>ul>li ul.sub-menu li {text-align: left;}
|
|
||||||
header nav>ul>li ul.sub-menu li a {font-size: 15px;}
|
|
||||||
|
|
||||||
/* index */
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* usermenu */
|
|
||||||
.usermenu-container {background: #0f2141;}
|
|
||||||
.cosmosfarm-members-account-links {max-width: 1000px; margin: 0 auto; text-align: right;}
|
|
||||||
.cosmosfarm-members-account-links > div {display: inline-block; padding: 6px 0;}
|
|
||||||
.cosmosfarm-members-account-links > div a {color:#fff;display:inline-block; padding: 6px; opacity: 0.9;}
|
|
||||||
|
|
||||||
@media (max-width:576px) {
|
|
||||||
.index-main {}
|
|
||||||
header { transition: 0.2s;}
|
|
||||||
header.mobile {position: fixed; width: 100%; top:40px;}
|
|
||||||
header.scroll {top:0;}
|
|
||||||
.usermenu-container.mobile {position: fixed; top:0; left:0; width: 100%; z-index: 100; height: 40px; overflow: hidden; transition: 0.2s;}
|
|
||||||
.usermenu-container.absol {position: absolute; height: 0;}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* section1 -top slider */
|
|
||||||
/* .top-slide { height: 546px; position: relative; background: url('/images/slide1-bg.png')no-repeat center center/cover;} */
|
|
||||||
.top-slide .img-wrap {max-width: 1100px; margin: 0 auto;height: 100%; padding: 0 50px; position: relative; display: flex; justify-content: space-between;}
|
|
||||||
.top-slide .img-wrap .left { text-align: center; padding-top: 40px;}
|
|
||||||
.top-slide .img-wrap .right { display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: 20px;}
|
|
||||||
.top-slide img {max-width: 100%;}
|
|
||||||
|
|
||||||
@media (max-width:950px) {
|
|
||||||
.top-slide {height: auto;}
|
|
||||||
.top-slide .img-wrap {display: block;}
|
|
||||||
.top-slide .img-wrap .right {display: block; text-align: center; padding-top:3.5vh;}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width:576px) {
|
|
||||||
body.scroll {margin-top: 100px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
.search-box {max-width: 1440px; margin: 0 auto; z-index: 30; position: relative; border-top: 9px solid #0e3059; box-shadow: 0.845px 1.813px 6.58px 0.42px rgba(0, 0, 0, 0.18);}
|
|
||||||
.search-box .search-heading {padding: 25px 30px; background: #fff;}
|
|
||||||
.search-box .search-heading strong {font-size: 16px; letter-spacing: -0.8px; line-height: 1;}
|
|
||||||
.search-box .search-heading span {color:#666; font-size: 14px; font-weight: 400; display: inline-block; padding: 0 16px 0 18px 0; line-height: 1;}
|
|
||||||
.search-box .search-heading p {display: inline-block; font-size: 14px; letter-spacing: -0.6px; color:#666;}
|
|
||||||
.search-box .search-body {background: #f7f7f7; padding: 47px 42px; display: flex; }
|
|
||||||
.search-box .search-body strong {font-size: 20px; letter-spacing: -1px; display: inline-block; padding-right: 17px;}
|
|
||||||
.search-box .search-body .l,.search-box .search-body .r {display: flex; align-items: center; flex-wrap: wrap;}
|
|
||||||
.search-box .search-body .l {width: 40%;}
|
|
||||||
.search-box .search-body .r {width: 60%;}
|
|
||||||
.search-box .search-body .check-row {display: flex; align-items: center; padding: 0 15px; flex-wrap: wrap; align-items: center;}
|
|
||||||
.search-box .input-wrap {padding: 0 17px;}
|
|
||||||
.search-box .input-wrap {display: inline-block;}
|
|
||||||
|
|
||||||
@media (max-width:950px) {
|
|
||||||
/* .search-box .search-body .l,.search-box .search-body .r {} */
|
|
||||||
.search-box .search-body strong {padding-bottom: 0;}
|
|
||||||
.search-box .input-wrap {padding: 0;}
|
|
||||||
.search-box .input-wrap+.input-wrap {padding-left: 17px;}
|
|
||||||
.search-box .search-body .check-row {padding: 0;}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width:950px) {
|
|
||||||
.search-box .input-wrap {display: block;}
|
|
||||||
.search-box .input-wrap+.input-wrap {margin-top: 0px;}
|
|
||||||
.search-box .search-body {display: block; padding: 38px 30px;}
|
|
||||||
.search-box .search-body .l {width: 100%;}
|
|
||||||
.search-box .search-body div+div {margin-top: 28px;}
|
|
||||||
.search-box .search-body .r {width: 100%;}
|
|
||||||
.search-box .input-wrap {display: block;}
|
|
||||||
.search-box .search-body .l,.search-box .search-body .r {display: block;}
|
|
||||||
.search-box .search-body strong {padding-bottom: 10px; display: block;}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* 상품리스트 */
|
|
||||||
.pd_section .max-container {max-width: 1000px; margin: 0 auto; padding-top: 127px;} /* overflow-x: hidden;*/
|
|
||||||
.pd-list {margin: 0 -15px; display: flex; flex-wrap: wrap;}
|
|
||||||
.pd-list:after {content: ''; display: block; overflow: hidden; width: 100%; clear:both;}
|
|
||||||
.pd-list li {width: 33.33333%; float: left; padding: 0 15px; margin: 32px 0;}
|
|
||||||
.pd-list li a {display: inline-block; width: 100%; height:100%; border: 1px solid #dfdfdf; background: #fff;
|
|
||||||
flex-direction: column; justify-content: space-between;
|
|
||||||
}
|
|
||||||
.pd-list li a .top {position: relative;}
|
|
||||||
.pd-list li a .top img {max-width: 100%;}
|
|
||||||
.pd-list li a .top .thumb {width: 100%; max-width: 159px; margin: 0 auto;}
|
|
||||||
.pd-list li a .top .labels {position: absolute; top:0; left:0; transform: translateY(-19px); padding-left: 10px; z-index: 5;}
|
|
||||||
.pd-list li a .top .tel {position: absolute; right:0; top:0; padding: 18px 22px; z-index: 5;}
|
|
||||||
.pd-list li a .top .tel img {display: block;}
|
|
||||||
.pd-list li a .top .tel img+img {margin-top: 10px;}
|
|
||||||
.pd-list li a .top .thumb {padding: 18px 0 0px 0; transform:scale(1); transition: 0.3s; display:inline-block; min-height: 270px; display: flex; align-items: center; justify-content: center;}
|
|
||||||
.pd-list li a .top .txt {padding: 14px 0 32px 0;}
|
|
||||||
.pd-list li a .top strong {font-size: 21px; color:#222; letter-spacing: -1.25px; padding-bottom:18px; display: block; text-align: center; width: 100%; word-break: keep-all;}
|
|
||||||
.pd-list li a .top p {font-size: 18px; letter-spacing: -0.9px; font-weight: 300; text-align: center;}
|
|
||||||
.pd-list li a .top p {white-space: nowrap; text-overflow:ellipsis; padding: 0 15px; line-height: 1; overflow: hidden; line-height: 1.6;}
|
|
||||||
.pd-list li a .bot {position: relative; background:#f7f7f7; padding: 24px 0; text-align: center; border-top: 1px solid #dfdfdf; }
|
|
||||||
.pd-list li a .bot .price1 {font-size: 28px; color:#ff304f; font-weight: 700; letter-spacing: 0.48px;}
|
|
||||||
.pd-list li a .bot .price1 span {font-size: 16px; font-weight: 500; color:#222; display: inline-block; padding-left: 5px; }
|
|
||||||
.pd-list li a .bot .price2 {font-size: 18px; font-weight: 300; letter-spacing: -0.9px; padding-top:13px;}
|
|
||||||
.pd-list li:hover a .top .thumb img {transform:scale(1.1); transform-origin: center; transition: 0.3s; position: relative; z-index: 2;}
|
|
||||||
.pd-list li:hover a {border-color:#0e3059;}
|
|
||||||
.pd-list li:hover a .bot { background: #0e3059;}
|
|
||||||
.pd-list li:hover a .bot .price1 span {color:#fff;}
|
|
||||||
.pd-list li:hover a .bot .price2 {color:#fff;}
|
|
||||||
.pd-list.pd-list-main {padding-top: 10px; min-height:100px; display: flex; flex-wrap: wrap;}
|
|
||||||
|
|
||||||
@media (max-width:950px) {
|
|
||||||
.pd_section .max-container {padding-top: 100px;}
|
|
||||||
.pd-list li {width: 50%; margin: 15px 0;}
|
|
||||||
.pd-list {margin: 0; padding: 0;}
|
|
||||||
.pd-list li {padding: 0 10px;}
|
|
||||||
.pd-list li a .top .labels {padding-left: 3px;}
|
|
||||||
.pd-list li a .top .labels img {width: 45px; max-width: 100%; display: inline-block;}
|
|
||||||
.pd-list li a .top .thumb {max-width: 100px;}
|
|
||||||
.pd-list li a .top .tel {padding: 10px 12px; }
|
|
||||||
.pd-list li a .top .txt {padding: 15px 0 18px 0;}
|
|
||||||
.pd-list li a .top .txt strong {padding-bottom: 10px; font-size: 17px;}
|
|
||||||
.pd-list li a .top .txt p {font-size: 14px;}
|
|
||||||
.pd-list li a .top .tel img {padding-top:7px; max-width: 20px }
|
|
||||||
.pd-list li a .top .tel img+img{margin-top:2px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width:500px) {
|
|
||||||
.pd_section .max-container {padding-top:30px;}
|
|
||||||
.pd-list li a .top .labels img {width: 40px;}
|
|
||||||
.pd-list li a .top .thumb {max-width:75px; min-height: auto;}
|
|
||||||
.pd-list li a .bot {padding: 14px 0;}
|
|
||||||
.pd-list li a .bot .price1 {font-size: 23px;}
|
|
||||||
.pd-list li a .bot .price1 span {font-size: 13px;}
|
|
||||||
.pd-list li a .bot .price2 {font-size: 14px; padding-top: 10 px;}
|
|
||||||
.search-box .search-heading span {display: none;}
|
|
||||||
}
|
|
||||||
|
|
||||||
.main-banner {width: 100%; background: #212f3f; text-align: center; margin-top: 75px; cursor: pointer;
|
|
||||||
-webkit-box-shadow: inset 2px 23px 10px -17px rgba(0,0,0,0.55);
|
|
||||||
-moz-box-shadow: inset 2px 23px 10px -17px rgba(0,0,0,0.55);
|
|
||||||
box-shadow: inset 2px 23px 10px -17px rgba(0,0,0,0.55);
|
|
||||||
}
|
|
||||||
.main-banner .max-container {max-width: 1000px; margin: 0 auto; background:url('')no-repeat center center/cover; height: 100%; padding: 73px 0 57px 0;
|
|
||||||
-webkit-box-shadow: inset 2px 23px 10px -17px rgba(0,0,0,0.55); -moz-box-shadow: inset 2px 23px 10px -17px rgba(0,0,0,0.55); box-shadow: inset 2px 23px 10px -17px rgba(0,0,0,0.55); }
|
|
||||||
.main-banner .max-container img {max-width: 100%;}
|
|
||||||
|
|
||||||
@media (max-width:500px) {
|
|
||||||
.main-banner {margin-top:20px;}
|
|
||||||
.main-banner .max-container {padding: 53px 0 37px 0;}
|
|
||||||
.main-banner .max-container img {padding: 0 20px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
footer .top {background: #3a3a3a; border-bottom: 1px solid #6c6c6c; padding: 18px 0; text-align: center;}
|
|
||||||
footer .top .f_list1 {display: inline-block;}
|
|
||||||
footer .top .f_list1 li {display: inline-block; padding: 0 15px; position: relative;}
|
|
||||||
footer .top .f_list1 li:before { content: ''; width: 1px; height: 50%; position: absolute; top:25%; left:0; background: #fff; opacity: 35%;}
|
|
||||||
footer .top .f_list1 li:nth-child(0):before {display: none;}
|
|
||||||
footer .top .f_list1 li a {color:#fff; font-size: 14px; opacity: 0.8; font-weight: 200; letter-spacing: .7px;}
|
|
||||||
footer .bot {padding: 49px 0px 55px; background: #2f3132;}
|
|
||||||
footer .bot .flex-container {display: flex; align-items: flex-start; margin: 0 auto; max-width: 1000px; position: relative;}
|
|
||||||
footer .bot .logo2 {position: absolute; right:0; top:0;}
|
|
||||||
footer .bot .logo {padding-right: 35px; padding-top:3px;}
|
|
||||||
footer .bot .txt-wrap p {color:#ccc; font-size: 14px; font-weight: 200; opacity: 93%; line-height: 20px; letter-spacing: 0.8px;}
|
|
||||||
footer .bot .txt-wrap .v-line {display: inline-block; padding: 0 15px; opacity: 0.5;}
|
|
||||||
footer .bot .txt-wrap .copy {padding-top:20px; font-size: 12px; opacity: 0.5; color:#ccc;}
|
|
||||||
|
|
||||||
@media (max-width:950px) {
|
|
||||||
footer .bot .flex-container {padding: 0 15px; flex-wrap:wrap;}
|
|
||||||
footer .bot .logo {padding-right: 0px;}
|
|
||||||
footer .bot .flex-container .logo {width: 23%;}
|
|
||||||
footer .bot .flex-container .logo2 {width: 100%; text-align: center; padding-top: 20px;}
|
|
||||||
footer .bot .flex-container .txt-wrap {width: 77%;}
|
|
||||||
footer .bot .txt-wrap p {font-size: 13px;}
|
|
||||||
footer .bot .txt-wrap .copy {font-size: 11px; padding-top: 10px;}
|
|
||||||
footer .top {padding: 10px 0;}
|
|
||||||
footer .top .f_list1 li {line-height: 25px;}
|
|
||||||
footer .top .f_list1 li a {font-size: 13px; font-weight: 300;}
|
|
||||||
footer .bot {padding: 29px 0;}
|
|
||||||
footer .bot .logo2 {position: relative; }
|
|
||||||
}
|
|
||||||
|
|
||||||
/****** 상품리스트 서브페이지 - pdList */
|
|
||||||
.subpage-banner {text-align: center; background: #ff415d;}
|
|
||||||
.subpage-banner .max-container {max-width: 1100px; margin: 0 auto; margin: 0 auto; background: url('http://luckyphone.kr/images/showcase-bg.png')no-repeat center center/cover; padding: 120px 0;}
|
|
||||||
|
|
||||||
/***** 상품 디테일 ****/
|
|
||||||
.pdList-subpage {max-width: 1030px; margin: 0 auto;}
|
|
||||||
.fluid-container {
|
|
||||||
padding-right: 15px;
|
|
||||||
padding-left: 15px;
|
|
||||||
margin-right: auto;
|
|
||||||
margin-left: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.swiper-container { width: 100%; margin-left: auto; margin-right: auto; }
|
|
||||||
.swiper-slide { background-size: cover; background-position: center; }
|
|
||||||
.gallery-top { height: 418px; width: 100%; }
|
|
||||||
.gallery-thumbs { box-sizing: border-box; padding: 10px 0; margin: 0 auto;}
|
|
||||||
.gallery-thumbs .swiper-wrapper {justify-content: center;}
|
|
||||||
.gallery-thumbs .swiper-slide { height: 100%;background: #fff; border: 1px solid #dfdfdf; width: 110px !important; text-align: center; height: 110px; cursor:pointer}
|
|
||||||
.gallery-thumbs .swiper-slide-thumb-active {border-color:#0e3059;}
|
|
||||||
|
|
||||||
.swiper-slide img {max-height: 100%;}
|
|
||||||
.gallery-thumbs img {max-height: 100%;}
|
|
||||||
|
|
||||||
#pd_Slider {text-align: center;}
|
|
||||||
#pd_thumbs {padding: 40px 40px 10px 40px;}
|
|
||||||
.swiper-button-next.swiper-button-white {color:#dfdfdf;}
|
|
||||||
.swiper-button-prev.swiper-button-white {color:#dfdfdf;}
|
|
||||||
|
|
||||||
.pd-default-area .row {padding-bottom:28px; border-bottom: 1px solid #dfdfdf; margin-bottom: 50px;}
|
|
||||||
.pd-default-area h3 {padding-bottom:20px;}
|
|
||||||
.display1.pd-name {margin-bottom:20px;}
|
|
||||||
|
|
||||||
.pd-right .display1 {margin-bottom: 18px;}
|
|
||||||
.pd-right .display1 h1{font-size: 38px;}
|
|
||||||
.pd-right .display1 h1:after {height: 3px;}
|
|
||||||
.pd-right .pannel {padding: 0 10px; padding-bottom: 25px;}
|
|
||||||
.pd-right .pannel.select-pannel {padding: 25px 26px;}
|
|
||||||
.pd-right .pannel {margin-bottom: 33px;}
|
|
||||||
.pd-right .colors {display: flex; flex-wrap:wrap; }
|
|
||||||
.pd-right .colors li {flex-basis: 20%; text-align: center; max-width: 20%; padding-top:25px; cursor:pointer;}
|
|
||||||
.pd-right .colors li .circle {width: 44px; height: 44px; background: #444; display: inline-block; border-radius: 50%; margin-bottom:15px;}
|
|
||||||
.pd-right .colors li .circle.active {border: 3px solid #ff415d; }
|
|
||||||
.pd-right .colors li p {font-size: 16px; font-weight: 500; word-break: keep-all; padding: 0 5px;}
|
|
||||||
.pd-right .relase-info {display: flex !important; justify-content: space-between; align-items: center; padding-bottom:60px;}
|
|
||||||
.pd-right .relase-info .r-price {font-size:21px; }
|
|
||||||
.pd-right .relase-info .r-price b {font-weight: bold;}
|
|
||||||
.pd-right .relase-info .r-tel img {display: inline-block; max-height: 21px; }
|
|
||||||
.pd-right .relase-info .r-tel img+img {margin-left: 9px;}
|
|
||||||
.pd-right.mobile-on .relase-info {padding-bottom:15px;}
|
|
||||||
|
|
||||||
@media (max-width: 600px) {
|
|
||||||
.pd-left {padding-bottom:60px;}
|
|
||||||
.gallery-top {height: 380px;}
|
|
||||||
.pd-right .relase-info.wide-relase-info {display: none !important;}
|
|
||||||
.pd-right.mobile-on .relase-info {padding-bottom: 60px;}
|
|
||||||
.gallery-thumbs .swiper-slide {width: 95px !important;height: 95px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
.pd-mid .pannel {padding: 25px 26px;}
|
|
||||||
.pd-mid .pannel p {font-size: 20px;}
|
|
||||||
.pd-default-area .pd-mid .row {padding-bottom: 70px;}
|
|
||||||
.pd-mid .l {display: flex; align-items: center; flex-direction: column; justify-content: center;}
|
|
||||||
.pd-mid .l p {font-size: 20px; font-weight: 500; letter-spacing: -1px; line-height: 1.25; padding: 20px 0 38px 0 ;}
|
|
||||||
.pd-mid .l .btn {width: 230px; text-align: center;}
|
|
||||||
.pd-mid .l .btn+.btn {margin-top: 8px;}
|
|
||||||
|
|
||||||
|
|
||||||
@media (max-width: 600px) {
|
|
||||||
.pd-mid .l {flex-direction: row; flex-wrap: wrap; justify-content: flex-start;}
|
|
||||||
.pd-mid .l p {display: none;}
|
|
||||||
.pd-mid .row .col-md-3.l {order:2;}
|
|
||||||
.pd-mid .row .col-md-9.r {order:1;}
|
|
||||||
.pd-mid .row .col-md-3.l .btn-row { display: flex; justify-content: space-between;}
|
|
||||||
.pd-mid .row .col-md-3.l .btn-row .btn {flex-basis: 48%; width: 100%; max-width: 48%;}
|
|
||||||
.pd-mid .row .col-md-3.l .btn-row .btn+.btn {margin-top:0;}
|
|
||||||
.pd-mid .l .btn {width:auto; flex:1;}
|
|
||||||
.pd-mid .l .btn-row {width: 100%;}
|
|
||||||
}
|
|
||||||
|
|
||||||
.pd-detail {width: 100%; border-bottom: 1px solid #dfdfdf; padding: 0 15px 95px 15px; }
|
|
||||||
.pd-detail .img-wrap {text-align: center;}
|
|
||||||
.pd-detail .img-wrap img {max-width: 100%; margin: 0 auto;}
|
|
||||||
.pd-buy {text-align: center;}
|
|
||||||
.pd-buy h2 {padding: 50px 0;}
|
|
||||||
.order-steps {max-width: 480px; margin: 0 auto; padding: 0 15px;}
|
|
||||||
.order-steps li .down-arrow {text-align: center; display: block; padding: 18px 0;}
|
|
||||||
.order-steps li .down-arrow img {display: inline-block;}
|
|
||||||
.order-steps li .pannel .pannel-body {padding: 30px 20px; display: flex; justify-content: center; align-items: center; text-align: center;}
|
|
||||||
.order-steps li .pannel .pannel-heading { padding: 19px 0; text-align: center;}
|
|
||||||
|
|
||||||
.buy-notice {padding: 50px 15px 0 15px; border-top: 1px solid #dfdfdf; margin-top:50px;}
|
|
||||||
.buy-notice h3 {padding-bottom: 60px;}
|
|
||||||
.buy-notice .buy-nav {display: flex; width: 100%; flex-wrap:wrap; max-width: 800px;}
|
|
||||||
.buy-notice .buy-nav li {flex-basis: 0; flex:1; margin-bottom: 8px; width: 20%;text-align: center;}
|
|
||||||
.buy-notice .buy-nav li button {position: relative; line-height: 35px; cursor: pointer;}
|
|
||||||
.buy-notice .content {position: relative;}
|
|
||||||
.buy-notice .content .article p {font-size: 15px; font-weight: 400; line-height: 1.5; text-align: left; padding: 20px 0; color:#444;}
|
|
||||||
/* .buy-notice .buy-nav li button:after {content:''; width: 90%; height: 2px; position: absolute; bottom: 0; left:5%; background: #000; z-index: 1;} */
|
|
||||||
|
|
||||||
@media (max-width:600px) {
|
|
||||||
.buy-notice .buy-nav li {flex-basis: 33.3333%; text-align: center;}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 주문서 작성 */
|
|
||||||
.pd-order {padding: 40px 0; transition: 0.5s; width:100%; max-width: 400px;}
|
|
||||||
.pd-order h2 {padding-bottom:40px; text-align: center;}
|
|
||||||
.pd-order-area {padding-top:40px;}
|
|
||||||
.pd-order-area .row {max-width: 1030px; margin: 0 auto;}
|
|
||||||
.pd-order .top {border: 1px solid #dfdfdf; padding: 42px 36px; display: flex;
|
|
||||||
box-shadow: 0px 3px 7.12px 0.88px rgba(0, 0, 0, 0.05);
|
|
||||||
-webkit-box-shadow: 0px 3px 7.12px 0.88px rgba(0, 0, 0, 0.05);
|
|
||||||
-moz-box-shadow: 0px 3px 7.12px 0.88px rgba(0, 0, 0, 0.05);
|
|
||||||
-o-box-shadow: 0px 3px 7.12px 0.88px rgba(0, 0, 0, 0.05);
|
|
||||||
}
|
|
||||||
|
|
||||||
.pd-order .top .img-wrap {max-width: 114px;}
|
|
||||||
.pd-order .top img {max-width: 100%;}
|
|
||||||
.pd-order .top .txt-wrap {padding-left: 50px;}
|
|
||||||
.pd-order .top .txt-wrap h3 {font-weight: bold; font-weight: 28px; display: inline-block; padding-bottom:12px; border-bottom: 1px solid rgba(0,0,0,0.3); margin-bottom:12px;}
|
|
||||||
.pd-order .top .txt-wrap p {font-size: 20px; padding-bottom:19px;}
|
|
||||||
.pd-order .top .txt-wrap ul li { line-height: 1.5; font-size: 18px;}
|
|
||||||
.pd-order .pannel {padding: 30px 25px 23px 25px; border-top:none;}
|
|
||||||
.pd-order .pannel .content.right-content {text-align: left;}
|
|
||||||
.pd-order .pannel h3 {font-size: 20px; font-weight: bold; padding-bottom:14px;}
|
|
||||||
.pd-order .pannel p {line-height: 1.8;}
|
|
||||||
.pd-order .bot .result-pannel {border-color: #dfdfdf; border-top:none;}
|
|
||||||
|
|
||||||
.order-form .input-group .flex-container {display: flex; margin-bottom:10px;}
|
|
||||||
.order-form .input-group.ad .flex-container .btn { width:183px; margin-left:13px; font-size: 16px; padding: 0; line-height: 48px; height: 48px;}
|
|
||||||
.order-form .btn-row .btn.solid {width: 100%; max-width: 100%; display: block;}
|
|
||||||
.order-form .ck-group { padding-top: 22px; position: relative; display: flex; justify-content: space-between; align-items: center;}
|
|
||||||
.order-form .ck-group .link a { text-decoration: underline;}
|
|
||||||
.order-form .area-group {padding-bottom:38px;}
|
|
||||||
.order-form .btn-row {padding-top:10px;}
|
|
||||||
.order-form .small,.ck-small {font-size: 14px; opacity: 0.8; letter-spacing: -1.2px;}
|
|
||||||
.ck-small { color:#ff304f;}
|
|
||||||
.order-form .small b {font-weight: 500;}
|
|
||||||
|
|
||||||
.pos-container {margin: 0 auto; width: 100%; height:100%;justify-content: center;}
|
|
||||||
.pos-container .inner {position: relative; width: 1000px; margin: 0 auto; }
|
|
||||||
#fixedItem {position: relative;}
|
|
||||||
#fixedItem.fix {position: fixed; top:0; left:0;}
|
|
||||||
#fixedItem.fix .pd-order {padding: 10px 0;}
|
|
||||||
|
|
||||||
@media (min-width: 769px) and (max-width:960px) {
|
|
||||||
.pd-order {width:100%;}
|
|
||||||
.pd-order .top .img-wrap {max-width: 100%;}
|
|
||||||
.pd-order .top .img-wrap {max-width: 114px; margin: 0 auto;}
|
|
||||||
.pd-order .top {flex-direction: column; justify-content: center; align-items: flex-start;}
|
|
||||||
}
|
|
||||||
@media (max-width:768px) {
|
|
||||||
.pd-order {max-width:100%;}
|
|
||||||
.pos-container .inner {width: 100%;}
|
|
||||||
.pd-order {width: 100%;}
|
|
||||||
.pd-order-area {padding-top:0;}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 주문 목록 */
|
|
||||||
.orderList-search {max-width: 1000px; margin: 0 auto; padding: 42px 0 47px 0;}
|
|
||||||
.orderList-search .fluid-container {background: #f7f7f7; border: 1px solid #dfdfdf; padding: 18px 0;}
|
|
||||||
.orderList-search .box1 {display: flex; align-items: center; justify-content: center;}
|
|
||||||
.orderList-search .box1 p {font-weight: 700;}
|
|
||||||
.orderList-search .box1 {text-align: center;}
|
|
||||||
.orderList-search .input-group { padding-bottom: 0;}
|
|
||||||
.orderList-search .input-group.box3 .inner {padding-right:30px;}
|
|
||||||
|
|
||||||
.order-area {max-width: 1000px; margin: 0 auto;}
|
|
||||||
.order-area .post-count {font-size: 15px; color:#333; padding-bottom:26px;}
|
|
||||||
.order-list .order-item {border: 1px solid #dfdfdf;}
|
|
||||||
.order-list .order-item:hover {border-color:#0e3059;
|
|
||||||
box-shadow: 0px 3px 7.12px 0.88px rgba(0, 0, 0, 0.05);
|
|
||||||
-webkit-box-shadow: 0px 3px 7.12px 0.88px rgba(0, 0, 0, 0.05);
|
|
||||||
-moz-box-shadow: 0px 3px 7.12px 0.88px rgba(0, 0, 0, 0.05);
|
|
||||||
-o-box-shadow: 0px 3px 7.12px 0.88px rgba(0, 0, 0, 0.05);
|
|
||||||
}
|
|
||||||
.order-list .order-item+.order-item {margin-top:32px;}
|
|
||||||
.order-list .order-item .col-date {background: #f7f7f7; display: flex; align-items: center; justify-content: center; border-right: 1px solid #dfdfdf;}
|
|
||||||
.order-list .order-item:hover .col-date {background: #0e3059;}
|
|
||||||
.order-list .order-item .col-date strong {font-size: 21px; font-weight: 500; letter-spacing: -0.9px; margin-bottom: 8px; display: block; text-align: center;}
|
|
||||||
.order-list .order-item:hover .col-date strong {color:#fff;}
|
|
||||||
.order-list .order-item .col-date p {font-weight: 300; font-size: 16px; text-align: center;}
|
|
||||||
.order-list .order-item:hover .col-date p {color:#fff;}
|
|
||||||
.order-list .order-item .col-content {padding: 20px 37px;}
|
|
||||||
.order-list .order-item .col-content a {display: flex; position: relative;}
|
|
||||||
.order-list .order-item .col-content .txt-wrap {padding: 0 29px;}
|
|
||||||
.order-list .order-item .col-content .txt-wrap strong {font-size: 23px; font-weight: bold; padding: 0 13px 10px 13px; display: inline-block; border-bottom: 1px solid rgba(0,0,0,.3);}
|
|
||||||
.order-list .order-item .col-content .txt-wrap .default-spec {padding: 13px 13px 14px 13px;}
|
|
||||||
.order-list .order-item .col-content .txt-wrap .default-spec li {display: inline-block; position: relative;}
|
|
||||||
.order-list .order-item .col-content .txt-wrap .default-spec li+li {padding-left:14px; margin-left: 6px;}
|
|
||||||
.order-list .order-item .col-content .txt-wrap .default-spec li.dash:before {content: '/'; position: absolute; left:0; top:0;}
|
|
||||||
.order-list .order-item .col-content .txt-wrap .order-relase {font-size: 14px; color:#666; letter-spacing: 0; padding: 0 13px;}
|
|
||||||
.order-list .order-item .col-content .btn {position: absolute; right:0; top:0; }
|
|
||||||
.order-list .order-item .col-content .btn p {font-size: 15px; }
|
|
||||||
|
|
||||||
.order-list .order-item img {max-height: 118px;}
|
|
||||||
.pageNation-wrap {display: flex; justify-content: center; padding-top: 100px;}
|
|
||||||
|
|
||||||
@media (max-width: 960px) {
|
|
||||||
.myOrder-list-section {padding-left:15px; padding-right: 15px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
|
||||||
.order-list .order-item .col-date strong {font-size: 19px;}
|
|
||||||
.order-list .order-item .col-date p {font-size: 15px;}
|
|
||||||
.order-list .order-item .col-content {padding: 15px 27px;}
|
|
||||||
.order-list .order-item .col-content .txt-wrap {padding: 0 15px; position: relative; top:10px;}
|
|
||||||
.order-list .order-item .col-content .txt-wrap .default-spec {padding: 10px 10px 11px 10px;}
|
|
||||||
.order-list .order-item .col-content .txt-wrap .default-spec li p {font-size: 15px;}
|
|
||||||
.order-list .order-item .col-content .txt-wrap .default-spec li+li {padding-left: 11px; margin-left: 2px; font-size: 13px;}
|
|
||||||
.order-list .order-item .col-content .txt-wrap .order-relas {font-size: 13px;}
|
|
||||||
.order-list .order-item .col-content .btn p {padding-bottom: 4px;}
|
|
||||||
.order-list .order-item .col-content .btn p {font-size: 12px;}
|
|
||||||
.pageNation-wrap {padding-top:60px;}
|
|
||||||
.orderList-search .box1 {padding-bottom: 20px;}
|
|
||||||
.orderList-search .fluid-container {padding: 20px 15px;}
|
|
||||||
.orderList-search .input-group.box3 .inner {padding-right:0; }
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 576px) {
|
|
||||||
.order-list .order-item .col-date {text-align: left; display: block; padding: 10px 18px;}
|
|
||||||
.order-list .order-item .col-date p {text-align: left;}
|
|
||||||
.input-group select {margin-bottom: 10px;}
|
|
||||||
.order-list .order-item .col-content .btn {display: none;}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* 주문목록 상세 */
|
|
||||||
.order-list.order-detail-list .order-item:hover {border-color: #dfdfdf;}
|
|
||||||
.order-list.order-detail-list .order-item:hover .col-date {background: #f7f7f7;}
|
|
||||||
.order-list.order-detail-list .order-item:hover .col-date strong {color:#222;}
|
|
||||||
.order-list.order-detail-list .order-item:hover .col-date p {color:#222;}
|
|
||||||
.order-list.order-detail-list .btn-row {padding: 20px 0; padding-right:30px;}
|
|
||||||
.order-list.order-detail-list .btn-row .btn {width: 100%;}
|
|
||||||
.order-list.order-detail-list .btn-row .btn+.btn {margin-top:12px;}
|
|
||||||
.order-list.order-detail-list .order-item .col-content a {pointer-events: none;}
|
|
||||||
|
|
||||||
.order-subInfos {max-width: 1000px; margin: 0 auto; padding-top: 50px;}
|
|
||||||
.order-subInfos.infos1 {padding-top:85px;}
|
|
||||||
.order-tbl tr td,.order-tbl tr th {padding: 12px 15px; font-size: 18px;}
|
|
||||||
.order-tbl tr th {font-weight: 500;}
|
|
||||||
.order-tbl tr td {font-weight: 400; color:#333; line-height: 1.7;}
|
|
||||||
.order-tbl tr th { text-align: left;}
|
|
||||||
.btn-row {text-align: center;}
|
|
||||||
.btn-row.order-detail-btns {padding-top:90px; border-top: 1px solid #dfdfdf; max-width: 1000px; margin: 50px auto 0 auto;}
|
|
||||||
.order-tbl .col1 { width:238px;}
|
|
||||||
.order-tbl .col2 {width:auto;}
|
|
||||||
|
|
||||||
@media (max-width: 960px) {
|
|
||||||
.order-subInfos {padding-left:15px; padding-right: 15px;}
|
|
||||||
.myOrder-list-section .display-wrap {padding: 0; padding-bottom: 40px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
|
||||||
.order-tbl tr td,.order-tbl tr th {font-size: 16px;}
|
|
||||||
.order-list.order-detail-list .btn-row {padding-right:0; padding: 20px 15px;}
|
|
||||||
.order-list .order-item .col-date{border-bottom: 1px solid #dfdfdf;}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 576px) {
|
|
||||||
.order-tbl .col1 { width:140px;}
|
|
||||||
.order-tbl .col2 {width:auto;}
|
|
||||||
.order-tbl tr th {line-height: 1.5; word-break: keep-all;}
|
|
||||||
.order-subInfos.infos1 {padding-top:50px}
|
|
||||||
.btn-row.order-detail-btns {padding: 45px 15px 0 15px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 단말기 비교 */
|
|
||||||
.compare-forms {max-width: 1030px; margin: 0 auto; padding-top:40px;}
|
|
||||||
.compare-forms .row {width: 1000px; padding-bottom:40px;}
|
|
||||||
.compare-forms .row .phone {width: 500px;}
|
|
||||||
.compare-forms .pannel {position: relative; max-height:220px;}
|
|
||||||
.compare-forms .pannel.pannel1 {padding: 33px 38px; font-size: 20px; min-height: 122px; display: flex; align-items: center; justify-content: center; flex-direction: column;}
|
|
||||||
.compare-forms .pannel.pannel1 p { font-weight: 400; line-height: 1.5;}
|
|
||||||
.compare-forms .pannel.pannel2 {padding: 33px 23px;}
|
|
||||||
.compare-forms .pannel.pannel3 {padding: 23px 23px;}
|
|
||||||
.compare-forms .pannel2 {border-radius: 3px;}
|
|
||||||
.compare-forms .pannel2 strong {font-size: 20px; font-weight: 500; padding-bottom:20px; display: block;}
|
|
||||||
.compare-forms .pannel2 p {font-size: 16px; font-weight: 300; line-height: 1.5;}
|
|
||||||
.compare-forms .pannel2+.pannel2 {border-top:0; border-top-left-radius: 0; border-top-right-radius: 0;}
|
|
||||||
.compare-forms .pannel .pannel-ck {position: absolute; left:0; top:0; width:100% !important; line-height:100% !important; height: 100%!important; opacity: 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; z-index: 10;}
|
|
||||||
.compare-forms .ck-pannel.active {background: #e9e9e9;}
|
|
||||||
/* .compare-forms .pannel .pannel-ck:checked {} */
|
|
||||||
.compare-forms .pannel.pannel3 {border-bottom: 0; background: #ff304f; color:#fff;}
|
|
||||||
.compare-forms label {font-size: 22px;}
|
|
||||||
.compare-forms input,.compare-forms select {line-height: 62px !important; height: 62px !important; border-color: rgb(223, 223, 223) !important;
|
|
||||||
background: url('/images/select_arrow.png')no-repeat 95% center/auto,#f7f7f7;
|
|
||||||
}
|
|
||||||
.compare-forms input {border-radius: 3px;}
|
|
||||||
.compare-forms select {border: 1px solid #dfdfdf; border-radius: 3px; font-size: 16px;}
|
|
||||||
.compare-forms .btn-row {padding-top:40px;}
|
|
||||||
.compare-forms .result-pannel {border-color:#dfdfdf;}
|
|
||||||
|
|
||||||
.ph-select-btn {font-size: 16px; font-weight: 500;}
|
|
||||||
|
|
||||||
@media (max-width: 960px) {
|
|
||||||
.compare-forms {overflow-x :scroll;}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* fixed menu */
|
|
||||||
.fixed-menu-wrap {position: fixed; top:0; right:0%; width: 100%; height: 100%; max-width: 183px; margin: 0 auto; z-index: 100;}
|
|
||||||
.fixed-menu-wrap .fixed-menu {position: absolute; width: 90px; top:50vh; transform: translateY(-50%); text-align: center;}
|
|
||||||
.fixed-menu-wrap .fixed-menu .top {margin-bottom:5px; border-radius: 5px; overflow: hidden;}
|
|
||||||
.fixed-menu-wrap .fixed-menu img {vertical-align:middle; -webkit-vertical-align:middle; line-height: 1; border: 0;}
|
|
||||||
.fixed-menu-wrap .fixed-menu ul li {cursor :pointer; background: #0e3059; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 12px 0; text-align: center;}
|
|
||||||
.fixed-menu-wrap .fixed-menu ul li.item-cal {padding: 22px 0; background:#081f3b; border-top-left-radius: 5px; border-top-right-radius: 5px; overflow: hidden;}
|
|
||||||
.fixed-menu-wrap .fixed-menu ul li.cart img {display: inline-block; position: relative; left:-3px;}
|
|
||||||
.fixed-menu-wrap .fixed-menu ul li.log {padding-top:18px;}
|
|
||||||
.fixed-menu-wrap .fixed-menu ul li.cs {padding-bottom:18px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; overflow: hidden;}
|
|
||||||
.fixed-menu-wrap .fixed-menu ul li p { color:#fff; font-size: 14px; letter-spacing: 0.5px; line-height: 1; padding-top:10px;}
|
|
||||||
.fixed-menu-wrap .fixed-menu .win-top {position: relative; z-index: 10; outline: none;}
|
|
||||||
.fixed-menu-wrap .fixed-menu .win-top img {padding-top: 15px; display: inline-block;}
|
|
||||||
/* fixed menu end */
|
|
||||||
|
|
||||||
@media (max-width: 960px) {
|
|
||||||
.fixed-menu-wrap {display: none;}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* order-modal */
|
|
||||||
.order-modal .modal-body p {color:#555; font-weight: 300; line-height: 1.5;}
|
|
||||||
|
|
||||||
/* tooltip */
|
|
||||||
.order-tooltip {position: relative; top:2px;}
|
|
||||||
.input-group:hover .order-tooltip svg {fill:#ff304f;}
|
|
||||||
|
|
||||||
|
|
||||||
/* */
|
|
||||||
.tbl-group.ck-group {margin-bottom: 30px;}
|
|
||||||
.tbl-group .meta-key-pd_devide_num label{display: inline-block;}
|
|
||||||
|
|
||||||
/* 단말기 비교 css */
|
|
||||||
.modal-nav {padding: 25px 0 45px 0; text-align: center;}
|
|
||||||
.modal-nav li {display: inline-block; cursor: pointer; padding: 0 15px;}
|
|
||||||
.modal-nav li.active {color:#ff304f;}
|
|
||||||
.modal-nav li.active .link-btn:before{background: #ff304f;}
|
|
||||||
.modal-nav li a {font-size: 20px;}
|
|
||||||
.modal-nav li a:hover {opacity: 0.7;}
|
|
||||||
.danmal-pop-list {padding-top:15px;}
|
|
||||||
.danmal-pop-list li {text-align: center; border: 1px solid #dfdfdf; cursor:pointer;}
|
|
||||||
/* .danmal-pop-list li+li {border-left: none;} */
|
|
||||||
/* .danmal-pop-list li:nth-child(4n+1) {border-left: 1px solid #dfdfdf;} */
|
|
||||||
.danmal-pop-list li .thumb {display: inline-block;}
|
|
||||||
.danmal-pop-list li .thumb img {display: block; width: 100%; max-width: 130px;}
|
|
||||||
.danmal-pop-list li .txt-wrap {padding: 18px 15px; text-align: center; background: #f7f7f7; border-top: 1px solid #dfdfdf; margin:0 -15px;}
|
|
||||||
.danmal-pop-list li .txt-wrap strong {font-size: 16px; margin-bottom: 10px; display: block; font-weight: 500;}
|
|
||||||
.danmal-pop-list li .txt-wrap p{font-size: 14px; font-weight: 300;}
|
|
||||||
.danmal-pop-list li:hover {border-color:#ff304f; border-left: 1px solid #ff304f;}
|
|
||||||
.danmal-pop-list li:hover .txt-wrap {background: #ff304f;}
|
|
||||||
.danmal-pop-list li:hover .txt-wrap strong {color:#fff;}
|
|
||||||
.danmal-pop-list li:hover .txt-wrap p {color:#fff;}
|
|
||||||
|
|
||||||
.mobile_quck_bar {display: none;}
|
|
||||||
@media (max-width:959px) {
|
|
||||||
.mobile_quck_bar {position: fixed; bottom:8px; right:10px; display: block; z-index: 90;}
|
|
||||||
.mobile_quck_bar .img-wrap { border-radius: 5px; overflow: hidden; margin-bottom:8px; background: #0e3059; max-width: 53px; width: 100%;}
|
|
||||||
.mobile_quck_bar img {line-height: 1; vertical-align: baseline; }
|
|
||||||
.mobile_quck_bar a.call {display: block;}
|
|
||||||
.mobile_quck_bar .calu {background:#0e3059;text-align: center;; display: block; padding: 8px 0;}
|
|
||||||
.mobile_quck_bar .calu img {display: inline-block; max-width: 30px; }
|
|
||||||
.mobile_quck_bar img {max-height:60px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
.yogum_tbl {border-collapse: collapse; width: 100%;}
|
|
||||||
.yogum_tbl td, .yogum_tbl th { border: 1px solid #dfdfdf; padding: 10px 14px; cursor: pointer;}
|
|
||||||
.yogum_tbl td {font-size: 18px;}
|
|
||||||
.yogum_tbl tr:nth-child(even){background-color: #f2f2f2;}
|
|
||||||
.yogum_tbl tr:hover {background-color: #ddd;}
|
|
||||||
.yogum_tbl th { padding-top: 12px; padding-bottom: 12px; text-align: left; background-color: #0e3059; color: white;}
|
|
||||||
|
|
||||||
.hidden_pannel {opacity: 0; visibility: hidden; position: absolute; z-index: -1;}
|
|
||||||
.hidden {display: none;}
|
|
||||||
|
|
||||||
.input-group {position: relative;}
|
|
||||||
.danmal_btn {position: absolute; width: 100%; height: 100%; left:0; top:0;
|
|
||||||
display: flex; align-items: center;; justify-content: center; flex-direction: column;}
|
|
||||||
.danmal_btn p { padding: 10px;}
|
|
||||||
|
|
||||||
.title-pannel {background: #fff; }
|
|
||||||
.title-pannel .row {width: 1000%; padding-bottom:0;}
|
|
||||||
.title-pannel .row img {width: 100%; max-width: 100%;}
|
|
||||||
.title-pannel .row .img {text-align: center;}
|
|
||||||
.title-pannel .row .txt {line-height: 20px; padding-top:15px;}
|
|
||||||
.title-pannel .row .txt p:nth-child(1) {font-size: 20px; font-weight: 500; margin-bottom: 5px;}
|
|
||||||
|
|
||||||
.pannel-ck {cursor: ponter;}
|
|
||||||
body {display: block; position: relative; box-sizing: border-box;}
|
|
||||||
.danma_pageWrap {padding: 120px 0;}
|
|
||||||
.danma_pageWrap .subpage { padding: 0;}
|
|
||||||
|
|
||||||
|
|
||||||
.jump-button{ animation: bouncing 0.5s cubic-bezier(0.1,0.25,0.1,1) 0s infinite alternate both; animation-play-state: running;}
|
|
||||||
|
|
||||||
@keyframes bouncing{
|
|
||||||
0% { bottom: 0; box-shadow: 0 0 5px rgba(0,0,0,0.5);}
|
|
||||||
100%{ bottom: 50px; box-shadow: 0 50px 50px rgba(0,0,0,0.1);}
|
|
||||||
}
|
|
||||||
|
|
||||||
.kboard-attr-option {display: none;}
|
|
||||||
.sucessPage {text-align: center;}
|
|
||||||
.sucessPage section {}
|
|
||||||
.sucessPage img {padding-bottom:40px; max-width:330px; width:100%;}
|
|
||||||
@media (max-width: 576px) {
|
|
||||||
.sucessPage {display: flex; align-items: center; justify-content: center; height: 100vh; width: 100%;}
|
|
||||||
.sucessPage img {max-width: 250px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
.wide-btn-row {padding-top:20px;}
|
|
||||||
.wide-btn-row > div {padding: 0 15px;}
|
|
||||||
.wide-btn {width: 100%;}
|
|
||||||
|
|
||||||
/* 사전승낙서 */
|
|
||||||
.footer-paper-cover {max-width: 1000px; margin: 0 auto; padding: 30px 0 20px 0;}
|
|
||||||
.footer-paper {display: inline-block; padding: 5px 10px; border: 1px solid #fff; color:#fff; cursor: pointer; font-size: 16px; text-align: center; opacity: 0.8; transition: 0.3s;}
|
|
||||||
.footer-paper:hover {opacity: 1;}
|
|
||||||
|
|
||||||
@media (max-width: 576px) {
|
|
||||||
.footer-paper-cover {padding: 30px 20px; text-align: center;}
|
|
||||||
}
|
|
||||||
.kboard-wonderful-product-button-small { position: relative; display: inline-block; *display: inline; zoom: 1; margin: 0; padding: 0 10px; width: auto; height: 28px; line-height: 28px; font-size: 13px; font-weight: normal; letter-spacing: normal; color: white !important; background: black !important; border: none !important; border-radius: 0; text-decoration: none !important; cursor: pointer; vertical-align: middle; text-shadow: none; box-shadow: none; transition-duration: 0.3s; box-sizing: content-box; }
|
|
||||||
@@ -1,532 +0,0 @@
|
|||||||
/**
|
|
||||||
* Swiper 6.0.0
|
|
||||||
* Most modern mobile touch slider and framework with hardware accelerated transitions
|
|
||||||
* http://swiperjs.com
|
|
||||||
*
|
|
||||||
* Copyright 2014-2020 Vladimir Kharlampidi
|
|
||||||
*
|
|
||||||
* Released under the MIT License
|
|
||||||
*
|
|
||||||
* Released on: July 3, 2020
|
|
||||||
*/
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'swiper-icons';
|
|
||||||
src: url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA') format('woff');
|
|
||||||
font-weight: 400;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
:root {
|
|
||||||
--swiper-theme-color: #007aff;
|
|
||||||
}
|
|
||||||
.swiper-container {
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
list-style: none;
|
|
||||||
padding: 0;
|
|
||||||
/* Fix of Webkit flickering */
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
.swiper-container-vertical > .swiper-wrapper {
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
.swiper-wrapper {
|
|
||||||
position: relative;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 1;
|
|
||||||
display: flex;
|
|
||||||
transition-property: transform;
|
|
||||||
box-sizing: content-box;
|
|
||||||
}
|
|
||||||
.swiper-container-android .swiper-slide,
|
|
||||||
.swiper-wrapper {
|
|
||||||
transform: translate3d(0px, 0, 0);
|
|
||||||
}
|
|
||||||
.swiper-container-multirow > .swiper-wrapper {
|
|
||||||
flex-wrap: wrap;
|
|
||||||
}
|
|
||||||
.swiper-container-multirow-column > .swiper-wrapper {
|
|
||||||
flex-wrap: wrap;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
.swiper-container-free-mode > .swiper-wrapper {
|
|
||||||
transition-timing-function: ease-out;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
.swiper-slide {
|
|
||||||
flex-shrink: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
position: relative;
|
|
||||||
transition-property: transform;
|
|
||||||
}
|
|
||||||
.swiper-slide-invisible-blank {
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
/* Auto Height */
|
|
||||||
.swiper-container-autoheight,
|
|
||||||
.swiper-container-autoheight .swiper-slide {
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
.swiper-container-autoheight .swiper-wrapper {
|
|
||||||
align-items: flex-start;
|
|
||||||
transition-property: transform, height;
|
|
||||||
}
|
|
||||||
/* 3D Effects */
|
|
||||||
.swiper-container-3d {
|
|
||||||
perspective: 1200px;
|
|
||||||
}
|
|
||||||
.swiper-container-3d .swiper-wrapper,
|
|
||||||
.swiper-container-3d .swiper-slide,
|
|
||||||
.swiper-container-3d .swiper-slide-shadow-left,
|
|
||||||
.swiper-container-3d .swiper-slide-shadow-right,
|
|
||||||
.swiper-container-3d .swiper-slide-shadow-top,
|
|
||||||
.swiper-container-3d .swiper-slide-shadow-bottom,
|
|
||||||
.swiper-container-3d .swiper-cube-shadow {
|
|
||||||
transform-style: preserve-3d;
|
|
||||||
}
|
|
||||||
.swiper-container-3d .swiper-slide-shadow-left,
|
|
||||||
.swiper-container-3d .swiper-slide-shadow-right,
|
|
||||||
.swiper-container-3d .swiper-slide-shadow-top,
|
|
||||||
.swiper-container-3d .swiper-slide-shadow-bottom {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
pointer-events: none;
|
|
||||||
z-index: 10;
|
|
||||||
}
|
|
||||||
.swiper-container-3d .swiper-slide-shadow-left {
|
|
||||||
background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
|
|
||||||
}
|
|
||||||
.swiper-container-3d .swiper-slide-shadow-right {
|
|
||||||
background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
|
|
||||||
}
|
|
||||||
.swiper-container-3d .swiper-slide-shadow-top {
|
|
||||||
background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
|
|
||||||
}
|
|
||||||
.swiper-container-3d .swiper-slide-shadow-bottom {
|
|
||||||
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
|
|
||||||
}
|
|
||||||
/* CSS Mode */
|
|
||||||
.swiper-container-css-mode > .swiper-wrapper {
|
|
||||||
overflow: auto;
|
|
||||||
scrollbar-width: none;
|
|
||||||
/* For Firefox */
|
|
||||||
-ms-overflow-style: none;
|
|
||||||
/* For Internet Explorer and Edge */
|
|
||||||
}
|
|
||||||
.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.swiper-container-css-mode > .swiper-wrapper > .swiper-slide {
|
|
||||||
scroll-snap-align: start start;
|
|
||||||
}
|
|
||||||
.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper {
|
|
||||||
scroll-snap-type: x mandatory;
|
|
||||||
}
|
|
||||||
.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper {
|
|
||||||
scroll-snap-type: y mandatory;
|
|
||||||
}
|
|
||||||
:root {
|
|
||||||
--swiper-navigation-size: 44px;
|
|
||||||
/*
|
|
||||||
--swiper-navigation-color: var(--swiper-theme-color);
|
|
||||||
*/
|
|
||||||
}
|
|
||||||
.swiper-button-prev,
|
|
||||||
.swiper-button-next {
|
|
||||||
position: absolute;
|
|
||||||
top: 50%;
|
|
||||||
width: calc(var(--swiper-navigation-size) / 44 * 27);
|
|
||||||
height: var(--swiper-navigation-size);
|
|
||||||
margin-top: calc(-1 * var(--swiper-navigation-size) / 2);
|
|
||||||
z-index: 10;
|
|
||||||
cursor: pointer;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
color: var(--swiper-navigation-color, var(--swiper-theme-color));
|
|
||||||
}
|
|
||||||
.swiper-button-prev.swiper-button-disabled,
|
|
||||||
.swiper-button-next.swiper-button-disabled {
|
|
||||||
opacity: 0.35;
|
|
||||||
cursor: auto;
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
.swiper-button-prev:after,
|
|
||||||
.swiper-button-next:after {
|
|
||||||
font-family: swiper-icons;
|
|
||||||
font-size: var(--swiper-navigation-size);
|
|
||||||
text-transform: none !important;
|
|
||||||
letter-spacing: 0;
|
|
||||||
text-transform: none;
|
|
||||||
font-variant: initial;
|
|
||||||
line-height: 1;
|
|
||||||
}
|
|
||||||
.swiper-button-prev,
|
|
||||||
.swiper-container-rtl .swiper-button-next {
|
|
||||||
left: 10px;
|
|
||||||
right: auto;
|
|
||||||
}
|
|
||||||
.swiper-button-prev:after,
|
|
||||||
.swiper-container-rtl .swiper-button-next:after {
|
|
||||||
content: 'prev';
|
|
||||||
}
|
|
||||||
.swiper-button-next,
|
|
||||||
.swiper-container-rtl .swiper-button-prev {
|
|
||||||
right: 10px;
|
|
||||||
left: auto;
|
|
||||||
}
|
|
||||||
.swiper-button-next:after,
|
|
||||||
.swiper-container-rtl .swiper-button-prev:after {
|
|
||||||
content: 'next';
|
|
||||||
}
|
|
||||||
.swiper-button-prev.swiper-button-white,
|
|
||||||
.swiper-button-next.swiper-button-white {
|
|
||||||
--swiper-navigation-color: #ffffff;
|
|
||||||
}
|
|
||||||
.swiper-button-prev.swiper-button-black,
|
|
||||||
.swiper-button-next.swiper-button-black {
|
|
||||||
--swiper-navigation-color: #000000;
|
|
||||||
}
|
|
||||||
.swiper-button-lock {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
:root {
|
|
||||||
/*
|
|
||||||
--swiper-pagination-color: var(--swiper-theme-color);
|
|
||||||
*/
|
|
||||||
}
|
|
||||||
.swiper-pagination {
|
|
||||||
position: absolute;
|
|
||||||
text-align: center;
|
|
||||||
transition: 300ms opacity;
|
|
||||||
transform: translate3d(0, 0, 0);
|
|
||||||
z-index: 10;
|
|
||||||
}
|
|
||||||
.swiper-pagination.swiper-pagination-hidden {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
/* Common Styles */
|
|
||||||
.swiper-pagination-fraction,
|
|
||||||
.swiper-pagination-custom,
|
|
||||||
.swiper-container-horizontal > .swiper-pagination-bullets {
|
|
||||||
bottom: 10px;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
/* Bullets */
|
|
||||||
.swiper-pagination-bullets-dynamic {
|
|
||||||
overflow: hidden;
|
|
||||||
font-size: 0;
|
|
||||||
}
|
|
||||||
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
|
|
||||||
transform: scale(0.33);
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
|
|
||||||
transform: scale(1);
|
|
||||||
}
|
|
||||||
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
|
|
||||||
transform: scale(1);
|
|
||||||
}
|
|
||||||
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
|
|
||||||
transform: scale(0.66);
|
|
||||||
}
|
|
||||||
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
|
|
||||||
transform: scale(0.33);
|
|
||||||
}
|
|
||||||
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
|
|
||||||
transform: scale(0.66);
|
|
||||||
}
|
|
||||||
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
|
|
||||||
transform: scale(0.33);
|
|
||||||
}
|
|
||||||
.swiper-pagination-bullet {
|
|
||||||
width: 8px;
|
|
||||||
height: 8px;
|
|
||||||
display: inline-block;
|
|
||||||
border-radius: 100%;
|
|
||||||
background: #000;
|
|
||||||
opacity: 0.2;
|
|
||||||
}
|
|
||||||
button.swiper-pagination-bullet {
|
|
||||||
border: none;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
box-shadow: none;
|
|
||||||
-webkit-appearance: none;
|
|
||||||
-moz-appearance: none;
|
|
||||||
appearance: none;
|
|
||||||
}
|
|
||||||
.swiper-pagination-clickable .swiper-pagination-bullet {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.swiper-pagination-bullet-active {
|
|
||||||
opacity: 1;
|
|
||||||
background: var(--swiper-pagination-color, var(--swiper-theme-color));
|
|
||||||
}
|
|
||||||
.swiper-container-vertical > .swiper-pagination-bullets {
|
|
||||||
right: 10px;
|
|
||||||
top: 50%;
|
|
||||||
transform: translate3d(0px, -50%, 0);
|
|
||||||
}
|
|
||||||
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
|
|
||||||
margin: 6px 0;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
|
|
||||||
top: 50%;
|
|
||||||
transform: translateY(-50%);
|
|
||||||
width: 8px;
|
|
||||||
}
|
|
||||||
.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
|
|
||||||
display: inline-block;
|
|
||||||
transition: 200ms transform, 200ms top;
|
|
||||||
}
|
|
||||||
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
|
|
||||||
margin: 0 4px;
|
|
||||||
}
|
|
||||||
.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-50%);
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
|
|
||||||
transition: 200ms transform, 200ms left;
|
|
||||||
}
|
|
||||||
.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
|
|
||||||
transition: 200ms transform, 200ms right;
|
|
||||||
}
|
|
||||||
/* Progress */
|
|
||||||
.swiper-pagination-progressbar {
|
|
||||||
background: rgba(0, 0, 0, 0.25);
|
|
||||||
position: absolute;
|
|
||||||
}
|
|
||||||
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
|
|
||||||
background: var(--swiper-pagination-color, var(--swiper-theme-color));
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
transform: scale(0);
|
|
||||||
transform-origin: left top;
|
|
||||||
}
|
|
||||||
.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
|
|
||||||
transform-origin: right top;
|
|
||||||
}
|
|
||||||
.swiper-container-horizontal > .swiper-pagination-progressbar,
|
|
||||||
.swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
|
|
||||||
width: 100%;
|
|
||||||
height: 4px;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
.swiper-container-vertical > .swiper-pagination-progressbar,
|
|
||||||
.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
|
|
||||||
width: 4px;
|
|
||||||
height: 100%;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
.swiper-pagination-white {
|
|
||||||
--swiper-pagination-color: #ffffff;
|
|
||||||
}
|
|
||||||
.swiper-pagination-black {
|
|
||||||
--swiper-pagination-color: #000000;
|
|
||||||
}
|
|
||||||
.swiper-pagination-lock {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
/* Scrollbar */
|
|
||||||
.swiper-scrollbar {
|
|
||||||
border-radius: 10px;
|
|
||||||
position: relative;
|
|
||||||
-ms-touch-action: none;
|
|
||||||
background: rgba(0, 0, 0, 0.1);
|
|
||||||
}
|
|
||||||
.swiper-container-horizontal > .swiper-scrollbar {
|
|
||||||
position: absolute;
|
|
||||||
left: 1%;
|
|
||||||
bottom: 3px;
|
|
||||||
z-index: 50;
|
|
||||||
height: 5px;
|
|
||||||
width: 98%;
|
|
||||||
}
|
|
||||||
.swiper-container-vertical > .swiper-scrollbar {
|
|
||||||
position: absolute;
|
|
||||||
right: 3px;
|
|
||||||
top: 1%;
|
|
||||||
z-index: 50;
|
|
||||||
width: 5px;
|
|
||||||
height: 98%;
|
|
||||||
}
|
|
||||||
.swiper-scrollbar-drag {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
position: relative;
|
|
||||||
background: rgba(0, 0, 0, 0.5);
|
|
||||||
border-radius: 10px;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
.swiper-scrollbar-cursor-drag {
|
|
||||||
cursor: move;
|
|
||||||
}
|
|
||||||
.swiper-scrollbar-lock {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.swiper-zoom-container {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.swiper-zoom-container > img,
|
|
||||||
.swiper-zoom-container > svg,
|
|
||||||
.swiper-zoom-container > canvas {
|
|
||||||
max-width: 100%;
|
|
||||||
max-height: 100%;
|
|
||||||
object-fit: contain;
|
|
||||||
}
|
|
||||||
.swiper-slide-zoomed {
|
|
||||||
cursor: move;
|
|
||||||
}
|
|
||||||
/* Preloader */
|
|
||||||
:root {
|
|
||||||
/*
|
|
||||||
--swiper-preloader-color: var(--swiper-theme-color);
|
|
||||||
*/
|
|
||||||
}
|
|
||||||
.swiper-lazy-preloader {
|
|
||||||
width: 42px;
|
|
||||||
height: 42px;
|
|
||||||
position: absolute;
|
|
||||||
left: 50%;
|
|
||||||
top: 50%;
|
|
||||||
margin-left: -21px;
|
|
||||||
margin-top: -21px;
|
|
||||||
z-index: 10;
|
|
||||||
transform-origin: 50%;
|
|
||||||
animation: swiper-preloader-spin 1s infinite linear;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
|
|
||||||
border-radius: 50%;
|
|
||||||
border-top-color: transparent;
|
|
||||||
}
|
|
||||||
.swiper-lazy-preloader-white {
|
|
||||||
--swiper-preloader-color: #fff;
|
|
||||||
}
|
|
||||||
.swiper-lazy-preloader-black {
|
|
||||||
--swiper-preloader-color: #000;
|
|
||||||
}
|
|
||||||
@keyframes swiper-preloader-spin {
|
|
||||||
100% {
|
|
||||||
transform: rotate(360deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/* a11y */
|
|
||||||
.swiper-container .swiper-notification {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
pointer-events: none;
|
|
||||||
opacity: 0;
|
|
||||||
z-index: -1000;
|
|
||||||
}
|
|
||||||
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
|
|
||||||
transition-timing-function: ease-out;
|
|
||||||
}
|
|
||||||
.swiper-container-fade .swiper-slide {
|
|
||||||
pointer-events: none;
|
|
||||||
transition-property: opacity;
|
|
||||||
}
|
|
||||||
.swiper-container-fade .swiper-slide .swiper-slide {
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
.swiper-container-fade .swiper-slide-active,
|
|
||||||
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
|
|
||||||
pointer-events: auto;
|
|
||||||
}
|
|
||||||
.swiper-container-cube {
|
|
||||||
overflow: visible;
|
|
||||||
}
|
|
||||||
.swiper-container-cube .swiper-slide {
|
|
||||||
pointer-events: none;
|
|
||||||
-webkit-backface-visibility: hidden;
|
|
||||||
backface-visibility: hidden;
|
|
||||||
z-index: 1;
|
|
||||||
visibility: hidden;
|
|
||||||
transform-origin: 0 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.swiper-container-cube .swiper-slide .swiper-slide {
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
.swiper-container-cube.swiper-container-rtl .swiper-slide {
|
|
||||||
transform-origin: 100% 0;
|
|
||||||
}
|
|
||||||
.swiper-container-cube .swiper-slide-active,
|
|
||||||
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
|
|
||||||
pointer-events: auto;
|
|
||||||
}
|
|
||||||
.swiper-container-cube .swiper-slide-active,
|
|
||||||
.swiper-container-cube .swiper-slide-next,
|
|
||||||
.swiper-container-cube .swiper-slide-prev,
|
|
||||||
.swiper-container-cube .swiper-slide-next + .swiper-slide {
|
|
||||||
pointer-events: auto;
|
|
||||||
visibility: visible;
|
|
||||||
}
|
|
||||||
.swiper-container-cube .swiper-slide-shadow-top,
|
|
||||||
.swiper-container-cube .swiper-slide-shadow-bottom,
|
|
||||||
.swiper-container-cube .swiper-slide-shadow-left,
|
|
||||||
.swiper-container-cube .swiper-slide-shadow-right {
|
|
||||||
z-index: 0;
|
|
||||||
-webkit-backface-visibility: hidden;
|
|
||||||
backface-visibility: hidden;
|
|
||||||
}
|
|
||||||
.swiper-container-cube .swiper-cube-shadow {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
bottom: 0px;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
background: #000;
|
|
||||||
opacity: 0.6;
|
|
||||||
-webkit-filter: blur(50px);
|
|
||||||
filter: blur(50px);
|
|
||||||
z-index: 0;
|
|
||||||
}
|
|
||||||
.swiper-container-flip {
|
|
||||||
overflow: visible;
|
|
||||||
}
|
|
||||||
.swiper-container-flip .swiper-slide {
|
|
||||||
pointer-events: none;
|
|
||||||
-webkit-backface-visibility: hidden;
|
|
||||||
backface-visibility: hidden;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
.swiper-container-flip .swiper-slide .swiper-slide {
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
.swiper-container-flip .swiper-slide-active,
|
|
||||||
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
|
|
||||||
pointer-events: auto;
|
|
||||||
}
|
|
||||||
.swiper-container-flip .swiper-slide-shadow-top,
|
|
||||||
.swiper-container-flip .swiper-slide-shadow-bottom,
|
|
||||||
.swiper-container-flip .swiper-slide-shadow-left,
|
|
||||||
.swiper-container-flip .swiper-slide-shadow-right {
|
|
||||||
z-index: 0;
|
|
||||||
-webkit-backface-visibility: hidden;
|
|
||||||
backface-visibility: hidden;
|
|
||||||
}
|
|
||||||
@@ -1,290 +0,0 @@
|
|||||||
|
|
||||||
.utill-container {max-width: 1000px; margin: 0 auto; padding: 50px 0;}
|
|
||||||
.utill-container section {padding-bottom:70px;}
|
|
||||||
.utill-tit {background: #ccc; padding: 10px 22px; margin-bottom: 40px;}
|
|
||||||
.heading-container {max-width: 1000px; margin: 0 auto; padding-top:90px;}
|
|
||||||
/* 컨테이너 전체 여백 */
|
|
||||||
.display-wrap { max-width: 1000px; margin: 0 auto}
|
|
||||||
.subpage {padding: 90px 0 120px 0;}
|
|
||||||
.max-cotaniner {max-width: 1000px; margin: 0 auto; }
|
|
||||||
.mini-container {max-width: 466px; margin: 0 auto; min-width:85%}
|
|
||||||
.full-screen-center {display: flex; align-items: center; justify-content: center; min-height: calc(100vh - 220px);}
|
|
||||||
.pd-vertival{ padding: 0 15px}
|
|
||||||
main {padding-bottom : 120px;}
|
|
||||||
|
|
||||||
|
|
||||||
.mb-30 {margin-bottom: 30px;}
|
|
||||||
h1 {font-size: 40px; font-weight: 500; color:#222; letter-spacing: -2px;}
|
|
||||||
h2 {font-size: 30px; font-weight: 500; color:#222; letter-spacing: -1.5px;}
|
|
||||||
h3 {font-size: 22px; font-weight: 400; color:#222; letter-spacing: -1.1px;}
|
|
||||||
p {font-size: 18px; letter-spacing: -.8px; font-weight: 400;}
|
|
||||||
|
|
||||||
@media (max-width: 769px) {
|
|
||||||
.subpage {padding:37px 0 90px 0;}
|
|
||||||
p {font-size: 16px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width:576px) {
|
|
||||||
main {padding-bottom : 40px;}
|
|
||||||
.subpage {padding:37px 0 60px 0;}
|
|
||||||
div.display1 {margin-bottom: 20px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
.dark {color:#000 !important;}
|
|
||||||
.light {color:#555 !important;}
|
|
||||||
.regu {font-weight: 400 !important;}
|
|
||||||
.midi {font-weight: 500 !important;}
|
|
||||||
.bold {font-weight: 700 !important;}
|
|
||||||
.ft-20 {font-weight: 20px !important;}
|
|
||||||
.ft-18 {font-size: 18px !important;}
|
|
||||||
.ft-16 {font-size: 16px !important;}
|
|
||||||
.mt-30 {margin-top: 30px;}
|
|
||||||
.mb-40 {margin-bottom: 40px;}
|
|
||||||
.ft-right {text-align: right !important;}
|
|
||||||
.ft-left {text-align: left;}
|
|
||||||
.border-top {border-top: 1px solid #dfdfdf;}
|
|
||||||
strong {font-weight: 500;}
|
|
||||||
|
|
||||||
.display1 {
|
|
||||||
position: relative;
|
|
||||||
line-height: 1;
|
|
||||||
position: rleative; margin-bottom: 30px;
|
|
||||||
border-bottom: 1px solid rgba(34,34,34,.3);
|
|
||||||
}
|
|
||||||
.display1 h1 {display: inline-block; font-weight: 700; position: relative; padding-bottom:18px;}
|
|
||||||
.display1 h1:after {content: ''; position: absolute; bottom:0; left:0; height:8px; width: 100%; background: #222; display: inline-block; z-index: 1; }
|
|
||||||
.display1 h1 span.small { font-size: 30px; font-weight: 500; display: inline-block; padding-left: 5px; }
|
|
||||||
.display1 p { font-size: 16px; font-weight: 300; display: inline-block; color:#555; line-height: inherit;}
|
|
||||||
.display1 p b {font-weight: 500;}
|
|
||||||
.display1 p span.dash { display:inline-block; padding: 0 17px;}
|
|
||||||
|
|
||||||
.display1.dispaly1-sub h1 {font-weight: 500;}
|
|
||||||
|
|
||||||
.display2 {border-bottom: 1px solid rgba(34,34,34,.3); margin-bottom:30px;}
|
|
||||||
.display2 h2 { color:#222; font-size: 30px; font-weight: 500; display: inline-block; padding-bottom: 15px; position: relative;}
|
|
||||||
.display2 h2:after {content: ''; position: absolute; bottom:0; left:0; height:6px; width: 100%; background: #222; display: inline-block; z-index: 1; }
|
|
||||||
.display2 p { display: inline-block; color:#555; line-height: inherit; font-size: 15px;}
|
|
||||||
.display2 p span.dash {display: inline-block; padding: 0 20px;}
|
|
||||||
|
|
||||||
.editor-display2 {border-bottom: 1px solid rgba(34,34,34,.3); margin-bottom:30px;}
|
|
||||||
.editor-display2 h2 { color:#222; font-size: 30px; font-weight: 500; display: inline-block; padding-bottom: 15px; position: relative;}
|
|
||||||
.editor-display2 h2:after {content: ''; position: absolute; bottom:0; left:0; height:6px; width: 100%; background: #222; display: inline-block; z-index: 1; }
|
|
||||||
.editor-display2 p { display: inline-block; color:#555; line-height: inherit; font-size: 15px;}
|
|
||||||
.editor-display2 p span.dash {display: inline-block; padding: 0 20px;}
|
|
||||||
|
|
||||||
.login-heading {text-align: center; padding-bottom: 36px; }
|
|
||||||
.login-form hr { opacity: 0.7;}
|
|
||||||
.log-hr-2 {margin:40px 0 15px 0;}
|
|
||||||
.login-utill { width: 100%; padding: 0 15px; text-align: left;}
|
|
||||||
.login-utill .item { display: inline-block; margin-right: 15px; padding-right: 15px;}
|
|
||||||
.login-utill .item a {display: inline-block; padding-right: 8px; font-weight: 18px;}
|
|
||||||
.login-utill .item span.log-aro {font-size: 15px; color:#666; font-weight: 500; line-height: 18px;}
|
|
||||||
.login-utill .item+.item a {}
|
|
||||||
|
|
||||||
/* 판넬 */
|
|
||||||
.pannel { border-width: 1px; border-color: rgb(223, 223, 223); border-style: solid; background-color: rgb(247, 247, 247); }
|
|
||||||
.pannel p {font-weight: 300;}
|
|
||||||
.pannel .align-left { text-align: left;}
|
|
||||||
.pannel .align-right {text-align: right;}
|
|
||||||
.pannel .pannel-flex,.pannel .pannel-body {display: flex; justify-content: space-between; }
|
|
||||||
.pannel .pannel-heading {background: #fff; padding: 30px 58px; font-size: 20px; font-weight: 500;}
|
|
||||||
.pannel .pannel-heading {border-bottom: 1px solid rgb(223, 223, 223);}
|
|
||||||
.pannel .pannel-body {line-height: 1.45;}
|
|
||||||
.pannel .pannel-flex {line-height:2.15; font-weight: 300;}
|
|
||||||
|
|
||||||
/* 버튼 */
|
|
||||||
.btn {border: none; background: none; line-height: 1; text-align:center; font-size: 18px; letter-spacing: -1px; cursor: pointer;}
|
|
||||||
.btn.small {font-size: 16px;}
|
|
||||||
.btn.mid {font-size: 18px;}
|
|
||||||
.btn.large {font-size: 20px;}
|
|
||||||
.btn.solid {background: #0e3059 !important; color:#fff !important; padding: 20px 35px;}
|
|
||||||
.btn.border {border: 1px solid #0e3059; color:#0e3059; padding: 19px 35px;}
|
|
||||||
.btn.inline-btn {display: inline-block;}
|
|
||||||
.btn.block-btn {display: block; width: 100%;}
|
|
||||||
.under-btn {position: relative; line-height: 35px;}
|
|
||||||
.under-btn:after {content:''; width: 80%; height: 2px; position: absolute; bottom: 0; left:10%; background: #000; z-index: 1;}
|
|
||||||
.under-btn:hover {color:#0e3059;}
|
|
||||||
.more-btn {border-bottom: 1px solid #222; display: inline-block; transition: 0.3s; transform: translateY(0);}
|
|
||||||
.more-btn p {padding-bottom: 7px;}
|
|
||||||
.more-btn:hover {transform: translateY(-3px);}
|
|
||||||
.link-btn {position: relative; padding-bottom: 7px;}
|
|
||||||
.link-btn:before {width: 76%; height: 1px; left:13%; bottom:0; content: ''; position: absolute; background: #000; content:'';}
|
|
||||||
.btn-row.btn-row-center { text-align: center;}
|
|
||||||
/* 인풋 */
|
|
||||||
.form {position: relative; width: 100%; height: 100%; overflow: hidden;}
|
|
||||||
.input-group {padding-bottom:30px;}
|
|
||||||
.input-group label { font-weight: 16px; font-weight: 700; line-height: 1.2; text-align: left; letter-spacing: 0.7px; display: block; margin-bottom: 15px; }
|
|
||||||
.input-group input {outline: none;}
|
|
||||||
.input-group input[type="select"],.input-group input[type="text"],.input-group input[type="password"],.input-group input[type="email"]
|
|
||||||
{height: 48px; line-height: 1; border: 1px solid #c6c6c6; padding: 17px 22px; width: 100%; vertical-align: middle;}
|
|
||||||
input {line-height: 1 !important;}
|
|
||||||
.input-group input::placeholder { color:#666; font-size: 16px;}
|
|
||||||
.input-group input:focus {border-color:#0e3059; }
|
|
||||||
.input-group input.search-input {background: url('../images/search-ico.png')no-repeat 97% center/auto,#fff;}
|
|
||||||
.input-group textarea {width: 100%; border: 1px solid #c6c6c6; padding: 18px 22px; height: 130px; overflow-y:scroll; font-size: 16px; resize:none; display: block; outline:none;}
|
|
||||||
.input-group textarea:focus {border-color:#0e3059;}
|
|
||||||
.input-group label .small { display: inline-block; padding: 0 8px; font-weight: 400; color:#333; color:#ff304f}
|
|
||||||
.input-group select {height: 48px; line-height: 48px; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none;
|
|
||||||
background: url('http://luckyphone.kr/images/select_arrow.png')no-repeat 90% center/auto,#fff; color:#222;
|
|
||||||
text-align: center; font-size: 16px; padding: 0 25px; font-weight: 500;
|
|
||||||
}
|
|
||||||
.input-group select:focus {outline: none;}
|
|
||||||
#colorStok-tbl select {line-height: 35px !important; height: 35px !important; border:none !important;}
|
|
||||||
select#size_select {background: url('http://luckyphone.kr/images/select_arrow.png')no-repeat 90% center/auto,rgb(247, 247, 247); color:#222; border: 1px solid rgb(223, 223, 223); line-height: 53px; height: 53px;}
|
|
||||||
|
|
||||||
|
|
||||||
/* 에디터용 인풋 & form , css */
|
|
||||||
.editor-form {padding-top:30px;}
|
|
||||||
.editor-form label {font-weight: 500;}
|
|
||||||
.ctl-btn-row {}
|
|
||||||
.add-btn {background: #57606f; padding: 10px 12px; color:#fff; font-size: 12px;}
|
|
||||||
.del-btn {background: #ff4757; padding: 10px 12px; color:#fff; font-size: 12px; }
|
|
||||||
|
|
||||||
.input-group select.arrow-end {background: url('http://luckyphone.kr/images/select_arrow.png')no-repeat 95% center/auto,#fff; color:#222;}
|
|
||||||
.input-group.inline {display: flex; align-items: center; justify-content: center;}
|
|
||||||
.input-group.inline label {display: inline-block; flex-basis: 250px; margin: 0 auto; padding-left:30px;}
|
|
||||||
|
|
||||||
/* form tbl */
|
|
||||||
.tbl-container {max-width: 1000px; margin: 0 auto; padding-bottom: 35px;}
|
|
||||||
.tbl-group {padding-bottom:30px; background: #f1f2f6; padding: 20px 25px; position: relative;}
|
|
||||||
.tbl-group label { font-weight: 16px; font-weight: 500; line-height: 1.2; text-align: left; letter-spacing: 0.7px; display: block; margin-bottom: 20px; padding-left: 15px;}
|
|
||||||
.tbl-group .tbl-control {position: absolute; right: 25px; top:20px;}
|
|
||||||
.tbl-bg {background: #f1f2f6; padding:20px 25px; margin-bottom:30px;}
|
|
||||||
.tbl-bg .kboard-attr-row {margin-bottom:15px; display: block; overflow: hidden; }
|
|
||||||
.editor-tbl {width: 100%; border: 1px solid #dfdfdf;}
|
|
||||||
/* .editor-tbl tr td,.editor-tbl tr th {padding: 18px 23px;} */
|
|
||||||
.editor-tbl tr th {padding: 13px 22px;}
|
|
||||||
.editor-tbl tr th {background: #ced6e0; border-bottom: 1px solid #dfdfdf; color:#000;}
|
|
||||||
.editor-tbl tr td {background: #fff;}
|
|
||||||
.editor-tbl tr td {border-bottom: 1px solid #dfdfdf; border-left: 1px solid #dfdfdf;}
|
|
||||||
.editor-tbl tr td input {display: block; line-height: 35px !important; height: 35px !important; padding: 0 22px !important; border:none !important; outline: none !important;}
|
|
||||||
.editor-tbl tr th+th {border-left: 1px solid #dfdfdf;}
|
|
||||||
.editor-tbl.left-border {border-left:1px solid #dfdfdf;}
|
|
||||||
.editor-tbl.solid-td {background: #f7f7f7;}
|
|
||||||
.editor-tbl.editor-tbl-vertical th {width: 130px;}
|
|
||||||
.editor-tbl.editor-tbl-vertical .ctrol-td {}
|
|
||||||
.tbl-group+.tbl-group {margin-top: 25px;}
|
|
||||||
|
|
||||||
.pc-on { display: block !important;}
|
|
||||||
.mobile-on { display: none !important;}
|
|
||||||
|
|
||||||
/* 유틸 */
|
|
||||||
.result-pannel {background: #fff; border: 1px solid #000; padding: 23px 0; width: 100%;}
|
|
||||||
.result-pannel .txt-flex {max-width: 350px; margin: 0 auto; line-height: 1; display: flex; align-items: center; justify-content: space-between;}
|
|
||||||
.result-pannel .txt-flex .l {text-align: center;}
|
|
||||||
.result-pannel .txt-flex .l h3 { padding-bottom: 6px; font-weight: 500; font-size: 25px; color:#000; letter-spacing: 0;}
|
|
||||||
.result-pannel .txt-flex .l p {font-size: 16px; font-weight: 400; padding: 0; margin: 0; letter-spacing: -1.28px; color:#444;}
|
|
||||||
.result-pannel .txt-flex .r .num { font-size: 40px; font-weight: bold; letter-spacing: 0; color:#ff304f; }
|
|
||||||
.result-pannel .txt-flex .r span {font-size: 36px; font-weight: 400;}
|
|
||||||
|
|
||||||
.result-pannel.small {}
|
|
||||||
|
|
||||||
@media (max-width: 960px) {
|
|
||||||
.result-pannel .txt-flex {max-width: 100%; padding: 0 15px; display: inline-block; text-align: center; width:100%;}
|
|
||||||
.result-pannel .txt-flex .l {display: block; margin-bottom: 10px;}
|
|
||||||
.result-pannel .txt-flex .l h3 {font-size: 23px;}
|
|
||||||
.result-pannel .txt-flex .r {flex-basis:auto;}
|
|
||||||
.result-pannel .txt-flex .r .num {font-size: 33px;}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* tab */
|
|
||||||
.tab-content {display: none;}
|
|
||||||
.tab-content.active {display: block;}
|
|
||||||
.tab-nav button:after,.tab-nav a:after {display: none;}
|
|
||||||
.tab-nav button.active:after,.tab-nav a:after {display: block;}
|
|
||||||
|
|
||||||
@media (max-width:960px) {
|
|
||||||
.display-wrap {padding: 0 15px; border-bottom: none;;}
|
|
||||||
.display1 p {display: none;}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width:576px) {
|
|
||||||
.pc-on { display: none !important;}
|
|
||||||
.mobile-on { display: block !important;}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* 체크박스 커스텀 */
|
|
||||||
|
|
||||||
/* The container */
|
|
||||||
.ck-group {display: flex; justify-content: space-between; padding-top: 15px;}
|
|
||||||
.ck-group button {font-size: 16px;}
|
|
||||||
.ck-container {
|
|
||||||
display: block;
|
|
||||||
position: relative;
|
|
||||||
padding-left: 35px;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
cursor: pointer;
|
|
||||||
font-size: 16px;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-ms-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
font-weight: 400 !important;
|
|
||||||
color:#222;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Hide the browser's default checkbox */
|
|
||||||
.ck-container input {
|
|
||||||
position: absolute;
|
|
||||||
opacity: 0;
|
|
||||||
cursor: pointer;
|
|
||||||
height: 0;
|
|
||||||
width: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Create a custom checkbox */
|
|
||||||
.checkmark {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
height: 22px;
|
|
||||||
width: 22px;
|
|
||||||
background-color: #eee;
|
|
||||||
border-radius: 3px;
|
|
||||||
}
|
|
||||||
.ck-container:hover input ~ .checkmark {
|
|
||||||
background-color: #ccc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ck-container input:checked ~ .checkmark {
|
|
||||||
background-color: #0e3059;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Create the checkmark/indicator (hidden when not checked) */
|
|
||||||
.checkmark:after {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Show the checkmark when checked */
|
|
||||||
.ck-container input:checked ~ .checkmark:after {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Style the checkmark/indicator */
|
|
||||||
.ck-container .checkmark:after {
|
|
||||||
left: 9px;
|
|
||||||
top: 5px;
|
|
||||||
width: 5px;
|
|
||||||
height: 10px;
|
|
||||||
border: solid white;
|
|
||||||
border-width: 0 3px 3px 0;
|
|
||||||
-webkit-transform: rotate(45deg);
|
|
||||||
-ms-transform: rotate(45deg);
|
|
||||||
transform: rotate(45deg);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* pannel ck */
|
|
||||||
.pannel-ck {
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-ms-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.kboard-control {overflow: hidden; padding: 20px 15px; }
|
|
||||||
.kboard-control .left {float: left;}
|
|
||||||
.kboard-control .right {float: right;}
|
|
||||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 116 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 119 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 117 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 14 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 116 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 119 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 117 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 237 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 226 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 226 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 225 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 221 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 183 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 180 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 187 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 237 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1016 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 978 B |
Binary file not shown.
|
Before Width: | Height: | Size: 711 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 43 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1022 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 KiB |
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user