p {font-size: 18px !important;}

@media screen and (max-width: 768px) {
    p {font-size: 16px !important;}
}




/*공통*/
.overview { max-width:890px}
.sub-title { padding: 150px 0 100px;text-align: center;}
.sub-title h2 { font-size: 54px; font-weight: 700;color: #000; line-height: 1.2; max-width: 700px}
.sub-title p { font-size: 18px; color: #555;padding: 0px 0 50px 0; line-height: 1.65;}
.sub-title.left { text-align: left;}
.sub-title.left strong {color: #0460d9; font-size: 18px; padding-bottom: 20px;display: block}

.sub-content-title {padding: 100px 0 50px;}
.sub-content-title h3 {font-size: 38px;color: #222;font-weight: 700;}
.sub-content-title h3::after {content: ""; width: 7px; height: 7px; background: #0460d9;border-radius: 50%;display: inline-block;margin-left: 10px;}

.dot-title { display: block;  position: relative; margin-top: 30px;  padding-left: 20px; font-size: 16px; font-weight: 500; line-height: 22px; color: #000 }
.dot-title::before {content: "";  display: inline-block;  position: absolute; top: 5px; left: 0; width: 10px; height: 10px;  background-image: url("../img/sub/icon_hexa_blue.svg"); background-size: auto; background-position: center;  background-repeat: no-repeat}
.dot-title--nomb { margin-top: 0}
.dot-title--bottom { margin-top: 0;  margin-bottom: 30px}
.sub_title { text-align: left;  padding: 0px 20px 50px 20px; max-width: 1600px; word-break: keep-all; margin:100px auto}
.sub_title h2 {font-size: 40px; color: #000; max-width: 600px}

#contents {margin: 100px 0;}
.clearfix:after {content: " "; visibility: hidden; display: block; height: 0; clear: both;}

/* main common */
.max-inner{max-width:1600px; width:100%; padding: 0 20px; margin:0 auto;}
.sec-title p.sub-tit{font-size:18px; color:#0460d9; font-weight:600; margin-bottom:20px;}
.max-inner .top-desc { font-size: 24px; font-weight: 700; max-width: 830px; word-break: keep-all; padding: 28px 0; line-height: 1.4;}


.download-button { margin: 50px 0 0; }
.download-button a { display: inline-block; padding: 20px 50px; background: #0460d9; color: #fff; }
.download-button a img { margin-left: 20px; }
@media screen and (max-width: 768px) {
  #contents {margin: 50px 0;}
}

@media screen and (max-width:576px) {
     .sub_title{margin:50px 0 50px}
	 .sub_title h2 { font-size:25px; line-height: 1.3}
}



/*회사소개*/
.container { width: 100%; max-width: 1800px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
.about .image { width: 100%; height: 400px; background-image: url('../img/sub/about_bg.jpg'); background-size: cover; background-position: center; background-attachment: fixed; }
.about-container { margin: 100px 0;}
.about-container .about-flex {display: flex; margin-bottom: 80px; padding-bottom: 60px; border-bottom: 1px solid #e0e0e0;}
.about-container .about-flex:last-child {border-bottom: none; padding-bottom: 0;}
.about-container .left { width: 30%; padding-right: 40px; display: flex; flex-direction: column; justify-content: space-between; }
.about-container .dot_list li {padding-left: 12px; position: relative; margin-bottom: 10px; font-size: 18px; font-weight: 400; line-height: 1.65; color:#555}
.about-container .dot_list > li::before {content: ''; display: block; width: 5px; height: 5px; background-color: #333; border-radius: 50%; position: absolute; top: 12px; left: 0;}

.about-container .sub_list {margin:10px 0 20px}
.about-container .sub_list li {position: relative; padding-left: 20px; margin-bottom: 8px; font-size: 17px; color:#6d6d6d;}
.about-container .sub_list li::before {content: '→';  position: absolute; top: 0; left: 0; color: #0460d9;}
.about-container .right { width: 70% }
.about-container .left .section-title {display: flex; align-items: baseline; font-weight: 700;}
.about-container .left .step-number {font-size: 36px;}
.about-container .left h3 {font-size: 27px; font-weight: 700; margin-left: 10px;}
.about-container .left .subtitle { font-size: 18px; margin: 0; }
.about-wrap h5 { font-size: 26px; margin-bottom: 20px; }
.about-wrap p { font-size: 18px; margin-bottom: 30px; color: #555; line-height: 1.65; font-weight: 400; word-break: keep-all; max-width: 1000px }
.info-list { margin: 0; padding: 0; }
.info-items { list-style: none; padding: 0; display: flex; flex-wrap: wrap; margin: 0 -20px; }
.info-items > li { width: calc(50% - 40px); margin:0 20px; }
.info-item { display: flex; align-items: flex-start; padding: 40px 0; border-bottom: 1px solid #ddd; }
.info-index { width: 85px; font-size: 18px; font-weight: 500; color: #0066e0; margin-top: 5px }
.info-details { flex: 1;  line-height: 1.65}
.info-title { font-size: 18px; font-weight: 500; margin-bottom: 5px; }
.info-text { font-size: 16px; font-weight: 300 }
.download-btn { display: inline-block; padding: 12px 24px; background-color: #0066e0; color: #fff; text-decoration: none; margin-top: 20px; font-size: 18px; border-radius: 8px;}

@media screen and (max-width: 1023px) {
    .about .image { height: 350px; background-attachment: scroll; }
    .about-container .left { width: 30%; }
    .about-container .right { width: 70%; }
    .about-container .left h4 { font-size: 28px; }
    .about-container .left .subtitle { font-size: 16px; }
    .about-wrap { margin-top: 40px; }
    .about-wrap h5 { font-size: 22px; }
    .about-wrap p { font-size: 16px; margin-bottom: 20px; }
    .info-item { padding: 20px 0}
    .info-index { width: 60px; font-size: 16px; }
    .download-btn { font-size: 16px; padding: 10px 20px; }
}

@media screen and (max-width: 768px) {
    .about .image { height: 300px;}
    .about-container {margin: 50px 0;}
    .about-container .about-flex {flex-direction: column; padding-bottom: 40px; margin-bottom: 40px;}
    .about-container .left, .about-container .right { width: 100%; }
    .about-container .left { margin-bottom: 30px; }
    .about-container .left .step-number {font-size: 30px;}
    .about-container .left h3 {font-size: 21px;}
    .about-container .left h3>br {display: none;}
    .about-container .left h4 { font-size: 24px; margin-bottom: 10px; }
    .about-container .dot_list li {font-size: 15px;}
    .about-wrap { margin-top: 30px; }
    .about-wrap h5 { font-size: 20px; margin-bottom: 15px; }
    .info-items { margin: 0; }
    .info-items > li { width: 100%; margin: 0; }
}
/*회사소개*/


/* content03 */
.title { text-align: center; margin-bottom: 60px; } 
.title h1 { color: white; font-size: 2.5rem; font-weight: 300; margin-bottom: 10px; } 
.title p { color: rgba(255, 255, 255, 0.8); font-size: 1.1rem; } 
.process-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(450px, 1fr)); gap: 30px; margin: 0; padding: 0; list-style: none; } 
.process-card { background: white; border-radius: 20px; padding: 40px 30px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); transition: all 0.3s ease; position: relative; overflow: hidden; animation: slideUp 0.6s ease forwards; opacity: 0; transform: translateY(30px); height: 308px } 
.process-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15); } 
.process-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, #667eea, #764ba2); } 
.step-header { display: flex; align-items: center; margin-bottom: 30px; } 
.step-icon { width: 60px; height: 60px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-right: 20px; position: relative; background: #fff; border: 3px solid; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); transition: all 0.3s ease; } 
.step-icon:hover { transform: scale(1.1); } 
.icon-user { border-color: #4facfe; color: #4facfe; } 
.icon-user::before { content: "👤"; font-size: 28px; } 
.icon-calculator { border-color: #43e97b; color: #43e97b; } 
.icon-calculator::before { content: "💰"; font-size: 28px; } 
.icon-register { border-color: #fa709a; color: #fa709a; } 
.icon-register::before { content: "📝"; font-size: 28px; } 
.icon-chat { border-color: #a8edea; color: #a8edea; } 
.icon-chat::before { content: "💬"; font-size: 28px; } 
.icon-contract { border-color: #fcb69f; color: #fcb69f; } 
.icon-contract::before { content: "🤝"; font-size: 28px; } 
.icon-complete { border-color: #ff9a9e; color: #ff9a9e; } 
.icon-complete::before { content: "✅"; font-size: 28px; } 
.step-info h3 { font-size: 1.5rem; color: #2c3e50; margin-bottom: 5px; font-weight: 600; } 
.step-number { font-size: 0.9rem; color: #7f8c8d; font-weight: 500; } 
.step-content { color: #555; line-height: 1.7; } 
.step-list { list-style: none; margin: 0; padding: 0; } 
.step-list li { position: relative; padding-left: 25px; margin-bottom: 15px; font-size: 1rem; word-break: keep-all } 
.step-list li:last-child { margin-bottom: 0; } 
.step-list li::before { content: ''; position: absolute; left: 0; top: 8px; width: 8px; height: 8px; background: linear-gradient(135deg, #667eea, #764ba2); border-radius: 50%; } 
.warning { color: #e74c3c !important; font-weight: 600; } 
.warning::before { background: #e74c3c !important; } 
.process-card:nth-child(1) { animation-delay: 0.1s; } 
.process-card:nth-child(2) { animation-delay: 0.2s; } 
.process-card:nth-child(3) { animation-delay: 0.3s; } 
.process-card:nth-child(4) { animation-delay: 0.4s; } 
.process-card:nth-child(5) { animation-delay: 0.5s; } 
.process-card:nth-child(6) { animation-delay: 0.6s; } 
@keyframes slideUp { to { opacity: 1; transform: translateY(0); } } 
@media screen and (max-width: 768px) { body { padding: 20px 15px; } .title h1 { font-size: 2rem; } .process-grid { grid-template-columns: 1fr; gap: 20px; } .process-card { padding: 30px 25px; } .step-header { flex-direction: column; text-align: center; margin-bottom: 25px; } .step-icon { margin-right: 0; margin-bottom: 15px; } .step-info h3 { font-size: 1.3rem; } } 
@media screen and (max-width: 480px) { .process-card { padding: 25px 20px; } .step-icon { width: 50px; height: 50px; border-width: 2px; } .icon-user::before, .icon-calculator::before, .icon-register::before, .icon-chat::before, .icon-contract::before, .icon-complete::before { font-size: 22px; } .step-info h3 { font-size: 1.2rem; } .step-list li { font-size: 0.95rem; } }

/* content03 */


