@charset "utf-8";

#sub #footer {border-top:1px solid #ddd;}
/* sub-visual  */
.sub-visual {height:640px; width:100%; max-width:1760px; margin:0 auto; background-repeat:no-repeat; background-size:cover; background-position:center center; border-radius:0 0 40px 40px;}
.sub-visual .txt-box {height:calc(100% - 110px); display:flex; align-items:center; justify-content:center; align-items:center; padding-top:120px;}
.sub-visual03 .txt-box {height:100%;}
.sub-visual04 .txt-box {height:100%;}
.sub-visual05 .txt-box {height:100%;}
.sub-visual .txt-box h2 {font-size:62px; line-height:1.3em; color:#fff; font-weight:600;}
.lnb {border-top:1px solid rgba(255,255,255,0.3); padding:0 80px;}
.lnb ul {display:flex;}
.lnb ul li {width:100%; height:110px;}
.lnb ul li a {display:flex; height:100%; align-items:center; justify-content:center; padding:20px; font-size:20px; line-height:1.6em; color:#fff; font-weight:600; position:relative;}
.lnb ul li a:after {content:''; width:0; height:3px; background:#ddd; position:absolute; top:-1px; left:50%; opacity:0; transition:all 0.4s;}
.lnb ul li.active a:after {width:100%; left:0; opacity:1;}
.lnb ul li a:hover:after {width:100%; left:0; opacity:1;}
/* sub common */
.real-cont {padding:160px 0 180px;}

.sub-title {margin-bottom:76px;}
.sub-title h3 {font-size:55px; line-height:1.4em; color:#000; font-weight:600; display:inline-block; padding-right:18px; position:relative;}
.sub-title h3:after {content:''; width:8px; height:8px; background:#0c4da2; border-radius:50%; position:absolute; top:14px; right:0;}
/* sub 01 01 */
.outline {margin-bottom:180px; position:relative; overflow:hidden;}
.outline .col {display:flex; align-items:center; margin:0 -40px 80px;}
.outline .col:last-child {margin-bottom:0;}
.outline .col:nth-child(even) {flex-direction:row-reverse;}
.outline .col > div {width:50%; padding:0 40px;}
.outline .col .img-box img {border-radius:20px; overflow:hidden;}
.outline .txt {padding-left:100px;}
.outline .txt .icon {margin-bottom:46px;}
.outline .txt p {font-size:23px; line-height:1.4em; color:#333;}

.history .img-box {margin-bottom:90px;}
.history .img-box img {border-radius:20px; overflow:hidden;}
.history .col {display:flex;}
.history .col .year {width:100%; max-width:550px; position:relative;}
.history .col .year .tit {position:sticky; top:200px; left:0; width:100%; padding:0 80px;}
.history .col .year p {font-size:32px; line-height:1.4em; color:#000; font-weight:600; margin-bottom:12px;}
.history .col .year h4 {font-size:90px; color:#0c4da2; font-weight:700; font-family:'Montserrat'; line-height:1.1em;}
.history .col .cnt {width:1%; flex:1 1 auto; border-left:1px solid #ddd; position:relative; padding-bottom:260px;}
.history .col .cnt .txt-box {padding:64px 70px; border-top:1px solid #ddd; position:relative;}
.history .col .cnt .txt-box:before {content:''; width:40px; height:80px; background:#fff; position:absolute; top:-40px; left:-1px;}
.history .col .cnt .txt-box:after {content:''; width:18px; height:18px; background:url('../img/sub/history-icon.png'); position:absolute; top:-9px; left:-9px;}
.history .col .cnt .txt-box .m-year {display:none;}
.history .col .cnt .txt {display:flex; margin-bottom:34px;}
.history .col .cnt .txt:last-child {margin-bottom:0;}
.history .col .cnt .txt .month {width:100%; max-width:80px; font-size:18px; line-height:1.7em; color:#000; font-weight:600;}
.history .col .cnt .txt ul {width:1%; flex:1 1 auto;}
.history .col .cnt .txt ul li {font-size:18px; line-height:1.7em; color:#666;}
/* sub 01 02 */
.greeting .img-box {margin-bottom:90px; background:url('../img/sub/greeting-bg.jpg') center center no-repeat; border-radius:20px; height:400px; padding:20px 90px; display:flex; flex-direction:column; justify-content:center; position:relative;}
.greeting .img-box p {font-size:20px; line-height:1.6em; color:#0c4da2; margin-bottom:12px; font-weight:700;}
.greeting .img-box h4 {font-size:40px; line-height:1.5em; color:#000; font-weight:400; position:relative; z-index:10;}
.greeting .img-box h4 strong {font-weight:600;}
.greeting .img-box h4 span {color:#0c4da2;}
.greeting .img-box .img {position:absolute; top:12px; right:80px; width:320px;}
.greeting .txt-box {padding:0 90px;}
.greeting .txt-box p {font-size:18px; line-height:1.7em; color:#666; margin-bottom:42px;}
.greeting .txt-box p:last-child {margin-bottom:0;}
.greeting .txt-box p span {font-size:24px;}
.greeting .txt-box p strong {font-weight:600;}


/* sub 02 */
.product {position:relative; overflow:hidden;}
.product .real-cont {padding-bottom:0;}
.product .col {display:flex;}
.product .sub-title {width:100%; max-width:430px; margin-bottom:0;}
.product .sub-title p {font-size:18px; line-height:1.7em; color:#666;}
.product .txt-box {width:1%; flex:1 1 auto; padding-top:6px;}
.product .txt-box .line {padding-bottom:60px; margin-bottom:60px; border-bottom:1px dashed #ddd;}
.product .txt-box .tit p {font-size:23px; line-height:1.6em; color:#333; margin-bottom:40px;}
.product .txt-box .tit p:last-child {margin-bottom:0;}
.product .txt-box .tit p strong {font-weight:600;}
.product .txt-box .txt h4 {font-size:40px; line-height:1.1em; color:#000; font-weight:600; margin-bottom:30px;}
.product .txt-box .txt li {font-size:18px; line-height:1.7em; color:#666; position:relative; padding-left:14px;}
.product .txt-box .txt li:before {content:''; width:4px; height:4px; background:#0c4da2; position:absolute; top:12px; left:0; border-radius:50%;}
.product .txt-box .txt li strong {font-weight:600; color:#333;}
.product .img-box {max-width:1790px; width:100%; margin:110px auto 180px; padding:0 15px;}
.product .img-box .imgs {display:flex; margin:0 -8px;}
.product .img-box .img {width:50%; padding:0 8px;}
.product .img-box .img img {border-radius:20px; overflow:hidden;}
.product .wrap {padding:160px 0 180px; background:#f8f8f8; position:relative; z-index:11;}
.product .wrap .col {margin-bottom:120px;}
.product .track {transform:translateX(-540px); width:100%;}
.product .items {position:relative; display:flex; width:fit-content; width:max-content; animation:scroll-left 25s linear infinite; margin:0 -10px;}
.product .items:hover {animation-play-state:paused;}
@keyframes scroll-left {0% {transform: translateX(0);} 100% {transform:translateX(-50%);}}
.product .item {flex:0 0 auto; margin:0 10px; position:relative; padding:25px 0; animation-duration:8s; animation-timing-function:linear; animation-iteration-count:infinite; position:relative;}
.product .items:hover .item {animation-play-state:paused;}
.product .item:nth-child(odd) {animation-name:move-x;}
.product .item:nth-child(even) {animation-name:move-x-re;}
@keyframes move-x {0%,100% {transform:translateY(25px);} 50% {transform:translateY(-25px);}}
@keyframes move-x-re {0%,100% {transform:translateY(-25px);} 50% {transform:translateY(25px);}}
.product .item .img {position:relative; border-radius:20px; overflow:hidden;}
.product .item .img p {position:absolute; bottom:50px; left:50px; font-size:26px; line-height:1.4em; color:#fff; font-weight:600;}
/* sub 03 */
.recruitment .cnt {padding:160px 0 180px;}
.recruitment .wrap {display:flex;}
.recruitment .sub-title {width:100%; max-width:430px; margin-bottom:0;}
.recruitment .txt-box {width:1%; flex:1 1 auto; padding-top:14px;}
.recruitment .cnt01 .col {display:flex; margin:0 -8px -46px; flex-wrap:wrap;}
.recruitment .cnt01 .col .row {width:33.33333%; padding:0 8px; margin-bottom:46px;}
.recruitment .cnt01 .inner {text-align:center;}
.recruitment .cnt01 .inner .img img {border-radius:20px; overflow:hidden;}
.recruitment .cnt01 .inner p {font-size:18px; line-height:1.7em; color:#666; padding:0 10px; margin-top:26px;}
.recruitment .cnt02 {background:#f8f8f8;}
.recruitment .cnt02 .box {padding-bottom:60px; margin-bottom:60px; border-bottom:1px dashed #ddd;}
.recruitment .cnt02 .box:last-child {margin-bottom:0; padding-bottom:0; border-bottom:0;}
.recruitment .cnt02 .tit {margin-bottom:46px;}
.recruitment .cnt02 .tit h4 {font-size:40px; line-height:1.1em; color:#000; font-weight:600; margin-bottom:12px;}
.recruitment .cnt02 .tit p {font-size:23px; line-height:1.4em; color:#666;}
.recruitment .cnt02 .col {display:flex; flex-wrap:wrap; margin:0 -5px -10px;}
.recruitment .cnt02 .col .row {width:25%; padding:0 5px; margin-bottom:10px;}
.recruitment .cnt02 .inner {background:#fff; border-radius:20px; padding:60px 20px; text-align:center;}
.recruitment .cnt02 .inner .icon {margin-bottom:36px;}
.recruitment .cnt02 .inner p {font-size:18px; line-height:1.7em; color:#666;}
.recruitment .cnt03 .col {display:flex; justify-content:space-between;}
.recruitment .cnt03 .col .row {position:relative;}
.recruitment .cnt03 .col .row:after {content:''; width:32px; height:32px; background:url('../img/sub/recruitment03-arrow.png') no-repeat; background-size:cover; position:absolute; top:50%; margin-top:-16px; right:-25px; z-index:1;}
.recruitment .cnt03 .col .row:last-child:after {display:none;}
.recruitment .cnt03 .inner {width:180px; height:180px; background:#f8f8f8; border-radius:50%; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center;}
.recruitment .cnt03 .inner p {font-size:16px; line-height:1.4em; color:#0c4da2; font-weight:500; margin-bottom:2px;}
.recruitment .cnt03 .inner h4 {font-size:23px; line-height:1.2em; color:#333; font-weight:600;}
/* sub 05 */
.directions .maps {border-radius:20px; overflow:hidden; margin-bottom:50px;}
.directions .root_daum_roughmap {width:100% !important; height:460px !important;}
.directions .root_daum_roughmap .wrap_map {height:460px !important;}
.directions .root_daum_roughmap .map_border {border:0 !important; width:0 !important; height:0 !important;}
.directions .txt-box {position:relative; padding-left:20px; padding-right:580px;}
.directions .txt-box .btn {position:absolute; top:0; right:0;}
.directions .txt-box .btn ul {display:flex; margin:0 -5px;}
.directions .txt-box .btn ul li {padding:0 5px;}
.directions .txt-box .btn ul li a {display:block; width:180px; line-height:55px; padding:0 20px; transition:all 0.4s; color:#fff; font-size:18px; border-radius:10px; position:relative;}
.directions .txt-box .btn ul li a:hover {padding:0 20px;}
.directions .txt-box .btn ul li a.naver {background:#4ab752;}
.directions .txt-box .btn ul li a.google {background:#e84437;}
.directions .txt-box .btn ul li a.print {background:#0c4da2;}
.directions .txt-box .btn ul li a:after {content:''; width:8px; height:12px; background:url('../img/sub/directions-more.png') no-repeat; position:absolute; top:50%; margin-top:-6px; right:25px; transition:all 0.4s;}
.directions .txt-box .btn ul li a:hover:after {right:20px;}



.directions .txt-box dl {display:flex; font-size:18px; line-height:1.7em;}
.directions .txt-box dt {width:100%; max-width:50px; color:#000; font-weight:600;}
.directions .txt-box dd {width:1%; flex:1 1 auto; color:#666;}
.directions .txt-box dd a {display:inline-block;}