@charset "utf-8";

.bar-tit {text-align: center; font-size: var(--fz22); font-weight: 700; line-height: 1.4em; letter-spacing:-.03em;}
.bar-tit:after {content:''; display: block; margin: 18px auto; width: 30px; height: 2px; background:var(--color-primary);}

.prod-txt {font-size: var(--fz18); margin-bottom: 35px; text-align: center; font-weight: 500; color: #454545; letter-spacing:-.03em;}

.greeting-bnr {border-radius:30px; height: 400px; background: url('/images/sub/greeting.jpg') no-repeat 50% 50% / cover; display: flex; align-items: center; justify-content: center; padding: 0 30px;}
.greeting-bnr p {text-align: center; font-size: var(--fz20); font-weight: 700; line-height: 1.4em; letter-spacing: .7em; color: rgba(255,255,255,.4);}
.greeting {display: flex; margin-top: 65px;}
.greeting .head {display: flex; justify-content: center; width: 50%;}
.greeting h2 {font-size: var(--fz40); font-weight: 700; letter-spacing:-.03em; line-height: 1.4em;}
.greeting h2 span {color: var(--color-primary);}
.greeting .cnt {width: 50%;} 
.greeting .cnt .strong {font-size: var(--fz22); font-weight: 600; letter-spacing:-.03em; line-height: 1.55em;}
.greeting .cnt .mg-txt {margin:27px 0 48px;}
.greeting .cnt .mg-txt p {margin-bottom: 19px; font-size: var(--fz18); font-weight: 400; line-height: 1.67em; color: #454545;}
.greeting .cnt .mg-txt p:last-child {margin-bottom: 0;}
.greeting .cnt .ceo {font-size: var(--fz18); font-weight: 400; line-height: 1.67em; color: #454545;}

.history {position:relative; border-top:1px solid #000; padding-top: 70px;}
.history:before {content:''; position:absolute;left:300px; top:86px; width:1px; margin-left:-.5px; height:82%; background:#ddd;}
.history .group {display:flex; padding-bottom:130px;}
.history .group:last-child {padding-bottom:0;}
.history .year {position:relative; width:300px; padding-right:112px; text-align:right; font-size:var(--fz28); font-weight:500; line-height:1em; letter-spacing:-.03em; color:#242424;}
.history .year:before {transition:.3s; content:''; position:absolute; width:10px; height:10px; background:#fff; border-radius:100%; border:2px solid #242424; right:0; margin-right:-5px; top:8px;}
.history .cnt {flex:1 1 auto; min-width:0; width:1%;padding-left:105px;}
.history .cnt ul li {margin-bottom:12px;display:flex; font-size:var(--fz18); font-weight:400; letter-spacing:-.03em; line-height:1.4em; color:#454545;}
.history .cnt ul li:last-child {margin-bottom:0;}
.history .cnt ul li strong {min-width:56px;font-weight:600; color:#898989;}
.history .group.active .year {line-height:.5em;font-weight:600; font-size:var(--fz60);}
.history .group.active .year:before {width:100px; height:100px; right:0; margin-right:-50px; top:-38px; background:url('../images/sub/history-active.png') no-repeat 50% 50% / contain; border:none;}
.history .group.active .cnt ul li {font-weight:700; color:#242424;}
.history .group.active .cnt ul li strong {color:var(--color-primary);}

.root_daum_roughmap_landing {border-radius:20px; width:100% !important;}
.root_daum_roughmap .cont {display:none;}
.root_daum_roughmap .border1,
.root_daum_roughmap_landing .border3, 
.root_daum_roughmap_landing .border4 {display: none;}
.root_daum_roughmap .wrap_controllers {border:0 !important;}
.directions {margin-top:55px; display:flex;}
.directions .contact-info {width:51%;}
.directions .contact-info .comp {color:var(--color-primary); font-weight:600;}
.directions .contact-info .addr {margin:13px 0 8px; color:#242424; font-size:var(--fz24); font-weight:600; line-height:1.33em; letter-spacing:-.03em;}
.directions .contact-info .etc {color:#898989;}
.directions .contact-info .etc span {display:inline-block; margin-right:16px;}
.directions .contact-info .etc span:last-child {margin-right:0;}
.directions .address-info {width:49%;}
.directions .address-info dl {margin-bottom:30px; display:flex;}
.directions .address-info dl:last-child {margin-bottom:0;}
.directions .address-info dl dt {min-width:120px; font-weight:500; line-height:1.4em; letter-spacing:-.03em;}
.directions .address-info dl dt svg {vertical-align:middle; margin:-.2em 15px 0 0;}
.directions .address-info dl dt path {fill:#ababab;}
.directions .address-info dd {line-height:1.4em; color: #454545;}

.prod-list ul {display: flex; flex-wrap:wrap; margin: -20px;}
.prod-list ul li {width: 33.333%; padding: 20px;}
.prod-list ul li.w25 {width: 25%;}
.prod-list.col-2 ul li {width: 50%;}
.prod-list.type2 ul {margin: -10px;}
.prod-list.type2 ul li {padding: 10px;}

