/**
* OLYM Cascading Style Sheets
* File Name : contents.css
* Description : 컨텐츠 스타일시트
* Author : Web business Team / Choi Hyun Mi
* Email : desingtj@olym.co.kr
* Date : 2017.04.26
* Update : 2016.04.26
* Copyright(c) 2017 OLYM Communications. All Rights Reserved.
*/

/* 상단 문구 */
.con_box_title { text-align: center;}
.con_box_title h4 {font-weight: 700; line-height: 1.1em; font-size: 30px; color: #000;}
.con_box_title h4 span { color: #233976;}
.con_box_title p { color: #7e7e7e; font-size: 18px; padding: 10px 0 50px 0;}


@media all and (max-width:800px) {
.con_box_title h4 {font-size: 20px; }
.con_box_title p { font-size: 14px; padding: 5px 0 30px 0;}
}

@media all and (max-width:500px) {
.con_box_title h4 span { display: block;}
.con_box_title p { padding: 5px 20px 30px 20px;}
}

/* 0101_사업개요 */
.busi_overview { margin-bottom: 50px; padding: 80px; background: url("/project/design/contents/bg_busi.jpg") no-repeat center / cover; display: flex; justify-content: flex-end;}
.busi_overview .box_in { background-color: #fff; box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.05); width: 360px; height: 600px; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.busi_overview .box_in .p_desc1 { color: #7f7f7f; font-size: 18px; margin-top: 60px; padding-top: 60px; border-top: 1px solid #ddd; text-align: center;}
.busi_overview .box_in .p_desc2 { color: #000; font-size: 40px; padding-top: 40px; font-weight: 600; line-height: 1.1em; letter-spacing: -0.05em;}
.busi_overview .box_in .p_desc2 span { color: #233976;}

@media all and (max-width:1024px) {
    .busi_overview { padding: 60px;}
    .busi_overview .box_in {  width: 300px; height: 500px;}
    .busi_overview .box_in img { height: 80px;}
    .busi_overview .box_in .p_desc1 { font-size: 16px; margin-top: 40px; padding-top: 40px;}
    .busi_overview .box_in .p_desc2 { font-size: 32px; padding-top: 30px;}
}

@media all and (max-width:800px) {
    .busi_overview { padding: 30px;}
    .busi_overview .box_in {  width: 240px; height: 400px;}
    .busi_overview .box_in img { height: 50px;}
    .busi_overview .box_in .p_desc1 { font-size: 13px; margin-top: 30px; padding-top: 30px;}
    .busi_overview .box_in .p_desc2 { font-size: 28px; padding-top: 20px;}
}
@media all and (max-width:500px) {
    .busi_overview { margin-bottom: 30px; padding:0; background: url("/project/design/contents/bg_busi.jpg") no-repeat center bottom / auto 260px; padding-bottom: 260px;}
    .busi_overview .box_in {  width: 100%; height: 200px; box-shadow: none;}
    .busi_overview .box_in img { height: 40px;}
    .busi_overview .box_in .p_desc1 { margin-top: 20px; padding-top: 20px;}
    .busi_overview .box_in .p_desc1 br { display: none;}
    .busi_overview .box_in .p_desc2 { font-size: 22px; padding-top: 10px;}
    .busi_overview .box_in .p_desc2 br { display: none;}
}


/* 0201_프리미엄 */
.prem_wrap { position: relative; background: url("/project/design/contents/premi_logo.png") no-repeat center; background-attachment: fixed;}

.prem_box { display: grid; grid-template-columns: 1fr 1fr; gap:0 100px;}
.prem_box .box_in { width: 100%;}
.prem_box .box_in:nth-child(even) { margin-top: 150px;}
.prem_box .box_in .img { border-top-right-radius: 60px; overflow: hidden; transition: all ease 0.3s;}
.prem_box .box_in .img img { width: 100%;}
.prem_box .box_in:hover .img { box-shadow: 5px 10px 20px rgba(0, 0, 0, 0.1);}
.prem_box .text_box { padding: 50px 45px;}
.prem_box .text_box .title { font-family: 'Montserrat'; font-weight: 800; font-size: 20px; color: #bb9558;}
.prem_box .text_box h2 { font-size: 32px; font-weight: 700; color: #000; padding:10px 0 20px 0;}
.prem_box .text_box p { font-size: 18px; color:#666; line-height: 1.6em;}
.prem_box .text_box ul > li {font-size: 18px; color:#666; line-height: 1.6em;}
.prem_box .text_box ul > li::before { content: "· ";}

@media all and (max-width:1260px) {
    .prem_wrap { background-size: 100%; background-attachment:local;}
    .prem_box {gap:0 60px;}
}

@media all and (max-width:1024px) {
    
    .prem_box .box_in:nth-child(even) { margin-top: 100px;}
    .prem_box .box_in .img {border-top-right-radius: 30px;}
    .prem_box .box_in .text_box { padding: 20px 15px 0 15px;}
    .prem_box .box_in .text_box .title { font-size: 14px;}
    .prem_box .box_in .text_box h2 { font-size: 22px; padding: 5px 0 10px 0;}
    .prem_box .box_in .text_box p { font-size: 16px; }
    .prem_box .box_in .text_box ul > li {font-size: 16px;}
}

@media all and (max-width:800px) {
    .prem_box {gap:0 30px;}
}

@media all and (max-width:500px) {
    .prem_wrap { background:none;}
    .prem_box {grid-template-columns: 1fr; gap:30px;}
    .prem_box .box_in:nth-child(even) { margin-top: 0;}
    .prem_box .box_in .text_box p { font-size: 15px; }
    .prem_box .box_in .text_box ul > li {font-size: 15px;}
}



/* 0202_동호수배치도 */
.d_layout_box { background-color: #f2f2f2; text-align: center; padding: 50px; margin-bottom: 70px;}
.layout_box { display: flex; justify-content: space-between; gap: 20px;}
.layout_box img { width: 100%;}

@media all and (max-width:800px) {
    .d_layout_box { padding: 10px; margin-bottom: 40px;}
    .layout_box { flex-direction: column; justify-content: flex-start; align-items: flex-start;}
}


/* 0203_평면정보 */
.surf_info {display:flex; margin:60px 0; border: 1px solid #dbdbdb; border-top: 1px solid #0f1935; padding: 40px 0; justify-content: space-around;}
.surf_info .box_in { width: 100%; display: flex; align-items: center; justify-content: center; gap: 20px;}
.surf_info .box_in + .box_in{ border-left:1px solid #dbdbdb;}
.surf_info .box_in .left { width: 64px; height: 64px; background-color: #4667b7; border-radius: 100%; display: flex; justify-content: center; align-items: center;}
.surf_info .box_in .left i {font-size:32px; color: #fff;}
.surf_info .box_in h4 {font-size:18px;color:#7f7f7f; padding-left: 2px;}
.surf_info .box_in p {padding-top:5px; font-size:32px; line-height: 1em; color:#0f1935;font-weight:700;}
.surf_info .box_in p span {font-size:16px;}

.surf_img { background:#f7f7f7; display:flex; align-items:flex-end; justify-content:space-between;}
.surf_img div:last-of-type {background:#fff; margin: 30px;}



@media all and (max-width:1024px) {  
.surf_info { margin:40px 0; padding: 30px 0;}  
.surf_info .box_in { gap: 10px;}
.surf_info .box_in .left { width: 50px; height: 50px; }
.surf_info .box_in .left i {font-size:24px;}
.surf_info .box_in h4 {font-size:16px; }
.surf_info .box_in p {font-size:24px; }
.surf_info .box_in p span {font-size:13px;}
}

@media all and (max-width:800px) {
.surf_info {display:grid; grid-template-columns: 1fr 1fr; padding: 0;}
.surf_info .box_in { padding:30px 20px; box-sizing: border-box;}
.surf_info .box_in + .box_in{ border-left:none;}
.surf_info .box_in:nth-child(even){ border-left:1px solid #dbdbdb;}
.surf_info .box_in:nth-child(1), .surf_info .box_in:nth-child(2){ border-bottom:1px solid #dbdbdb;}
}

@media all and (max-width:500px) {
    .surf_info { margin:20px 0;}  
    .surf_info .box_in { padding:15px 10px;}
    .surf_info .box_in .left { width: 30px; height: 30px; }
    .surf_info .box_in .left i {font-size:18px;}
    .surf_info .box_in h4 {font-size:13px; font-weight: 500; padding-left: 0;}
    .surf_info .box_in p {padding-top:0; font-size:18px; }
    .surf_img { flex-direction: column;}
    .surf_img div:last-of-type {margin:0 30px 30px 30px;}

}



/* 0204_커뮤니티 */
.comm_box { position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 40px;}
.comm_box .box_in .img { overflow: hidden;}
.comm_box .box_in .img img { width: 100%; transition: all ease 0.5s;}
.comm_box .box_in .img img:hover { transform: scale(1.1);}
.comm_box .box_in .img_text { padding: 45px 10px;}
.comm_box .box_in span { font-family: 'Montserrat'; font-weight: 500; color: #bb9558;}
.comm_box .box_in h3 { padding: 10px 0 20px 0; font-size: 24px; font-weight: 800; color: #000;}
.comm_box .box_in p { font-size: 17px; color: #7e7e7e;}

@media all and (max-width:1024px) {
    .comm_box { gap: 30px;}
    .comm_box .box_in .img_text { padding: 25px 10px;}
    .comm_box .box_in h3 { font-size: 20px; padding: 5px 0 10px 0;}
    .comm_box .box_in p { font-size: 15px;}
}

@media all and (max-width:800px) {
    .comm_box { gap: 20px;}
}
@media all and (max-width:500px) {
    .comm_box { grid-template-columns: 1fr;}
}



/* 0301_청년주택 안내 */
.youth_box { background: url("/project/design/contents/bg_youth.jpg") no-repeat center top / contain; padding: 380px 80px 0 80px; display: flex; align-items:flex-end; margin-bottom: 100px;}
.youth_box .box_in { background-color: #fff; width: 100%; padding: 60px 80px 0 80px;}
.youth_box .box_in h4 { color: #000; font-size: 40px; font-weight: 800; margin-bottom: 20px;}

.youth_info {display:flex;background:#f9f9f9;padding:3rem;margin-top:30px;gap:60px;}
.youth_info h5 {flex-basis:15%; font-size:26px;font-weight:700;color:#222;}
.youth_info div {font-size:1.125em;position:relative;padding-left:40px;}
.youth_info div:before {width:2px;height:100%;background:#222;content:"";position:absolute;left:0;top:0;}
.youth_info div span {color:#222;}

@media all and (max-width:1260px) {
    .youth_box { padding: 300px 80px 0 80px; margin-bottom: 100px;}
    .youth_box .box_in { padding: 40px 60px 0 60px;}
    .youth_box .box_in h4 { font-size: 30px;}
}


@media all and (max-width:1024px) {
    .youth_box { padding: 200px 50px 0 50px; margin-bottom: 50px;}
    .youth_box .box_in { padding: 40px 40px 0 40px;}
    .youth_box .box_in h4 { font-size: 24px;}
.youth_info div {font-size:1em;}
.youth_info h5 {font-size:24px;}
}

@media all and (max-width:800px) {
    .youth_box { padding: 140px 40px 0 40px;}
    .youth_box .box_in { padding: 40px 40px 0 40px;}
    .youth_box .box_in h4 { font-size: 20px; margin-bottom: 10px;}
.youth_info h5 {font-size:20px;}
.youth_info {flex-wrap:wrap;gap:30px;padding:2.5rem;}
.youth_info h5 {flex-basis:100%;}
.youth_info h5 br {display:none;}
.youth_info div {padding-left:30px;}
}

@media all and (max-width:440px) {
    .youth_box { padding: 100px 20px 0 20px;}
    .youth_box .box_in { padding: 20px 30px 0 30px;}
    .youth_box .box_in h4 { font-size: 18px; margin-bottom: 5px;}
.youth_info h5 {font-size:18px;}
.youth_info {flex-wrap:wrap;gap:20px;padding:2rem;}
.youth_info div {padding-left:20px;}
}


/* 0302_금융지원 안내 */
.finance { background: url("/project/design/contents/bg_fin.jpg") no-repeat center top / contain;}
.finance_box > ul { display: grid; grid-template-columns: 1fr 1fr; gap: 20px;}
.finance_box > ul > li { width: 100%; display: flex;}
.finance_box > ul > li .box_in {width: 100%; border: 1px solid #e4e4e4; padding: 40px 40px 75px 40px; position: relative; transition: all ease 0.3s;}
.finance_box > ul > li .box_in:hover { box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1);}
.finance_box > ul > li .box_in .img { position: absolute; top: 40px; right: 40px;}
.finance_box > ul > li .box_in h2 { font-size: 24px; color: #000; font-weight: 800; line-height: 1.2em;}
.finance_box > ul > li .box_in .p_desc3 { color: #324880; font-weight: 600; padding: 15px 0;}
.finance_box > ul > li:nth-child(even) .p_desc3 { color: #bb9558;}
.finance_box > ul > li .box_in .p_desc2 { color: #8a8a8a;}
.finance_box > ul > li .box_in .btn_in { position: absolute; bottom: 35px; right: 40px; display: flex; justify-content: end; gap: 40px;}
.finance_box > ul > li .box_in .btn_ar1 { display: inline-block; color: #8a8a8a; font-weight: 700; font-size: 15px; line-height: 1em;} 
.finance_box > ul > li .box_in .btn_ar1 i { display: inline-block; text-indent: -9999px; width: 40px; height: 16px; background: url("/project/design/main2/icon_ar_f1.png") no-repeat center / 100%; transition: all ease 0.3s; transform: translate(0,5px);}
.finance_box > ul > li .box_in .btn_ar1:hover { color: #000;} 
.finance_box > ul > li .box_in .btn_ar1:hover i {background: url("/project/design/main2/icon_ar_f2.png") no-repeat center / 100%;}
.finance_box h4 { font-size: 24px; color: #000; font-weight: 800; line-height: 1.2em; padding: 50px 0 20px 0;}
.finance_box .p_desc4 { color: #7e7e7e; font-size: 15px;padding: 20px;}


@media all and (max-width:800px) {
    .finance_box > ul { grid-template-columns: 1fr; gap: 10px;}    
    .finance_box > ul > li .box_in {padding: 20px 20px 50px 20px;}
    .finance_box > ul > li .box_in .img { top: 20px; right: 20px;}
    .finance_box > ul > li .box_in .img img { height: 40px;}
    .finance_box > ul > li .box_in h2 { font-size: 18px; }
    .finance_box > ul > li .box_in .p_desc3 { font-size: 13px; padding: 5px 0;}
    .finance_box > ul > li .box_in .p_desc2 { font-size: 13px;}
    .finance_box > ul > li .box_in .btn_in { bottom: 20px; right: 20px;}
    .finance_box h4 { font-size: 18px; padding: 40px 0 10px 0;}
    .finance_box .p_desc4 { font-size: 13px; padding: 10px;}
    .finance_box > ul > li .box_in .btn_ar1 {font-size: 14px;} 
}

/* 0303_모집공고 */
.recr_step ul {display:flex;gap:20px; margin-bottom: 50px;}
.recr_step ul li {flex:1;text-align:center; display:flex; justify-content: space-around; flex-direction: column;border:1px solid #eee;}
.recr_step .con { flex:3; padding:2.5rem;}
.recr_step .con p {font-size:20px;font-weight:700;color:#222;margin-top:20px;}
.recr_step .con p span { color: #c89552; font-weight: 900; display: block;}
.recr_step .desc {height: 80px; color:#0f1935; display: flex; justify-content: center; align-items: center; background-color: #f9f9f9; font-weight: 900;}
.recr_step .desc2 {height: 40px; display: flex; justify-content: center; align-items: center;}


@media all and (max-width:1280px) {
.recr_step ul {flex-wrap:wrap;}
.recr_step ul li {flex-basis:30%;}
.recr_step ul li br {display:none;}
.recr_step .con {padding:2rem;}
/* .recr_step .desc {min-height:auto;} */
}

@media all and (max-width:1120px) {
.recr_step ul li {flex-basis:40%;}
.recr_step .con p {font-size:18px;}
}

@media all and (max-width:1024px) {
.recr_step .con {padding:1.5rem;}
.recr_step .desc {padding:0.8rem; height: auto;}
}

@media all and (max-width:800px) {
.recr_step ul li {flex-basis:50%;}
.recr_step .con img {zoom:0.7;}
.recr_step .con {padding:1rem;}
.recr_step .con p {margin-top:10px;font-size:16px;}
.recr_step .desc {padding:0.6rem;}
}



/* 청약신청 */
.info_subs { padding: 10px 20px; font-size: 19px; color:#000; font-weight: 700; background:#f9f9f9; margin-bottom: 10px;}
.subs_box { border: 10px solid #f9f9f9; padding: 40px;}
.subs_box > ul { display: flex; flex-direction: column; gap: 20px;}
.subs_box > ul > li { display: flex; border-bottom: 1px dashed #ddd; padding-bottom: 20px;}
.subs_box > ul > li h5 { flex:1.5;color: #000; font-size: 19px; font-weight: 700;}
.subs_box > ul > li h5::before { content: "\f02e"; font-family:"FontAwesome"; padding-right: 10px; font-size: 16px; color: #f60;}
.subs_box > ul > li .desc_box { flex:9;}

@media all and (max-width:1024px) {
    .subs_box { border: 6px solid #f9f9f9; padding: 30px;}
    .subs_box > ul > li { flex-direction: column; gap: 10px;}
    .subs_box > ul > li .desc_box { padding-left: 24px;}
}
@media all and (max-width:800px) {
    .info_subs { font-size: 15px;}
    .subs_box { padding: 20px;}
    .subs_box > ul { gap: 10px;}
    .subs_box > ul > li { gap: 5px; padding-bottom: 10px;}
    .subs_box > ul > li h5 { font-size: 15px;}
}



/* 하단 버튼 */
.apt_btn_box {padding-top:30px; display: flex; justify-content: center; gap: 10px; }
.apt_btn_box2 {padding-top:30px; display: flex; justify-content: flex-end; gap: 10px; }

@media all and (max-width:700px) {
    .apt_btn_box2 .btn { padding: 15px;height: auto !important;}
}

@media all and (max-width:440px) {
.apt_btn_box {padding-top:20px; gap: 10px; flex-direction: column;}
.apt_btn_box .btn { padding: 15px; font-size: 17px; display: block;}
.apt_btn_box2 {padding-top:20px; gap: 10px; flex-direction: column;}
.apt_btn_box2 .btn { font-size: 17px; display: block;}
}

/* 자격요건 */
.qual_box h4 { text-align: center; color: #000; font-size: 40px; line-height: 1.3em; letter-spacing: -0.04em; font-weight: 800; margin-bottom: 30px;}
.qual_box h4 span { color: #bb9558; display: block;}
.qual_box .box_in { background-color: #cbe5fd; padding: 40px; display: flex; gap: 30px;}
.qual_box .box_in .left { flex: 0.8; background-color: #0f1935; color: #fff; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px; padding: 50px 30px;}
.qual_box .box_in .left .title { background-color: #ff8033; border-radius: 100%; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20px; font-weight: 700; line-height: 1.2em; width: 120px; height: 120px;}
.qual_box .box_in .left > ul { display: flex; gap: 20px; flex-direction: column; align-items: center; justify-content: center;}
.qual_box .box_in .left > ul > li { width: 100%; box-sizing: border-box; border-radius: 20px; border: 2px solid #fff; padding: 20px; text-align: center; font-size: 20px; font-weight: 600; line-height: 1.2em;}
.qual_box .box_in .left > ul > li i { display: block; color: #ff8033; font-size: 30px; margin-bottom: 5px;}
.qual_box .box_in .left > ul > li span { font-size: 15px;line-height: 1.2em;}
.qual_box .box_in .right { flex: 5; display: flex; flex-direction: column; gap: 30px;}
.qual_box .box_in .right .item { display: flex; gap: 30px; width: 100%; height: 100%;}
.qual_box .box_in .right .item .st2 { position: relative; width: 80%; background-color: #fff; display: flex; flex-direction: column; justify-content: center; align-items: center;}

.qual_box .box_in .right .item .st2::before { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; position: absolute; left: 0; top: 50%; transform: translate(-100%, -50%); content: '\f068'; font-family: "FontAwesome"; font-size: 20px;}
.qual_box .box_in .right .item .st2 .p_desc1 { font-size: 24px; color: #666; line-height: 1.2em; font-weight: 700; text-align: center; padding: 15px;}
.qual_box .box_in .right .item .st2 .p_desc1 span { line-height: 1.2em;}
.qual_box .box_in .right .item .st2 > ul > li { display: flex; align-items: center; border-top: 1px solid #dcdcdc; background-color: #f9f9f9;}
.qual_box .box_in .right .item .st2 > ul > li > p { flex: 1;  padding: 25px 15px; color: #000; font-size: 18px; font-weight: 600; text-align: center; line-height: 1.2em;}
.qual_box .box_in .right .item .st2 > ul > li > div { flex: 9; border-left: 1px solid #dcdcdc; font-size: 16px; padding: 25px 15px;}
.qual_box .box_in .right .item .st2 .p_desc2 { font-size: 14px; margin-top: 7px;}

.qual_box .box_in .right .item .st3 { position: relative; width: 20%; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 24px; line-height: 1.2em; font-weight: 700; text-align: center;}
.qual_box .box_in .right .item .st3::before { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; position: absolute; left: 0; top: 50%; transform: translate(-100%, -50%); content: '\f068'; font-family: "FontAwesome"; font-size: 20px;}

.qual_box .box_in .right .item.bg1 .st2 { border: 2px solid #1885d2;}
.qual_box .box_in .right .item.bg2 .st2 { border: 2px solid #294395;}
.qual_box .box_in .right .item.bg3 .st2 { border: 2px solid #bb9558;}
.qual_box .box_in .right .item.bg1 .st2::before { color: #1885d2;}
.qual_box .box_in .right .item.bg2 .st2::before { color: #294395;}
.qual_box .box_in .right .item.bg3 .st2::before { color: #bb9558;}

.qual_box .box_in .right .item.bg1 .st2 .p_desc1 span { color: #1885d2;}
.qual_box .box_in .right .item.bg2 .st2 .p_desc1 span { color: #294395;}
.qual_box .box_in .right .item.bg3 .st2 .p_desc1 span { color: #bb9558;}

.qual_box .box_in .right .item.bg1 .st3 { background-color: #1885d2;}
.qual_box .box_in .right .item.bg2 .st3 { background-color: #294395;}
.qual_box .box_in .right .item.bg3 .st3 { background-color: #bb9558;}


.qual_box .box_in .right .item.bg1 .st3::before { color: #1885d2;}
.qual_box .box_in .right .item.bg2 .st3::before { color: #294395;}
.qual_box .box_in .right .item.bg3 .st3::before { color: #bb9558;}

@media all and (max-width:1024px) {
    .qual_box h4 { font-size: 30px;}
    .qual_box .box_in { padding: 20px; gap: 10px;}
    .qual_box .box_in .left { gap: 10px; padding: 30px 20px;}
    .qual_box .box_in .left .title { font-size: 16px; width: 80px; height: 80px;}
    .qual_box .box_in .left > ul { gap: 10px;}
    .qual_box .box_in .left > ul > li { padding: 10px; font-size: 16px;}
    .qual_box .box_in .left > ul > li i { font-size:24px;}
    .qual_box .box_in .left > ul > li span { font-size: 14px;}
    .qual_box .box_in .right { gap: 10px;}
    .qual_box .box_in .right .item { gap: 10px;}
    .qual_box .box_in .right .item .st2 .p_desc1 { font-size: 18px; padding: 15px;}
    .qual_box .box_in .right .item .st2 > ul > li > p { padding: 20px 10px; font-size: 15px;}
    .qual_box .box_in .right .item .st2 > ul > li > div { font-size: 14px; padding: 20px 10px;}
    .qual_box .box_in .right .item .st3 { font-size: 18px;}
    .qual_box .box_in .right .item .st2::before { width: 10px; height: 10px; font-size: 10px;}
    .qual_box .box_in .right .item .st3::before { width: 10px; height: 10px; font-size: 10px;}
}

@media all and (max-width:600px) {
    .qual_box h4 { font-size: 18px;}
    .qual_box .box_in { flex-direction: column; padding: 10px;}
    .qual_box .box_in .left { padding:0; gap: 0;}
    .qual_box .box_in .left .title { width: 100%; padding: 10px 0; height: auto; border-radius: 0;}
    .qual_box .box_in .left .title br { display: none;}
    .qual_box .box_in .left > ul { flex-direction: row; gap: 10px; padding: 10px;}
    .qual_box .box_in .left > ul > li { padding: 5px; font-size: 14px; border:1px solid #fff; border-radius: 10px;}
    .qual_box .box_in .left > ul > li i { font-size: 20px;}
    .qual_box .box_in .left > ul > li span { font-size: 12px;}
    .qual_box .box_in .left > ul > li br { display: none;}
    .qual_box .box_in .right .item { gap: 0;}
    .qual_box .box_in .right .item .st2 { width: 72%;}
    .qual_box .box_in .right .item .st2 .p_desc1 { font-size: 15px; padding: 10px;}
    .qual_box .box_in .right .item .st2 > ul > li > p { font-size: 13px;}
    .qual_box .box_in .right .item .st2 > ul > li > div { font-size: 13px; padding: 10px;}    
    .qual_box .box_in .right .item .st2 .p_desc2 { font-size: 13px; margin-top: 3px;}
    .qual_box .box_in .right .item .st3 { width: 28%;}
    .qual_box .box_in .right .item .st3 { font-size: 14px;}
    .qual_box .box_in .right .item .st2::before { display: none;}
    .qual_box .box_in .right .item .st3::before { content: "\f061";width: 20px; height: 20px; font-size: 15px; transform: translate(-25%, -50%);}

    .qual_box .box_in .right .item.bg1 .st3::before { color: #fff;}
    .qual_box .box_in .right .item.bg2 .st3::before { color: #fff;}
    .qual_box .box_in .right .item.bg3 .st3::before { color: #fff;}
}
/* 0601_입지환경 */

.of_box .top_box p { border-top: 6px solid #1f1e1d; text-align: center; color: #000; font-size: 40px; line-height: 1.3em; letter-spacing: -0.04em; font-weight: 800; padding: 40px 10px;}
.of_box .top_box p .em1 { color: #bb9558;}
.of_box .top_box p .em2 { color: #e6103f;}
.of_box .top_box p .st { position: relative;}
.of_box .top_box p .st::before {content: "\f005"; font-family:"FontAwesome"; font-size: 13px; position: absolute; top:0; left: 50%; transform: translate(-50%, -60%);}

.of_box .cha_box { margin-top: 50px; padding: 90px; background-color: #f8f4ee; position: relative;}
.of_box .cha_box::before { content: ""; display: block; width: 10%; height: 90%; position: absolute; left: 0; bottom: 0; background-color: #e6103f; border-radius: 0 100px 0 0;}
.of_box .cha_box .p_desc1 {text-align: center; color: #000; font-size: 30px;font-weight: 800;}
.of_box .cha_box .p_desc2 {text-align: center; color: #bb9558; font-size: 80px; line-height: 1.1em; font-family: 'Montserrat'; font-weight: 700; margin-bottom: 80px;}
.of_box .cha_box > ul { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; justify-content: center;}
.of_box .cha_box > ul > li { text-align: center;}
.of_box .cha_box > ul > li .img_box { position: relative;}
.of_box .cha_box > ul > li .img_box > img { width: 100%;}
.of_box .cha_box > ul > li .img_box > i { position: absolute; left: 50%; bottom: 0; transform:translate(-50%, 50%);}
.of_box .cha_box > ul > li h4 { margin: 80px 0 10px 0; color: #000; font-size: 36px; line-height: 1.3em; letter-spacing: -0.04em; font-weight: 800;}
.of_box .cha_box > ul > li p { font-size: 18px; line-height: 1.6em;}

@media all and (max-width:1024px) {
.of_box .top_box p { border-top: 4px solid #1f1e1d; font-size: 30px; padding: 30px 10px;}
.of_box .top_box p .st::before {font-size: 11px;}
.of_box .cha_box { margin-top: 30px; padding: 60px;}
.of_box .cha_box .p_desc1 {font-size: 24px;}
.of_box .cha_box .p_desc2 {font-size: 50px; margin-bottom: 40px;}
.of_box .cha_box > ul { gap: 40px;}
.of_box .cha_box > ul > li .img_box > i img { height: 100px;}
.of_box .cha_box > ul > li h4 { margin: 60px 0 10px 0; font-size: 28px;}
.of_box .cha_box > ul > li p { font-size: 15px;}
}

@media all and (max-width:800px) {
.of_box .cha_box { padding: 40px;}
.of_box .cha_box > ul { gap: 20px;}
.of_box .cha_box > ul > li p br { display: none;}

}
@media all and (max-width:500px) {
.of_box .top_box p { border-top: 2px solid #1f1e1d; font-size: 18px; padding: 20px 10px;}
.of_box .top_box p .st::before {font-size: 6px;}
.of_box .cha_box { padding: 30px;}
.of_box .cha_box .p_desc1 {font-size: 18px;}
.of_box .cha_box .p_desc2 {font-size: 24px; margin-bottom: 30px;}
.of_box .cha_box > ul { grid-template-columns: 1fr;}
.of_box .cha_box > ul > li h4 { margin: 60px 0 10px 0; font-size: 20px;}
.of_box .cha_box > ul > li p { font-size: 14px;}
}

/* 0602_공급안내 */
.box_floor .desc_box { text-align: center; padding: 70px 0;}
.box_floor .desc_box .p_desc1 { font-size: 30px; color: #000;font-weight: 800;}
.box_floor .desc_box .p_desc2 { font-size: 18px; padding-top: 10px;}
.box_floor .desc_box ul { margin-top: 60px; display: flex; gap:40px;}
.box_floor .desc_box ul > li > img { width: 100%;}

@media all and (max-width:1024px) {
.box_floor .desc_box { padding: 40px 0;}
.box_floor .desc_box .p_desc1 { font-size: 22px;}
.box_floor .desc_box .p_desc2 { font-size: 15px; padding-top: 5px;}
.box_floor .desc_box ul { margin-top: 30px; gap:20px;}
}
@media all and (max-width:600px) {
.box_floor .desc_box .p_desc1 { font-size: 18px;}
.box_floor .desc_box .p_desc2 { font-size: 14px;}
.box_floor .desc_box ul { margin-top: 20px; gap:5px;}
}

/* vr홍보관 */

.vr_box {background: url("/project/design/contents/bg_vr.jpg") no-repeat left bottom / cover; padding: 100px; display: flex; flex-direction: column; align-items: flex-end;}
.vr_box .p_desc1 { font-size: 40px; color: #000; font-weight: 800; line-height: 1.1em; letter-spacing: -0.02em; text-align: right;}
.vr_box .p_desc1 span { color: #324880; font-size: 1.8em;}
.vr_box .p_desc2 { font-size: 1.125em; padding: 10px 0; text-align: right;}
.vr_box .iso_btn { display: flex; gap: 40px; margin-top: 50px; align-items: center; justify-content: center;}
.vr_box .iso_btn a { padding: 0 40px 40px 40px; border-radius: 60px; color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; font-size: 24px; font-weight: 800;}
.vr_box .iso_btn a p { display: flex; justify-content: center; align-items: center; gap: 10px;}
.vr_box .iso_btn a i { font-size: 1.2em;}
.vr_box .iso_btn a.bg1 { background-color: #bb9558; border: 4px solid #bb9558;}
.vr_box .iso_btn a.bg2 { background-color: #0f1935; border: 4px solid #0f1935;}
.vr_box .iso_btn a:hover { box-shadow: 0 10px 20px rgba(0,0,0,0.1); transform: translate(0, 10px);}
.vr_box .iso_btn a.bg1:hover { background-color: #fff; color: #bb9558;}
.vr_box .iso_btn a.bg2:hover { background-color: #fff; color: #0f1935;}

@media all and (max-width:1260px) {
.vr_box {padding: 50px;}
.vr_box .p_desc1 { font-size: 24px; }
.vr_box .iso_btn {  gap: 20px; margin-top: 30px;}
.vr_box .iso_btn a { padding: 0 30px 20px 30px; font-size: 20px;}
.vr_box .iso_btn a span img { height: 180px; }
} 
@media all and (max-width:800px) {
.vr_box {padding: 30px;}
.vr_box .p_desc1 { font-size: 18px; }
.vr_box .p_desc2 { padding: 5px 0;}
.vr_box .iso_btn {margin-top: 20px;}
.vr_box .iso_btn a { padding: 0 20px 20px 20px; font-size: 16px; border-radius: 40px;}
.vr_box .iso_btn a span img { height: 120px; }
}
@media all and (max-width:500px) {
.vr_box {padding: 50px 15px 100px 15px;}
.vr_box .p_desc1 { text-align: center;}
.vr_box .p_desc1 span {color: #fff; background-color: #324880; padding: 0 10px;}
.vr_box .p_desc2 {display: none;}
.vr_box .iso_btn { gap: 10px; margin-top: 50px;}
.vr_box .iso_btn a { padding: 0 20px 20px 20px; font-size: 16px; border-radius: 40px; border-radius: 20px;}
.vr_box .iso_btn a p { flex-direction: column; gap: 5px;}
.vr_box .iso_btn a i { font-size: 1.5em;}
.vr_box .iso_btn a span img { height: 120px; }
}