@charset "utf-8";
@import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css');

.mobile {display:none;}
.summary .img {display:flex; justify-content: center; align-items: center; height: 240px; background-color: #fef8f8; padding: 20px;}
.summary .con {margin-top: 40px;}
.summary .con table {width:100%; border-collapse:collapse; border-top:2px solid #db2128;}
.summary .con tr {font-size:16px; line-height:1.4em; border-bottom:1px solid #ddd;}
.summary .con th {position: relative; font-weight: 500; color:#242424; text-align:start; padding:13.5px;}
.summary .con th:before {content:""; position:absolute; top:50%; left:0px; transform:translate(0,-50%;) width:5px; height: 5px; background-color: #db2128; opacity: 0.2;}
.summary .con td {font-weight: 400; color:#454545; padding:13.5px;}

.doc-tit h3 { padding-bottom: 25px; padding-left: 30px; position: relative; font-size:24px; line-height:1.25em; font-weight: 500; color:#242424; letter-spacing: 0;}
.doc-tit h3:before {content:""; position: absolute; width: 22px; height: 22px; background:url(../images/sub/mark.png); top:5px; left:0;}

.Business_area_list {margin-top: 23px;}
.Business_area_img {display:flex; justify-content: center; align-items: center; padding: 0 20px; margin: 50px 0 80px 0;}
.Business_area_list ul {display:flex; flex-wrap:wrap;}
.Business_area_list ul li {width:25%; text-align:center; }
.Business_area_list .text {justify-content: center; display:flex; font-size:16px; line-height:1.75em; font-weight: 400; color:#454545;}
.Business_area_list h4 {font-size:18px; line-height:1.4em; font-weight: 500; color:#242424; margin:23px 0 6px 0;}

.doc-txt {margin-left:30px; padding: 22px 30px; background-color: #f8f8f8; margin-bottom: 54px; border:1px solid #eee; border-radius:7px;}
.doc-txt p {padding-bottom:17px; font-size:16px; line-height:1.75em; font-weight: 400; color:#454545; letter-spacing: 0;}
.doc-txt p:last-child {padding-bottom: 0;}

.SI ul {padding-left: 30px; display:flex; flex-wrap:wrap; margin: -10px;}
.SI ul li {width:33.3333%; padding: 10px;}
.SI ul li p {margin: 20px 0 34px 0; font-size:18px; line-height:1.389em; font-weight: 500; color:#242424; text-align:center; letter-spacing: 0;}

.list ul {display:flex; flex-wrap:wrap; padding-left: 30px; margin: -10px;}
.list ul li {width:33.3333%; text-align:center;  padding: 10px;}
.list ul li h4 {font-size:18px; line-height:1.389em; font-weight:500; color:#242424; text-align:center; margin-top: 20px; letter-spacing: 0;}
.list ul li p {font-size:16px; line-height:1.563em; font-weight:400; color:#242424; text-align:center; margin-top: 10px; letter-spacing: 0;}

.system {position: relative; margin-bottom: 80px;}
.system ul {display:flex; flex-wrap:wrap; margin:-10px -20px;}
.system ul li {width:50%; padding: 10px 20px;}
.system .box {border:1px solid #ddd; height: 110px; display:flex; justify-content: center; align-items: center;}
.system .circle {position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); width: 130px; height: 130px; background-color: #db2128; border-radius:50%;}
.system .circle p {position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:25px; line-height:1.4em; font-weight: 500; color: #fff; letter-spacing: -0.03em;}

.system-list .con {display:Flex; margin-bottom: 40px;}
.system-list .con:last-child {margin-bottom: 0;}
.system-list .img {width:44.16%;}
.system-list .text {border:1px solid #ddd; padding-left: 50px; display:flex;flex:1; flex-direction: column; justify-content: center;}
.system-list .text h3 {font-size:24px; line-height:1.25em; font-weight:500; color:#242424; letter-spacing: -0.03em; margin-bottom: 20px;}
.system-list .text li {font-size:16px; line-height:1.4em; font-weight:400; color:#454545; letter-spacing: -0.03em; margin-bottom: 8px;}

.massage_img {display:flex; justify-content: center; align-items: center; padding: 30px 20px 40px 20px; border:1px solid #ddd; border-radius:7px; margin-bottom: 50px; margin-left: 33px;}
.massage_list ul{display:flex;}
.massage_list ul li {width :25%; display:flex; flex-direction: column; align-items: center;}
.massage_list .circle {margin-bottom: 23px; width:188px; height:188px; background-color: #dd2827; border-radius:50%; display:flex; justify-content: center; align-items: center;}
.massage_list .circle h4 {font-size:20px; line-height:1.5em; font-weight:500; color:#fff; text-align:center;}
.massage_list .text {padding: 0 30px; text-align:center;}

.contact .map {margin-bottom: 40px;}
.contact .box {border-radius:8px; text-align:center; max-width:1000px; padding:40px 0; margin:auto; background: linear-gradient(90deg, #db2128, #f47621); margin-top: -50px; z-index: 10;}
.contact .con, .contact .row {display:flex; justify-content: center;}
.contact .con p {font-size:18px; line-height:1.4em; font-weight:400; color:#fff; letter-spacing: -0.03em; margin-left: 8px;}
.contact .fax {margin-left: 80px;}
.contact .address {margin-bottom: 10px;}
.root_daum_roughmap{z-index: -1;}

.contact .transport .tit {display:flex; margin-bottom: 17px;}
.contact .transport h3 {margin-left: 6px;font-size:18px; line-height:1.4em; font-weight:500; color:#242424; letter-spacing: -0.03em;}
.contact .transport .tt {margin-left: 40px;}
.contact .transport .tt .station {display:flex; margin-bottom: 5px;}
.contact .transport .tt .station p {font-size:16px;}
.contact .transport .tt .station .num {position: relative; color:#fff; font-weight: 500; margin-right: 14px;}
.contact .transport .tt .station .num:before {content:""; position: absolute; top:4px; left:-10px; background-color: #9d34a7; width:55px; height: 22px; z-index:-1; border-radius:30px;}
.contact .transport .tt .station .num9:before {background-color: #d6af27;}
.contact .transport .tt .station span {color:#f16022; font-weight:300;}
.contact .transport .tt .station strong {font-weight: 500;}

.contact .transport1 {padding-bottom: 17px; border-bottom:1px solid #ddd;}
.contact .transport2 {margin-top: 25px;}
.contact .transport .bus {display:flex;}
.contact .transport .bus .left {width:25.83%; padding: 0 40px 0 30px;}
.contact .transport .bus .left p {position: relative; font-size:16px; line-height:1.5em; font-weight:400; color:#454545;}
.contact .transport .bus .left p:before {content:""; position: absolute; top:8px; right:-17px; width: 19px; height: 11px; background: url(../images/sub/arrow.png);}
.contact .transport .bus .left span { font-weight:500;}
.contact .transport .bus .right {width:64.17%; display:flex; flex-wrap:wrap; margin-top: -3px;}
.contact .transport .bus .right p {position: relative; width:calc(50% - 45px); margin-bottom: 4px;}
.contact .transport .bus .right p:before {content:""; position: absolute; top:4px; left:-8px; width:45px; height:22px; z-index:-1; border-radius:5px;}
.contact .transport .bus .right .blue:before {background-color: #4e73dc;}
.contact .transport .bus .right .green:before {background-color: #6fc241}
.contact .transport .bus .right .blown:before {background-color: #937326;}
.contact .transport .bus .right .mint:before {background-color: #23b0b2;}
.contact .transport .bus .right .orange:before {background-color: #e67112;}
.contact .transport .bus .right span {color:#fff; margin-right: 15px;}
.contact .transport .bus2 {margin-top: 22px;}
