html, body, div, span, h2, h3, h4, h5, h6, p, blockquote, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, small, strike, strong, sub, tt, dl, dt, dd, ol, ul, li, form, label, table, caption, tbody, tfoot, thead, tr, th, td, embed, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  line-height: 0;
  font: inherit;
  vertical-align: baseline;
  word-break: keep-all;
  font-family: 'Pretendard', 'KBFGDisplayM';
}

html{
  scroll-behavior: smooth;
}

/* GEO PC: 화면 전체를 80% 비율로 표시(요청: 80% 축소) — Chrome·Edge·Safari 기준 */
body.geo-scale-80 {
  zoom: 0.8;
}

body {
  font-family: 'Pretendard', sans-serif;
}

strong {font-weight: bold}

.text-hidden {position: absolute;text-indent: -9999em;font-size: 0;}

.inner {position: relative; width: 1200px; margin: 0 auto; padding: 0 50px; box-sizing: border-box;}

header{width: 100%;  min-width: 1200px; margin: 0 auto; height: 90px; border-bottom: 1px solid #979189; overflow: hidden;}
  h1 {position: absolute; left: 50px; top: 33px;}
  nav {float:right; padding-top: 35px; overflow: hidden;}
  nav a {display: inline-block; padding: 0 0 0 20px; font-size: 18px; color: #544e40; text-decoration: none; font-weight: ;}

/* a.btn {position: absolute; display: block; left:0; bottom: 0; width: 441px; height: 83px; text-decoration: none; color: #fff; box-sizing: border-box;} */

  a.btn {text-decoration: none; color: #222}

section{width: 100%; min-width: 1200px;}
  #visual {height: 1008px; text-align: center; background: url('../images/visual.jpg') no-repeat center 0,url('../images/visual_bg.jpg') repeat-x center 0;}

    #visual h2 {padding: 125px 0 40px; font-size: 72px; letter-spacing: -0.03em; color: #121212; font-weight: 900;}
    #visual h2 p {padding-top: 40px;font-size: 36px; line-height: 58px; color: #303030; font-weight: 300;}

    #visual a.btn {display: flex; justify-content: center; align-items: center; width: max-content; border-radius: 24px; height: 48px; font-size: 25px; padding: 0 30px; margin: 0 auto; border: 1px solid #222;}
    #visual a.btn span {color: #fffc26;}

  #s1 {padding: 135px 0; background: url(../images/s1.jpg) no-repeat center top}
    #s1 h2 {padding: 20px 0 20px; font-size: 55px; text-align: center; line-height: 58px; color: #303030; font-weight: 900;}

    #s1 p {padding: 20px 0 0; font-size: 46px; text-align: center; line-height: 50px; color: #212121; font-weight: 300;}
    #s1 p .mid-arrow {display: inline-block; margin: 0 10px; font-size: 42px; line-height: 1; vertical-align: middle; color: #212121;}
    #s1 p span {display: inline-block; padding-top: 8px; font-size: 32px;}
    #s1 p strong {color: #f75f07; font-weight: 300;}

    #s1 a.btn {display: flex; justify-content: center; align-items: center; width: max-content; border-radius: 24px; height: 48px; font-size: 25px; padding: 0 30px; margin: 30px auto 0; border: 1px solid #222;}
    #s1 a.btn span {color: #fffc26;}

  #s2 {padding: 85px 0; background:#f5f5f7 url(../images/s2.jpg) no-repeat center top}
    #s2 .inner {display: flex; flex-flow: row wrap; gap: 20px; align-content: flex-start;}
    #s2 dl {flex: 1 1 calc((100% - 20px) / 2); min-height: 540px; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; min-width: 0; box-sizing: border-box; padding: 20px; font-size: 22px; color: #212121; border-radius: 20px; font-weight: 300; background: #fff;}
    #s2 dl dt {padding: 55px 0 20px; font-size: 52px; font-weight: 900; line-height: 1; color: #121212; letter-spacing: -0.02em;}
    #s2 dl dd.txt {display: flex; justify-content: center; align-items: center; padding-bottom: 10px; height: 70px; font-size: 21px; line-height: 33px;}
    #s2 dl dd:not(.txt) {display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 12px;}

    #s2 dl dd a {display: inline-flex; justify-content: center; align-items: center; width: max-content; border-radius: 24px; text-decoration: none; color: #222; height: 48px; font-size: 25px; padding: 0 30px; border: 1px solid #222;}
    #s2 dl dd a.ac {background: #d9dbdf;}

    #s2 dl.box1 {background: #fff url(../images/box_img1.jpg) no-repeat center bottom;}
    #s2 dl.box2 {background: #fff url(../images/box_img2.jpg) no-repeat center bottom;}
    #s2 dl.box3 {background: #fff url(../images/box_img3.jpg) no-repeat center bottom;}
    #s2 dl.box4 {background: #fff url(../images/box_img4.jpg) no-repeat center bottom;}
    #s2 dl.box5 {background: #fff url(../images/box_img5.jpg) no-repeat center bottom;}
    #s2 dl.box6 {background: #fff url(../images/box_img6.jpg) no-repeat center bottom;}
    #s2 dl.box1-layer-trigger,
    #s2 dl.box2-layer-trigger,
    #s2 dl.box3-layer-trigger,
    #s2 dl.box4-layer-trigger {cursor: pointer;}

  .layer-popup {display: none; position: fixed; inset: 0; z-index: 99999; align-items: center; justify-content: center; padding: 24px; box-sizing: border-box; line-height: 1.45; font-size: 21px; color: #212121;}
  .layer-popup.on,
  #layerBox1Detail.layer-popup.on {display: flex !important;}
  .layer-popup .layer-dim {position: absolute; inset: 0; background: rgba(0, 0, 0, 0.65);}
  .layer-popup .layer-box {position: relative; z-index: 1; width: 100%; max-width: 940px; max-height: calc(100vh - 80px); display: flex; flex-direction: row; align-items: center;}
  .layer-popup .layer-panel {width: 100%; max-height: calc(100vh - 120px); overflow: hidden; background: #fff; border-radius: 24px; padding: 0; box-sizing: border-box; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2); display: flex; flex-direction: column; min-height: 0;}
  .layer-popup .layer-panel-scroll {flex: 1 1 auto; min-height: 0; max-height: calc(100vh - 120px); overflow-y: auto; overflow-x: hidden; padding: 28px 28px 40px; box-sizing: border-box; scrollbar-width: thin; scrollbar-color: #d9dbdf #fff;}
  .layer-popup .layer-panel-scroll::-webkit-scrollbar {width: 3px;}
  .layer-popup .layer-panel-scroll::-webkit-scrollbar-track {background: #fff;}
  .layer-popup .layer-panel-scroll::-webkit-scrollbar-thumb {background: #d9dbdf; border-radius: 999px;}
  .layer-popup .layer-section {display: grid; grid-template-columns: 148px 1fr; gap: 16px 20px; align-items: stretch; padding-bottom: 22px; margin-bottom: 22px; border-bottom: 1px solid #e8e8e8;}
  .layer-popup .layer-section:last-of-type {border-bottom: 0; margin-bottom: 18px; padding-bottom: 0;}
  .layer-popup .layer-label {grid-column: 1; grid-row: 1; min-height: 88px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; background: #f5f5f7; border-radius: 15px; padding: 16px 12px; font-size: 28px; font-weight: 500; color: #121212; box-sizing: border-box;}
  .layer-popup .layer-label small {display: block; margin-top: 10px; font-size: 18px; font-weight: 400; color: #4c4c4c; line-height: 1.35;}
  .layer-popup .layer-label-tall {align-self: stretch;}
  .layer-popup .layer-table-wrap {grid-column: 2; grid-row: 1; min-width: 0;}
  .layer-popup .layer-table-wrap p {font-size: 21px; font-weight: 300; color: #4c4c4c; text-align: right; padding: 20px 0 10px;}
  .layer-popup .layer-table-scroll {overflow-x: auto; -webkit-overflow-scrolling: touch;}
  .layer-popup .layer-table {width: 100%; border-collapse: collapse; font-size: 18px;}
  .layer-popup .layer-table th,
  .layer-popup .layer-table td {padding: 20px 20px; text-align: center; vertical-align: middle; border: 0;}
  .layer-popup .layer-table td {border-right: 1px solid #f5f5f7;}
  .layer-popup .layer-table td:last-of-type {border-right: 0;}
  .layer-popup .layer-table thead th {font-weight: 500; color: #121212; background: #fff;}
  .layer-popup .layer-table tbody th {text-align: center; font-weight: 400; color: #333;}
  .layer-popup .layer-table tbody tr:nth-child(odd) td,
  .layer-popup .layer-table tbody tr:nth-child(odd) th[scope="row"] {background: #fcfcfd; border-bottom: 1px solid #f5f5f7; }
  .layer-popup .layer-table tbody tr .nobg {background: #fff !important; border-right:1px solid #f5f5f7;}
  .layer-popup .layer-table-mileage tbody tr:nth-child(odd) td {background: #fcfcfd;}
  .layer-popup .layer-table-mileage tbody tr:nth-child(odd) th {background: #fcfcfd;}
  .layer-popup .layer-td-full {text-align: center;}
  .layer-popup .layer-note {grid-column: 1 / -1; width: auto; margin: 0; font-size: 18px; color: #4c4c4c; line-height: 1.5; box-sizing: border-box;}
  .layer-popup .layer-btn-cta {display: flex; justify-content: center; align-items: center; width: max-content; text-decoration: none; margin: 40px auto 0; padding: 16px 60px; font-size: 25px; font-weight: 600; color: #121212; background: #d9dbdf; border: 1px solid #292a2a; border-radius: 999px; cursor: pointer; font-family: inherit; text-decoration: none; box-sizing: border-box;}
  .layer-popup .layer-btn-cta:hover {background: #d9dbdf;}
  .layer-popup .layer-btn-close {margin-top: 0; align-self: flex-end; padding: 8px 18px; font-size: 25px; color: #fff; background: none; border: 0; cursor: pointer; text-decoration: underline; font-family: inherit; text-decoration: none;}
  .layer-popup .layer-btn-close:hover {opacity: 0.85;}
  body.layer-open {overflow: hidden;}

  #s3 .inner {padding: 85px 0 50px; text-align: center;}
    #s3 h2 {padding: 0 0 70px; font-size: 55px; text-align: center; line-height: 58px; color: #000; font-weight: 900;}
    #s3 ul {display: flex; flex-wrap: wrap; justify-content:space-between; align-items: center;}
    #s3 ul li {flex: 1 1 calc(100% / 3); min-height: 162px; padding-top: 162px; font-size: 21px; color:#121212; line-height: 33px;}
    #s3 ul li strong {font-weight: 600;}

    #s3 ul li:first-of-type {background: #fff url(../images/icn_img1.jpg) no-repeat center top;}
    #s3 ul li:nth-of-type(2) {background: #fff url(../images/icn_img2.jpg) no-repeat center top;}
    #s3 ul li:nth-of-type(3) {background: #fff url(../images/icn_img3.jpg) no-repeat center top;}

    #s3 a {display: inline-flex; justify-content: center; align-items: center; width: max-content; border-radius: 24px; text-decoration: none; margin: 30px auto; color: #222; height: 48px; font-size: 25px; padding: 0 30px; border: 1px solid #222;}

  #s4 {padding: 50px 0; background:#f5f5f7 url(../images/s2.jpg) no-repeat center top}
    #s4 .inner {width: 1400px; height: 600px;}

    #s4 p {display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding-top: 10px;}
    #s4 p a {flex: 1; height: 60px; display: flex; justify-content: center; align-items: flex-start; border-radius: 24px; text-decoration: none; color: #121212; font-size: 25px; opacity: 0.4;}
    #s4 p a.on {color: #121212; opacity: 1;}

    #s4 div.con {display: flex; flex-wrap: wrap; align-items: self-start; gap: 40px 20px; border-radius: 25px; background: #fff;  padding: 60px 60px;}
    #s4 div.con dl {flex: 0 1 calc((100% - 20px) / 2); font-size: 22px; color: #212112; border-radius: 20px; font-weight: 300; background: #fff;}
    #s4 div.con dl dt {font-size: 25px; font-weight: 900; line-height: 1; color: #121212; letter-spacing: -0.02em;}
    #s4 div.con dl dd {padding: 10px 0 0; font-size: 21px; line-height: 33px; padding-left: 14px; text-indent: -14px;}
    #s4 div.con dl dd.nohave {padding-left: 0; text-indent: 0;}
    #s4 div.con dl strong {color:#f75f07;}
    #s4 div.con dl span {color: #4c4c4c;}

    #s4 .inner>span {display: block; margin-top: 20px; font-size: 25px; text-align: center; color: #121212;}

footer{background:#fff;}
  footer .inner {width: 1600px;}
  #footer{padding:40px 0; font-size: 20px; line-height: 35px; color:#121212; letter-spacing: -0.05em; border-top:1px solid #dddcd9;}
  #footer dt {padding-bottom: 8px; font-weight: 500; font-size: 25px;}