@charset "utf-8";
/* 공통 */
.sub-pd { padding-bottom: 100px; }
.sub-bg { padding: 80px 0; text-align: center; color: #fff; background: url(../images/sub/sub1-2-bg.jpg) center no-repeat; background-size: cover;}
.sub-bg h2 { font-family: var(--font-shilla); font-size: var(--font-size40); font-weight: 700; line-height: 1.2em; margin-bottom: 20px;}
.sub-bg p { color: rgba(255, 255, 255, 0.7); font-size: var(--font-size18); line-height: 1.3em; }
.sub-bg p strong { font-weight: 700; color: #fff; }

/* 원장 인사말 */
.gt-img { margin-bottom: 60px; display: flex; align-items: flex-end; background: url(../images/sub/sub1-1-bg.jpg) left center no-repeat; }
.gt-img .info { flex: 1 1 auto; min-width:0; width:1%; padding: 40px;  font-family: var(--font-shilla); font-size: var(--font-size48); font-weight: 700; line-height: 1.45em; color: #121212; height: 100%;}
.gt-img .img { position: relative; }
.gt-img .img .ceo { position: absolute; left: 0; bottom: 0; }
.gt p { margin-bottom: 20px; line-height: 1.7em; font-size: var(--font-size20);}
.gt p strong { color: #121212; font-weight: 700; }
.gt p:last-child { margin-bottom: 0; }

/* 원장 약력 */
.pf { display: flex; height: 100%; align-items: flex-start;}
.pf .img { text-align: center; width: 50%; padding-right: 145px; position:sticky; top: 140px;}
.pf .img h4 { font-family: var(--font-shilla); font-size: var(--font-size24); font-weight: 500; line-height: 1.667em; color: #121212; margin-top: 30px; }
.pf .info { width: 50%; }
.pf .info .group { margin-bottom: 100px; }
.pf .info .group h3 { font-size: var(--font-size24); font-weight: 700; line-height: 1.2em; color: #121212; font-family: var(--font-shilla); padding: 16px 20px 13px; border-radius: 4px; background: url(../images/sub/pf-bg.jpg) center no-repeat; background-size: cover;}
.pf .info .wrap { padding-top: 25px; padding-left: 20px; }
.pf .info .wrap .col { margin-bottom: 40px; }
.pf .info .wrap .col:last-child { margin-bottom: 0; }
.pf .info h5 { font-size: var(--font-size18); font-weight: 700; color: #121212; line-height: 1.2em; margin-bottom: 20px; }
.pf .info .txt p { margin-bottom: 12px; line-height: 1.4em; padding-left: 15px; font-size: var(--font-size18); position: relative; font-weight: 300; }
.pf .info .txt p:last-child { margin-bottom: 0; }
.pf .info .txt p:before { content: ''; position: absolute; left: 0; top: 10px; width: 5px; height: 5px; background: #ccc; border-radius: 6px; }

/* 조선명리 뿌리 */
.hst-tit { font-size: var(--font-size48); font-weight: 700; line-height: 1.45em; color: #121212; font-family: var(--font-shilla); text-align: center; }
.hst-tit span { font-weight: 500; }
.hst-txt { line-height: 1.6em; font-size: var(--font-size20); text-align: center; margin: 25px 0 60px;}
.hst .col { margin-bottom: 20px; display: flex; padding: 50px; border-radius: 8px; border: 1px solid #ddd; background: #f9f9f9; }
.hst .col:last-child { margin-bottom: 0; }
.hst .col .img { border-radius: 8px; overflow: hidden; margin-right: 60px; }
.hst .col .info { flex: 1 1 auto; min-width:0; width:1%; }
.hst .col .info h3 { font-size: var(--font-size24); font-weight: 700; line-height: 1.2em; color: #121212; padding-bottom: 18px; margin-bottom: 30px; border-bottom: 1px solid #ddd;}
.hst .col .info .ctr { display: inline-block; color: #fff; font-weight: 600; line-height: 1.2em; padding: 7px 10px; border-radius: 4px; background: var(--color-primary); margin-bottom: 18px; }
.hst .col .info .txt p { margin-bottom: 20px; line-height: 1.4em; padding-left: 15px; font-size: var(--font-size18); position: relative; font-weight: 300; }
.hst .col .info .txt p:last-child { margin-bottom: 0; }
.hst .col .info .txt p:before { content: ''; position: absolute; left: 0; top: 10px; width: 5px; height: 5px; background: #ccc; border-radius: 6px; }

/* 작업공간 소개 */
.wk .col { display: flex; align-items: center; margin-bottom: 150px; }
.wk .col:last-child { margin-bottom: 0; }
.wk .col .img { width: 43%; }
.wk .col .img img { border-radius: 16px; }
.wk .col .info { width: 57%; padding-left: 100px; }
.wk .col .info h4 { font-size: var(--font-size24); font-weight: 700; color: #121212; line-height: 1.3em; margin-bottom: 25px; }
.wk .col .info p { line-height: 1.666em; font-size: var(--font-size18); margin-bottom: 20px; }
.wk .col .info p strong { color: #121212; font-weight: 700; }
.wk .col .info p:last-child { margin-bottom: 0; }
.wk .col .info h3 { font-size: var(--font-size32); font-weight: 700; line-height: 1.2em; color: #121212; font-family: var(--font-shilla); margin: 30px 0;}
.wk .col .info h3.mg { margin-bottom: 0; margin-top: 55px; }
.wk .col:nth-child(even) { flex-direction: row-reverse; }
.wk .col:nth-child(even) .info { padding-left: 0; padding-right: 100px; }

/* 역대명인 소개 */
.master { padding: 100px 0 150px; background: url(../images/sub/sub1-5-bg.jpg) center no-repeat; background-size: cover; color: #fff; text-align: center; }
.master h3 { font-size: var(--font-size40); font-weight: 700; margin: 30px 0; line-height: 1.4em; font-family: var(--font-shilla);}
.master h3 span { font-weight: 500; font-family:'Noto Sans KR';}
.master h3 strong { font-size: var(--font-size24);}
.master h5 { display: none; }
.master p { margin-bottom: 30px; font-size: var(--font-size18); line-height: 1.666em; }
.master p:last-child { margin-bottom: 0; }
.master .txt { border-radius: 8px; background: rgba(255, 255, 255, 0.10); box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.10); padding: 20px 10px; font-weight: 600; line-height: 1.62em; margin-top: 75px; }
.ms-prev::after, .ms-next::after { display: none; }
.ms-prev, .ms-next { position: absolute; top: 0; transform: none; margin-top: 0; display: flex; gap: 20px; align-items: center; color: #fff; width: auto; font-size: 16px; line-height: 1.5em; font-weight: 500; }
.ms-prev { left: 0; text-align: left; }
.ms-swiper .swiper-button-disabled { opacity: 0; }
.ms-next { right: 0; left: auto; text-align: right; }

/* 작업공간 철학 */
.ps { margin: 55px 0 80px; }
.ps .col { display: flex; margin-bottom: 80px; align-items: center;}
.ps .col:last-child { margin-bottom: 0; }
.ps .left { display: flex; align-items: center; width: 380px; }
.ps .left .num { line-height: 1.3em; font-size: 64px; font-weight: 700; color: #eee; margin-right: 30px; }
.ps .left .info { flex: 1 1 auto; min-width:0; width:1%; }
.ps .left .info h4 { font-size: var(--font-size24); font-weight: 700; color: #121212; line-height: 1.3em; margin-bottom: 8px; }
.ps .left .info h5 { color: #121212; font-size: var(--font-size18); font-weight: 400; }
.ps .txt { flex: 1 1 auto; min-width:0; width:1%; padding-left: 30px; font-size: var(--font-size18); line-height: 1.666em; border-left: 1px solid #ddd;}
.ps-ban { text-align: center; color: #fff; padding: 60px 10px; background: url(../images/sub/sub2-1-bg.jpg) center no-repeat; background-size: cover; border-radius: 16px; }
.ps-ban p { margin-bottom: 15px; font-size: var(--font-size20); line-height: 1.6em; }
.ps-ban p:last-child { margin-bottom: 0; }
.ps-ban span { display: block; margin-top: 30px; font-size: var(--font-size18); color: rgba(255, 255, 255, 0.7);}
.ps-ban span strong { font-weight: 700; color: #fff; }

/* 작명의 원리 */
.pc-wrap { display: flex; flex-wrap: wrap; gap: 80px 60px;}
.pc-wrap .col { width: calc(100%/2 - 30px); }
.pc-wrap .col img { width: 100%; }
.pc-wrap .col .txtbox { padding-top: 30px; padding-left: 10px; }
.pc-wrap .col .ctr { display: flex; align-items: center; justify-content: center; color: #fff; width: 90px; height: 30px; border-radius: 4px; background: var(--color-primary); font-weight: 600; line-height: 1.2em; }
.pc-wrap .col h3 { margin: 15px 0 25px; font-size: var(--font-size24); font-weight: 700; color: #000; line-height: 1.3em; }
.pc-wrap .col p { font-size: var(--font-size18); line-height: 1.666em; }

/* 상담신청 공통 */
.ct-bg { margin-bottom: 60px; padding: 60px; background: url(../images/sub/sub4-bg.jpg) center no-repeat; background-size: cover; border-radius: 24px; }
.ct-bg h4 { margin-bottom: 26px; font-size: var(--font-size32); font-weight: 700; color: #121212; line-height: 1.3em; font-family: var(--font-shilla); }
.ct-bg h4 span { color: #d5132b; }
.ct-bg p { font-size: var(--font-size18); line-height: 1.666em; margin-bottom: 15px; }
.ct-bg p strong { color: #121212; font-weight: 700; }
.ct-bg p:last-child { margin-bottom: 0;}
.ct-pd { padding-bottom: 120px; }
.ct-pd.mg { padding-bottom: 0; }
.ct-pd .required { color: #d5132b; }
.ct-titbox { margin-bottom: 28px; display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 10px; }
.ct-tit { position: relative; padding-left: 38px; line-height: 1.2em; font-size: var(--font-size28); font-weight: 700; color: #121212; }
.ct-tit::before { content: ""; position: absolute; left: 0; width: 28px; height: 28px; background: url(../images/sub/tit-bf.png) center no-repeat; background-size: contain; top: 4px; }
.ct-titbox p .required { font-weight: 700; }

/* 사주상담 , 궁합이사, 각종상담 공통 */
.sub4-fx { padding-bottom: 180px; display: flex; align-items: flex-end; background: url(../images/sub/sub4-bg2.jpg) center bottom no-repeat; background-size: 100% 76%;}
.sub4-fx .img { width: 50%; padding-right: 100px; }
.sub4-fx .img img { border-radius: 0 600px 600px 0; width: 100%; }
.sub4-fx .info { width: 50%; }
.sub4-fx .info h2 { font-size: var(--font-size56); font-weight: 700; line-height: 1.2em; color: #121212; font-family: var(--font-shilla); }
.sub4-fx .info h2 span {font-size: var(--font-size24);}
.sub4-fx .info .line { margin: 30px 0; width: 2px; height: 60px; background: var(--color-primary); }
.sub4-fx .info p { font-size: var(--font-size20); line-height: 1.8em; font-weight: 400; margin-bottom: 30px; }
.sub4-fx .info p:last-child { margin-bottom: 0; }

/* 오시는 길 */
.root_daum_roughmap {width:100% !important;}
.map { border-radius: 24px; overflow: hidden; }
.directions {margin-top:40px; display: flex; flex-wrap: wrap; }
.directions .address-info { width: 50%; }
.directions .address-info .comp {color:#B38C53; font-weight:600; margin-bottom:8px; font-size: var(--font-size18); }
.directions .address-info .addr {color:#121212; font-size:var(--font-size24); font-weight:700; line-height:1.33em; letter-spacing:-.03em; margin-bottom:12px;}
.directions .address-info .etc {color:#505050;}
.directions .address-info .etc span {display:inline-block; margin-right:15px;}
.directions .address-info .etc span:last-child {margin-right:0;}
.directions .contact-info { width: 50%; padding-top: 30px; }
.directions .contact-info dl {display:flex; margin-bottom: 20px; line-height: 1.5em; }
.directions .contact-info dl:last-child {margin-bottom: 0;}
.directions .contact-info dt {width:100px; color:#121212; font-size:var(--font-size18); font-weight:700;}
.directions .contact-info dt svg {vertical-align:middle; margin:-.2em 15px 0 0;}
.directions .contact-info dt path {fill:#121212;}
.directions .contact-info dd {flex:1 1 auto; min-width:0; width:1%; color:#505050; font-size: var(--font-size18);}