body {
  min-width: 1024px;
}
.inner{width:1200px; margin:0 auto;}
html {
  scroll-behavior: smooth;
}
/* header */
header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  min-width: 1024px;
  height: 80px;
  padding: 20px 40px;
  box-sizing: border-box;
  z-index: 99999;
  background-color: #fff;
}
header .logo {
  float: left;
  margin: 0;
}
header .logo a {
  display: block;
  width: 170px;
  height: 63px;
  margin-top: 8px;
  font-size: 0;
  background: url('../img4/logo.png') no-repeat 50% 50% /170px auto;
}
header .logo img {
  max-height: 100%;
}
header nav {
  float: center;
  display: flex;
  flex-direction: row; 
  align-items: center;
  margin: 0;
  line-height: 80px;
}
header nav ul {
  display: flex;
  flex-direction: row;
  padding-left: 120px;
}
header nav ul li a {
  font-family: 'Gmarket Sans';
  line-height: 10px;
  display: inline-block;
}
header nav ul li {
  margin-right: 100px;  
  font-size: 20px;
}
header nav ul li:hover{
  font-weight: 700;
}
header nav ul li:last-child {
  margin-right: 56px;  
}
header nav ul li:hover{
  font-weight: 700;
}
/* page 1 */
.page-1 {
  background: url(../img4/page-1_background.png) #000000 center no-repeat ;
  width: 100%;
  height: 1000px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
}
.page-1 .text {
  position: absolute;    
  top: 67%;
  left: 52%;
  transform: translate(-50%, -50%);
}
/* page 2 */
.page-2 {
  background-color: #514642;
  width: 100%;
  height:335px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
}
.page-2 .text {
  width: 1180px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.page-2 .text img{
  width: 100%;
 }
  /*page-3*/
  .page-3 {
    background: url(../img4/page-3.png) #1a1a1a center no-repeat ;
    object-fit: cover;  
    width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
    background-size: cover;
    align-items: baseline;
    display: block;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 120px;
    box-sizing: border-box;
  }
  .page-3 .text img{
    width: 100%;
  }
  .page-3 .page-3_tite{
    width: 650px;
    position: relative;
    margin: 140px auto 0 auto;
  }
  .page-3 .page-3_tite_mo{
    display: none;
  }
  .page3Slide {
    margin-top: 100px;
  }
  .page3slideArea .slick-slide  {
    width: auto;
    height: auto;
    text-align: center;
    margin: 0 5px;
  }
  .page3slideArea .slick-slide img {
    margin: 0 auto;
  }

/* page 4 */
.page-4 {
  background: url(../img4/page-4_background.png) #000000 center no-repeat ;
  width: 100%;
  height:600px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
}
.page-4 .text {
  width: 1150px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.page-4 .text img{
  width: 100%;
 }
/* page 5 */
.page-5 {
  background: url(../img4/page-5_background.png) #000000 center no-repeat ;
  width: 100%;
  height: 1800px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
}
.page-5 .text {
  width: 1260px;
  position: absolute;
  top: 50%;
  left: 52%;
  transform: translate(-50%, -50%);
}
.page-5 .text img{
  width: 100%;
 }
 /* page 6 */
 .page-6 {
  background: url(../img4/page-6_background.png) #000000 center no-repeat ;
  width: 100%;
  height:1170px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
}
.page-6 .text {
  width: 1700px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.page-6 .text img{
  width: 100%;
 }
/* page 7 */
.page-7 {
  background: url(../img4/page-7_background.png) #000000 center no-repeat ;
 width: 100%;
 height: 1600px;
 background-size: 1920px;
 position: relative;
 background-size: cover;
}
.page-7 .text {
  width: 1320px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.page-7 .text img{
  width: 100%;
 }
/* page 8 */
.page-8 {
  background: url(../img4/page-8_background.png) #000000 center no-repeat ;
  width: 100%;
  height: 1340px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
 }
 .page-8 .text {
  width: 1220px;
  position: absolute;
  top: 50%;
  left: 48%;
  transform: translate(-50%, -50%);
}
.page-8 .text img{
  width: 100%;
 }
 /* page 9 */
.page-9 {
  background: url(../img4/page-9_background.png) #000000 center no-repeat ;
  width: 100%;
  height:1340px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
 }
 .page-9 .text {
  width: 1310px;
  position: absolute;
  top: 50%;
  left: 54%;
  transform: translate(-50%, -50%);
}
.page-9 .text img{
  width: 100%;
 }
 /* page 10 */
.page-10 {
  background: url(../img4/page-10_background.png) #ecc94a center no-repeat ;
  width: 100%;
  height: 3700px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
 }
 .page-10 .text {
  width: 1160px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.page-10 .text img{
  width: 100%;
 }
 /* page 17 */
 .page-17 {
  background: url(../img4/page_17_background.png) #1f221f center no-repeat ;
  width: 100%;
  height: 3060px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
 }
 .page-17 .text {
  width: 1160px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.page-17 .text img{
  width: 100%;
 }
 .page-17 .text p:nth-child(1){
  margin: 0 auto;
  width: 750px;
 }
 .page-17 .text p:nth-child(2){
  margin: 0 auto;
  width: 910px;
  padding: 100px 0;
 }
 .page-17 .text p:nth-child(3){
  margin: 0 auto;
  width: 730px;
 }
 /* page 11 */
.page-11 {
  background: url(../img4/page-11_background.png) #000000 center no-repeat ;
  width: 100%;
  height:2217px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
 }
 .page-11 .text {
  width: 1270px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.page-11 .text img{
  width: 100%;
 }

 /* page 13 */
.page-13 {
  background: url(../img4/page-13_background.png) #000000 center no-repeat ;
  width: 100%;
  height:1740px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
 }
 .page-13 .text {
  width: 1210px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.page-13 .text img{
  width: 100%;
 }
 /* page 14 */
.page-14 {
  background: url(../img4/page-14_background.png) #000000 center no-repeat ;
  width: 100%;
  height:1035px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
 }
 .page-14 .text {
  width: 1200px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.page-14 .text img{
  width: 100%;
 }
 /* page 15 */
.page-15 {
  background: url(../img4/page-15_background.png) #000000 center no-repeat ;
  width: 100%;
  height:1840px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
 }
 .page-15 .text {
  width: 1230px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.page-15 .text img{
  width: 100%;
 } /* page 18 */
 .page-18 {
   background: url(../img4/page-18_background.png) #000000 center no-repeat ;
   width: 100%;
   height: 2210px;
   background-size: 1920px;
   position: relative;
   background-size: cover;
  }
  .page-18 .text {
   width: 1230px;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
 }
 .page-18 .text img{
   width: 100%;
  }
  .page-18 .text p{
    margin:0 auto;
  }
  .page-18 .text p:nth-child(1) {
    width: 760px;
    position: absolute;
    top: 0;
    bottom: 90%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.page-18 .text p:nth-child(2) {
  width: 1210px;
  padding-top: 410px;
}
 /* page 16 */
.page-16 {
  background: url(../img4/page-16_background.png) #000000 center no-repeat ;
  width: 100%;
  height:1750px;
  background-size: 1920px;
  position: relative;
  background-size: cover;
 }
 .page-16 .text {
  width: 1250px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.page-16 .text img{
  width: 100%;
 }


/* responsive */
@media (min-width: 2560px) {
  .page-6 .text {
    width: 2270px;
}
.page-6 {
  height: 1570px;
}
.page-10 {
  height: 3650px;
} 
.page-17 {
  height: 3760px;
}
.page-17 .text p:nth-child(1) {
  width: 910px;
}
.page-17 .text p:nth-child(2) {
  width: 1100px;
  padding: 110px 0;
}
.page-17 .text p:nth-child(3) {
  width: 930px;
}
}
@media (min-width: 2400px) {
  .inner{
    width:1500px;
  }
  header nav ul li{
    margin-right: 120px;
  }
  .page-2 {
    height:385px;
  }
  .page-2 .text {
    width: 1360px;
  }
  .page-3{
    height: 1240px;
  }
  .page-3 .text p:nth-child(1) {
    width: 800px;
  }
  .page-3 .text p:nth-child(2) {
    width: 770px;
    right: 290px;
  }
  .page-4 .text {
    width: 1280px;
  }
  .page-5{
    height: 2220px;
  }
  .page-5 .text {
    width: 1520px;
    left: 54%;
  }
  .page-7{
    height: 1946px;
  }
  .page-7 .text{
    width: 1750px;
  }
  .page-8{
    height: 1680px;
  }
  .page-8 .text{
    width: 1504px;
  }
  .page-9{
    height: 1715px;
  }
  .page-9 .text{
    width: 1838px;
  }
  .page-11 {
    height: 2640px;
  }
  .page-11 .text {
    width: 1626px;
  }
  .page-13{
    height: 2223px;
  }
  .page-13 .text{
    width: 1539px;
  }
  .page-14{
    height: 1433px;
  }
  .page-14 .text{
    width: 1570px;
  }
  .page-15 {
    height: 2221px;
  }
  .page-15 .text {
    width: 1480px;
  }
  .page-16{
    height: 1954px;
  }
  .page-16 .text{
    width: 1427px;
  }
  header{
    height: 100px!important;
  }
  header .logo a{
    height: 87px!important;
  }
  header nav{
    line-height: 115px!important;
  }
  header nav ul{
    padding-left: 212px;
  }
  header nav ul li {
    margin-right: 100px;
  }
  header nav ul li a{
    font-size: 25px;
  }
  #bottomArea {
    height: 220px!important;
  }
  #bottomArea .area {
    padding-top: 77px!important;
  }
  #bottomArea .area1 {
    bottom: 33px!important;
    right: 750px!important;
  }
  #bottomArea .area2 {
    bottom: 60px!important;
    right: 420px!important;
  }
  #bottomArea input[type=text] {
    height: 70px!important;
    font-size: 19px!important;
  }
  #bottomArea .area1 .input1 {
    width: 180px!important;
  }
  #bottomArea .area1 .input2 {
    width: 385px!important;
  }
  #bottomArea .area1 .input3 {
    width: 180px!important;
  }
  #bottomArea .area1 .input4 {
    width: 180px!important;
  }
  #bottomArea .area1 .input5 {
    width: 180px!important;
  }
  #bottomArea .area2 .cilck{
    font-size: 22px!important;
  }
  #bottomArea .checkbox input{
    width: 30px!important;
    height: 30px!important;
  }
}




 /* bottomArea */
