@charset "utf-8";

.sub-tits {margin-bottom:15px;}
.sub-tits h3 {font-size:24px; font-weight:600; letter-spacing:-.03em; line-height:1.167em;}

.doc-tit {width:100%; max-width:1200px; margin:0 auto; margin-bottom:40px; text-align:left;}
.doc-tit.mg {margin-bottom:20px;}
.doc-tit h3 {position:relative; padding-left:40px; font-size:24px; font-weight:700; letter-spacing:-.04em; line-height:1.250em;}
.doc-tit h3:before {position:absolute; content:""; width:30px; height:30px; background:url("../images/sub/doc-tit.png")50% 50% no-repeat; background-size:contain; top:50%; margin-top:-15px; left:0;}

.table01 {width:100%; border-collapse:collapse; border-spacing:0px; border-top:1px solid #a8a8a8;}
.table01 td {padding:15px 15px; border:1px solid #dfdfdf; border-top:0; font-size:16px; color:#505050;}
.table01 tr th:first-child,
.table01 tr td:first-child {border-left:0;}
.table01 tr th:last-child,
.table01 tr td:last-child {border-right:0;}

.greetings {display:flex;}
.greetings .img {width:41%;}
.greetings .txt-box {width:59%;}
.greetings .txt-box h3 {font-size:30px; font-weight:400; color:#000; letter-spacing:0; line-height:1.200em; margin-bottom:40px;}
.greetings .txt-box .txt {line-height:2.250em; margin-bottom:40px;}
.greetings .txt-box .bold {font-size:18px; font-weight:500; letter-spacing:0; line-height:1.3em; margin-top:40px;}


.historys {text-align:center;}
.history-bg {width:100%; max-width:320px; margin:0 auto; height:70px;}
.history-bg .tit {font-size:20px; color:#fff; letter-spacing:0.4em; margin-bottom:40px;}
.history-bg h3 {font-size:30px; color:#fff; font-weight:700; letter-spacing:0; line-height:70px;}

.history {position:relative;}
.history:before {content:""; position:absolute; top:0; height:100%; left:50%; bottom:0; width:2px; background:#ddd;}
.history .logo img {border-radius:50%;}
.history .group {position:relative; padding-bottom:20px;}
/* .history .group:before {content:""; position:absolute; top:0; height:100%; left:50%; bottom:0; width:1px; background:#ddd;} */
.history .group:last-child:before {display:none;}
.history .group .inner {position:relative;}
.history .group .bullet:after {position:absolute; content:""; width:26px; height:26px; top:30px; margin-top:-13px; left:50%; margin-left:-13px; background:url("../images/sub/dots.png")50% 50% no-repeat; background-size:contain;}
.history .group h3 {position:relative; color:#103a85; letter-spacing:-.025em; font-size:30px; line-height:1.3em; font-weight:700; margin-bottom:15px; text-align:left;}
.history .group:nth-child(even) h3:before {position:absolute; content:""; bottom:-30px; left:-59px; width:12px; height:12px; background:url('../images/sub/his-dot.png')50% 50% no-repeat; background-size:contain;}
.history .group:nth-child(odd) h3:before {position:absolute; content:""; bottom:-30px; right:-61px; width:12px; height:12px; background:url('../images/sub/his-dot.png')50% 50% no-repeat; background-size:contain;}
.history .group ul li {position:relative; color:#505050; font-size:16px; font-weight:400; line-height:1.875em; letter-spacing:-.02em;}
.history .group ul li .day {font-size:18px; color:#000; position:absolute; top:0; font-weight:500;}
.history .group:last-child {padding-bottom:0;}
.history .group:nth-child(odd) h3 {text-align:right; padding-right:70px;}
.history .group:nth-child(even) .inner {margin-left:50%; padding-left:54px;}
.history .group:nth-child(even) .bullet:after {left:0;}
.history .group:nth-child(even) .bullet:before {left:0;}
.history .group:nth-child(even) ul li {padding-left:75px;}
.history .group:nth-child(even) ul li .day {left:0;}
.history .group:nth-child(even) p {text-align:left;}
.history .group:nth-child(odd) {text-align:right;}
.history .group:nth-child(odd) .inner {margin-right:50%; padding-right:54px;}
.history .group:nth-child(odd) .bullet:after {left:100%;}
.history .group:nth-child(odd) .bullet:before {right:0}
.history .group:nth-child(odd) ul li {padding-right:75px;}
.history .group:nth-child(odd) ul li .day {right:0;}
.history .group .sb {font-size:16px; color:#878787;}

.root_daum_roughmap {width:100% !important; height:400px !important;}
.root_daum_roughmap .wrap_map {height:400px !important;}

.map .img {text-align:center;}
.map .img img {width:100%;}
.map .txt-box {margin-bottom:100px;}
.map .txt-box .tit {font-weight:500; color:#050051; margin-top:20px;}
.map .txt-box .txt span {padding:0 10px;}

.product .item-list {position:relative; display:flex; align-items:center; border:2px solid #ddd; margin-bottom:15px; padding:30px 0;}
.product .item-list:hover {border-color:#2551a8}
.product .item-list:hover .btn {background:#2551a8;}
.product .item-list .img {width:16%; text-align:center; position:relative; padding-bottom:16%; overflow:hidden; margin:0 40px;}
.product .item-list .img img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:contain;}
.product .txt-box {border-left:1px solid #ddd; padding-left:40px;}
.product .txt-box dl {display:flex; margin-bottom:7px;} 
.product .txt-box dl dt.spacing {letter-spacing:0.07em;}
.product .txt-box dl dt {width:100px; font-size:18px; font-weight:700; letter-spacing:0; color:#000;}
.product .txt-box dl dd {font-size:18px; letter-spacing:0; color:#555; font-weight:500; padding-left:10px;}
.product .txt-box dl ul li {font-size:18px; letter-spacing:0; color:#555; font-weight:500;}
.product .txt-box .btn {position:absolute; bottom:40px; right:30px; font-size:18px; border-radius:5px; letter-spacing:0; font-weight:500; display:flex; align-items:center; justify-content:center; width:137px; height:44px; line-height:44px; color:#fff; background:#999;}
.product .txt-box .btn img {vertical-align:inherit; margin-right:5px;}

.port-lists {display:flex; border: 1px solid #ddd;}
.port-lists .port-list {padding:20px;}
.port-lists .txt-inner {width:44%;}
.port-lists .txts-box {width:56%; padding:30px; padding-left:50px; border-left:1px solid #ddd; }
.port-lists .txts-box .tit {font-size:24px; letter-spacing:0; font-weight:700; line-height:1.0em;} 
.port-lists .txts-box .txt {font-size:18px; letter-spacing:0; line-height:1.0em; padding:20px 0 15px;} 
.port-lists .txts-box ul li {font-size:18px; color:#888; letter-spacing:0; line-height:1.444em;}
.port-lists .slick-slide img {margin:0 auto;}
.port {width:44%; padding:30px 35px;}
.port .slick-slide {padding:0 10px;}
.port .slick-slider {margin:0 -10px;}
.port .thumb {text-align:center; position:relative; padding-bottom:74.45%; overflow:hidden;}
.port .thumb:hover:before {position:absolute; content:""; border:1px solid #217dd2; width:100%; height:100%; top:0; left:0; z-index:9;}
.port .thumb img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:contain;}
.port .slick-arrow {transition:.2s linear; position:absolute; top:50%; margin-top:-13.5px; width:17px; height:27px; border:none; overflow:hidden; text-indent:-999em; background-color:transparent; background-position:50% 50%; background-repeat:no-repeat; z-index:50; background-size:contain;}
.port .slick-prev {left:-30px; background-image:url("../images/sub/sub-prev.png");}
.port .slick-next {right:-30px; background-image:url("../images/sub/sub-next.png");}

.port-lists .btn-flexs {display:flex; margin-top:60px; justify-content: flex-end;}
.port-lists .btn-flexs a {font-size:18px; font-weight:500; letter-spacing:0; color:#217dd2; display:flex; align-items:center; justify-content:center; height:52px; line-height:50px; text-align:center; border:1px solid #217dd2; margin-left:30px; width:182px;}
.port-lists .btn-flexs a img {vertical-align:text-top; margin-right:8px;}
.port-lists .btn-flexs a.btns {background:#217dd2; color:#fff;}

.inquirys h4 {font-size:18px; font-weight:500; letter-spacing:0; line-height:1.3em; padding:0 0 30px 40px;}
.inquirys h4 span {margin-right:15px;}
.inquirys h4 span img {vertical-align: middle;}

.product-more {margin-top:100px;}
.product-more .mores {border-bottom:2px solid #333;}
.product-more .mores h4 {font-size:20px; font-weight:500; position:relative; display:inline-block; height:55px; line-height:55px; border:2px solid #333; padding:0 50px;}
.product-more .mores h4:before {position:absolute; content:""; bottom:-4px; left:0; height:4px; width:100%; background:#fff;}



#lnb .submenu {display:none; position:absolute; width:280px; top:0; right:-280px;}
#lnb .submenu li.active a {background:#fff; color:#333;}
#lnb .submenu li:hover a {background:#050051; color:#fff; border:1px solid #050051;}
#lnb .submenu li:hover a:after {background-image:url('../images/common/lnb-arrow_on.png');}
#lnb .submenu li a {background:#fff; color:#333; border:1px solid #ddd; border-top:0; border-left:0;}
#lnb .submenu li:first-child a {border-top:1px solid #ddd;}
#lnb .submenu li a:after {background-image:url('../images/common/lnb-arrow.png');}
#lnb .submenu.depth2 li a {background:#fff; color:#333; border:1px solid #ddd; border-top:0; border-left:0;}
#lnb .submenu.depth2 li:first-child a {border-top:1px solid #ddd;}
#lnb .submenu.depth2 li:nth-child(n+5) a {border-left:1px solid #ddd;}
#lnb .submenu.depth2 li a:after {background-image:url('../images/common/lnb-arrow.png');}
#lnb .submenu.depth2 li:hover a {background:#050051; color:#fff; border:1px solid #050051;}
#lnb .submenu.depth2 li:hover a:after {background-image:url('../images/common/lnb-arrow_on.png');}