@charset "utf-8";

.play {font-family: "Play", serif;}

.greetings {display: flex; align-items: flex-start;}
.greetings img {border-radius: 0 0 150px 0; margin-right: 80px;}
.greetings .play {font-size: var(--font-size-16); letter-spacing: .2em; line-height: 1.2em; color:#ababab; font-weight: 700;}
.greetings .play span {color: var(--color-primary);}
.greetings .cnt {flex:1 1 auto; min-width:0; width:1%;}
.greetings h2 {margin: 25px 0 35px; font-size: var(--font-size-36); letter-spacing: -.03em; line-height: 1.44em; color:#242424; font-weight: 600;}
.greetings h3 {margin-bottom: 30px; font-size: var(--font-size-24); letter-spacing: -.03em; line-height: 1.58em; color:#242424; font-weight: 500;}
.greetings .txt {margin-bottom: 15px; font-size: var(--font-size-16); letter-spacing: -.03em; line-height: 1.75em;}
.greetings .txt:last-child {margin-bottom: 0;}
.greetings .ceo {margin-top: 40px; font-size: var(--font-size-18); letter-spacing: -.03em; line-height: 1.2em; font-weight: 600; color: #242424;}
.greetings .ceo span {margin-left: 10px; font-size: var(--font-size-24); font-weight: 700;}

.history-tit {padding:0 0 35px 0 ;}
.history-tit h2 {font-size:var(--font-size-46); font-weight:800; line-height:1.2em; letter-spacing:0em; color:#242424;}
.history-tit h2 span {color:var(--color-primary);}
.history-tit p {margin-top:15px; font-size:var(--font-size-18); line-height:1.2em; letter-spacing:-.03em; }
.history {position:relative; padding-top:75px; border-top:1px solid #ddd;}
.history::after {content:''; position:absolute; right:0; top:-160px; width:320px; height:320px; background-image:url(/images/sub/history.png); background-repeat:no-repeat; background-size:contain;box-shadow:8.192px 5.736px 30px 0px rgba(201, 201, 201, 0.4); border-radius:100%;}
.history .wrap {display:flex;}
.history .year {width:26.3%; padding:0 50px; font-size:var(--font-size-50); font-weight:800; line-height:1.2em; letter-spacing:0em; color:#242424; }
.history .story {flex:1 1 auto; min-width:0; width:1%;}
.history .story .box {position:relative; padding:0 0 40px 60px;}
.history .story .box:last-child {padding-bottom:95px;}
.history .story .box::before {content:''; position:absolute; left:0; top:10px; width:1px; height:100%; background-color:#ccc;}
.history .story .box h3 {position:relative; margin-bottom:25px; font-size:var(--font-size-28); line-height:1.2em; letter-spacing:0em; color:#242424;}
.history .story .box h3::before {content:''; position:absolute; left:-69px; top:50%; transform:translateY(-50%); width:18px; height:18px; background-image:url(/images/sub/history-ico.png); background-repeat:no-repeat; background-size:contain;}
.history .story .box ul li {display:flex; align-items:center; margin-bottom:10px;}
.history .story .box ul li:last-child {margin-bottom:0;}
.history .story .box ul li .month {margin-right:17px; width:3%; color:var(--color-primary); font-size:var(--font-size-16); font-weight:700; line-height:1.2em; letter-spacing:0em;}
.history .story .box ul li .txt {flex:1 1 auto; min-width:0; width:1%; font-size:var(--font-size-16);  line-height:1.2em; letter-spacing:0em;}
.history .wrap:last-child .story .box:last-child:before {display:none;}

.org-img {text-align: center;}

.root_daum_roughmap .wrap_controllers,
.root_daum_roughmap .border1,
.root_daum_roughmap .border2,
.root_daum_roughmap .border3,
.root_daum_roughmap .border4 {display: none;}

.directions {display: flex; margin-top:40px;}
.directions .address-info {width: 50%; padding-left: 60px;}
.directions .address-info .comp {color:var(--color-primary); font-weight:600; margin-bottom:2px;}
.directions .address-info .addr {color:#242424; font-size:20px; font-weight:500; line-height:1.33em; letter-spacing:-.03em; margin-bottom:5px;}
.directions .address-info .etc {color:#454545;}
.directions .address-info .etc span {display:inline-block; margin-right:16px;}
.directions .address-info .etc span:last-child {margin-right:0;}
.directions .contact-info {flex:1 1 auto; min-width:0; width:1%;}
.directions .contact-info dl {display:flex; margin-bottom: 20px;}
.directions .contact-info dl:last-child {margin-bottom: 0;}
.directions .contact-info dt {display: flex; align-items: center;width:120px; color:#242424; font-size:1.125em; font-weight:500;}
.directions .contact-info dt img {margin-right: 18px;}
.directions .contact-info dt path {fill:#ae8038;}
.directions .contact-info dd {flex:1 1 auto; min-width:0; width:1%; color:#454545;}

@media (max-width: 1024px) {
	.root_daum_roughmap .wrap_map {height:300px !important;}
	.directions .address-info .addr {font-size:20px;}
	.directions .contact-info dt {width:140px;}
}

@media (max-width: 640px) {
	.root_daum_roughmap .wrap_map {height:250px !important;}	
	.directions {margin-top:30px;}
	.directions .address-info .addr {font-size:18px;}
	.directions .address-info {margin-bottom:20px;}
	.directions .contact-info dt {padding-left:5px; width:110px;}
	.directions .contact-info dt svg {margin-right:10px;}
}

.biz-imgs {margin-bottom: 90px;}
.biz-imgs ul {display: flex; margin: 0 -15px;}
.biz-imgs ul li {width: 33.33%; padding: 0 15px; text-align: center;}
.biz-imgs ul li img {border-radius: 20px;}
.biz-imgs ul li p {margin-top: 12px; font-size: var(--font-size-16); font-weight: 600; letter-spacing: -.03em; line-height: 1.2em; color: #242424;}

.sub-tabs {margin-bottom:60px;}
.sub-tabs ul {display:flex; width:100%; height:60px;}
.sub-tabs ul li {flex: 1;background-color:#fafafa;  border-top:1px solid #dddddd; border-bottom:1px solid #0072ce;}
.sub-tabs ul li:after {content:''; position:absolute; left:0; top:50%; height:30px; width:1px; margin-top:-15px; background:#ddd;}
.sub-tabs ul li:first-child:after {display:none;}
.sub-tabs ul li:first-child {border-left:1px solid #ddd; border-radius: 20px 0 0 0;}
.sub-tabs ul li:first-child.active {border-left:1px solid #0072ce;}
.sub-tabs ul li:last-child {border-right:1px solid #ddd; border-radius: 0 20px 0 0;}
.sub-tabs ul li:last-child.active {border-right:1px solid #0072ce;}
.sub-tabs ul li a {padding: 0 20px; width: 100%; height: 100%; display:inline-flex; align-items:center; justify-content:center; font-size:var(--font-size-17); font-weight:600; letter-spacing:-0.03em; line-height:1.44em; color:#878787; }
.sub-tabs ul li.active {border-radius: 20px 20px 0 0 ; border:1px solid #0072ce; border-bottom:none; background-color:#fff; color:#0072ce;}
.sub-tabs ul li.active + li:after {display:none;}
.sub-tabs ul li.active a {color: var(--color-primary); }

.quality .location-wrap {position:relative;}
.quality .location {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; z-index:-1;}
.quality .location.on {opacity:1; z-index:1; position:relative;}
.quality .tit h3 { margin-bottom:35px; font-size: var(--font-size-28); font-weight: 600; letter-spacing: -.03em; line-height: 1.2em; color: #242424;}
.quality .ceo p {display: flex; align-items: flex-end; justify-content: flex-end; font-size: var(--font-size-18); font-weight: 600; letter-spacing: -.03em; line-height: 1.2em;}
.quality .ceo p span {margin: 0 30px 0 10px; font-weight: 700; font-size: var(--font-size-24);}

.ethic .check-list {margin:0 0 90px 0;}

.management .cnt {position: relative; margin-top: -120px; padding-right: 60px;}
.management .tit {padding: 75px 0 0 60px; background-color: #fff; border-radius: 0 50px 0 0;}
.management .tit h2 {margin-bottom: 30px; position: relative; display: inline-block; padding-right: 30px; font-size: var(--font-size-56); letter-spacing: -.03em; line-height: 1em; color: #242424;}
.management .tit h2::after {content: ''; position: absolute; right: 0; bottom: 0; width: 8px; height: 8px; border-radius: 100%; background-color: var(--color-primary);}
.management .txt-box {padding:0 60px;}
.management .txt-box .txt {font-size: var(--font-size-16); letter-spacing: -.03em; line-height: 1.75em;}
.management .wrap {margin-bottom: 55px;}
.management .wrap:last-child {margin-bottom: 0;}
.management .tit2 {position: relative; margin-bottom: 30px; padding-left: 30px; font-size: var(--font-size-24); letter-spacing: -.03em; line-height: 1.2em; color: #242424;}
.management .tit2::before {content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; background-repeat: no-repeat; background-size: contain; background-image: url(/images/sub/tit-ico.png);}

.check-list {margin: 35px 0; border-radius: 20px; background-color: #fbfbfb; padding: 38px;}
.check-list li {position: relative; padding-left: 26px; margin-bottom: 15px; font-size: var(--font-size-15); font-weight: 500; letter-spacing: -.03em; line-height: 1.75em; color: #242424;}
.check-list li:last-child {margin-bottom: 0;}
.check-list li::after {content: ''; position: absolute; width: 16px; height: 16px; left: 0; top: 5px; background-image: url(/images/sub/check-ico.png) ; background-repeat: no-repeat; background-size: contain;}
.check-list.ty2 {background-color: #fff; border: 1px solid #ddd;}

.board-form table td p {font-size: var(--font-size-14); letter-spacing: -.03em; line-height: 1.2em; color: #898989; font-weight: 300;}

.customer ul {display: flex; flex-wrap: wrap; margin: -5px;}
.customer ul li {padding: 5px; width: 16.66%;}

.license ul {display: flex; flex-wrap: wrap; margin: 0 -10px -40px;}
.license ul li {width: 20%; padding: 0 10px; text-align: center; margin-bottom: 40px;}
.license ul li p {margin-top: 15px; font-size: var(--font-size-16); font-weight: 500; letter-spacing: -.03em; line-height: 1.5em; color: #242424;}

.benefits {position: relative;}
.benefits::before {content: ''; position: absolute; z-index: -1; width: 432px; height: 298px; left: 0; top: 0; background-image: url(/images/sub/biz-bg.png); background-repeat: no-repeat; background-size: contain;}
.benefits h2 {padding-top: 65px; text-align: center; font-size: var(--font-size-30); letter-spacing: -.03em; line-height: 1.4em; color: #242424; font-weight: 500;}
.benefits>p {margin: 25px 0 55px; text-align: center; font-size: var(--font-size-18); letter-spacing: -.03em; line-height: 1.67em;}
.benefits ul {display: flex; flex-wrap: wrap; margin: -20px;}
.benefits ul li {width: 33.33%; padding:20px;}
.benefits ul li .box {display: flex; justify-content: space-between; align-items: flex-start; height: 150px; border-radius: 20px; border: 1px solid #ddd; padding: 20px; background-color: #fff;}
.benefits ul li .txt p {margin: 15px 0; font-size: var(--font-size-14); font-weight: 600; letter-spacing: -.03em; line-height: 1.2em; color: var(--color-primary);}
.benefits ul li .txt h3 {font-size: var(--font-size-20); font-weight: 600; letter-spacing: -.03em; line-height: 1.2em; color: #242424;}
.benefits ul li:nth-child(even) .box {background-color: #fbfbfb;}