master
parent
e6d406153a
commit
9c620a3416
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
Binary file not shown.
After Width: | Height: | Size: 230 KiB |
Binary file not shown.
After Width: | Height: | Size: 42 KiB |
@ -1,104 +0,0 @@
|
||||
.artist-info{
|
||||
display:flex;
|
||||
> div{
|
||||
flex:1;
|
||||
padding:0px 60px;
|
||||
}
|
||||
.artist-image-container{
|
||||
padding-left:0;
|
||||
text-align: center;
|
||||
}
|
||||
.artist-profile{
|
||||
.name-box{
|
||||
padding-bottom:30px;
|
||||
}
|
||||
.intro-box{
|
||||
padding:30px 0px;
|
||||
}
|
||||
.career-box{
|
||||
padding:30px 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.artist-eng-name{
|
||||
font-size:30px;
|
||||
font-weight: 500;
|
||||
line-height: 39px;
|
||||
}
|
||||
.artist-kor-name{
|
||||
font-size: 42px;
|
||||
line-height: 50.41px;
|
||||
letter-spacing: -0.005em;
|
||||
font-weight: 200;
|
||||
}
|
||||
.artist-box-title{
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
line-height: 130%;
|
||||
letter-spacing: -0.5px;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
.artist-text-content{
|
||||
font-weight: 300;
|
||||
font-size: 16px;
|
||||
line-height: 130%;
|
||||
letter-spacing: -0.5px;
|
||||
}
|
||||
|
||||
.list-container{
|
||||
display: flex;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
/************ BreakPoints ************/
|
||||
// Small devices (landscape phones, 576px and up)
|
||||
@media (max-width: 576px) {
|
||||
}
|
||||
|
||||
// Medium devices (tablets, 768px and up)
|
||||
@media (max-width: 768px) {
|
||||
|
||||
}
|
||||
|
||||
// Large devices (desktops, 992px and up)
|
||||
@media (max-width: 992px) {
|
||||
|
||||
}
|
||||
|
||||
// X-Large devices (large desktops, 1200px and up)
|
||||
@media (max-width: 1200px) {
|
||||
|
||||
}
|
||||
|
||||
// XX-Large devices (larger desktops, 1400px and up)
|
||||
@media (max-width: 1400px) {
|
||||
.artist-info{
|
||||
flex-direction: column;
|
||||
|
||||
> div{
|
||||
padding:0px;
|
||||
}
|
||||
|
||||
.artist-profile{
|
||||
.career-box{
|
||||
border-top:1px solid rgba(0, 0, 0, 0.05);
|
||||
border-bottom:1px solid rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
}
|
||||
|
||||
.artist-price, .artist-exhibit{
|
||||
border:0;
|
||||
padding:20px 0px;
|
||||
border-bottom:1px solid rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
}
|
||||
|
||||
.artist-swiper{
|
||||
overflow: unset;
|
||||
}
|
||||
.artist-swiper-wrapper{
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
@ -1,297 +0,0 @@
|
||||
.arts-main-section{
|
||||
background: url('/images/background/arts-background.png') no-repeat;
|
||||
background-size: cover;
|
||||
width:calc(100% - 80px);
|
||||
height: 100vh;
|
||||
margin-left:80px;
|
||||
padding:60px 240px 60px 160px;
|
||||
|
||||
.arts-categorys{
|
||||
padding-top:70px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.arts-category-item{
|
||||
max-width: 400px;
|
||||
|
||||
.category-text{
|
||||
background:white;
|
||||
padding:20px;
|
||||
padding-right:0px;
|
||||
.category-title{
|
||||
font-size:30px;
|
||||
font-weight: 300;
|
||||
line-height:39px;
|
||||
letter-spacing: -0.005em;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
.category-desc{
|
||||
padding-top:20px;
|
||||
font-weight: 200;
|
||||
font-size:18px;
|
||||
line-height:23.4px;
|
||||
letter-spacing: -0.005em;
|
||||
}
|
||||
.category-link{
|
||||
margin-top:30px;
|
||||
a{
|
||||
padding:0px 6px;
|
||||
border-bottom:1px solid #c0c0c0;
|
||||
font-size:16px;
|
||||
line-height: 24px;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.ceramics-section{
|
||||
background: url('/images/arts/bg-ceramics.png');
|
||||
background-size:cover;
|
||||
}
|
||||
.jewelry-section{
|
||||
background: url('/images/arts/bg-jewel.png');
|
||||
background-size:cover;
|
||||
}
|
||||
.paint-section{
|
||||
background: url('/images/arts/bg-pic.png');
|
||||
background-size:cover;
|
||||
}
|
||||
|
||||
.arts-intro{
|
||||
max-width: 340px;
|
||||
width: 340px;
|
||||
|
||||
.arts-intro-links{
|
||||
padding:20px 0px;
|
||||
border-bottom:1px solid rgba(0, 0, 0, 0.05);
|
||||
|
||||
img{
|
||||
margin-right:12px;
|
||||
width: 40px;
|
||||
}
|
||||
a{
|
||||
span{
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.arts-list-warper{
|
||||
padding-left:140px;
|
||||
display: flex;
|
||||
.arts-item{
|
||||
min-width: 324px;
|
||||
|
||||
.arts-item-title{
|
||||
font-size: 20px;
|
||||
line-height: 26px;
|
||||
letter-spacing: -0.005em;
|
||||
padding-top:20px;
|
||||
padding-bottom:30px;
|
||||
}
|
||||
.arts-desc-title{
|
||||
width: 70px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.arts-view{
|
||||
.view-container{
|
||||
margin-top:75px;
|
||||
display: flex;
|
||||
.view-image{
|
||||
max-width: 500px;
|
||||
width:100%;
|
||||
}
|
||||
.view-content{
|
||||
flex:1;
|
||||
padding-left:120px;
|
||||
|
||||
.content-title{
|
||||
display:flex;
|
||||
padding-bottom: 40px;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
|
||||
.content-name{
|
||||
font-weight: 500;
|
||||
font-size: 20px;
|
||||
line-height: 130%;
|
||||
letter-spacing: -0.5px;
|
||||
flex:1;
|
||||
}
|
||||
}
|
||||
.content-infos{
|
||||
display: flex;
|
||||
padding:40px 0px;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 140%;
|
||||
letter-spacing: -0.5px;
|
||||
.info-box{
|
||||
flex:1;
|
||||
.info-content{
|
||||
padding:7px 0px;
|
||||
display: flex;
|
||||
.art-category{
|
||||
width:90px;
|
||||
}
|
||||
.art-info{
|
||||
flex:1;
|
||||
padding-left: 10px;;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.content-desc{
|
||||
padding:40px 0px;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 140%;
|
||||
letter-spacing: -0.5px;
|
||||
}
|
||||
.content-inquiry{
|
||||
padding-top:40px;
|
||||
padding-bottom: 120px;
|
||||
}
|
||||
.content-controll{
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1700px){
|
||||
.arts-main-section{
|
||||
padding:40px 20px;
|
||||
}
|
||||
}
|
||||
/************ BreakPoints ************/
|
||||
// Small devices (landscape phones, 576px and up)
|
||||
@media (max-width: 576px) {
|
||||
}
|
||||
|
||||
// Medium devices (tablets, 768px and up)
|
||||
@media (max-width: 768px) {
|
||||
|
||||
}
|
||||
|
||||
// Large devices (desktops, 992px and up)
|
||||
@media (max-width: 992px) {
|
||||
|
||||
}
|
||||
|
||||
// X-Large devices (large desktops, 1200px and up)
|
||||
@media (max-width: 1200px) {
|
||||
.arts-main-section{
|
||||
width:100%;
|
||||
|
||||
.arts-categorys{
|
||||
padding-top:30px;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.arts-category-item{
|
||||
max-width: none;
|
||||
margin-bottom: 40px;
|
||||
|
||||
.category-text{
|
||||
.category-title{
|
||||
font-size:28px;
|
||||
line-height:36.4px;
|
||||
letter-spacing: -0.005em;
|
||||
padding-bottom:10px;
|
||||
}
|
||||
.category-desc{
|
||||
padding-top:10px;
|
||||
padding-top:18px;
|
||||
font-size:18px;
|
||||
line-height:23.4px;
|
||||
letter-spacing: -0.005em;
|
||||
}
|
||||
.category-link{
|
||||
margin-top:20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.arts-intro{
|
||||
padding:60px 20px;
|
||||
color:white !important;
|
||||
width:100%;
|
||||
max-width: 100%;
|
||||
|
||||
.arts-intro-links{
|
||||
padding:20px;
|
||||
background:rgba(7, 7, 7, 0.5);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.ceramics-section, .jewelry-section, .paint-section{
|
||||
&::after{
|
||||
content:'';
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
z-index: -1;
|
||||
position: absolute;
|
||||
top:0;
|
||||
}
|
||||
}
|
||||
|
||||
.arts-view{
|
||||
.view-container{
|
||||
flex-direction: column;
|
||||
|
||||
.view-image{
|
||||
margin:auto;
|
||||
}
|
||||
|
||||
.view-content{
|
||||
padding:20px 0px;;
|
||||
|
||||
.content-title{
|
||||
padding: 0px 20px 20px;
|
||||
}
|
||||
|
||||
.content-infos{
|
||||
flex-direction: column;
|
||||
padding:20px 0px;
|
||||
.info-box{
|
||||
padding:0px 20px;
|
||||
}
|
||||
}
|
||||
.content-desc{
|
||||
padding:20px;
|
||||
}
|
||||
|
||||
.content-inquiry{
|
||||
padding:20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// XX-Large devices (larger desktops, 1400px and up)
|
||||
@media (max-width: 1400px) {
|
||||
|
||||
.arts-main-section{
|
||||
width:100%;
|
||||
margin:0;
|
||||
height:auto;
|
||||
}
|
||||
|
||||
.arts-view{
|
||||
.view-container{
|
||||
padding:0;
|
||||
margin:0;
|
||||
}
|
||||
}
|
||||
}
|
@ -1,202 +0,0 @@
|
||||
.board-left-section{
|
||||
background: #F2F2F2;
|
||||
padding-top:60px;
|
||||
padding-left:80px;
|
||||
min-width: 332px;
|
||||
width: 332px;
|
||||
}
|
||||
.board-links{
|
||||
margin-top:60px;
|
||||
|
||||
> a{
|
||||
padding:10px 0px 4px;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
line-height: 140%;
|
||||
letter-spacing: -0.5px;
|
||||
display: block;
|
||||
|
||||
> div{
|
||||
padding-bottom:6px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
&.active{
|
||||
font-weight: 600;
|
||||
|
||||
> div{
|
||||
border-bottom:2px solid #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.board-section{
|
||||
flex:1;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.notice-list-table{
|
||||
thead{
|
||||
background:#F8F8F8;
|
||||
border-top:1px solid #212121;
|
||||
}
|
||||
th{
|
||||
font-size: 18px;
|
||||
line-height: 130%;
|
||||
text-align: center;
|
||||
padding:20px 0px !important;
|
||||
}
|
||||
tr{
|
||||
vertical-align: middle;
|
||||
}
|
||||
td{
|
||||
font-size: 16px;
|
||||
line-height: 130%;
|
||||
padding:15px 0px !important;
|
||||
}
|
||||
.number{
|
||||
width: 140px;
|
||||
}
|
||||
.created-at{
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
.notice-list, .inquery-page{
|
||||
padding:150px 200px 60px;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.notice-view{
|
||||
padding:150px 200px 60px;
|
||||
overflow-y: auto;
|
||||
height: 100vh;
|
||||
.board-title{
|
||||
padding-bottom:40px;
|
||||
}
|
||||
.board-date{
|
||||
padding:20px 0px;
|
||||
}
|
||||
.board-content{
|
||||
padding:40px 0px;
|
||||
min-height: 400px;
|
||||
}
|
||||
.board-controll{
|
||||
padding-top:40px;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
.news-list{
|
||||
padding:60px 40px 0px;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
|
||||
.news-column{
|
||||
padding:0px 40px;
|
||||
}
|
||||
.news-item{
|
||||
width: 300px;
|
||||
padding-bottom:40px;
|
||||
|
||||
.news-title{
|
||||
padding-top:20px;
|
||||
}
|
||||
.news-date{
|
||||
padding-top:10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.term-controll{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
.inquery-submit{
|
||||
margin-top:60px;
|
||||
}
|
||||
|
||||
|
||||
/************ BreakPoints ************/
|
||||
// Small devices (landscape phones, 576px and up)
|
||||
@media (max-width: 576px) {
|
||||
}
|
||||
|
||||
// Medium devices (tablets, 768px and up)
|
||||
@media (max-width: 768px) {
|
||||
}
|
||||
|
||||
// Large devices (desktops, 992px and up)
|
||||
@media (max-width: 992px) {
|
||||
|
||||
}
|
||||
|
||||
// X-Large devices (large desktops, 1200px and up)
|
||||
@media (max-width: 1200px) {
|
||||
.news-list{
|
||||
padding:20px;
|
||||
flex-direction: column;
|
||||
|
||||
.news-column{
|
||||
padding:0;
|
||||
}
|
||||
.news-item{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
.news-date{
|
||||
padding-top:7px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// XX-Large devices (larger desktops, 1400px and up)
|
||||
@media (max-width: 1400px) {
|
||||
.notice-list, .inquery-page{
|
||||
padding:20px;
|
||||
}
|
||||
.notice-list-table{
|
||||
.number{
|
||||
width:60px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.term-controll{
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.inquery-submit{
|
||||
margin-top:40px;
|
||||
}
|
||||
|
||||
.notice-view{
|
||||
padding:20px;
|
||||
|
||||
.board-title{
|
||||
padding-top:20px;
|
||||
padding-bottom:16px;
|
||||
border-top:2px solid #212121;
|
||||
}
|
||||
.board-date{
|
||||
padding:0;
|
||||
padding-bottom:16px;
|
||||
border-top:none;
|
||||
}
|
||||
.board-content{
|
||||
padding:20px 0px;
|
||||
}
|
||||
.board-controll{
|
||||
padding-top:20px;
|
||||
padding-bottom:20px;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.board-left-section{
|
||||
padding-top:20px;
|
||||
padding-left:30px;
|
||||
padding-right:30px;
|
||||
width: auto;
|
||||
min-width: 200px;
|
||||
}
|
||||
}
|
@ -1,95 +0,0 @@
|
||||
.company-image-section{
|
||||
background: url('/images/company/company-left.png');
|
||||
background-size:cover;
|
||||
}
|
||||
|
||||
.company-section{
|
||||
background: #070707;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.company-big-title-section{
|
||||
max-width: 390px;
|
||||
width: 390px;
|
||||
}
|
||||
.company-big-title{
|
||||
color:#C29C58 !important;
|
||||
}
|
||||
|
||||
.company-column{
|
||||
margin:0px 40px;
|
||||
}
|
||||
.company-item{
|
||||
width: 250px;
|
||||
padding-bottom:40px;
|
||||
.company-title{
|
||||
margin-top:10px;
|
||||
font-weight: 300;
|
||||
font-size: 18px;
|
||||
line-height: 140%;
|
||||
color:white;
|
||||
}
|
||||
}
|
||||
/************ BreakPoints ************/
|
||||
// Small devices (landscape phones, 576px and up)
|
||||
@media (max-width: 576px) {
|
||||
}
|
||||
|
||||
// Medium devices (tablets, 768px and up)
|
||||
@media (max-width: 768px) {
|
||||
}
|
||||
|
||||
// Large devices (desktops, 992px and up)
|
||||
@media (max-width: 992px) {
|
||||
|
||||
}
|
||||
|
||||
// X-Large devices (large desktops, 1200px and up)
|
||||
@media (max-width: 1200px) {
|
||||
.company-section{
|
||||
background: url('/images/company/company-left.png');
|
||||
background-size:cover;
|
||||
|
||||
&::after{
|
||||
content:'';
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
z-index: -1;
|
||||
position: absolute;
|
||||
top:0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.company-column{
|
||||
margin:0px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.company-item{
|
||||
width: auto;
|
||||
padding-top:20px;
|
||||
padding-bottom: 0px;
|
||||
.company-title{
|
||||
margin-top:0px;
|
||||
padding:10px 20px;
|
||||
background: black;
|
||||
}
|
||||
|
||||
&:first-child{
|
||||
margin-right:10px;
|
||||
}
|
||||
&:last-child{
|
||||
margin-left:10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// XX-Large devices (larger desktops, 1400px and up)
|
||||
@media (max-width: 1400px) {
|
||||
.company-big-title-section{
|
||||
max-width: auto;
|
||||
width: auto;
|
||||
}
|
||||
}
|
@ -1,57 +0,0 @@
|
||||
|
||||
.gallery-image-section{
|
||||
background: url('/images/gallery-info/gallery-left1.png');
|
||||
background-size:cover;
|
||||
}
|
||||
.info-page{
|
||||
display: flex;
|
||||
.info-text{
|
||||
flex:1;
|
||||
|
||||
.info-logo{
|
||||
width:60px;
|
||||
}
|
||||
}
|
||||
.info-img{
|
||||
width:430px;
|
||||
}
|
||||
}
|
||||
|
||||
/************ BreakPoints ************/
|
||||
// Small devices (landscape phones, 576px and up)
|
||||
@media (max-width: 576px) {
|
||||
}
|
||||
|
||||
// Medium devices (tablets, 768px and up)
|
||||
@media (max-width: 768px) {
|
||||
|
||||
}
|
||||
|
||||
// Large devices (desktops, 992px and up)
|
||||
@media (max-width: 992px) {
|
||||
|
||||
}
|
||||
|
||||
// X-Large devices (large desktops, 1200px and up)
|
||||
@media (max-width: 1200px) {
|
||||
.info-page{
|
||||
margin-top:30px;
|
||||
|
||||
.info-img{
|
||||
width:100%;
|
||||
margin-top:40px;
|
||||
}
|
||||
}
|
||||
|
||||
.gallery-swiper{
|
||||
overflow: unset;
|
||||
}
|
||||
.gallery-swiper-wrapper{
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// XX-Large devices (larger desktops, 1400px and up)
|
||||
@media (max-width: 1400px) {
|
||||
}
|
@ -1,51 +0,0 @@
|
||||
.greeting-text{
|
||||
flex:1;
|
||||
}
|
||||
.greeting-image{
|
||||
.image-box{
|
||||
margin:5px;
|
||||
width:251px;
|
||||
}
|
||||
.link-box{
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1700px) {
|
||||
.greeting-image{
|
||||
.link-box{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
/************ BreakPoints ************/
|
||||
// Small devices (landscape phones, 576px and up)
|
||||
@media (max-width: 576px) {
|
||||
}
|
||||
|
||||
// Medium devices (tablets, 768px and up)
|
||||
@media (max-width: 768px) {
|
||||
|
||||
}
|
||||
|
||||
// Large devices (desktops, 992px and up)
|
||||
@media (max-width: 992px) {
|
||||
.greeting-image{
|
||||
width: 100%;
|
||||
|
||||
.image-box{
|
||||
margin:0;
|
||||
width:100%
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// X-Large devices (large desktops, 1200px and up)
|
||||
@media (max-width: 1200px) {
|
||||
|
||||
}
|
||||
|
||||
// XX-Large devices (larger desktops, 1400px and up)
|
||||
@media (max-width: 1400px) {
|
||||
}
|
@ -1,439 +0,0 @@
|
||||
.slide-container{
|
||||
width: 100% !important;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
z-index:5;
|
||||
}
|
||||
.sections-container{
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
.main-section{
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
float: left;
|
||||
padding-left:200px;
|
||||
padding-right:120px;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.footer-section{
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
float: left;
|
||||
padding-left:200px;
|
||||
padding-right:120px;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
top:0;
|
||||
left:0;
|
||||
z-index:-1;
|
||||
}
|
||||
// .main-section{
|
||||
// width: 100vw;
|
||||
// height: 100vh;
|
||||
// padding-left:200px;
|
||||
// padding-right:80px;
|
||||
// overflow: hidden;
|
||||
// display: flex;
|
||||
// flex:0 0 auto;
|
||||
// }
|
||||
.main-section1{
|
||||
background:url('/images/background/bg1.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.main-section2{
|
||||
background:url('/images/background/bg2.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.main-section3{
|
||||
background:url('/images/background/bg3.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.main-section4{
|
||||
padding:0 !important;
|
||||
|
||||
.section2-image{
|
||||
background:url('/images/background/bg4.png' );
|
||||
background-repeat: no-repeat;
|
||||
background-size:cover;
|
||||
padding-left:160px;
|
||||
padding-right:0;
|
||||
display: flex;
|
||||
height:100%;
|
||||
width:75%;
|
||||
z-index:5;
|
||||
}
|
||||
|
||||
.section2-intro{
|
||||
height:100%;
|
||||
width:25%;
|
||||
position:relative;
|
||||
.center-info{
|
||||
background-color: white;
|
||||
padding:60px 0px;
|
||||
text-align: center;
|
||||
|
||||
.info-title{
|
||||
padding-bottom:30px;
|
||||
border-bottom:1px solid rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
.info-operate{
|
||||
padding:30px 30px;
|
||||
border-bottom:1px solid rgba(0, 0, 0, 0.05);
|
||||
|
||||
.operate-item{
|
||||
flex:1;
|
||||
padding:0px 30px;
|
||||
text-align: left;
|
||||
|
||||
.operate-title{
|
||||
font-size:18px;
|
||||
font-weight: 400;
|
||||
line-height: 130%;
|
||||
}
|
||||
.operate-numbers{
|
||||
font-size:20px;
|
||||
line-height:130%;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
.info-btns{
|
||||
display:flex;
|
||||
padding:30px 30px 0px;
|
||||
.info-btn{
|
||||
flex:1;
|
||||
|
||||
.info-btn-img{
|
||||
width: 60px;
|
||||
margin-bottom:12px;
|
||||
}
|
||||
.info-btn-title{
|
||||
font-size:16px;
|
||||
line-height:140%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-page{
|
||||
width:100%;
|
||||
height:100%;
|
||||
|
||||
.item1{
|
||||
background-image:url('/images/background/item-page1.png' );
|
||||
background-color:#F2F2F2;
|
||||
}
|
||||
.item2{
|
||||
background-image:url('/images/background/item-page2.png' );
|
||||
background-color: white;
|
||||
}
|
||||
.item3{
|
||||
background-image:url('/images/background/item-page3.png' );
|
||||
background-color:#F9F2EC;
|
||||
}
|
||||
.item1, .item2, .item3{
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
padding-top:60px;
|
||||
padding-left:40px;
|
||||
overflow: hidden;
|
||||
|
||||
.item-title{
|
||||
font-size:45px;
|
||||
font-weight:400;
|
||||
line-height: 130%;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
.item-desc{
|
||||
margin-top:10px;
|
||||
font-size:20px;
|
||||
font-weight:350;
|
||||
line-height:26px;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.main-section5{
|
||||
background:#0D0D0D;
|
||||
padding:100px 200px;
|
||||
color:white;
|
||||
flex-direction: column;
|
||||
overflow-y:auto;
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
|
||||
&::-webkit-scrollbar{
|
||||
display:none;
|
||||
}
|
||||
|
||||
&.section-none-scroll{
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
||||
.ft-title{
|
||||
font-size:36px;
|
||||
font-weight: 700;
|
||||
text-align: center;
|
||||
padding-bottom:60px;
|
||||
|
||||
border-bottom:1px solid rgba(255, 255, 255, 0.1);
|
||||
|
||||
.news{
|
||||
margin-left:10px;
|
||||
}
|
||||
}
|
||||
|
||||
.ft-board{
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
.notice-box, .news-box{
|
||||
flex:1;
|
||||
border-right: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
.board-title{
|
||||
padding-top:40px;
|
||||
padding-bottom:40px;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
.eng{
|
||||
font-size:30px;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.01em;
|
||||
line-height: 43.35px;
|
||||
}
|
||||
.kor{
|
||||
font-weight: 300;
|
||||
font-size: 20px;
|
||||
line-height: 26px;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
}
|
||||
.board-list{
|
||||
padding-top:30px;
|
||||
padding-bottom:30px;
|
||||
.footer-list-item{
|
||||
padding:10px 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.footer{
|
||||
padding:50px 0px;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
}
|
||||
.company-info, .copyright{
|
||||
font-size:14px;
|
||||
letter-spacing: -0.01em;
|
||||
font-weight: 300;
|
||||
line-height:18.2px;
|
||||
margin-top:10px;
|
||||
}
|
||||
.copyright{
|
||||
margin-top:20px;
|
||||
}
|
||||
|
||||
.footer-social-link{
|
||||
padding:5px;
|
||||
background:rgba(255, 255, 255, 0.1);
|
||||
border-radius: 100px;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.sub-link-item{
|
||||
width:250px;
|
||||
height:300px;
|
||||
margin:5px;
|
||||
color:white !important;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.sub-link-item1{background:url('/images/background/main-thumb1.png') no-repeat; background-size:cover;}
|
||||
.sub-link-item2{background:url('/images/background/main-thumb3.png') no-repeat; background-size:cover;}
|
||||
.sub-link-item3{background:url('/images/background/main-thumb2.png') no-repeat; background-size:cover;}
|
||||
.sub-link-item4{background:url('/images/background/main-thumb4.png') no-repeat; background-size:cover;}
|
||||
|
||||
.pg-wrapper{
|
||||
overflow: hidden !important;
|
||||
}
|
||||
|
||||
.scroll{
|
||||
position: fixed;
|
||||
left: 200px;
|
||||
bottom:100px;
|
||||
display: flex;
|
||||
font-weight: 700;
|
||||
z-index:10;
|
||||
}
|
||||
.arrow{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.arrow-line{
|
||||
width:65px;
|
||||
height:2px;
|
||||
background:white;
|
||||
position:relative;
|
||||
overflow: hidden;
|
||||
|
||||
&::before{
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 2px;
|
||||
position:absolute;
|
||||
background: #C29C58;
|
||||
animation: scrollright 1.5s infinite;
|
||||
}
|
||||
}
|
||||
.arrow-end {
|
||||
border: solid white;
|
||||
border-width: 0 2px 2px 0;
|
||||
display: inline-block;
|
||||
padding: 2px;
|
||||
width:2px;
|
||||
height:2px;
|
||||
margin-left:-4px;
|
||||
|
||||
&.black-arrow{
|
||||
border-color: black;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
transform: rotate(-45deg);
|
||||
-webkit-transform: rotate(-45deg);
|
||||
}
|
||||
@keyframes scrollright{
|
||||
0%{transform:translateX(-60px)}
|
||||
100%{transform:translateX(65px)}
|
||||
}
|
||||
|
||||
.list-scroll-arrow{
|
||||
position: absolute;
|
||||
left:0;
|
||||
bottom:0;
|
||||
}
|
||||
|
||||
.mobile-scroll{
|
||||
position: absolute;
|
||||
bottom:20px;
|
||||
left:50%;
|
||||
transform: translateX(-50%);
|
||||
display: flex;
|
||||
font-weight: 700;
|
||||
}
|
||||
.down-arrow-box{
|
||||
position:relative;
|
||||
padding:20px 0px;
|
||||
}
|
||||
.down-arrow{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
animation: jumpInfinite 1.5s infinite;
|
||||
}
|
||||
@keyframes jumpInfinite {
|
||||
0% {
|
||||
top: 0;
|
||||
}
|
||||
50% {
|
||||
top: 20px;
|
||||
}
|
||||
100% {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
@media (max-width: 576px) {
|
||||
|
||||
}
|
||||
|
||||
// Medium devices (tablets, 768px and up)
|
||||
@media (max-width: 768px) {
|
||||
|
||||
}
|
||||
|
||||
// Large devices (desktops, 992px and up)
|
||||
@media (max-width: 992px) {
|
||||
|
||||
}
|
||||
|
||||
// XX-Large devices (larger desktops, 1400px and up)
|
||||
@media (max-width: 1400px) {
|
||||
.main-section{
|
||||
margin-top:64px;
|
||||
padding-left: 120px;
|
||||
padding-right: 120px;
|
||||
padding-top:30px;
|
||||
}
|
||||
}
|
||||
|
||||
// X-Large devices (large desktops, 1200px and up)
|
||||
@media (max-width: 1200px) {
|
||||
.slide-container{
|
||||
height:auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
.sections-container{
|
||||
width:100%;
|
||||
height:auto;
|
||||
}
|
||||
|
||||
.main-section{
|
||||
width:100%;
|
||||
height:100vh;
|
||||
position:relative;
|
||||
float:none;
|
||||
padding:20px;
|
||||
margin:0;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.main-section4{
|
||||
height: auto;
|
||||
padding:0;
|
||||
.section2-image{
|
||||
padding:20px;
|
||||
width:100%;
|
||||
height: 100vh;
|
||||
position: relative;
|
||||
}
|
||||
.section2-intro{
|
||||
width:100%;
|
||||
height:100vh;
|
||||
.center-info{
|
||||
padding:30px 0px;
|
||||
.info-title{
|
||||
padding-bottom:20px;
|
||||
}
|
||||
.info-operate{
|
||||
padding:20px;
|
||||
.operate-item{
|
||||
text-align: center;
|
||||
padding:0px;
|
||||
}
|
||||
}
|
||||
.info-btns{
|
||||
padding:20px 20px 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
@ -1,220 +0,0 @@
|
||||
.k-sidebar{
|
||||
position: fixed;
|
||||
height: 100vh;
|
||||
background:black;
|
||||
color:white;
|
||||
width: 80px;
|
||||
// transition: width 1s ease-in-out;/
|
||||
padding:100px 18px;
|
||||
z-index: 100;
|
||||
top:0;
|
||||
left:0;
|
||||
|
||||
.menu-btn{
|
||||
cursor:pointer;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.back-button{
|
||||
cursor:pointer;
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.sub-page-title{
|
||||
font-size:22px;
|
||||
text-align: center;
|
||||
color:#212121 !important;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.sidebar-controll{
|
||||
width:100%;
|
||||
}
|
||||
.sidebar-menus{
|
||||
position: relative;
|
||||
left:-300px;
|
||||
display: none;
|
||||
opacity: 0;
|
||||
transition: all 1s ease-in-out;
|
||||
}
|
||||
|
||||
|
||||
.mobile-complete-logo{
|
||||
width:106px
|
||||
}
|
||||
|
||||
&.open{
|
||||
width:300px;
|
||||
padding:80px 40px 0px;
|
||||
overflow: auto;
|
||||
|
||||
.sidebar-controll{
|
||||
display: none;
|
||||
}
|
||||
.sidebar-menus{
|
||||
left:0px;
|
||||
opacity: 1;
|
||||
display: block;
|
||||
width:100%;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-logos{
|
||||
padding-bottom:60px;
|
||||
.open-logo{
|
||||
width:70px;
|
||||
}
|
||||
.menu-close{
|
||||
cursor:pointer;
|
||||
width:26px;
|
||||
position:absolute;
|
||||
right:0;
|
||||
top:0;
|
||||
}
|
||||
}
|
||||
.sidebar-nav{
|
||||
.menu-box{
|
||||
padding:20px 0px 10px;
|
||||
border-bottom:1px solid rgba(255, 255, 255, 0.1);
|
||||
.menu-title, .menu-item{
|
||||
a{
|
||||
color:white !important;
|
||||
}
|
||||
|
||||
&.active, &:hover{
|
||||
a{
|
||||
color:#C29C58 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.menu-title{
|
||||
font-size:20px;
|
||||
line-height: 20px;
|
||||
letter-spacing: -0.01em;
|
||||
font-weight: 300;
|
||||
padding-bottom:10px;
|
||||
}
|
||||
.menu-item{
|
||||
font-size:16px;
|
||||
line-height: 16px;
|
||||
letter-spacing: -0.01em;
|
||||
font-weight: 300;
|
||||
padding-bottom:10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.sidebar-footer{
|
||||
padding-top:60px;
|
||||
color:rgba(255, 255, 255, 0.2);
|
||||
.menu-company{
|
||||
font-size:20px;
|
||||
font-weight: 700;
|
||||
line-height: 28.9px;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
.menu-copyright{
|
||||
margin-top:10px;
|
||||
font-size:12px;
|
||||
font-weight: 300;
|
||||
line-height: 15.6px;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/************ BreakPoints ************/
|
||||
// Small devices (landscape phones, 576px and up)
|
||||
@media (max-width: 576px) {
|
||||
|
||||
}
|
||||
|
||||
// Medium devices (tablets, 768px and up)
|
||||
@media (max-width: 768px) {
|
||||
|
||||
}
|
||||
|
||||
// Large devices (desktops, 992px and up)
|
||||
@media (max-width: 992px) {
|
||||
|
||||
}
|
||||
|
||||
// X-Large devices (large desktops, 1200px and up)
|
||||
@media (max-width: 1200px) {
|
||||
|
||||
}
|
||||
|
||||
// XX-Large devices (larger desktops, 1400px and up)
|
||||
@media (max-width: 1400px) {
|
||||
.k-sidebar{
|
||||
position:relative;
|
||||
height:auto;
|
||||
background:rgba(7, 7, 7, 0.8);
|
||||
width: 100%;
|
||||
padding:20px;
|
||||
|
||||
.sidebar-controll{
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.menu-btn{
|
||||
left:auto;
|
||||
right:20px;
|
||||
}
|
||||
|
||||
&.open{
|
||||
width:100%;
|
||||
padding:30px;
|
||||
height: 100vh;
|
||||
background:#070707;
|
||||
|
||||
.mobile-complete-logo{
|
||||
width:128px;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-logos{
|
||||
padding-bottom:0px;
|
||||
.open-logo{
|
||||
width:128px;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-nav{
|
||||
padding-top:16px;
|
||||
|
||||
.menu-box{
|
||||
padding:24px 0px;
|
||||
display:flex;
|
||||
|
||||
.menu-title{
|
||||
flex:1;
|
||||
padding:0;
|
||||
}
|
||||
.menu-item-group{
|
||||
flex:1;
|
||||
}
|
||||
.menu-item{
|
||||
font-size:18px;
|
||||
line-height: 18px;
|
||||
padding-bottom:20px;
|
||||
&:last-child{
|
||||
padding-bottom:0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.sidebar-footer{
|
||||
padding-top:30px;
|
||||
}
|
||||
}
|
||||
.sub-page-background{
|
||||
background:white;
|
||||
}
|
||||
}
|
@ -1,115 +0,0 @@
|
||||
.visit-map{
|
||||
width:640px;
|
||||
height:600px;
|
||||
#map{
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
}
|
||||
.visit-infos{
|
||||
padding-left:140px;
|
||||
|
||||
.visit-logo{
|
||||
padding-bottom:40px;
|
||||
img{
|
||||
width:194px;
|
||||
}
|
||||
}
|
||||
.visit-line{
|
||||
border-bottom:1px solid rgba(0, 0, 0, 0.05)
|
||||
}
|
||||
|
||||
|
||||
.info-operate{
|
||||
padding:40px 0px;
|
||||
.operate-item{
|
||||
flex:1;
|
||||
text-align: left;
|
||||
|
||||
.operate-numbers{
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
.visit-address{
|
||||
padding:40px 0px;
|
||||
font-weight: 400;
|
||||
|
||||
span{
|
||||
border-radius: 100px;
|
||||
background: rgba(105, 114, 21, 1);
|
||||
color:white;
|
||||
font-size:14px;
|
||||
line-height: 14px;
|
||||
padding:3px 9px;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.visit-links{
|
||||
padding:40px 0px;
|
||||
display:flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.info-btn{
|
||||
text-align: center;
|
||||
.info-btn-img{
|
||||
width:60px;
|
||||
margin-bottom:12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.visit-map-link{
|
||||
padding-top:40px;
|
||||
}
|
||||
/************ BreakPoints ************/
|
||||
// Small devices (landscape phones, 576px and up)
|
||||
@media (max-width: 576px) {
|
||||
}
|
||||
|
||||
// Medium devices (tablets, 768px and up)
|
||||
@media (max-width: 768px) {
|
||||
|
||||
}
|
||||
|
||||
// Large devices (desktops, 992px and up)
|
||||
@media (max-width: 992px) {
|
||||
|
||||
}
|
||||
|
||||
// X-Large devices (large desktops, 1200px and up)
|
||||
@media (max-width: 1200px) {
|
||||
|
||||
}
|
||||
|
||||
// XX-Large devices (larger desktops, 1400px and up)
|
||||
@media (max-width: 1400px) {
|
||||
.visit-infos{
|
||||
padding:0;
|
||||
padding-bottom:20px;
|
||||
flex:1;
|
||||
}
|
||||
|
||||
.visit-map{
|
||||
width:100%;
|
||||
height:auto;
|
||||
flex:1;
|
||||
#map{
|
||||
height:400px;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
}
|
||||
|
||||
.visit-map-link{
|
||||
padding-top:20px;
|
||||
padding-bottom:20px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1510px) {
|
||||
.visit-link-mobile-hidden{
|
||||
display:none;
|
||||
}
|
||||
}
|
@ -1,58 +0,0 @@
|
||||
<div class="mobile-footer d-block d-xl-none">
|
||||
<div class="d-flex flex-column" style="flex:1">
|
||||
<div class="d-flex">
|
||||
<a href="#" class="footer-social-link margin-r-1"><img src="/images/icons/icon-facebook.png" style="width:18px"/></a>
|
||||
<a href="#" class="footer-social-link margin-r-1"><img src="/images/icons/icon-instar.png" style="width:18px"/></a>
|
||||
<a href="#" class="footer-social-link"><img src="/images/icons/icon-youtube.png" style="width:18px"/></a>
|
||||
</div>
|
||||
<div class="margin-t-6">
|
||||
<img src="/images/word-logo-white.png" style="width:124px"/>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between margin-t-3 margin-b-3">
|
||||
<div><span class="text-white info-term" style="cursor:pointer">개인정보처리방침</span> <span class="padding-l-1 padding-r-1 font-15">|</span> <span class="text-white service-term" style="cursor:pointer">서비스 이용약관</span></div>
|
||||
</div>
|
||||
<div class="company-info">
|
||||
<div>
|
||||
총괄대표 : 최 형 준 E. topbeststar@nate.com
|
||||
</div>
|
||||
<div>
|
||||
T. 02-540-3376 F. 02-540-6676
|
||||
</div>
|
||||
<div>
|
||||
서울시 강남구 삼성로 716(첨담동 76) 리임빌딩 2층 청담K
|
||||
</div>
|
||||
</div>
|
||||
<div class="copyright">
|
||||
© 2022. Cheong Dam K. ALL RIGHT RESERVED.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal fade " id="termModal" tabindex="-1" role="dialog" aria-labelledby="termModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg modal-dialog-centered" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-body">
|
||||
<div class="term-title-box d-flex justify-content-between" style="position:relative; padding:40px;">
|
||||
<div class="term-title font-30 mobile-font-20"></div>
|
||||
<div class="term-modal-close font-30 mobile-font-20" style="cursor:pointer"><span aria-hidden="true">×</span></div>
|
||||
</div>
|
||||
<div class="term-content" style="padding:0px 40px 40px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="loader-page">
|
||||
<div class="load-item d-flex flex-column align-items-center">
|
||||
<div class="mb-2">
|
||||
{{-- <span class="typing jost font-weight-bold"></span> --}}
|
||||
<img src="/images/loader-logo-full.png"/>
|
||||
</div>
|
||||
<div style="position:relative">
|
||||
<img src="/images/loader-k.png" class="loader-logo"/>
|
||||
<div class="loader"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="progress-container d-none d-xl-block">
|
||||
<div class="custom-progress" id="myBar"></div>
|
||||
</div>
|
@ -0,0 +1,25 @@
|
||||
<header>
|
||||
<div class="container">
|
||||
<nav class="navbar navbar-expand-lg navbar-light">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="#">솔라아이</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse justify-content-end" id="navbarSupportedContent">
|
||||
<ul class="navbar-nav mb-2 mb-lg-0">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#portfolio">시공사진</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#introduce">소개</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#inquiry">문의</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
@ -1,68 +0,0 @@
|
||||
<div class="k-sidebar @if(isset($page['is_main']) && $page['is_main']) @else sub-page-background @endif" id="sidebar">
|
||||
@if(isset($page['is_main']) && $page['is_main'])
|
||||
<div class="sidebar-controll">
|
||||
<div>
|
||||
<a href="/" class="d-none d-xxl-block"><img src="/images/logo.png" class="img-fluid d-none d-xxl-block"/></a>
|
||||
<a href="/" class="d-block d-xxl-none mobile-complete-logo"><img src="/images/complete-white-logo.png" class="img-fluid d-block d-xxl-none mobile-complete-logo"/></a>
|
||||
</div>
|
||||
<div class="text-xxl-center menu-btn open-menu">
|
||||
<img src="/images/menu.png"/>
|
||||
<div class="d-xxl-block d-none">메뉴</div>
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
<div class="sidebar-controll">
|
||||
<div class="d-none d-xxl-block">
|
||||
<a href="/" class="d-none d-xxl-block"><img src="/images/logo.png" class="img-fluid d-none d-xxl-block"/></a>
|
||||
<a href="/" class="d-block d-xxl-none mobile-complete-logo"><img src="/images/complete-white-logo.png" class="img-fluid d-block d-xxl-none mobile-complete-logo"/></a>
|
||||
</div>
|
||||
<div class="d-block d-xxl-none back-button">
|
||||
<img src="/images/pageprev.png"/>
|
||||
</div>
|
||||
<div class="d-block d-xxl-none sub-page-title">@if($page['subTitle']){{ $page['subTitle'] }}@else{{ $page['title']}}@endif</div>
|
||||
<div class="text-xxl-center menu-btn open-menu">
|
||||
<img src="/images/menu.png" class="d-none d-xxl-block"/>
|
||||
<img src="/images/menu_black.png" class="d-block d-xxl-none"/>
|
||||
<div class="d-xxl-block d-none">메뉴</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="sidebar-menus">
|
||||
<div class="sidebar-logos">
|
||||
<div class="open-logo">
|
||||
<a href="/" class="d-none d-xxl-block"><img src="/images/logo.png" class="img-fluid"/></a>
|
||||
<a href="/" class="d-block d-xxl-none"><img src="/images/complete-white-logo.png" class="img-fluid"/></a>
|
||||
</div>
|
||||
<div class="menu-close" id="close-menu">
|
||||
<img src="/images/close.png" class="img-fluid"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sidebar-nav">
|
||||
<div class="menu-box">
|
||||
<div class="menu-title"><a href="{{ route('pages', ['gallery'], false) }}">갤러리소개</a></div>
|
||||
<div class="menu-item-group">
|
||||
<div class="menu-item{{ ($page['code'] == 'pages.gallery') ? ' active' : '' }}"><a href="{{ route('pages', ['gallery'], false) }}">- {{ $pages['gallery'] }}</a></div>
|
||||
<div class="menu-item{{ ($page['code'] == 'pages.greeting') ? ' active' : '' }}"><a href="{{ route('pages', ['greeting'], false) }}">- {{ $pages['greeting'] }}</a></div>
|
||||
<div class="menu-item{{ ($page['code'] == 'pages.groups') ? ' active' : '' }}"><a href="{{ route('pages', ['groups'], false) }}">- {{ $pages['groups'] }}</a></div>
|
||||
<div class="menu-item {{ ($page['code'] == 'pages.visit') ? ' active' : '' }}"><a href="{{ route('pages', ['visit'], false) }}">- {{ $pages['visit'] }}</a></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="menu-box">
|
||||
<div class="menu-title{{ ($page['code'] == 'partner') ? ' active' : '' }}"><a href="{{ route('partner', null, false) }}">제휴업체</a></div>
|
||||
</div>
|
||||
<div class="menu-box">
|
||||
<div class="menu-title">게시판</div>
|
||||
<div class="menu-item-group">
|
||||
<div class="menu-item{{ ($page['code'] == 'board.notice') ? ' active' : '' }}"><a href="{{ route('board.list', ['notice'], false) }}">- 공지사항</a></div>
|
||||
<div class="menu-item{{ ($page['code'] == 'board.news') ? ' active' : '' }}"><a href="{{ route('board.list', ['news'], false) }}">- 뉴스</a></div>
|
||||
<div class="menu-item{{ ($page['code'] == 'board.inquiry') ? ' active' : '' }}"><a href="{{ route('board.list', ['inquiry'], false) }}">- 문의하기</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sidebar-footer">
|
||||
<div class="menu-company">{{ $settings->site_engName }}</div>
|
||||
<div class="menu-copyright">{{ $settings->copyright_side }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
@ -1,3 +1,92 @@
|
||||
<section class="main-inquiry">
|
||||
Inquiry Area
|
||||
<section class="main-inquiry" id="inquiry">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="inquiry-message-box">
|
||||
<div class="inquiry-message mb-2">"쏠라아이를 방문해 주셔서 감사합니다. 궁금하신 점이 있다면 문의 주세요."</div>
|
||||
<div class="inquiry-team">- Solarai 일동</div>
|
||||
</div>
|
||||
<hr class="ai-hr">
|
||||
<div class="inquiry-form">
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-6">
|
||||
<form id="writeForm" method="post" accept-charset="utf-8" action="">
|
||||
<input type="hidden" name="_token" value="{{ csrf_token() }}" />
|
||||
<input type="hidden" name="mode" value="add" />
|
||||
<input type="hidden" name="id" value="0" />
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<input type="text" class="k-input" name="name" id="name" value="" placeholder="이름" required />
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<input type="text" class="k-input" name="phone" id="phone" value="" placeholder="연락처" required />
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<input type="text" class="k-input" name="email" id="email" value="" placeholder="이메일" required />
|
||||
</div>
|
||||
</div>
|
||||
<textarea name="content" id="content" rows="14" class="k-input k-text-area autosize" placeholder="문의내용을 입력해 주세요." required></textarea>
|
||||
|
||||
<div class="text-center inquery-submit">
|
||||
<button type="submit" class="black-submit-button">등록하기 <i class="fa-solid fa-chevron-right"></i></button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="col-12 col-md-6">
|
||||
<div class="inquiry-box">
|
||||
<div class="inquiry-box-title">문의하기</div>
|
||||
|
||||
<div class="inquiry-box-desc">
|
||||
질문이 있거나 도움이 필요한 경우<br>
|
||||
왼쪽 양식을 작성해주세요.<br>
|
||||
빠른 시간내 답변 드리겠습니다.
|
||||
</div>
|
||||
</div>
|
||||
<div class="inquiry-box">
|
||||
<div class="inquiry-box-title">주소</div>
|
||||
|
||||
<div class="inquiry-box-desc">
|
||||
-
|
||||
</div>
|
||||
</div>
|
||||
<div class="inquiry-box mb-0">
|
||||
<div class="inquiry-box-title">연락처</div>
|
||||
|
||||
<div class="inquiry-box-desc">
|
||||
-
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@push('scripts')
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function() {
|
||||
$('#writeForm').submit(function () {
|
||||
if (!$("#name").checkEmpty('이름을 입력해 주세요.')) return false;
|
||||
if (!$("#phone").checkEmpty('연락처를 입력해 주세요.')) return false;
|
||||
if (!$("#email").checkEmpty('이메일을 입력해 주세요.')) return false;
|
||||
if (!$("#content").checkEmpty('문의내용을 입력해 주세요.')) return false;
|
||||
// if (!$('#invalidCheck3').prop('checked')) {
|
||||
// alert('개인정보처리방침에 동의해 주세요.');
|
||||
// return false;
|
||||
// }
|
||||
|
||||
$.post($(this).attr('action'), $(this).serialize(), function(result) {
|
||||
alert(result.message);
|
||||
if (result.code == 'success') {
|
||||
window.history.go(-1);
|
||||
}
|
||||
}).fail(function(result) {
|
||||
console.log(result);
|
||||
alert('문의 등록에 실패했습니다!!\n잠시 후 다시 시도해 주세요.');
|
||||
});
|
||||
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
@endpush
|
||||
|
@ -1,3 +1,22 @@
|
||||
<section class="main-introduce">
|
||||
Introduce Area
|
||||
<section class="main-introduce" id="introduce">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="intro-image-box">
|
||||
<img src="/images/main/solarai-middle.png" class="img-fluid"/>
|
||||
</div>
|
||||
<hr class="ai-hr">
|
||||
<div class="intro-text-box">
|
||||
<div class="text-image">
|
||||
<img src="/images/main/text-logo.png" class="image-fluid"/>
|
||||
</div>
|
||||
<div class="text-title">쏠라아이</div>
|
||||
<div class="text-desc mt-3">
|
||||
쏠라아이는 프리미엄 태양광 파고라,썬룸 및 주차장 전문 시공 업체로<br>
|
||||
디자인과 고품질로 고객님들에 만족도를 드리고 있습니다. <br>
|
||||
빨리 시공하기보다는 한땀한땀 장인정신으로기본과 원칙을 준수하여 제대로 시공해드립니다.
|
||||
</div>
|
||||
</div>
|
||||
<hr class="ai-hr">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
@ -1,3 +1,32 @@
|
||||
<section class="main-portfolio">
|
||||
Portfolio Area
|
||||
<section class="main-portfolio" id="portfolio">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-6 col-md-4 col-lg-3">
|
||||
<div>
|
||||
item
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-6 col-md-4 col-lg-3">
|
||||
<div>
|
||||
item
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-6 col-md-4 col-lg-3">
|
||||
<div>
|
||||
item
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-6 col-md-4 col-lg-3">
|
||||
<div>
|
||||
item
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
Loading…
Reference in New Issue