@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.yellow {color:#d9ad3b;}
.brown {color:#8b6e26;}

.outline .tit {text-align:center; margin-bottom:40px;}
.outline .tit h3 {font-size:26px; font-weight:700; color:#2c2c2c; margin-bottom:24px;}
.outline .tit p {font-size:14px; font-weight:400; color:#878787; letter-spacing:.64em;}
.outline .wrap {display:flex;}
.outline .wrap .img,
.outline .wrap .txt {width:50%;}
.outline .wrap .txt {padding:60px 50px; text-align:center; border:1px solid #ddd; border-left:0;}
.outline .txt span {display: block; font-size:16px; font-weight:500; margin-bottom:12px; letter-spacing:-.04em;}
.outline .txt ul {display:flex; flex-wrap: wrap; }
.outline .txt ul li {width:33.33333%; margin-bottom:70px;line-height: 1.2em;}
.outline .txt ul li:nth-child(1) {letter-spacing:.40em;} 
.outline .txt ul li:last-child { width: 66.6666%;}
.outline .txt ul li,
.outline .txt .addr,
.outline .txt .dmc {font-size:26px; color:#2c2c2c;}
.outline .txt .addr {padding-bottom:55px; margin-bottom:45px; position:relative;}
.outline .txt .addr:after {content:""; width:260px; height:1px; background:#ddd; position:absolute; bottom:0; left:50%; transform:translateX(-50%);}
.outline .txt .dmc p {font-size:16px; color:#878787; line-height:1.8em; margin-top:32px;}

.greeting {display:flex; flex-wrap:wrap}
.greeting .box01, .greeting .box02 {width:50%;}
.greeting .box01 h3 {font-size:36px; line-height:1.2em; font-weight:300; margin-bottom:36px; color:#2c2c2c;}
.greeting .box02 {padding-left:40px;}
.greeting .box02 h4 {font-size:22px; font-weight:500; color:#2c2c2c;}
.greeting .box02 ul li {font-size:18px; line-height:1.8em; color:#505050; margin-bottom:40px;}
.greeting .box02 p {font-weight:500; color:#2c2c2c; position:relative; display:inline;}
/* .greeting .box02 p:after {content:""; width:124px; height:44px; background:url("../images/sub/greeting02.jpg") no-repeat; position:absolute; top:-12px; right:0;} */

.management h3 {font-size:26px; font-weight:700; line-height:1.4em; color:#2c2c2c; position:relative; padding-left:25px; margin-bottom:40px;}
.management h3:before {content:""; width:7px; height:30px; background:#d9ad3b; position:absolute; top:5px; left:0;}

.idea {margin-bottom:80px;}
.idea .box {text-align:center;}
.idea .box img {margin-bottom:56px;}
.idea .box h4 {font-size:24px; color:#2c2c2c; line-height:1.6em; margin-bottom:36px; font-weight:700;}
.idea .box p {font-size:20px; color:#2c2c2c; font-weight:500;}

.competition {margin-bottom:80px;}
.competition ul {display:flex;}
.competition ul li {width:25%; padding:40px 30px; border:1px solid #ddd;} 
.competition ul li h4 {font-size:22px; line-height:1.4em; margin-bottom:36px; font-weight:700;}
.competition ul li p {font-size:18px; line-height:1.8em; font-weight:400; color:#505050;}

.target ul {display:flex; margin-left:-40px; margin-bottom:100px;}
.target ul li {width:calc(33.3333% - 40px); margin-left:40px; position:relative;}
.target ul li .box {text-align: center; width:293px; padding:22px 0; background:#fff; font-size:20px; color:#2c2c2c; display:inline-block; position:absolute; left:50%; bottom:-50px; transform:translateX(-50%);}
.target .img-box {text-align:center;}	

.directions .addr {margin-bottom:40px;}
.directions .addr ul {display:flex;}
.directions .addr ul li {width:50%; border:1px solid #ddd; text-align:center;}
.directions .addr .box {padding:57px 0;}
.directions .addr .box img {margin-bottom:34px;}
.directions .addr .box p {font-size:26px; font-weight:300; color:#2c2c2c; line-height:1.4em;}
.directions .addr .box p span {font-size:16px; line-height: 1.5em; display:block; margin-bottom:14px;}
.directions .map {border:1px solid #ddd;}
.root_daum_roughmap {width:100% !important; height:480px !important;}
.root_daum_roughmap .wrap_map {height:480px !important;}
.roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.roughmap_lebel_text:after {content:"제이피에셋자산운용"; font-size:12px; line-height:15px;}

.process .wrap:first-child {margin-bottom:80px;}
.process .wrap h3 {font-size:26px; font-weight:700; color:#2c2c2c; line-height:1.3em; position:relative; margin-bottom:38px; padding-left:25px;}
.process .wrap h3::before {content:""; width:7px; height:30px; background:#d9ad3b; position:absolute; top:3px; left:0;}
.process .wrap p {font-size:18px; font-weight:400; color:#505050; line-height:1.4em; margin-bottom:40px;}
.process .top-box {display:flex; flex-wrap:wrap; padding-left:1px; padding-top:1px;}
.process .top-box li {width:33.3333333%; padding:40px 0 40px 30px; border:1px solid #ddd; margin-left:-1px; margin-top:-1px; min-height:325px;}
.process .top-box li h4 {font-size:22px; font-weight:700; line-height:1.4em; position:relative; padding-left:40px; margin-bottom:40px;}
.process .top-box li h4 span {font-size:16px;}
.process .top-box li h4::before {content:""; position:absolute; top:0; left:0; width:30px; height:30px; border-radius:50%; background:#d9ad3b; color:#fff; text-align:center;}
.process .top-box li:nth-child(1) h4::before {content:"1";}
.process .top-box li:nth-child(2) h4::before {content:"2";}
.process .top-box li:nth-child(3) h4::before {content:"3";}
.process .top-box li:nth-child(4) h4::before {content:"4";}
.process .top-box li:nth-child(5) h4::before {content:"5";}
.process .top-box li:nth-child(6) h4::before {content:"6";}
.process .top-box li p {margin-bottom:34px;}
.process .top-box li p:last-child {margin-bottom:0;}
.process .downicon {margin:40px 0 80px; text-align:center;}
.process .txt-ac {text-align:center; font-size:24px; font-weight:700; margin-bottom:36px;}
.process .bot-box {display:flex; flex-wrap:wrap; padding-left:1px; padding-top:1px;}
.process .bot-box li{padding:40px 0 40px 30px; border:1px solid #ddd; margin-left:-1px; margin-top:-1px;}
.process .wrap:first-child .bot-box li {width:50%;}
.process .wrap:last-child .bot-box li {width:33.33333%;}
.process .bot-box li h4 {font-size:22px; font-weight:700; line-height:1.3em; margin-bottom:38px;}
.process .bot-box li p {font-size:18px; font-weight:400; line-height:1.4em;}
.process .bot-box li p strong {display:block;}

.present h3 {font-size:26px; font-weight:700; color:#2c2c2c; line-height:1.3em; position:relative; margin-bottom:38px; padding-left:25px;}
.present h3::before {content:""; width:7px; height:30px; background:#d9ad3b; position:absolute; top:3px; left:0;}
.present table {margin-bottom:80px;}
.present table {border-collapse:collapse; border-spacing:0; text-align:center;}
.present table thead tr th {border-top:2px solid #d9ad3b; border-bottom:1px solid #ddd; background:#fafafa;}
.present table thead tr th:last-child {border-right:0;}
.present table tbody tr th,
.present table tbody tr td {border-bottom:1px solid #ddd;}
.present table th {border-right:1px solid #ddd; padding:10px 0;}
.table02 tbody tr th {height:75px;}
.present .cell-box {margin-bottom:80px;}
.present .cell-box ul {display:flex; padding-left:1px; padding-top:1px;}
.present .cell-box02 ul {flex-wrap: wrap;}
.present .cell-box01 ul li {width:33.3333333%; height:290px;}
.present .cell-box02 ul li {width:50%; height:562px; position:relative;}
.present .cell-box ul li {border:1px solid #ddd; margin-left:-1px; margin-top:-1px; padding:30px 0 0 40px;}
.present .cell-box ul li h4 {margin-bottom:36px; line-height:1.4em; font-size:22px; font-weight:700;}
.present .cell-box ul li p {font-size:18px; line-height:1.6em; color:#505050; margin-bottom:36px;}
.present .cell-box02 ul li .box {position:absolute; top:290px; left:40px;}
.present .cell-box02 .box p {font-size:14px; color:#878787; font-weight:400;}
.present .cell-box02 .box p span {display:block; font-size:16px; line-height:1.6em; margin-bottom:20px;}
.present .txt-box p {font-size:18px; font-weight:400; line-height:1.6em;}
.present .txt-box p span {font-size:14px; color:#878787;display:block; margin-top:30px;}



.riskadmin .tit {font-size:20px; font-weight:500; line-height:1.4em; text-align:center;}
.riskadmin h3 {font-size:26px; font-weight:700; color:#2c2c2c; line-height:1.3em; position:relative; margin-bottom:38px; padding-left:25px;}
.riskadmin h3::before {content:""; width:7px; height:30px; background:#d9ad3b; position:absolute; top:3px; left:0;}
.riskadmin .cell-box {margin-bottom:40px;}
.riskadmin .cell-box ul {display:flex; padding-left:1px; padding-top:1px;}
.riskadmin .cell-box ul li {width:50%; padding:40px 0 75px 30px; border:1px solid #ddd; margin-left:-1px; margin-top:-1px;}
.riskadmin .cell-box .box {height:260px;}
.riskadmin .cell-box h4 {font-size:22px; font-weight:700; line-height:1.4em; margin-bottom:36px;}
.riskadmin .cell-box p {font-size:18px; font-weight:400; color:#505050; margin-bottom:40px;}
.riskadmin .cell-box p span {font-weight:500; margin-bottom:24px; display:block}
.riskadmin table {margin-bottom:80px;}
.riskadmin table {border-collapse:collapse; border-spacing:0; text-align:center;}
.riskadmin table thead tr th {border-top:2px solid #d9ad3b; border-bottom:1px solid #ddd; background:#fafafa;}
.riskadmin table thead tr th:last-child {border-right:0;}
.riskadmin table tbody tr th,
.riskadmin table tbody tr td {border-bottom:1px solid #ddd;}
.riskadmin table th {border-right:1px solid #ddd; padding:10px 0;}

.compliance .tit {font-size:20px; font-weight:500; line-height:1.4em; text-align:center;}
.compliance h3 {font-size:26px; font-weight:700; color:#2c2c2c; line-height:1.3em; position:relative; margin-bottom:38px; padding-left:25px;}
.compliance h3::before {content:""; width:7px; height:30px; background:#d9ad3b; position:absolute; top:3px; left:0;}
.compliance .cell-box {margin-bottom:40px;}
.compliance .cell-box ul {display:flex; padding-left:1px; padding-top:1px;}
.compliance .cell-box ul li {width:50%; padding:40px 0 75px 30px; border:1px solid #ddd; margin-left:-1px; margin-top:-1px;}
.compliance .cell-box h4 {font-size:22px; font-weight:700; line-height:1.4em; margin-bottom:36px;}
.compliance .cell-box p {font-size:18px; font-weight:400; color:#505050;}
.compliance .cell-box p span {font-size:14px; font-weight:500; margin-bottom:24px; display:block; color:#878787; margin-top:36px;}
.compliance table {margin-bottom:80px;}
.compliance table {border-collapse:collapse; border-spacing:0; text-align:center;}
.compliance table thead tr th {border-top:2px solid #d9ad3b; border-bottom:1px solid #ddd; background:#fafafa;}
.compliance table thead tr th:last-child {border-right:0;}
.compliance table tbody tr th,
.compliance table tbody tr td {border-bottom:1px solid #ddd;}
.compliance table th {border-right:1px solid #ddd;}
.compliance table td {padding:15px 0;}