포토리뷰, 메일폼 수정 완료료
This commit is contained in:
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@@ -2256,6 +2256,16 @@
|
||||
height: 3rem;
|
||||
}
|
||||
}
|
||||
.util-area .btn-reviewCount {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
transform: translate(0, -50%);
|
||||
font-size: 1.6rem;
|
||||
color: #05141f;
|
||||
cursor: pointer;
|
||||
border-bottom: 1px solid #05141f;
|
||||
}
|
||||
|
||||
.utilBtnArea {
|
||||
width: 100%;
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -11,6 +11,7 @@
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
transition: top 0.3s ease-in-out;
|
||||
|
||||
@include tablet {
|
||||
top: 5.6rem;
|
||||
}
|
||||
@@ -18,6 +19,7 @@
|
||||
@media (min-width: 1120px) {
|
||||
top: 8rem;
|
||||
}
|
||||
|
||||
@media (min-width: 1025px) {
|
||||
height: 35rem;
|
||||
}
|
||||
@@ -45,6 +47,7 @@
|
||||
&.case06 {
|
||||
background-image: url("/kr/assets/images/kia/contents/header06.jpg");
|
||||
}
|
||||
|
||||
&.case07 {
|
||||
background-image: url("/kr/assets/images/kia/keybg/event-key.png");
|
||||
}
|
||||
@@ -195,7 +198,7 @@
|
||||
@media (max-width: 768px) {
|
||||
width: 100%;
|
||||
|
||||
& + li {
|
||||
&+li {
|
||||
margin-top: 38px;
|
||||
}
|
||||
|
||||
@@ -274,7 +277,7 @@
|
||||
background-position: 40px 5px;
|
||||
}
|
||||
|
||||
& + li {
|
||||
&+li {
|
||||
border-left: 1px solid #dedede;
|
||||
}
|
||||
|
||||
@@ -284,7 +287,7 @@
|
||||
padding-right: 0;
|
||||
padding-left: 0 !important;
|
||||
|
||||
& + li {
|
||||
&+li {
|
||||
margin-top: 20px;
|
||||
border-left: none;
|
||||
}
|
||||
@@ -342,7 +345,7 @@
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
& + dd {
|
||||
&+dd {
|
||||
color: #676767;
|
||||
}
|
||||
}
|
||||
@@ -495,7 +498,7 @@
|
||||
|
||||
//스토어 가입안내
|
||||
&.caseRegist {
|
||||
section + section {
|
||||
section+section {
|
||||
margin-top: 80px;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
@@ -538,7 +541,7 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
li + li {
|
||||
li+li {
|
||||
margin-top: 30px;
|
||||
}
|
||||
}
|
||||
@@ -560,8 +563,8 @@
|
||||
|
||||
//상품별 이용안내 목록
|
||||
&.caseUsageList {
|
||||
> section {
|
||||
& + section {
|
||||
>section {
|
||||
&+section {
|
||||
margin-top: 80px;
|
||||
}
|
||||
|
||||
@@ -579,7 +582,7 @@
|
||||
a {
|
||||
width: calc(50% - 20px);
|
||||
|
||||
& + a + a {
|
||||
&+a+a {
|
||||
margin-top: 40px;
|
||||
}
|
||||
}
|
||||
@@ -626,7 +629,7 @@
|
||||
a {
|
||||
width: calc(50% - 15px);
|
||||
|
||||
& + a + a {
|
||||
&+a+a {
|
||||
margin-top: 30px;
|
||||
}
|
||||
}
|
||||
@@ -648,7 +651,7 @@
|
||||
a {
|
||||
width: calc(50% - 10px);
|
||||
|
||||
& + a + a {
|
||||
&+a+a {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
@@ -669,14 +672,14 @@
|
||||
div.listType02 a {
|
||||
width: 100%;
|
||||
|
||||
& + a {
|
||||
&+a {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
& + section {
|
||||
&+section {
|
||||
margin-top: 60px;
|
||||
}
|
||||
|
||||
@@ -687,7 +690,7 @@
|
||||
div.listType01 a {
|
||||
width: 100%;
|
||||
|
||||
& + a {
|
||||
&+a {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
@@ -701,7 +704,7 @@
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
> section + section {
|
||||
>section+section {
|
||||
margin-top: 90px;
|
||||
}
|
||||
|
||||
@@ -789,7 +792,7 @@
|
||||
display: none;
|
||||
}
|
||||
|
||||
> ul {
|
||||
>ul {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
@@ -904,7 +907,7 @@
|
||||
justify-content: space-between;
|
||||
align-items: stretch;
|
||||
|
||||
> p {
|
||||
>p {
|
||||
margin-top: 28px;
|
||||
color: #676767;
|
||||
}
|
||||
@@ -913,7 +916,7 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
> section {
|
||||
>section {
|
||||
letter-spacing: -4px;
|
||||
|
||||
&:first-of-type {
|
||||
@@ -960,10 +963,10 @@
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
> div {
|
||||
>div {
|
||||
display: inline-block;
|
||||
|
||||
& + div {
|
||||
&+div {
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
@@ -987,7 +990,7 @@
|
||||
border: 1px solid #dedede;
|
||||
}
|
||||
|
||||
& + a {
|
||||
&+a {
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
@@ -1002,7 +1005,7 @@
|
||||
@media (max-width: 1024px) {
|
||||
justify-content: flex-start;
|
||||
|
||||
> section {
|
||||
>section {
|
||||
&:first-of-type {
|
||||
width: 100%;
|
||||
}
|
||||
@@ -1028,8 +1031,8 @@
|
||||
}
|
||||
|
||||
@media (max-width: 680px) {
|
||||
> section {
|
||||
> div {
|
||||
>section {
|
||||
>div {
|
||||
&:first-of-type {
|
||||
width: 100%;
|
||||
}
|
||||
@@ -1046,11 +1049,11 @@
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
> p {
|
||||
>p {
|
||||
margin-top: 23px;
|
||||
}
|
||||
|
||||
> section {
|
||||
>section {
|
||||
@media (max-width: 359px) {
|
||||
&:first-of-type {
|
||||
display: flex;
|
||||
@@ -1058,14 +1061,14 @@
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
|
||||
> div {
|
||||
>div {
|
||||
display: unset;
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
& + section {
|
||||
&+section {
|
||||
margin-top: 28px !important;
|
||||
}
|
||||
|
||||
@@ -1080,7 +1083,7 @@
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
> div {
|
||||
>div {
|
||||
strong {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
@@ -1101,7 +1104,7 @@
|
||||
.item {
|
||||
width: calc(50% - 10px);
|
||||
|
||||
& + .item + .item {
|
||||
&+.item+.item {
|
||||
margin-top: 14px;
|
||||
}
|
||||
}
|
||||
@@ -1127,12 +1130,13 @@
|
||||
.caseFunction {
|
||||
.functionDetail {
|
||||
.itemWrap {
|
||||
|
||||
.item,
|
||||
p {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.item + .item {
|
||||
.item+.item {
|
||||
margin-top: 14px;
|
||||
}
|
||||
|
||||
@@ -1168,7 +1172,7 @@
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
> section + section {
|
||||
>section+section {
|
||||
margin-top: 60px;
|
||||
}
|
||||
|
||||
@@ -1199,7 +1203,7 @@
|
||||
|
||||
//원격 스마트 주차 보조2 (RSPA2) 기능 소개
|
||||
&.caseRspa2 {
|
||||
> section + section {
|
||||
>section+section {
|
||||
margin-top: 90px;
|
||||
|
||||
@media (max-width: 500px) {
|
||||
@@ -1228,7 +1232,7 @@
|
||||
position: relative;
|
||||
width: calc(20% - 12px);
|
||||
|
||||
& + li {
|
||||
&+li {
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
@@ -1253,7 +1257,7 @@
|
||||
li {
|
||||
width: calc(100% / 3 - 10px);
|
||||
|
||||
& + li + li + li {
|
||||
&+li+li+li {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
@@ -1269,11 +1273,11 @@
|
||||
li {
|
||||
width: calc(50% - 7px);
|
||||
|
||||
& + li {
|
||||
&+li {
|
||||
margin-left: 14px;
|
||||
}
|
||||
|
||||
& + li + li {
|
||||
&+li+li {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
@@ -1301,7 +1305,7 @@
|
||||
width: 100%;
|
||||
margin-left: 0 !important;
|
||||
|
||||
& + li {
|
||||
&+li {
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
@@ -1310,7 +1314,7 @@
|
||||
}
|
||||
|
||||
.howtobuy {
|
||||
> div {
|
||||
>div {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: row;
|
||||
@@ -1318,7 +1322,7 @@
|
||||
justify-content: space-between;
|
||||
margin-top: 40px;
|
||||
|
||||
> * {
|
||||
>* {
|
||||
position: relative;
|
||||
width: calc(100% / 3 - 8px);
|
||||
padding: 30px 30px 110px;
|
||||
@@ -1362,7 +1366,7 @@
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
> * {
|
||||
>* {
|
||||
padding: 25px 25px 79px;
|
||||
background-position: left 20px bottom 20px;
|
||||
background-size: 40px;
|
||||
@@ -1375,10 +1379,10 @@
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
> * {
|
||||
>* {
|
||||
width: 100%;
|
||||
|
||||
& + * {
|
||||
&+* {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
@@ -1404,8 +1408,8 @@
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
> div {
|
||||
h3 + p {
|
||||
>div {
|
||||
h3+p {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
@@ -1423,7 +1427,7 @@
|
||||
margin-left: -15px;
|
||||
padding-top: 30px;
|
||||
|
||||
> div {
|
||||
>div {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
@@ -1550,11 +1554,11 @@
|
||||
position: relative;
|
||||
margin-bottom: 10rem;
|
||||
|
||||
& + .storeGuideItem {
|
||||
&+.storeGuideItem {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
> header {
|
||||
>header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
@@ -1584,7 +1588,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.titleCase03 + strong {
|
||||
.titleCase03+strong {
|
||||
padding-bottom: 8px !important;
|
||||
}
|
||||
|
||||
@@ -1617,7 +1621,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
> b {
|
||||
>b {
|
||||
display: block;
|
||||
margin: 20px 0 8px;
|
||||
font-size: 14px;
|
||||
@@ -1667,7 +1671,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.swiper-horizontal > .swiper-scrollbar,
|
||||
.swiper-horizontal>.swiper-scrollbar,
|
||||
.swiper-scrollbar.swiper-scrollbar-horizontal {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
@@ -1689,7 +1693,7 @@
|
||||
height: 68px;
|
||||
}
|
||||
|
||||
.swiper-scrollbar-lock + .swiper-scrollbar-after-space {
|
||||
.swiper-scrollbar-lock+.swiper-scrollbar-after-space {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -1728,7 +1732,7 @@
|
||||
margin-left: -2rem;
|
||||
margin-right: -2rem;
|
||||
|
||||
& + .storeGuideItem {
|
||||
&+.storeGuideItem {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
@@ -1788,7 +1792,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.swiper-horizontal > .swiper-scrollbar,
|
||||
.swiper-horizontal>.swiper-scrollbar,
|
||||
.swiper-scrollbar.swiper-scrollbar-horizontal {
|
||||
width: calc(100% - 40px);
|
||||
}
|
||||
@@ -1898,18 +1902,18 @@
|
||||
align-items: center;
|
||||
padding-top: 50px;
|
||||
|
||||
> div {
|
||||
>div {
|
||||
width: 50%;
|
||||
|
||||
&:first-child {
|
||||
padding-right: 50px;
|
||||
}
|
||||
|
||||
h3 + p {
|
||||
h3+p {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
p + p {
|
||||
p+p {
|
||||
margin-top: 10px;
|
||||
color: #676767;
|
||||
}
|
||||
@@ -1927,7 +1931,7 @@
|
||||
width: 50%;
|
||||
border-radius: 6px;
|
||||
|
||||
& + div {
|
||||
&+div {
|
||||
padding-left: 50px;
|
||||
}
|
||||
}
|
||||
@@ -1946,11 +1950,11 @@
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
> div:first-child {
|
||||
>div:first-child {
|
||||
padding-right: 30px;
|
||||
}
|
||||
|
||||
img + div {
|
||||
img+div {
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
||||
@@ -1960,7 +1964,8 @@
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
> div,
|
||||
|
||||
>div,
|
||||
img {
|
||||
width: 100%;
|
||||
padding-right: 0 !important;
|
||||
@@ -2097,7 +2102,7 @@
|
||||
background-position: 25px 25px;
|
||||
font-size: 16px;
|
||||
|
||||
& + a {
|
||||
&+a {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
@@ -2357,7 +2362,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.btn-select.on + .list-member {
|
||||
.btn-select.on+.list-member {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@@ -2365,8 +2370,10 @@
|
||||
font-size: 1.6rem;
|
||||
line-height: 2;
|
||||
box-sizing: border-box;
|
||||
|
||||
button {
|
||||
font-size: 1.4rem;
|
||||
|
||||
@include tablet {
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
@@ -2467,7 +2474,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.btn-select.on + .list-member {
|
||||
.btn-select.on+.list-member {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@@ -2572,7 +2579,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.btn-select.on + .list-member {
|
||||
.btn-select.on+.list-member {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@@ -2598,6 +2605,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.util-area {
|
||||
position: relative;
|
||||
display: flex;
|
||||
@@ -2605,40 +2613,58 @@
|
||||
align-items: center;
|
||||
gap: 1.6rem;
|
||||
margin-bottom: 1.6rem;
|
||||
|
||||
@media (min-width: 768px) {
|
||||
gap: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.btn-wish {
|
||||
width: 2.4rem;
|
||||
height: 2.4rem;
|
||||
background: url(../images/common/icon_heart.png) no-repeat center / 100% auto;
|
||||
text-indent: -9999px;
|
||||
cursor: pointer;
|
||||
|
||||
@media (min-width: 768px) {
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-share {
|
||||
width: 2.4rem;
|
||||
height: 2.4rem;
|
||||
background: url(../images/common/icon_share.png) no-repeat center / 100% auto;
|
||||
text-indent: -9999px;
|
||||
cursor: pointer;
|
||||
|
||||
@media (min-width: 768px) {
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-reviewCount {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
transform: translate(0, -50%);
|
||||
font-size: 1.6rem;
|
||||
color: #05141f;
|
||||
cursor: pointer;
|
||||
border-bottom: 1px solid #05141f;
|
||||
}
|
||||
}
|
||||
|
||||
.utilBtnArea {
|
||||
width: 100%;
|
||||
padding: 4rem 0;
|
||||
|
||||
@include tablet {
|
||||
padding: 4rem 0;
|
||||
}
|
||||
|
||||
.utilBtnInner {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
@@ -2646,11 +2672,13 @@
|
||||
max-width: 120rem;
|
||||
margin: 0 auto;
|
||||
padding: 0 2rem;
|
||||
|
||||
@include tablet {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.util-area {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user