@charset "utf-8";

.play {font-family: "Play", serif;}

.about {display: flex;}
.about .img {width: 49%;}
.about .txt-box {margin-left: 75px; padding-top: 25px; flex:1 1 auto; min-width:0; width:1%;}
.about .txt-box h2 {position: relative; padding-bottom: 30px; font-size: var(--font-size-38); letter-spacing: -.03em; line-height: 1.47em; color: #242424;}
.about .txt-box h2 span {color: var(--color-primary);}
.about .txt-box h2::after {content: ''; position: absolute; left: 0; bottom: 0; width: 75px; height: 2px; background-color: #ddd;}
.about .txt-box p {margin-top: 30px; font-size: var(--font-size-16); letter-spacing: -.03em; line-height: 1.63em;}
.about .txt-box .ceo {margin-top: 55px; font-size: var(--font-size-16); font-weight: 500; letter-spacing: -.03em; line-height: 1.2em; color: #242424;}
.about .txt-box .ceo span {font-weight: 700; font-size: var(--font-size-18); margin-left: 5px;}


.business {position: relative;}
.business .img {text-align: center;}
.business .items {position: relative; margin-top: -80px; display: flex; width: 100%; justify-content: center;}
.business .item {width: clamp(200px, calc( 270 / var(--inner) * 100vw ), 270px); height: clamp(200px, calc( 270 / var(--inner) * 100vw ), 270px); margin: 0 -10px;}
.business .item .box {display: flex; align-items: center; justify-content: center; flex-direction: column; box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.1); height: 100%; width: 100%;border-radius: 100%;}
.business .item:nth-child(1) .box { background-color: #5698ed; }
.business .item:nth-child(2) .box { background-color: var(--color-primary); }
.business .item:nth-child(3) .box { background-color: var(--color-secondary); }
.business .item .box p {color: #fff;}
.business .item .box .play {font-size: var(--font-size-16); letter-spacing: -.03em; line-height: 1.2em; font-weight: 700; opacity: .6;}
.business .item .box .txt {margin-top: 10px; font-size: var(--font-size-26); letter-spacing: -.03em; line-height: 1.2em; font-weight: 700;}
.business>p {font-size: var(--font-size-16); letter-spacing: -.03em; line-height: 1.5em; text-align: center;}
.business>p span {color: #242424; font-weight: 600;}
.business .tt1 {margin: 55px 0 25px;}

.root_daum_roughmap {border-radius: 24px; width: 100% !important;}
.root_daum_roughmap .wrap_controllers,
.root_daum_roughmap .border1,
.root_daum_roughmap .border2,
.root_daum_roughmap .border3,
.root_daum_roughmap .border4 {display: none;}

.directions {margin-top:40px;}
.directions .address-info {margin-bottom:30px;}
.directions .address-info .comp {color:var(--color-primary); font-weight:600; margin-bottom:2px;}
.directions .address-info .addr {color:#242424; font-size:23px; font-weight:600; 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 {border-top:1px solid #ddd; line-height:1.5em;}
.directions .contact-info dl {display:flex; padding:28px 0; border-bottom:1px solid #ddd;}
.directions .contact-info dt {width:180px; padding-left:30px; color:#242424; font-size:1.125em; font-weight:500;}
.directions .contact-info dt svg {vertical-align:middle; margin:-.2em 15px 0 0;}
.directions .contact-info dt path {fill:var(--color-primary); opacity: .5;}
.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 dl {padding:20px 0;}
	.directions .contact-info dt {padding-left:20px; 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 dl {padding:16px 0;}
	.directions .contact-info dt {padding-left:5px; width:110px;}
	.directions .contact-info dt svg {margin-right:10px;}
}

.manufacture {margin-bottom: 60px; padding-bottom: 60px; border-bottom: 1px solid #ddd;}
.manufacture .btn {text-align: center;}
.manufacture .btn a {display: inline-flex; align-items: center; justify-content: space-between; font-size: var(--font-size-15); font-weight: 500; letter-spacing: -.03em;color: #fff; padding: 0 35px; width: 200px; height: 45px; background-color: var(--color-primary); border-radius: 23px; }
.manufacture>p {text-align: center; margin-top: 20px; font-size: var(--font-size-15); letter-spacing: -.03em; line-height: 1.2em; color: #606060;}