#bottomArea{
  position: fixed;
  bottom: 0px;
  left: 0px;
  width: 100%;
  min-width: 1200px;
  background: #fdd000;
  height: 160px;
  z-index: 2;
}
#bottomArea .checkbox span{
  width: 25px;
  height: 25px;
  display: block;
  background: url(../img/checkbox-off_03.png) top no-repeat;
  background-size: cover;
  float: left;
  margin-top: -5px;
}
/*#bottomArea .checkbox input:checked + span{
  background: url(../img/checkbox-on_03.png) top no-repeat;
  background-size: cover;
}*/
#bottomArea .checkbox input{
  position: relative;
  z-index: -9999;
  width: 20px;
  height: 20px;
}
#bottomArea input[type=text]{
  height: 50px;
  background: #fff;
  color: #999999;
  font-size: 14px;
  font-weight:bold;
  text-align: left;
  border-radius: 7px;
  padding-left: 10px;
  border: 1px solid #fff;
}
input:focus {outline: none;}
#footer{
  height: 190px;
  width: 100%;
  background-color: #333;
  padding-bottom: 180px;
  min-width: 1216px;
}
#footer .footer-row{
  margin: 0 auto;
  width: 1143px;
}
#footer .addr{
  clear: both;
  float: left;
  padding-left: 10px;
}
#footer .row2{
  margin-top: 45px;
}
#footer .contact{
  float: left;
  margin-left: 20px;
}
#footer .row2 div:nth-child(1){
  padding-bottom: 10px;
}
.footer-share {position: absolute; top: 110px; left: 800px;}
.footer-share li {float: left; margin: 10px;}
#footer .row1 ul.footer-nav{
  float: left;
}
#footer .row1 ul li{
  float: left;
  margin-top: 14px;
}
/* 상담하기 */
#bottomConsult{
  position: fixed;
  bottom: 208px;
  left: 90%;
  z-index: 5;
}
#bottomConsult ul li {
 width: 130px; 
}
#bottomConsult ul li a{
  display: block;
  height: 48px;
 }
#bottomConsult ul li img{
  width:100%;
}