@charset "utf-8";
@import url("common.css");
.visual.loex {background:url('../imgs/vis/vis_loex.jpg') no-repeat left 60%; background-size:cover;}
.visual.business {background:url('../imgs/vis/vis_business.jpg') no-repeat left center; background-size:cover;}
.visual.support {background:url('../imgs/vis/vis_support.jpg') no-repeat left center; background-size:cover;}

/* 소개 */
.about01 {position: relative;}
.about {width:100%; padding:0 5rem 38rem; margin:0 0 9rem; position:relative;}
.about:after {content:""; width:100%; height:100%; position:absolute; left:0; top:0; background:url('../imgs/bg/bg_dongwon.png') no-repeat center bottom; background-size:70%; opacity:0;}
.about:before {content:""; width:27.6rem; height:28.8rem; position:absolute; left:50%; bottom:9.5rem; margin-left:-13.8rem; background:url('../imgs/bg/bg_about.png') no-repeat center bottom; background-size:100%; opacity:0; transform:translateX(-50px);}
.about > span {margin-top:4.6rem; display:block;}
.about > span + strong {margin-top:calc(1rem - 3px); display:block; font-family:'NotokrB';}
.about01 .file_btn {position: absolute; top: 72px; right: 60px; color: #ffffff; text-align: center; }
.about01 .file_btn a {display: block; color: #ffffff;font-size: 14px;width: 214px; height: 50px; line-height: 50px; background-color: #005cb9;;margin:0 auto;}
.about01 .file_btn a + a{margin-top:10px;}

.about.action:after {transition:all 2s .5s; opacity:1;}
.about.action:before {transition:all 2s 1s; transform:translateX(0); opacity:1;}

.about02, .accounts {width:100%; padding:3.5rem 5rem 10rem;}
.vision {text-align:center; margin-top:10rem;}
.vision strong {display:inline-block; margin:0 auto; position:relative; line-height:100%;}
.vision strong > span {font-size:12.5rem; font-family:'RobotoBl'; float:left; line-height:100%; transform:rotateY(90deg); opacity:0;}
.vision strong > span:nth-of-type(1) {color:#0099e8;}
.vision strong > span:nth-of-type(2) {color:#ffe200;}
.vision strong > span:nth-of-type(3), .vision strong > span:nth-of-type(4) {color:#005cb9;}
.vision strong > span + span {margin-left:-.4rem;}
.vision strong > span:last-child {font-size:1.5rem; font-family:'RobotoB'; position:absolute; left:8rem; top:50%; margin:-.75rem 0 0;}
.vision > div {width:26.7rem; border-top:1px solid #ccc; border-bottom:1px solid #ccc; margin:-.6rem auto 0; padding:1.5rem 1rem; overflow:hidden; display:flex; justify-content:space-between; opacity:0;}
.vision > div span {display:inline-block; font-size:1.5rem; font-family:'NotokrM';}
.vision strong > span.on {transition:all 2s .5s; transform:rotateY(0); opacity:1;}
.vision > div.on {opacity:1; transition:all 2s 2.5s;}
.plan {width:calc(100% + 10rem); height:23rem; margin:10rem -5rem 0; position:relative; overflow:hidden;}
.plan ol {width:100%; height:100%; position:absolute; left:0; top:0; padding-left:10rem;}
.plan ol > li {width:43rem; height:100%; position:relative; z-index:100; display:flex; align-items:center; float:left;}
.plan ol > li:before {content:""; width:calc(100% - 11.4rem); height:1px; background:rgba(0,0,0,.15); position:absolute; right:0; top:calc(50% - 2px);}
.plan ol > li:after {content:""; width:23rem; height:100%; background:#ebebeb; border-radius:50%; position:absolute; left:0; top:0;  z-index:-1;}
.plan ol > li.active:after {background:#ffe200;}
.plan ol > li i {width:12.4rem; font-size:12.5rem; font-family:'RobotoB'; color:#fff; margin-left:-1rem;}
.plan ol > li div {width:31.5rem; height:100%; padding-top:3.7rem;}
.plan ol > li div span {font-size:2rem; line-height:3rem; display:block; padding:0 0 1.4rem; margin:0 0 2rem;}
.plan ol > li div ul li + li {margin-top:.5rem;}
.plan ol > li div ul li em {width:5rem; display:inline-block; font-family:'NotokrM';}

/* 연혁 */
.history {width:100%; padding:0 0 10rem 5rem;}
.year {font-size:16rem; font-family:'RobotoB'; line-height:12rem; letter-spacing:-1rem; color:#f7f7f7; display:block; padding-right:5rem;}
.year span {display:block;}
.history > div {position:relative;}
.history > div > .txt_main {margin-top:-4.3rem; position:relative; z-index:10; letter-spacing:-.1rem; opacity:.5;}
.history > div:nth-of-type(1) .year span {display:inline;}
.history > div.on .year {color:#ffe200; transition:all 1.5s ease-in-out;}
.history > div.on .year span {color:#0099e8; transition:all 1.5s 1s ease-in-out;}
.history > div:nth-of-type(even).on .year {color:#0099e8;}
.history > div:nth-of-type(even).on .year span {color:#ffe200;}
.hst_con02 {text-align:right;}
.hst_con01 ~ div {margin-top:-19.5rem;}
.history > div:nth-of-type(3) {margin-top:-15rem;}
.history > div:nth-of-type(even) .txt_main { padding-right:5rem;}
.history > div.on .txt_main {opacity:1; transition:all 1s 1.5s ease-in-out;}
.history > div > button {width:5rem; height:7.5rem; position:relative; margin:2rem 5rem 0 0;}
.history > div > button:after {content:""; width:5rem; height:5rem; border-radius:100%; background:#ffe200; position:absolute; left:0; bottom:0; z-index:1;}
.history > div.hst_con01 > button:after {background:#0099e8;}
.history > div > button:before {content:""; width:.8rem; height:5rem; border-left:1px solid #000; position:absolute; left:calc(50% - 1px); top:0; z-index:100; background:url('../imgs/btn/btn_open.png') no-repeat left calc(100% - 1px); background-size:100%;}
.history > div.on + div {margin-top:7rem;}
.history > div.hst_con01.on button {position:absolute; right:0; margin-top:1.5rem;}
.history > div.hst_con02.on button {position:absolute; left:0; margin-top:1.5rem;}
.history > div.on > button:after {top:0;}
.history > div.on > button:before {content:""; width:.8rem; border-left:0; border-right:1px solid #000; position:absolute; left:calc(50% - .8rem); top:2.5rem; z-index:100; background:url('../imgs/btn/btn_open.png') no-repeat left 1px; background-size:100%;}

.hst_box {margin-top:4rem; padding:4.5rem 5rem 5rem 0; border-top:1px solid #ccc; border-bottom:1px solid #ccc; display:none;}
.history > div.on .hst_box {display:block;}
.hst_box > div + div {margin-top:4.5rem;}
.hst_box > div {display:flex; flex-wrap:wrap;}
.hst_box > div > strong {width:7.2rem; font-family:'RobotoM'; font-size:2rem; line-height:2.4rem;}
.hst_box > div > ul li {padding-left:4.2rem; position:relative; line-height:1.8rem;}
.hst_box > div > ul li + li {margin-top:1rem;}
.hst_box > div > ul li span {position:absolute; left:0; top:0; font-family:'NotokrM';}

.hst_con02 .hst_box > div {position:relative; padding-right:7.2rem;}
.hst_con02 .hst_box > div + div {margin-top:4.5rem;}
.hst_con02 .hst_box > div > strong {width:7.2rem; font-family:'RobotoM'; font-size:2rem; line-height:2.4rem; position:absolute; right:0; top:0;}
.hst_con02 .hst_box > div > ul {width:100%;}
.hst_con02 .hst_box > div > ul li {padding-right:4.2rem; position:relative; line-height:1.8rem;}
.hst_con02 .hst_box > div > ul li + li {margin-top:1rem;}
.hst_con02 .hst_box > div > ul li span {position:absolute; right:0; top:0; font-family:'NotokrM';}

/* 수상 */
.award_list {width:100%; padding:0 5rem 10rem;}
.award_list ul {position:relative;}
.award_list ul li {padding-right:calc(50% + 3rem); text-align:right; position:relative;}
.award_list ul li.right {padding:0 0 0 calc(50% + 3rem); text-align:left;}
.award_list ul li:after {content:""; width:1.6rem; height:1.6rem; border-radius:100px; background:#0099e8; position:absolute; right:calc(50% - .8rem); top:0; z-index:100;}
.award_list ul li.right:after {background:#ffe200;}
.award_list ul li:before {content:""; width:1px; height:calc(100% + 3.5rem); background:#d9d9d9; position:absolute; left:50%; top:.8rem;; z-index:100;}
.award_list ul li:last-child:before {position:static; width:0; height:0; background:transparent;}
.award_list ul li + li {margin-top:3.5rem;}
.award_list ul li strong {font-size:2rem; letter-spacing:-.04rem; font-family:'RobotoM'; display:block; margin:0 0 1rem;}

/* 투자 */
.accounts .select {width:100%; display:block; margin:0 0 2.9rem;}
.accounts .unit {float:right; margin:0 0 1.9rem;}
.accounts .tb_box {display:none;}
.accounts .tb_box.on {display:block;}
.accounts .tb_type01 td:nth-of-type(1) {text-align:left;}
.accounts .tb_type01 td:nth-of-type(2) {text-align:right;}
.accounts .tb_type01 .sum td {text-align:right; font-family:'NotokrM'; background:#f8f8f8;}
.comment {width:100%; text-align:center; background:#f8f8f8; margin-top:4rem; padding:3rem 0;}
.comment > strong {display:block; font-size:1.6rem; font-family:'NotokrM'; margin:1.4rem 0 2.5rem;}
.comment dl {width:63rem; margin:0 auto; text-align:left; display:flex;}
.comment dl dd {margin-left:2rem;}
.comment dl dd strong {display:block; font-family:'NotokrM'; margin:1.4rem 0 0;}

.notice {width:calc(100% - 10rem); padding:0 0 0 5rem; margin:4rem 5rem 0; border-top:2px solid #000; border-bottom:1px solid #ddd; position:relative;}
.notice h3 {font-size:2rem; line-height:3rem; border-bottom:1px solid #ddd; padding:2.5rem 0;}
.notice > span {position:absolute; right:5rem; top:5rem;}
.notice > div {padding:4.8rem 5rem 5rem 0;}

.culture, .talent {padding:3rem 5rem 10rem;}
.culture > strong {position:relative; z-index:100;}
.culture > div {width:100%; position:relative; padding:10rem 0 0 50%; z-index:10; opacity:0;}
.culture > div.on {opacity:1; transition:all 1s .5s ease-in-out;}
.culture > div:nth-of-type(1) {margin-top:-3.7rem;}
.culture > div:nth-of-type(1):before {content:""; width:0; height:0; border:3rem solid transparent; border-bottom:4.8rem solid #0099e8; position:absolute; left:50%; top:14rem; margin-left:-11.75rem; transform:rotate(0); opacity:0;}
.culture > div.on:nth-of-type(1):before {animation:ctmt01 2s 1s ease-out both;}
.culture > div:nth-of-type(2):before {content:""; width:4.5rem; height:4.5rem; background:#ffe200; position:absolute; left:50%; top:-2.25rem; margin-left:-2.25rem; transform:rotate(45deg); opacity:0;}
.culture > div.on:nth-of-type(2):before {animation:ctmt02 2s 1s ease-out both;}
.culture > div:nth-of-type(3):before {content:""; width:5rem; height:5rem; border-radius:100%; background:#0099e8; position:absolute; left:50%; top:0; margin-left:-11.75rem; opacity:0;}
.culture > div.on:nth-of-type(3):before {animation:ctmt03 2s 1s ease-out both;}
.culture > div > span {content:""; width:23.5rem; height:23.5rem; background:#ffe200; border-radius:100%; position:absolute; left:50%; top:0; margin-left:-11.75rem; z-index:1; overflow:hidden;}
.culture > div:nth-of-type(even) > span {background:#0099e8;}
.culture > div:nth-of-type(1) > span:after {content:""; width:0; height:0; border:3rem solid transparent; border-bottom:4.8rem solid #008800; position:absolute; left:50%; top:14rem; margin-left:-11.75rem; z-index:-1; transform:rotate(0); opacity:0;}
.culture > div.on:nth-of-type(1) > span:after {animation:ctmt01 2s 1s ease-out both;}
.culture > div:nth-of-type(2) > span:after {content:""; width:4.5rem; height:4.5rem; background:#008800; position:absolute; left:50%; top:-2.25rem; margin-left:-2.25rem; transform:rotate(45deg); opacity:0;}
.culture > div.on:nth-of-type(2) > span:after {animation:ctmt02 2s 1s ease-out both;}
.culture > div:nth-of-type(3) > span:after {content:""; width:5rem; height:5rem; border-radius:100%; background:#008800; position:absolute; left:50%; top:0; margin-left:-11.75rem; opacity:0;}
.culture > div.on:nth-of-type(3) > span:after {animation:ctmt03 2s 1s ease-out both;}

@keyframes ctmt01 {
	0% {
		transform:rotate(0);
		opacity:0;
	}
	100% {
		transform:rotate(360deg);
		opacity:1;
	}
}

@keyframes ctmt02 {
	0% {
		transform:rotate(45deg);
		opacity:0;
	}
	100% {
		transform:rotate(405deg);
		opacity:1;
	}
}

@keyframes ctmt03 {
	0% {
		transform:translateX(-100px);
		opacity:0;
	}
	60% {
		transform:translateX(50px);
		opacity:1;
	}
	100% {
		transform:translateX(0);
		opacity:1;
	}
}

.culture > div:nth-of-type(1):after {content:""; width:1px; height:80rem; background:#ddd; position:absolute; left:50%; top:10rem;}
.culture > div:nth-of-type(even) {padding:10rem 50% 0 0; text-align:right;}
.culture > div + div {margin-top:7.6rem;}
.culture > div strong, .culture > div strong span {display:block; font-size:2rem; line-height:2.6rem; position:relative; z-index:10;}
.culture > div strong span {font-size:3rem; margin:0 0 2.4rem;}
.culture > div:nth-of-type(even) strong span {color:#fff;}
.culture > div p {margin-top:1.6rem; position:relative; z-index:10;}
.culture > div p span {display:block;}
.culture > div:nth-of-type(even) p {margin-top:2.9rem;}

.norms {padding:3rem 0 10rem 5rem; overflow:hidden;}
.norms .txt_main + p {margin-top:2.2rem;}
.norms > div {width:2800px; margin-top:7.7rem; display:flex; flex-wrap:wrap;}
.norms > div > div {width:71rem; padding:1.7rem 8rem 0 13rem; position:relative;}
.norms > div > div:after {content:""; width:calc(100% + 5rem); height:1px; background:#ddd; position:absolute; left:-5rem; top:9rem; z-index:-1;}
.norms > div > div > div {width:10rem; position:absolute; left:0; top:0; font-size:2rem; text-align:center;}
.norms > div > div > div:after {content:""; width:10rem; height:10rem; border-radius:100%; background:#ffe200; position:absolute; left:0; top:8rem; z-index:-1;}
.norms > div > div > div > span {width:10rem; height:10rem; display:block; border-radius:100%; background:#0099e8; color:#fff; line-height:10rem; position:relative; overflow:hidden; margin-bottom:2rem;}
.norms > div > div > div > span:after {content:""; width:10rem; height:10rem; border-radius:100%; background:#008800; position:absolute; left:0; top:8rem;}
.norms > div > div > em {display:block; font-size:2rem; line-height:2.6rem; margin:0 0 4.7rem;}

.talent {text-align:center;}
.talent .txt_main {text-align:left;}
.talent > div {width:100%; margin:5.2rem 0 3rem; padding:0 0 8rem; display:flex; text-align:center; justify-content:center; align-items:center; position:relative;}
.talent > div:after {content:""; width:1px; height:0; background:rgba(0,0,0,.15); position:absolute; left:50%; top:22rem;}
.talent > div.on:after {height:8rem; transition:height 1s 2.5s;}
.talent > div > div {width:22rem; height:22rem; display:flex; flex-direction:column; justify-content:center; color:#fff; font-size:1.4rem; padding:0 3rem; position:relative;}
.talent > div > div > .circle {width:22rem; height:22rem; border-radius:100%; background:#ffe200; position:absolute; left:0; top:0; overflow:hidden; z-index:1;}
.talent > div > div + div {margin-left:-2.1rem;}
.talent > div > div:nth-of-type(1) {text-align:left; opacity:0;}
.talent > div.on > div:nth-of-type(1) {opacity:1; transition:all 1.5s 1s ease-in-out;}
.talent > div > div:nth-of-type(1):after {content:""; width:5rem; height:5rem; border-radius:100%; background:#ffe200; position:absolute; left:0; top:0; opacity:0;}
.talent > div.on > div:nth-of-type(1):after {animation:ctmt03 2s 1s ease-out both;}
.talent > div > div:nth-of-type(2) {z-index:10; color:#000; opacity:0;}
.talent > div.on  > div:nth-of-type(2) {opacity:1; transition:all 2s ease-in-out;}
.talent > div > div:nth-of-type(2):after, .talent > div > div:nth-of-type(2):before {content:""; width:8.5rem; height:1px; background:rgba(255,255,255,.5); position:absolute; left:-4.9rem; top:50%; z-index:10;}
.talent > div > div:nth-of-type(2):before {left:auto; right:-4.9rem;}
.talent > div > div:nth-of-type(3) {text-align:right; opacity:0;}
.talent > div.on > div:nth-of-type(3) {opacity:1; transition:all 1.5s 2s ease-in-out;}
.talent > div > div:nth-of-type(3):after {content:""; width:0; height:0; border:3rem solid transparent; border-bottom:4.8rem solid #0099e8; position:absolute; right:1.2rem; bottom:-.4rem; transform:rotate(-18deg);  opacity:0;}
.talent > div.on > div:nth-of-type(3):after {animation:tltmt01 2s 2s ease-out both;}
.talent > div > div:nth-of-type(1) > .circle {background:#0099e8;}
.talent > div > div:nth-of-type(1) > .circle:after {content:""; width:5rem; height:5rem; border-radius:100%; background:#008800; position:absolute; left:0; top:0; z-index:-1; opacity:0;}
.talent > div.on > div:nth-of-type(1) > .circle:after {animation:ctmt03 2s 1s ease-out both;}
.talent > div > div:nth-of-type(2) > .circle:after, .talent > div > div:nth-of-type(2) > .circle:before {content:""; width:22rem; height:22rem; border-radius:100%; background:#008800; position:absolute; left:-19.91rem; top:0; opacity:0;}
.talent > div.on > div:nth-of-type(2) > .circle:after {opacity:1; transition:all 1.5s 1s ease-in-out;}
.talent > div.on > div:nth-of-type(2) > .circle:before {opacity:1; transition:all 1.5s 2s ease-in-out;}
.talent > div > div:nth-of-type(2) > .circle:before {left:auto; right:-19.91rem; background:#005200;}
.talent > div > div:nth-of-type(3) > .circle {background:#005cb9;}
.talent > div > div:nth-of-type(3) > .circle:after {content:""; width:0; height:0; border:3rem solid transparent; border-bottom:4.8rem solid #0037a8; position:absolute; right:1.2rem; bottom:-.4rem; transform:rotate(-18deg); z-index:-1; opacity:0;}
.talent > div.on > div:nth-of-type(3) > .circle:after {animation:tltmt01 2s 2s ease-out both;}

@keyframes tltmt01 {
	0% {
		transform:rotate(0);
		opacity:0;
	}
	100% {
		transform:rotate(342deg);
		opacity:1;
	}
}

.talent > div > div > strong {font-size:2.2rem; line-height:2.6rem; margin-bottom:1rem; position:relative; z-index:100;}
.talent > div > div > span:nth-of-type(2) {position:relative; z-index:100;}

.talent > div + strong {font-size:4rem; font-family:'RobotoR'; opacity:0;}
.talent > div.on + strong {opacity:1; transition:all 1s 3s;}
.talent > div + strong span {color:#0099e8;}
.talent > div + strong + p {font-size:1.6rem; line-height:2.4rem; margin:2.8rem 0 4.5rem; opacity:0;}
.talent > div.on + strong + p {opacity:1; transition:all 1s 3.2s;} 
.talent > div + strong + p + .link01 {opacity:0;}
.talent > div.on + strong + p + .link01 {opacity:1; transition:all 1s 3.5s;}

/* Business */
.port, .land, .port_infra, .tpl_infra, .tb_infra, .tpl_exp, .faq {padding:3rem 5rem 10rem;}
.connects {padding:0 5rem 10rem; background:url('../imgs/bg/bg_connects.png') no-repeat center 17rem; background-size:100%;}

.port > p:nth-of-type(1), .land > p:nth-of-type(1) {margin-bottom:9.5rem;}
.exp_con {position:relative; padding:0 50px;}
.exp_con:nth-of-type(even) {text-align:right;}
.exp_con + div {margin-top:5rem;}
.exp_con a {display:block; cursor:pointer;}
.exp_con dl {min-height:26rem; position:relative;}
.exp_con dl:after {content:""; width:25rem; height:100%; position:absolute; left:0; top:0; z-index:10;}
.exp_con:nth-of-type(even) dl:after {left:auto; right:0;}
.exp_con:nth-of-type(1) dl:after {background:url('../imgs/contents/img_port06.jpg') no-repeat left 6rem; background-size:25rem;}
.exp_con:nth-of-type(2) dl:after {background:url('../imgs/contents/img_port01.jpg') no-repeat left 6rem; background-size:25rem;}
.exp_con:nth-of-type(3) dl:after {right:0; background:url('../imgs/contents/img_port02.jpg') no-repeat right 6rem; background-size:25rem;}
.exp_con:nth-of-type(4) dl:after {background:url('../imgs/contents/img_port03.jpg') no-repeat left 6rem; background-size:25rem;}
.exp_con:nth-of-type(5) dl:after {background:url('../imgs/contents/img_port04.jpg') no-repeat right 6rem; background-size:25rem;}
.exp_con:nth-of-type(6) dl:after {background:url('../imgs/contents/img_port05.jpg') no-repeat left 6rem; background-size:25rem;}
.exp_con dl dt {display:inline-block; font-size:3rem; line-height:100%; position:relative; margin:0 0 3rem; z-index:1;}
.exp_con dl dt:after {content:""; width:10rem; height:10rem; background:#ffe200; border-radius:100%; position:absolute; left:-5rem; top:-2rem; z-index:-1; opacity:0;}
.exp_con:nth-of-type(even) dl dt:after {left:auto; right:-5rem;}
.exp_con a:hover dl dt:after {opacity:1; transition:all .5s ease-in-out;}
.exp_con:nth-of-type(even) a:hover dl dt:after, .exp_con:nth-of-type(even) a:hover .link02:after {background:#0099e8;}
.exp_con:nth-of-type(even) dl dt {text-align:right;}
.exp_con dl dd {height:8rem; padding:.8rem 7rem .8rem 3rem; margin:0 0 0 25rem;}
.exp_con:nth-of-type(even) dl dd {padding:.8rem 3rem .8rem 6rem; margin:0 25rem 0 0; text-align:right; justify-content:flex-end}
.exp_con dl dd:nth-of-type(1) {display:flex; align-items:flex-end;}
.exp_con dl dd + dd {border-top:1px solid #d9d9d9; position:relative; align-items:flex-start;}
.exp_con dl dd:nth-of-type(1):last-child {display:block;}

.exp_con dl dd + dd:after, .land .exp_con:nth-of-type(1) dl dd:after, .land .exp_con:nth-of-type(5) dl dd:after {content:""; width:10rem; height:1px; background:#d9d9d9; position:absolute; right:calc(-5rem - 50px); top:-1px;}
.exp_con:nth-of-type(even) dl dd + dd:after {content:""; width:10rem; height:1px; background:#d9d9d9; position:absolute; right:auto; left:calc(-5rem - 50px); top:-1px;}
.exp_con dl dd > em {font-size:1.4rem; font-family:'NotokrM';}
.exp_con dt span {display:block;}
.exp_con dd span {display:block;}

.exp_con .link02 {position:absolute; right:0; top:-2.1rem; z-index:10;}
.exp_con:nth-of-type(even) .link02 {position:absolute; right:auto; left:0;}
.exp_con:hover .link02:after {background:#ffe200; transition:all .5s ease-in-out;}

.land .tit01 {margin-top:9.5rem;}
.land .exp_con:nth-of-type(1) dl:after {background:url('../imgs/contents/img_land05.jpg') no-repeat left 5rem; background-size:25rem;}
.land .exp_con:nth-of-type(2) dl:after {background:url('../imgs/contents/img_land01.jpg') no-repeat right 9rem; background-size:25rem;}
.land .exp_con:nth-of-type(3) dl:after {background:url('../imgs/contents/img_land02.jpg') no-repeat left 9rem; background-size:25rem;}
.land .exp_con:nth-of-type(4) dl:after {background:url('../imgs/contents/img_land03.jpg') no-repeat right 9rem; background-size:25rem;}
.land .exp_con:nth-of-type(5) dl:after {background:url('../imgs/contents/img_land04.jpg') no-repeat left 9rem; background-size:25rem;}
.land .exp_con:nth-of-type(1) dl dd, .land .exp_con:nth-of-type(5) dl dd {height:auto; border-top:1px solid #d9d9d9; position:relative; margin-top:8rem;}

.dstb_map {height:535px; margin-top:5rem; padding:0; text-align:left; position:relative; background:url('../imgs/bg/map_korea.png') no-repeat center 40px; opacity:0;}
.dstb_map.on {opacity:1; transition:all 2s ease-in-out;}
.dstb_map div {display:inline-block; position:absolute; left:50%; top:0; margin-left:-315px; opacity:0;}
.dstb_map div.action {opacity:1; transition:all 1s ease-in-out;}
.dstb_map div:after, .dstb_map div:nth-of-type(1):before, .dstb_map div:nth-of-type(2):before, .dstb_map div:nth-of-type(6):before, .dstb_map div:nth-of-type(8):before, .dstb_map div:nth-of-type(12):before, .dstb_map div:nth-of-type(13):before {content:""; position:absolute; width:7px; height:7px; background:#0099e8; border-radius:100px;}

.dstb_map div:after {background:#ffe200;}
.dstb_map div:nth-of-type(6) ~ div {right:50%; margin:0 -315px 0 0; text-align:right;}
.dstb_map div:nth-of-type(1) {top:172px;}
.dstb_map div:nth-of-type(1):after {left:246px; top:5px;}
.dstb_map div:nth-of-type(1):before {left:251px; top:11px; background:#0099e8;}
.dstb_map div:nth-of-type(1) span:after {width:143px; left:108px; top:14px;}
.dstb_map div:nth-of-type(2) {top:222px;}
.dstb_map div:nth-of-type(2):after {left:216px; top:6px;}
.dstb_map div:nth-of-type(2):before {left:220px; top:11px; background:#0099e8;}
.dstb_map div:nth-of-type(2) span:after {width:112px; left:108px; top:14px;}
.dstb_map div:nth-of-type(3) {top:282px;}
.dstb_map div:nth-of-type(3):after {left:261px; top:11px; background:#0099e8;}
.dstb_map div:nth-of-type(3) span:after {width:174px; left:88px; top:14px;}
.dstb_map div:nth-of-type(4) {top:327px;}
.dstb_map div:nth-of-type(4):after {left:244px; top:-9px; background:#0099e8;}
.dstb_map div:nth-of-type(4) span:after {width:160px; left:88px; top:14px;}
.dstb_map div:nth-of-type(4) span:before {height:19px; left:247px; top:-4px;}
.dstb_map div:nth-of-type(5) {top:394px;}
.dstb_map div:nth-of-type(5):after {left:270px; top:11px; background:#0099e8;}
.dstb_map div:nth-of-type(5) span:after {width:183px; left:88px; top:14px;}
.dstb_map div:nth-of-type(6) {top:444px;}
.dstb_map div:nth-of-type(6):after {left:270px; top:11px;}
.dstb_map div:nth-of-type(6):before {left:275px; top:5px;}
.dstb_map div:nth-of-type(6) span:after {width:163px; left:108px; top:14px;}
.dstb_map div:nth-of-type(7) {left:auto; top:0;}
.dstb_map div:nth-of-type(7):after {left:-288px; top:188px; background:#0099e8;}
.dstb_map div:nth-of-type(7) span:after {width:284px; right:78px; top:14px;}
.dstb_map div:nth-of-type(7) span:before {height:175px; right:362px; top:14px;}
.dstb_map div:nth-of-type(8) {left:auto; top:82px;}
.dstb_map div:nth-of-type(8):after {left:-150px; top:18px;}
.dstb_map div:nth-of-type(8):before {left:-152px; top:11px;}
.dstb_map div:nth-of-type(8) span:after {width:145px; right:98px; top:14px;}
.dstb_map div:nth-of-type(9) {left:auto; top:142px;}
.dstb_map div:nth-of-type(9):after {left:-302px; top:11px;  background:#0099e8;}
.dstb_map div:nth-of-type(9) span:after {width:295px; right:78px; top:14px;}
.dstb_map div:nth-of-type(10) {left:auto; top:309px;}
.dstb_map div:nth-of-type(10):after {left:-100px; top:11px;  background:#0099e8;}
.dstb_map div:nth-of-type(10) span:after {width:93px; right:78px; top:14px;}
.dstb_map div:nth-of-type(11) {left:auto; top:349px;}
.dstb_map div:nth-of-type(11):after {left:-161px; top:-4px;  background:#0099e8;}
.dstb_map div:nth-of-type(11) span:after {width:158px; right:78px; top:14px;}
.dstb_map div:nth-of-type(11) span:before {height:12px; right:235px; top:3px;}
.dstb_map div:nth-of-type(12) {left:auto; top:389px;}
.dstb_map div:nth-of-type(12):after {left:-89px; top:-17px;}
.dstb_map div:nth-of-type(12):before {left:-83px; top:-13px; background:#0099e8;}
.dstb_map div:nth-of-type(12) span:after {width:80px; right:98px; top:14px;}
.dstb_map div:nth-of-type(12) span:before {height:20px; right:177px; top:-6px;}
.dstb_map div:nth-of-type(13) {left:auto; top:431px;}
.dstb_map div:nth-of-type(13):after {left:-91px; top:-24px;}
.dstb_map div:nth-of-type(13):before {left:-98px; top:-21px; background:#0099e8;}
.dstb_map div:nth-of-type(13) span:after {width:95px; right:98px; top:14px;}
.dstb_map div:nth-of-type(13) span:before {height:29px; right:192px; top:-14px;}
.dstb_map div > span {width:70px; height:30px; line-height:30px; font-family:'NotokrM'; display:inline-block; text-align:right; vertical-align:middle; margin:0 -15px 0 0; position:relative; z-index:100;}
.dstb_map div span:after {content:""; width:100%; height:1px; background:#d9d9d9; position:absolute; z-index:-1;}
.dstb_map div:nth-of-type(4) span:before, .dstb_map div:nth-of-type(7) span:before, .dstb_map div:nth-of-type(11) span:before, .dstb_map div:nth-of-type(12) span:before, .dstb_map div:nth-of-type(13) span:before {content:""; width:1px; background:#d9d9d9; position:absolute;}
.dstb_map div:nth-of-type(6) ~ div > span {width:60px; text-align:left; margin:0 0 0 -15px;}
.dstb_map div > i {display:inline-block; width:30px; height:30px; border-radius:100%; position:relative; vertical-align:middle; overflow:hidden; transform:translate(-40px); z-index:10;}
.dstb_map div:nth-of-type(6) ~ div > i {transform:translate(40px);}
.dstb_map div > i.ico_cy {background:#ffe200;}
.dstb_map div > i.ico_cb {background:#0099e8;}
.dstb_map div > i + i {margin-left:-10px;}
.dstb_map div > i + i:after {content:""; width:30px; height:30px; border-radius:100%; background:#008800; position:absolute; right:20px; top:0;}

.dstb_map div.action i.ico_cy {transform:translate(0); transition:all 1s ease-out;}
.dstb_map div.action i.ico_cb {transform:translate(0); transition:all 1s .5s ease-out;}

.map_exp {text-align:center; margin:2rem 0 5.6rem; font-family:'NotokrM'; font-size:1.4rem;}
.map_exp span {position:relative; display:inline-block; padding-left:17px;}
.map_exp span + span {margin-left:3.7rem;}
.map_exp span i {width:7px; height:7px; -webkit-border-radius:100px; border-radius:100px; position:absolute; top:8px; left:0; font-size:0; line-height:0; text-indent:-3000px; overflow:hidden;}
.map_exp span:nth-of-type(1) i {background:#ffe200;}
.map_exp span:nth-of-type(2) i {background:#0099e8;}

.port_box {display:none;}
.port_box.on {display:block;}
.port_box h4 {margin-top:4.7rem; font-size:1.4rem; font-family:'NotokrM';}
.port_box h4:nth-of-type(1) {margin-top:3rem;}
.port_box dl {margin:1.8rem 0 2rem;}
.port_box dl dt, .port_box dl dd {display:inline-block; line-height:100%;}
.port_box dl dt {color:#666; padding-right:.8rem; border-right:1px solid #ddd;}
.port_box dl dt ~ dt {margin-left:3.6rem;}
.port_box dl dd {margin-left:.4rem;}
.port_infra h3:nth-of-type(2) {margin-top:10rem;}
.info02 {display:flex; flex-wrap:wrap; justify-content:space-between;}
.info02 > div {width:calc((100% - 6rem) / 2);}
.info02 > div:nth-of-type(2) ~ div {margin-top:5.7rem;}
.info02 > div:nth-of-type(2) ~ div:nth-of-type(9) {margin-top:-27rem;}
.port_infra > div .tb_type01 td, .port_infra > div .tb_type01 tbody th {padding:1.3rem 1rem;}
.tpl_infra h3.tit02 {margin-top:6rem;}
.tpl_infra > p span {display:block;}

.tpl_infra .tb_type01 tr td:nth-of-type(3) ~ td, 
.tpl_infra .tb_type01 tr:nth-of-type(1) ~ tr td:nth-of-type(2) ~ td,  
.tpl_infra .tb_type01 .sum td, .tpl_infra .tb_type01 .total td {text-align:right;}

.tpl_infra .tb_type01 tr:nth-of-type(6) td:nth-of-type(3), .tpl_infra .tb_type01 tr:nth-of-type(12) td:nth-of-type(3), 
.tpl_infra .tb_type01 tr:nth-of-type(17) td:nth-of-type(3), .tpl_infra .tb_type01 tr:nth-of-type(21) td:nth-of-type(3),
.tpl_infra .tb_type01 tr:nth-of-type(25) td:nth-of-type(3) {text-align:center ! important;}

.tb_infra > h3.tit02, .info02 > div h3.tit02 {margin-bottom:1rem;}
.tb_infra > p, .info02 > div > span {margin-bottom:1.7rem; display:block;}
.tb_infra .tb_type01 td {text-align:right;}
.tb_infra .info02 {margin-top:6rem;}
.tb_infra .info02 > div .tb_type01 td {text-align:center;}

.txt_cnt {margin-top:10rem; text-align:center;}
.txt_cnt strong span:nth-of-type(1) {width:30rem; display:block; opacity:0; transform:translateX(-100px); margin:0 auto;}
.txt_cnt.on strong span:nth-of-type(1) {opacity:1; transform:translateX(0); transition:all 2s ease-out;}
.txt_cnt strong span:nth-of-type(2) {width:44.5rem; display:block; opacity:0; transform:translateX(100px); margin:-1rem auto 0;}
.txt_cnt strong span img {width:100%;}
.txt_cnt.on strong span:nth-of-type(2) {opacity:.9; transform:translateX(0); transition:all 2s ease-out;}
.txt_cnt p {font-size:1.6rem; line-height:2.4rem; margin-top:4rem;}

.process {width:100%; margin-top:11.2rem; display:flex; flex-wrap:wrap;}
.process > li {width:33.33%; position:relative; padding-right:2rem;}
.process > li:after {content:""; width:100%; height:1px; background:rgba(0,0,0,.16); position:absolute; top:2rem; left:0;}
.process > li:nth-of-type(3n):after {width:calc(100% + 5rem);}
.process > li:nth-of-type(3) ~ li {margin-top:5rem;}
.process > li:last-child:after {width:0; left:0;}
.process > li:nth-of-type(3n + 1):after {width:calc(100% + 5rem); left:-5rem;}
.process > li:last-child:nth-of-type(3n + 1):after {width:5rem; left:-5rem;}
.process > li:nth-of-type(1):after {width:100%; left:0;}
.process > li ~ li:before {content:""; width:0; height:0; border:1rem solid transparent; border-left:1.5rem solid #ffe200; position:absolute; left:-.6rem; top:1rem; transform:translateX(-4rem); opacity:0;}
.process > li.on:before {transform:translateX(0); opacity:1; transition:all 1s ease-in-out;}
.process > li ~ li:nth-of-type(odd):before {border-left:1.5rem solid #0099e8;}
.process > li i {width:4rem; height:4rem; border-radius:100%; background:#ffe200; display:flex; align-items:center; justify-content:center; font-family:'RobotoR'; font-size:1.8rem; position:relative; overflow:hidden; opacity:0;}
.process > li.on i {opacity:1; transition:all 1s ease-in-out; z-index:10;}
.process > li ~ li i:before {content:""; width:0; height:0; border:1rem solid transparent; border-left:1.5rem solid #008800; position:absolute; left:-.6rem; top:1rem; transform:translateX(-4rem); opacity:0;}
.process > li.on i:before {transform:translateX(0); opacity:1; transition:all 1s ease-in-out;}
.process > li:nth-of-type(even) i {background:#0099e8; color:#fff;}
.process > li dl {margin-top:2rem; padding:0 0 0 7rem; position:relative; transform:translateX(2rem); opacity:0;}
.process > li.on dl {transform:translateX(0); opacity:1; transition:all 1s ease-in-out;}
.process > li dl dt {position:absolute; left:0; top:0; font-size:2rem; line-height:2.6rem;}
.process > li dl dt span {display:block;}
.process > li dl dd {font-size:1.2rem; line-height:1.8rem;}
.process > li dl dd + dd {margin-top:.7rem;}
.process > li p {margin-top:.7rem;}

.process > li dl.type02 {width:100%; padding:4rem 0 0 8rem; position:relative;}
.process > li dl.type02 dt {width:100%;}
.process > li dl.type02 dt em {font-size:1.6rem; font-family:'NotokrM'; position:absolute; top:0; left:8rem;}

.tpl_exp .tit01 {margin-top:9.7rem;}
.tpl_exp .tit01 + p span {display:block;}
.tpl_con01 {width:calc(100% + 10rem); height:23rem; position:relative; margin:5rem -5rem 0; overflow:hidden; padding:0 5rem;}
.tpl_con01 > div {width:2500px; position:absolute; left:0; top:0; overflow:hidden; padding-left:5rem;}
.tpl_con01 > div > div {width:59.5rem; height:23rem; padding:4rem 0 0 27.8rem; position:relative; float:left; z-index:1;}
.tpl_con01 > div > div:after {content:""; width:23rem; height:23rem; border-radius:100%; background:#ffe200; position:absolute; left:16.5rem; top:0; z-index:-1;}
.tpl_con01 > div > div > span {width:23rem; height:23rem; border-radius:100%; position:absolute; left:0; top:0; overflow:hidden;}
.tpl_con01 > div > div strong {font-size:2rem; line-height:3rem;}
.tpl_con01 > div > div p {margin-top:2rem; padding:1.8rem 1rem 0 0; border-top:1px solid rgba(0,0,0,.15);}
.svc01 > span {background:url('../imgs/contents/tpl01.png') no-repeat left top; background-size:100%;}
.svc02 > span {background:url('../imgs/contents/tpl02.png') no-repeat left top; background-size:100%;}
.svc03 > span {background:url('../imgs/contents/tpl03.png') no-repeat left top; background-size:100%;}

.tpl_con02 {height:43rem; position:relative; margin-top:2.7rem; padding-top:4.7rem;}
.tpl_con02 > div {width:23rem; height:23rem; border-radius:100%; background:#0099e8; position:absolute; left:50%; top:0; margin-left:-11.5rem; z-index:10; overflow:hidden; opacity:0;}

.tpl_con02 > div:nth-of-type(1):after {content:""; width:100%; height:100%; border-radius:100%; background:#0037a8; position:absolute; left:0; top:20rem; opacity:0;}
.tpl_con02 > div:before {content:""; width:0; height:1px; background:#fff; position:absolute; right:0; top:50%;}

.tpl_con02 > div span {display:block; width:100%; height:100%; position:relative; z-index:10;}
.tpl_con02 > div span:after {content:""; width:5rem; height:5rem; border-radius:100%; background:#ffe200; position:absolute; z-index:-1;}
.tpl_con02 > div span:before {content:""; width:100%; height:100%; position:absolute;}
.tpl_con02 > div:nth-of-type(1) span {opacity:0; transform:translateX(-100px);  z-index:10;}
.tpl_con02 > div:nth-of-type(1) span:after {right:6rem; top:9rem; opacity:0;}
.tpl_con02 > div:nth-of-type(1) span:before {background:url('../imgs/contents/distribution0101.png') no-repeat center center; background-size:6.3rem; z-index:100; opacity:0;  transform:translateX(-80px);}
.tpl_con02 > div:nth-of-type(1) i {width:100%; height:100%; position:absolute; left:0; top:0;}
.tpl_con02 > div:nth-of-type(1) i:after {content:""; width:3.2rem; height:3.2rem; position:absolute; left:5.7rem; top:3.4rem; background:url('../imgs/contents/distribution0102.png') no-repeat center center; background-size:100%; animation:snow01 2.5s 1.5s ease-out infinite;}
.tpl_con02 > div:nth-of-type(1) i:before {content:""; width:4.5rem; height:4.5rem; position:absolute; left:9.9rem; top:5.6rem; background:url('../imgs/contents/distribution0102.png') no-repeat center center; background-size:100%; animation:snow01 3s 2s ease-out infinite;}
.tpl_con02 > div:nth-of-type(2) {background:#005cb9; top:20rem; z-index:1;}
.tpl_con02 > div:nth-of-type(2):after {content:""; width:2.3rem; height:2.3rem; background:url('../imgs/contents/distribution0202.png') no-repeat center center; background-size:100%; position:absolute; right:7.8rem; top:6.8rem;}
.tpl_con02 > div:nth-of-type(2):before {content:""; width:0; height:1px; background:#fff; position:absolute; right:auto; left:0;}
.tpl_con02 > div:nth-of-type(2) span {opacity:0;}
.tpl_con02 > div:nth-of-type(2) span:after {left:8rem; top:7rem; opacity:0; background:#005cb9;}
.tpl_con02 > div:nth-of-type(2) span:before {content:""; width:100%; height:100%; background:url('../imgs/contents/distribution0201.png') no-repeat center center; background-size:3.1rem;  opacity:0; transform:translateX(100px);}

@keyframes dtbt01 {
	0% {
		opacity:0;
	}
	100% {
		opacity:1;
	}
}

@keyframes snow01 {
	0% {
		transform:rotate(0);
	}
	100% {
		transform:rotate(300deg);
	}
}

.tpl_con02.on > div:nth-of-type(1) {opacity:1; transition:all 1s ease-out;}
.tpl_con02.on > div:nth-of-type(2) {opacity:1; transition:all 1s .5s ease-out;}
.tpl_con02.on > div:nth-of-type(1):after {opacity:1; transition:all 1s .5s ease-out;}
.tpl_con02.on > div:nth-of-type(1):before {width:7.9rem; transition:all 1s .5s ease-out;}
.tpl_con02.on > div:nth-of-type(1) span:after {opacity:1; transition:all 1s 3s ease-out;}
.tpl_con02.on > div:nth-of-type(1) span:before {opacity:1; transform:translateX(0); transition:all 1s .5s ease-out;}
.tpl_con02.on > div:nth-of-type(2):after {opacity:0; animation:dtbt01 1.5s 3s ease-out infinite;}
.tpl_con02.on > div:nth-of-type(2):before {width:8.9rem; transition:all 1s .8s ease-out;}
.tpl_con02.on > div span {opacity:1; transform:translateX(0); transition:all 1.5s 1s ease-out;}
.tpl_con02.on > div:nth-of-type(2) span:before {opacity:1; transform:translateX(0); transition:all 1.5s 1s ease-out;}
.tpl_con02.on > div:nth-of-type(2) span:after {left:8rem; top:7rem; opacity:1; background:#ffe200; transition:all 2s 2s ease-in-out;}

.tpl_con02 dl {width:100%; display:flex; flex-wrap:wrap; position:relative; z-index:100;}
.tpl_con02 dl:nth-of-type(2) {margin-top:11rem;}
.tpl_con02 dl dt {width:100%; font-family:'NotokrM'; font-size:1.8rem; margin-bottom:2rem;}
.tpl_con02 dl dd {width:50%;}
.tpl_con02 dl dd span {display:block;}
.tpl_con02 dl dd:nth-of-type(even) {text-align:right;}

.tpl_exp .process {margin-top:5rem;}
.forwarding, .contactus {padding:0 5rem 10rem;}
.forwarding > .tit01 ~ .tit01 {margin:9.7rem 0 0;}
.forwarding > .tit02 {margin-top:4.5rem;}
.forwarding > .tit02 + ul {margin-top:2.5rem;}

.customer {width:100%; display:flex; flex-wrap:wrap; border-left:1px solid #ddd;}
.customer li {width:20%; height:7rem; display:flex; justify-content:center; align-items:center; text-align:center; border:1px solid #ddd; border-left:0;}
.customer li:nth-of-type(5) ~ li {border-top:0;}
.customer li img {width:80%;}
.fwd01, .fwd02 {margin:5rem 0 5rem;}
.forwarding .tb_type01 th {background:#f8f8f8; font-family:'NotokrM';}
.forwarding .tb_type01 td {text-align:left;}

.fwd01 > div {display:flex; flex-wrap:nowrap; justify-content:space-between; position:relative;}
.fwd01 > div:after {content:""; width:0; height:0;  border:.8rem solid transparent; border-left:1.5rem solid #ffe200; position:absolute; left:calc(29.4rem + ((50% - 35rem) / 2)); top:50%; margin-top:-2.6rem; transform:translateX(-4rem); z-index:100;}
.fwd01 > div:before {content:""; width:0; height:0;  border:.8rem solid transparent; border-left:1.5rem solid #ffe200; position:absolute; left:calc(47.4rem + (50% - 35rem) + ((50% - 35rem) / 2)); top:50%; margin-top:-2.6rem; transform:translateX(-4rem); z-index:100;}
.fwd01 > div > div {width:26rem; padding-top:12rem; text-align:center; position:relative;}
.fwd01 > div > div:nth-of-type(2) {width:18rem;}
.fwd01 > div > div > span {width:10rem; height:10rem; border-radius:100%; position:absolute; left:0; top:0; background:#f7f7f7; overflow:hidden;}
.fwd01 > div > div > span:nth-of-type(2), .fwd01 > div.fwd_con02 > span:nth-of-type(2) {left:8rem;}

.fwd01 > div > div > span:nth-of-type(3) {left:16rem;}
.fwd01 > div > div > span:nth-of-type(2):after, .fwd01 > div > div > span:nth-of-type(3):after {content:""; width:100%; height:100%; border-radius:100%; background:#efefef; position:absolute; left:-8rem; top:0;}

.fwd01 > div > div > span:before {content:""; width:100%; height:100%; position:absolute; left:0; top:0;}
.fwd01 > div > div.fwd_con02 > span:nth-of-type(1) {background:#ffe200;}
.fwd01 > div > div.fwd_con02 > span:nth-of-type(2) {background:#0099e8;}
.fwd01 > div > div.fwd_con02 > span:nth-of-type(2):after {background:#008800;}

.fwd01 > div > div.fwd_con01 > span:nth-of-type(1):before {background:url('../imgs/contents/img_fwd01.png') no-repeat center center; background-size:3.8rem;}
.fwd01 > div > div.fwd_con01 > span:nth-of-type(2):before {background:url('../imgs/contents/img_fwd02.png') no-repeat center center; background-size:4.3rem;}
.fwd01 > div > div.fwd_con01 > span:nth-of-type(3):before {background:url('../imgs/contents/img_fwd03.png') no-repeat center center; background-size:3.8rem;}
.fwd01 > div > div.fwd_con02 > span:nth-of-type(1):before {background:url('../imgs/contents/img_fwd04.png') no-repeat center center; background-size:3.6rem;}
.fwd01 > div > div.fwd_con02 > span:nth-of-type(2):before {background:url('../imgs/contents/img_fwd05.png') no-repeat center center; background-size:3.7rem;}

.fwd01 > div > div.fwd_con03 > span:nth-of-type(1):before {background:url('../imgs/contents/img_fwd02.png') no-repeat center center; background-size:4.3rem;}
.fwd01 > div > div.fwd_con03 > span:nth-of-type(2):before {background:url('../imgs/contents/img_fwd01.png') no-repeat center center; background-size:3.8rem;}
.fwd01 > div > div.fwd_con03 > span:nth-of-type(3):before {background:url('../imgs/contents/img_fwd06.png') no-repeat center center; background-size:3.6rem;}

.fwd02 {display:flex; position:relative;}
.fwd02 > span {width:12rem; height:12rem; border-radius:100%; background:#0099e8; position:absolute; left:50%; top:0; margin-left:-6rem; opacity:0;}
.fwd02 > span + span {background:#ffe200; margin-left:-6rem; overflow:hidden;}
.fwd02 > span + span:after {content:""; width:12rem; height:12rem; border-radius:100%; background:#008800; position:absolute; left:0; top:0; opacity:0;}
.fwd02 > dl {width:50%; padding:5rem 4.7rem 0 0; text-align:right; position:relative; z-index:100;}
.fwd02 > dl + dl {padding:5rem 0 0 4.7rem; text-align:left;}
.fwd02 > dl dt {font-size:2.4rem; padding:0 3.7rem 4.5rem 3.7rem; opacity:0;}
.fwd02 > dl dd {margin-top:6rem; position:relative; padding:0 2.7rem 0 0; opacity:0;}
.fwd02 > dl dd:after {content:""; width:.7rem; height:.7rem; border-radius:100px; background:#000; position:absolute; right:-.3rem; top:.7rem;}
.fwd02 > dl dd:before {content:""; width:1px; height:6rem; background:#ddd; position:absolute; right:0; top:-5.5rem;}
.fwd02 > dl + dl dd {padding:0 0 0 2.7rem;}
.fwd02 > dl + dl dd:after {right:auto; left:-.3rem;}
.fwd02 > dl + dl dd:before {right:auto; left:0;}
.fwd02 > dl dd + dd {margin-top:5.5rem;}
.fwd02 > dl dd + dd:before {height:11rem; top:-10rem;}
.fwd02 > dl dd strong {display:block; font-size:1.9rem; margin-bottom:2rem;}

.fwd02.on > span {opacity:1; transition:all 2s ease-in-out; margin-left:-10.8rem;} 
.fwd02.on > span + span {opacity:1; margin-left:-1.2rem;} 
.fwd02.on > span + span:after {opacity:1; left:-9.6rem; transition:all 2s ease-in-out;}
.fwd02.on > dl {transition:all 1.5s 1.5s ease-in-out;}
.fwd02.on dl dt {opacity:1; transition:all 2s 1s ease-in-out;}
.fwd02.on dl dd {opacity:1; transition:all 2s 1s ease-in-out;}

.fwd03 {border-top:.2rem solid #000; display:flex; flex-wrap:wrap; justify-content:space-between;}
.fwd03 dl {width:50%; border-bottom:.1rem solid #ddd;}
.fwd03 dl:nth-of-type(even) {border-left:.1rem solid #ddd;}
.fwd03 dl dt {background:#f8f8f8; padding:1.2rem 0; text-align:center; border-bottom:.1rem solid #ddd; font-family:'NotokrM';}
.fwd03 dl dd {padding:1.2rem 3rem;}

.fwd04 {display:flex; flex-wrap:wrap; justify-content:space-between; margin-top:4.7rem;}
.fwd04 > div {width:calc((100% - 6rem) / 2)}
.forwarding .tb_type01 td.line_2 {padding:2.6rem 1rem;}

/* Support */
.branch, .location, .organogram, .network {padding:4rem 5rem 10rem; position:relative;}
.branch {width:100%; margin:0 auto; background:url('../imgs/bg/line.png') no-repeat 7.5rem 13.3rem; background-size:calc(100% - 15rem) calc(100% - 31.3rem);}
.branch > dl {position:relative; padding:14rem 0 0 7.5rem;}
.branch > dl:after {content:""; width:5rem; height:5rem; border-radius:100%; position:absolute; opacity:0;}
.branch > dl dt {width:15rem; height:15rem; border-radius:100%; position:absolute; font-size:2rem; overflow:hidden; z-index:10;}
.branch > dl dd {font-size:3.5rem; line-height:100%; letter-spacing:-.2rem; position:relative; z-index:10;}
.domestic:after {background:#0099e8; left:0; top:0;}
.domestic dt {background:#fff; left:0; top:2rem; padding:6.5rem 0 0 7.5rem; transform:translate(50px)}
.domestic dt:after {content:""; width:5rem; height:5rem; border-radius:100%; background:#008800; position:absolute; left:0; top:-2rem; opacity:0;}
.branch > dl dd + dd {margin-top:2.5rem;}
.branch > dl dd a {color:rgba(0,0,0,.7);}
.branch > dl dd a span {display:none; color:#0099e8; margin-left:1.6rem; padding-right:7rem; background:url('../imgs/ico/ico_arrow2.svg') no-repeat right center; background-size:5rem;}
.branch > dl dd a:hover {color:#000;}
.branch > dl dd a:hover span {display:inline-block;}

.branch > dl.foreign {padding:12.5rem 7.5rem 3rem 0; text-align:right; margin-top:5rem;}
.foreign:after {background:#ffe200; right:0; bottom:0;}
.foreign dt {background:#fff; right:0; top:2rem; padding:6.5rem 7.5rem 0 0; color:#fff; transform:translate(-50px);}
.foreign dt:after {content:""; width:5rem; height:5rem; border-radius:100%; background:#008800; position:absolute; right:0; bottom:-2rem; opacity:0;}

.branch.on dl:after {animation:ctmt03 2s 1s ease-out both;}
.branch.on .domestic dt {background:#ffe200; transform:translate(0); transition:all 1s ease-in-out;}
.branch.on .domestic dt:after {animation:ctmt03 2s 1s ease-out both;}
.branch.on .foreign:after {animation:ctmt03 2s 2s ease-out both;}
.branch.on .foreign dt {background:#0099e8; transform:translate(0); transition:all 1.5s 1s ease-in-out;}
.branch.on .foreign dt:after {animation:ctmt03 2s 2s ease-out both;}

/* 조직도 */
.organogram {background:url('../imgs/bg/bg_dongwon.png') no-repeat center 13rem; background-size:52rem;}
.chart {width:100%; max-width:66rem; margin:4rem auto 0; text-align:center; position:relative;}
.chart:after {content:""; width:calc(100% - 15rem); height:1px; background:#d9d9d9; position:absolute; left:7.5rem; top:29.5rem;}
.chart > em {display:block; font-size:2rem; position:relative; padding-top:6rem; z-index:10;}
.chart > em:before {content:""; width:5rem; height:5rem; border-radius:100%; background:#0099e8; position:absolute; left:50%; top:0; margin-left:-2.5rem;}
.chart > em:after {content:""; width:1px; height:24.5rem; background:#d9d9d9; position:absolute; left:50%; top:5rem; z-index:-1;}
.chart > span {font-size:2rem; height:5rem; display:block; padding:1.5rem 0 0 4rem; position:absolute; left:calc(50% + 11.5rem); top:14.75rem; z-index:10;}
.chart > span:before {content:""; width:5rem; height:5rem; border-radius:100%; background:#ffe200; position:absolute; left:0; top:0; z-index:-1;}
.chart > span:after {content:""; width:11.5rem; height:1px; background:#d9d9d9; position:absolute; left:-11.5rem; top:50%;}
.chart > div {width:10rem; margin-top:18.75rem; display:inline-block; vertical-align:top; padding-top:4rem; position:relative; z-index:10;}
.chart > div:before {content:""; width:5rem; height:5rem; border-radius:100%; background:#ffe200; position:absolute; left:50%; top:0; margin-left:-2.5rem;}
.chart > div + div {margin-left:calc((100% - 30rem - 8px) / 2);}
.chart > div span {display:block; font-size:2rem; position:relative;  z-index:10;}
.chart > div ul {padding-top:2rem;}
.chart > div ul li {height:3.5rem; line-height:3.3rem; border:1px solid #ccc; background-color:#fff;}
.chart > div ul li + li {margin-top:1rem;}

/* 20210103_조직도 개편*/
.chart > div:nth-of-type(2) {transform:translateX(-12rem); -webkit-transform:translateX(-12rem); -moz-transform:translateX(-12rem); -ms-transform:translateX(-12rem);}
.chart > div:nth-of-type(2) > b {position:absolute; top:8rem; left:50%; margin-left:2rem; display:inline-block; *display:inline; *zoom:1; height:3.5rem; line-height:3.3rem; border:1px solid #ccc; background-color:#fff; width:100%;}
.chart > div:nth-of-type(2) > b:before {position:absolute; top:50%; left:-2rem; content:''; width:2rem; height:1px; background:#d9d9d9; z-index:-1; }

.chart > div ul.sales {padding-top:6.5rem;}
.chart > div ul.sales:before {position:absolute; top:6.5rem; left:50%; content:''; width:1px; height:6.5rem; background:#d9d9d9; z-index:-1; }

.chart > div ul.sales li {position:relative; height:auto; line-height:auto; border:none; background-color:transparent; }
.chart > div ul.sales > li {margin-bottom:10rem;}
.chart > div ul.sales > li + li {margin-bottom:5.5rem;}
.chart > div ul.sales li span {display:inline-block; *display:inline; *zoom:1; height:3.5rem; line-height:3.3rem; border:1px solid #ccc; background-color:#fff; width:100%; font-size:1.2rem;}
.chart > div ul.sales li ul {position:absolute; top:0; left:12rem; padding-top:0;  width:100%; }
.chart > div ul.sales li ul:before {position:absolute; top:1.75rem; left:-1rem; content:''; width:1px; background:#d9d9d9; z-index:-1; }
.chart > div ul.sales li:first-child ul:before {height:9rem;}
.chart > div ul.sales li:nth-child(2) ul:before,
.chart > div ul.sales li:nth-child(3) ul:before {height:4.5rem;}

.chart > div ul.sales li ul ul:before {content:none; display:none;}
.chart > div ul.sales li ul li:before {position:absolute; top:1.75rem; left:-1rem; content:''; width:1rem; height:1px; background:#d9d9d9; z-index:-1; }
.chart > div ul.sales li ul li:first-child:before {width:2rem; left:-2rem; }

.chart > div ul.sales li ul li span {background-color:#f4f4f4;}
.chart > div ul.sales li ul li li span {background-color:#fff;}

.organogram > ul {width:100%; max-width:66rem; margin:5rem auto 0; border-top:2px solid #000;}
.organogram > ul li {border-bottom:1px solid #ddd; padding:1.2rem 0 1.2rem 3rem;}
.organogram > ul li em {display:inline-block; width:calc(9.2rem - 4px); font-family:'NotokrM';}
.organogram .refer {max-width:66rem; text-align:left; padding-left:calc(12.2rem - 4px); margin:2rem auto 0;}
.organogram .mobile {display:none;}

/* 사업장안내 */
.network .select {display:none;}
.tab_ntw {width:100%; display:flex; flex-wrap:wrap; justify-content:space-between; border-top:1px solid #d9d9d9; border-right:1px solid #d9d9d9;}
.tab_ntw li {width:20%; height:5rem; line-height:4.8rem; text-align:center; border-left:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9; position:relative;}
.tab_ntw li.on:before {content:""; width:100%; height:100%; border:1px solid #005cb9; position:absolute; left:-1px; top:-1px; z-index:100; box-shadow:5px 5px 5px 0 rgba(0,0,0,.1);}
.dmst_map {margin-top:5rem; background:url('../imgs/bg/map_korea.png') no-repeat center top; position:relative;}
.dmst_map.gg_on {background:url('../imgs/bg/map_korea.png') no-repeat center 45px; position:relative;}
.dmst_map > strong {position:absolute; left:calc(50% - 66px); top:111px; padding-left:11.4rem; font-size:1.4rem;  z-index:100;}
.dmst_map.gg_on > strong {top:158px;}
.dmst_map > strong:after {content:""; width:10.4rem; height:1px; background:#ff39a0; position:absolute; left:0; top:50%;}
.dmst_map > strong:before {content:""; width:7px; height:7px; -webkit-border-radius:100px; border-radius:100px; background:#ff39a0; position:absolute; left:0; top:50%; margin-top:-3.5px;}
.dmst_map > div {height:608px; display:none; opacity:0;}
.spot {position:absolute; left:0; top:18px; z-index:10; width:100%; border-top:1px solid #d9d9d9; opacity:0;}
.spot.right {left:auto; right:0; display:flex; flex-direction:column; align-items:flex-end;}
.spot em, .spot ul {width:17.5rem; text-align:right; display:block; position:relative; z-index:1000;}
.spot em {margin-top:-1.5rem; padding:.5rem 2rem 2rem 0; z-index:1000;  font-family:'NotokrM'; font-size:1.4rem;}
.spot.right em, .spot.right > ul {text-align:left;}
.spot.right > em {padding:.5rem 0 2rem 2rem;}
.spot:after {content:""; width:0; height:123px; border-left:1px solid #d9d9d9; position:absolute; left:calc(100% - 1px); top:0;}

.spot ul li {width:100%; display:flex; justify-content:space-between; padding:0 2rem 0 0; line-height:1.8rem;} 
.spot.right ul li {padding:0 0 0 2rem;}
.spot:before {border-top:1px solid #d9d9d9;}

/* 사업장안내 - 경기 */
.dmst_map > div.gyeonggi {height:877px; background:url('../imgs/bg/map_gyeonggi.png') no-repeat; display:block; background-position:calc(50% - 40px) 90px;}
.dmst_map > div > span {position:absolute; width:7px; height:7px; -webkit-border-radius:100px; border-radius:100px; background:#ffe200; opacity:0;}
.gyeonggi > span:nth-of-type(1) {left:calc(50% - 81px); top:137px;}
.gyeonggi > span:nth-of-type(2) {left:calc(50% - 60px); top:190px;}
.gyeonggi > span:nth-of-type(3) {left:calc(50% - 78.5px); top:198px;}
.gyeonggi > span:nth-of-type(4) {left:calc(50% - 55px); top:205px;}
.gyeonggi > span:nth-of-type(5) {left:calc(50% - 48px); top:214px;}
.gyeonggi > span:nth-of-type(6) {left:calc(50% - 58px); top:223px;}
.gyeonggi > span:nth-of-type(7) {left:calc(50% - 41px); top:222px;}
.gyeonggi > span:nth-of-type(8) {left:calc(50% - 53px); top:114px;}
.gyeonggi > span:nth-of-type(9) {left:calc(50% - 41px); top:188px;}
.gyeonggi > span:nth-of-type(10) {left:calc(50% - 30px); top:191px;}
.gyeonggi > span:nth-of-type(11) {left:calc(50% - 26px); top:202px;}
.gyeonggi > span:nth-of-type(12) {left:calc(50% - 32px); top:212px;}

.gyeonggi .spot:nth-of-type(1) {width:calc(50% - 77px); top:17px;}
.gyeonggi .spot:nth-of-type(2) {width:calc(50% - 134px); top:112px;}
.gyeonggi .spot:nth-of-type(2):after {height:81px;}
.gyeonggi .spot:nth-of-type(2):before, .gyeonggi .spot:nth-of-type(4):before, .gyeonggi .spot:nth-of-type(11):before, .gyeonggi .spot:nth-of-type(12):before, 
.gyeonggi .spot:nth-of-type(14):before {content:""; width:74px; height:1px; position:absolute; left:100%; top:80px;}
.gyeonggi .spot:nth-of-type(3) {width:calc(50% - 74px); top:247px;}
.gyeonggi .spot:nth-of-type(3):after {height:43px; top:-43px;}
.gyeonggi .spot:nth-of-type(4) {width:calc(50% - 64px); top:362px;}
.gyeonggi .spot:nth-of-type(4):after {height:155px; top:-155px;}
.gyeonggi .spot:nth-of-type(4):before {width:9px; top:-155px;}
.gyeonggi .spot:nth-of-type(5) {width:calc(50% - 44px); top:475px;}
.gyeonggi .spot:nth-of-type(5):after {height:255px; top:-255px;}
.gyeonggi .spot:nth-of-type(6) {width:calc(50% - 54px); top:590px;}
.gyeonggi .spot:nth-of-type(6):after {height:361px; top:-361px;}
.gyeonggi .spot:nth-of-type(7) {width:calc(50% - 37px); top:685px;}
.gyeonggi .spot:nth-of-type(7):after {height:457px; top:-457px;}
.gyeonggi .spot:nth-of-type(8) {width:calc(50% + 50px); top:17px;}
.gyeonggi .spot:nth-of-type(8):after {height:100px; left:auto; right:calc(100% - 1px); top:0;}
.gyeonggi .spot:nth-of-type(9) {width:calc(50% + 38px); top:131px;}
.gyeonggi .spot:nth-of-type(9):after {height:56px; left:auto; right:calc(100% - 1px); top:0;}
.gyeonggi .spot:nth-of-type(10) {width:calc(50% - 162px); top:246px;}
.gyeonggi .spot:nth-of-type(10):after {height:116px; left:auto; right:calc(100% - 1px); top:-116px;}
.gyeonggi .spot:nth-of-type(11) {width:calc(50% - 62px); top:359px;}
.gyeonggi .spot:nth-of-type(11):after {height:166px; left:auto; right:calc(100% - 1px); top:-166px;}
.gyeonggi .spot:nth-of-type(11):before {width:85px; left:auto; right:100%; top:-166px;}
.gyeonggi .spot:nth-of-type(12) {width:calc(50% - 42px); top:473px;}
.gyeonggi .spot:nth-of-type(12):after {height:269px; left:auto; right:calc(100% - 1px); top:-269px;}
.gyeonggi .spot:nth-of-type(12):before {width:61px; left:auto; right:100%; top:-269px;}
.gyeonggi .spot:nth-of-type(13) {width:calc(50% - 162px); top:587px;}
.gyeonggi .spot:nth-of-type(13):after {height:115px; left:auto; right:calc(100% - 1px); top:-115px;}
.gyeonggi .spot:nth-of-type(14) {width:calc(50% - 25px); top:701px;}
.gyeonggi .spot:nth-of-type(14):after {height:487px; left:auto; right:calc(100% - 1px); top:-487px;}
.gyeonggi .spot:nth-of-type(14):before {width:50px; left:auto; right:100%; top:-487px;}

/* 사업장안내 - 인천 */
.dmst_map > div.incheon {background:url('../imgs/bg/map_incheon.png') no-repeat; background-position:calc(50% - 108px) 87px;}
.incheon > span {left:calc(50% - 93px); top:125px;}
.incheon .spot {width:calc(50% - 93px); top:127px;}
.incheon .spot:after {position:static; width:0; height:0; border:0;}

/* °­¿øµµ */
.dmst_map > div.gangwon {background:url('../imgs/bg/map_gangwon.png') no-repeat; background-position:calc(50% + 50px) 0; margin-top:-5px;}
.gangwon > span {top:73px; left:calc(50% + 83px);}
.gangwon > span:nth-of-type(2) {top:104px; left:calc(50% + 107px);}
.gangwon .spot:nth-of-type(1) {width:calc(50% - 90px); top:76px;}
.gangwon .spot:nth-of-type(1):after {position:static; width:0; height:0; border:0;}
.gangwon .spot:nth-of-type(2) {width:calc(50% - 110px); top:263px;}
.gangwon .spot:nth-of-type(2):after {height:153px; left:auto; right:calc(100% - 1px); top:-153px;}

/* 사업장안내 - 충청 */
.dmst_map > div.chungcheong {background:url('../imgs/bg/map_chungcheong.png') no-repeat; background-position:calc(50% - 23px) 152px;}
.chungcheong > span {left:calc(50% - 101.5px); top:192px;}
.chungcheong > span:nth-of-type(2) { left:calc(50% - 84px); top:254px;}
.chungcheong > span:nth-of-type(3) {left:calc(50% - 8.5px); top:180px;}
.chungcheong > span:nth-of-type(4) {left:calc(50% - 34px); top:229px;}

.chungcheong .spot:nth-of-type(1) {width:calc(50% - 98px); top:133px;}
.chungcheong .spot:nth-of-type(1):after {height:59px; top:0;}
.chungcheong .spot:nth-of-type(2) {width:calc(50% - 80px); top:332px;}
.chungcheong .spot:nth-of-type(2):after {height:72px; top:-72px;}
.chungcheong .spot:nth-of-type(3) {width:calc(50% + 5.5px); top:133px;}
.chungcheong .spot:nth-of-type(3):after {left:auto; right:calc(100% - 1px); height:47px; top:0;}
.chungcheong .spot:nth-of-type(4) {width:calc(50% + 31px); top:267px;}
.chungcheong .spot:nth-of-type(4):after {height:32px; left:auto; right:calc(100% - 1px); top:-32px;}

/* 사업장안내 - 대전 */
.dmst_map > div.daejeon {background:url('../imgs/bg/map_daejeon.png') no-repeat; background-position:calc(50% - 21px) 238px;}
.daejeon > span {top:249px; left:calc(50% - 32px);}
.daejeon .spot {width:calc(50% - 32px); top:252px;}
.daejeon .spot:after {position:static; width:0; height:0; border:0;}

/* 사업장안내 - 경상 */
.dmst_map > div.gyeongsang {background:url('../imgs/bg/map_gyeongsang.png') no-repeat; background-position:calc(50% + 83px) 161px;}
.gyeongsang > span {top:266px; left:calc(50% + 60px);}
.gyeongsang > span:nth-of-type(2) {top:346px; left:calc(50% + 90px);}
.gyeongsang > span:nth-of-type(3) {top:306px; left:calc(50% + 90px);}
.gyeongsang > span:nth-of-type(4) {position:static; background:none; width:0; height:0;}
.gyeongsang > span:nth-of-type(5) {top:291px; left:calc(50% + 147px);}
.gyeongsang > span:nth-of-type(6) {top:357px; left:calc(50% + 108px);}

.gyeongsang .spot:nth-of-type(1) {width:calc(50% + 64px); top:195px;}
.gyeongsang .spot:nth-of-type(1):after {height:70px; top:0;}
.gyeongsang .spot:nth-of-type(2) {width:calc(50% + 63px); top:323px;}
.gyeongsang .spot:nth-of-type(2):after {height:25px; top:0;}
.gyeongsang .spot:nth-of-type(2):before {content:""; width:27px; height:1px; background:#d9d9d9; position:absolute; left:100%; top:25px;}
.gyeongsang .spot:nth-of-type(3) {width:calc(50% - 93px); top:114px;}
.gyeongsang .spot:nth-of-type(3):after {left:auto; right:calc(100% - 1px); height:192px; top:0;}
.gyeongsang .spot:nth-of-type(4) {width:calc(50% - 182px); top:223px;}
.gyeongsang .spot:nth-of-type(4):after {height:110px; left:auto; right:calc(100% - 1px); top:-110px;}
.gyeongsang .spot:nth-of-type(5) {width:calc(50% - 150px); top:350px;}
.gyeongsang .spot:nth-of-type(5):after {left:auto; right:calc(100% - 1px); height:53px; top:-53px;}
.gyeongsang .spot:nth-of-type(6) {width:calc(50% - 111px); top:480px;}
.gyeongsang .spot:nth-of-type(6):after {height:117px; left:auto; right:calc(100% - 1px); top:-117px;}

/* 사업장안내 - 울산 */
.dmst_map > div.ulsan {background:url('../imgs/bg/map_ulsan.png') no-repeat; background-position:calc(50% + 143px) 321px;}
.ulsan > span {top:333px; left:calc(50% + 130px);}
.ulsan .spot:nth-of-type(1) {width:calc(50% - 133px); top:135px;}
.ulsan .spot:nth-of-type(1):after {height:198px; left:auto; right:calc(100% - 1px); top:0;}
.ulsan .spot:nth-of-type(2) {width:calc(50% - 207px); top:412px;}
.ulsan .spot:nth-of-type(2):after {height:278px; left:auto; right:calc(100% - 1px); top:-278px;}

/* 사업장안내 - 부산 */
.dmst_map > div.busan {background:url('../imgs/bg/map_busan.png') no-repeat; background-position:calc(50% + 124px) 359px;}
.busan > span {top:374px; left:calc(50% + 119px);}
.busan .spot {width:calc(50% - 122px); top:176px;}
.busan .spot:after {height:198px; left:auto; right:calc(100% - 1px); top:0;}

/* 사업장안내 - 전라 */
.dmst_map > div.jeolla {background:url('../imgs/bg/map_jeolla.png') no-repeat; background-position:calc(50% - 69px) 273px;}
.jeolla > span {top:289px; left:calc(50% - 86px);}
.jeolla > span:nth-of-type(2) {top:353px; left:calc(50% - 84px);}
.jeolla > span:nth-of-type(3) {top:414px; left:calc(50% - 8px);}

.jeolla .spot:nth-of-type(1) {width:calc(50% - 82px); top:151px;}
.jeolla .spot:nth-of-type(1):after {height:137px; top:0;}
.jeolla .spot:nth-of-type(2) {width:calc(50% - 80px); top:322px;}
.jeolla .spot:nth-of-type(2):after {height:30px; top:0;}
.jeolla .spot:nth-of-type(3) {width:calc(50% + 5px); top:236px;}
.jeolla .spot:nth-of-type(3):after {height:177px; left:auto; right:calc(100% - 1px); top:0;}

/* 사업장안내 - 제주 */
.dmst_map > div.jeju {background:url('../imgs/bg/map_jeju.png') no-repeat; background-position:calc(50% - 98px) bottom;}
.jeju > span {top:561px; left:calc(50% - 96px);}
.jeju .spot {width:calc(50% + 93px); top:353px;}
.jeju .spot:after {height:207px; left:auto; right:calc(100% - 1px); top:0;}

.spot:hover, .spot:hover:before {border-top:1px solid #ffe200;}
.spot:hover:after {border-left:1px solid #ffe200;}
.spot > i {width:3rem; height:3rem; position:absolute; left:14.5rem; top:-1.5rem; z-index:100; background:#ffe200; border-radius:100%;}
.spot > i span {width:3rem; height:3rem; display:block; border-radius:100%; background:#ffe200; position:absolute; overflow:hidden;}
.spot:hover > i span:before {content:""; width:0; height:0; border:.8rem solid transparent; border-right:1.5rem solid #008800; position:absolute; left:5.3rem; top:.6rem; transform:translateX(-4rem); opacity:1;}
.spot:hover > i:before {content:""; width:0; height:0; border:.8rem solid transparent; border-right:1.5rem solid #0099e8; position:absolute; left:5.3rem; top:.6rem; transform:translateX(-4rem); opacity:1; z-index:-1;}
.spot.right > i {left:auto; right:14.5rem;}
.spot.right:hover > i span:before {content:""; width:0; height:0; border:.8rem solid transparent; border-left:1.5rem solid #008800; position:absolute; left:3.2rem; top:.6rem; transform:translateX(-4rem); opacity:1;}
.spot.right:hover > i:before {content:""; width:0; height:0; border:.8rem solid transparent; border-left:1.5rem solid #0099e8; position:absolute; left:3.3rem; top:.6rem; transform:translateX(-4rem); opacity:1;}

.dmst_map > div.on {opacity:1; transition:all 1s ease-in-out;}
.dmst_map > div > span.on {opacity:1; transition:all .3s ease-in-out;}
.dmst_map > div  .spot.on {opacity:1; transition:all 1s ease-in-out;}

.dmst_map + h4.tit01 {margin-top:9rem;}
.fr_map {width:850px; height:490px; margin:2rem auto 0; background:url('../imgs/bg/map_world.png') no-repeat center top; position:relative;}
.fr_map > span {width:7px; height:7px; -webkit-border-radius:100px; border-radius:100px; background:#0099e8; position:absolute;}
.fr_map > span:nth-of-type(1) {right:275px; top:206px; background:#ff39a0;}
.fr_map > span:nth-of-type(2) {left:33px; top:222px;}
.fr_map > span:nth-of-type(3) {left:44px; top:178px;}
.fr_map > span:nth-of-type(4) {left:44px; top:227px;}
.fr_map > span:nth-of-type(5) {left:47px; top:202px;}
.fr_map > span:nth-of-type(6) {left:59px; top:206px;} 
.fr_map > span:nth-of-type(7) {left:63px; top:190px;}
.fr_map > span:nth-of-type(8) {left:70px; top:139px;}
.fr_map > span:nth-of-type(9) {left:73px; top:175px;}
.fr_map > span:nth-of-type(10) {left:76px; top:213px;}
.fr_map > span:nth-of-type(11) {left:83px; top:147px;}
.fr_map > span:nth-of-type(12) {left:85px; top:190px;}
.fr_map > span:nth-of-type(13) {left:85px; top:219px;}
.fr_map > span:nth-of-type(14) {left:95px; top:178px;}
.fr_map > span:nth-of-type(15) {left:102px; bottom:79px;}
.fr_map > span:nth-of-type(16) {left:107px; top:178px;}
.fr_map > span:nth-of-type(17) {left:107px; top:215px;}
.fr_map > span:nth-of-type(18) {left:117px; top:138px;}
.fr_map > span:nth-of-type(19) {left:118px; top:225px;}
.fr_map > span:nth-of-type(20) {left:138px; top:253px;}
.fr_map > span:nth-of-type(21) {left:143px; top:158px;}
.fr_map > span:nth-of-type(22) {left:160px; top:253px;}
.fr_map > span:nth-of-type(23) {left:170px; top:268px;}
.fr_map > span:nth-of-type(24) {left:233px; top:260px;}
.fr_map > span:nth-of-type(25) {left:283px; top:276px;}
.fr_map > span:nth-of-type(26) {left:292px; top:283px;}
.fr_map > span:nth-of-type(27) {left:317px; top:300px;}
.fr_map > span:nth-of-type(28) {left:320px; top:264px;}
.fr_map > span:nth-of-type(29) {left:321px; top:290px;}
.fr_map > span:nth-of-type(30) {left:322px; top:225px;}
.fr_map > span:nth-of-type(31) {left:331px; top:218px;}
.fr_map > span:nth-of-type(32) {left:332px; top:234px;}
.fr_map > span:nth-of-type(33) {left:333px; top:264px;}
.fr_map > span:nth-of-type(34) {left:343px; top:253px;}
.fr_map > span:nth-of-type(35) {left:345px; top:243px;}
.fr_map > span:nth-of-type(36) {left:382px; top:229px;}
.fr_map > span:nth-of-type(37) {left:391px; top:222px;}
.fr_map > span:nth-of-type(38) {left:412px; bottom:45px;}
.fr_map > span:nth-of-type(39) {left:425px; bottom:67px;}
.fr_map > span:nth-of-type(40) {right:264px; top:193px;}
.fr_map > span:nth-of-type(41) {right:258px; top:160px;}
.fr_map > span:nth-of-type(42) {right:258px; top:222px;}
.fr_map > span:nth-of-type(43) {right:231px; top:222px;}
.fr_map > span:nth-of-type(44) {right:214px; top:234px;}
.fr_map > span:nth-of-type(45) {right:187px; top:209px;}
.fr_map > span:nth-of-type(46) {right:180px; top:218px;}
.fr_map > span:nth-of-type(47) {right:180px; top:242px;}
.fr_map > span:nth-of-type(48) {right:151px; top:197px;}
.fr_map > span:nth-of-type(49) {right:122px; bottom:65px;}
.fr_map .spot {width:116px; text-align:left; left:auto; top:209px; right:275px; z-index:-1; padding-top:77px; opacity:1;}
.fr_map .spot:after {height:77px; left:0;}
.fr_map .spot > i {width:36px; height:36px; border-radius:100%; background:#ffe200; position:absolute; left:-17px; top:60px; z-index:1;}
.fr_map .spot > em {padding:5px 21px 0 0; display:block; text-align:left; font-family:'NotokrM';}
.fr_map .spot > ul li {padding:0 0 0 21px; margin-top:12px;}

.map_box {width:100%; height:32rem; overflow:hidden;}

.location > ul {border-top:2px solid #000;}
.location > ul li {padding:2.6rem 0; border-bottom:1px solid #ddd;}
.location > ul li.on {padding:2.6rem 0 0; border-bottom:0;}
.location > ul li > a {width:100%; display:flex; flex-wrap:wrap; justify-content:space-between; position:relative; padding:0 6rem 0 3rem; font-size:1.6rem; font-family:'NotokrM'; background:url('../imgs/btn/open.svg') no-repeat right center; background-size:1.7rem;}
.location > ul li.on > a {color:#000; background:url('../imgs/btn/close.svg') no-repeat right center; background-size:1.7rem;}
.location > ul li > a strong {width:50%;}
.location > ul li > a span {width:50%; font-size:1.2rem; text-align:right;}
.location > ul li > a:after {content:""; width:14px; height:18px; position:absolute; left:0; top:.2rem; background:url('../imgs/ico/ico_branch01.svg') no-repeat center center; background-size:14px 18px;}
.location > ul li.on > a:after {background:url('../imgs/ico/ico_branch02.svg') no-repeat center center; background-size:14px 18px;}
.map_area {height:0; overflow:hidden;}
.location > ul li.on .map_area {height:auto; transition:height 1s ease-in-out;}
.map_area > div:nth-of-type(1) {padding:1.5rem 6rem 2.3rem 3rem; display:flex; justify-content:space-between;}

/* Contact Us */
.contactus .tit02 ~ .tit02 {margin-top:6rem;}
.contactus > div {text-align:center;}
.home_info {text-align:left; margin-top:2rem; display:flex; }
.home_info address {width:calc(100% - 28.6rem); padding:.7rem 0 .7rem 4.2rem; position:relative;}
.home_info address:after, .home_info > span:after {content:""; width:3.2rem; height:3.2rem; border-radius:100%; position:absolute; left:0; top:0; background:#005cb9;}
.home_info address:after {background:#005cb9 url('../imgs/ico/ico_location.svg') no-repeat center center; background-size:1rem;}
.home_info > span {width:12.8rem;  padding:.7rem 0 .7rem 4.2rem; position:relative;}
.home_info > span.tel:after {content:"T"; color:#fff; text-align:center; font-size:1.4rem; line-height:3.2rem; background:#0099e8;}
.home_info > span.fax:after {content:"F"; color:#000; text-align:center; font-size:1.4rem; line-height:3.2rem; background:#ffe200;}
.home_info > span + span {margin-left:3rem;}
.home_info + a {display:inline-block; margin:4rem 0 0; padding:2rem 9.5rem 2rem 3rem; color:#fff; font-size:2rem; line-height:100%; background:#0099e8; position:relative;}
.home_info + a:after {content:""; width:4.7rem; height:100%; background:#005cb9; position:absolute; right:0; top:0;}
.home_info + a:before {content:""; width:6.4rem; height:100%;  position:absolute; right:0; top:0; background:url('../imgs/ico/ico_arrow.svg') no-repeat left center; background-size:3.5rem; z-index:100;}

.contactus .web {display:block;}
.contactus .mobile {display:none;}

/* Faq */
.faq ul {width:100%; border-top:2px solid #000;}
.faq ul li {border-bottom:1px solid #ddd; padding:3rem 0 2.8rem;}
.faq ul li.on {border-bottom:0; padding:3rem 0 0;}
.faq ul li i, .faq li a {display:inline-block; font-size:1.6rem; line-height:100%;}
.faq ul li i {width:3rem; color:#0099e8}
.faq ul li a {width:calc(100% - 3rem); margin-left:-4px; padding-right:2rem; color:#000; background:url('../imgs/btn/open.svg') no-repeat right center; background-size:1.7rem .9rem;}
.faq ul li a span {display:inline;}
.faq ul li.on a {font-family:'NotokrM'; background:url('../imgs/btn/close.svg') no-repeat right center; background-size:1.7rem .9rem;}
.faq ul li p {display:none; padding:3.8rem 3rem; margin-top:3rem; background:#f8f8f8; font-size:1.2rem; line-height:2rem;}

@media only screen and (max-width:1919px) {
	.visual.loex {background:url('../imgs/vis/vis_loex.jpg') no-repeat left center; background-size:cover;}
	.visual.business {background:url('../imgs/vis/vis_business.jpg') no-repeat left center; background-size:cover;}
	.visual.support {background:url('../imgs/vis/vis_support.jpg') no-repeat left center; background-size:cover;}

	.customer li img {width:70%;}
}

@media only screen and (max-width:1599px) {
	.gyeonggi .spot:nth-of-type(5) > span:after {height:183px; top:-183px;}
	.gyeonggi .spot:nth-of-type(10), .gyeonggi .spot:nth-of-type(13) {width: calc(50% - 112px);}
	.chungcheong > div:nth-of-type(2) {left:0; top:271px;}
	.customer li img {width:80%;}	

	.fwd01 > div {display:flex; flex-wrap:nowrap; justify-content:space-between; position:relative;}
	.fwd01 > div:after {content:""; width:0; height:0;  border:.65rem solid transparent; border-left:1.2rem solid #ffe200; position:absolute; left:calc(24.5rem + ((50% - 28.25rem) / 2)); top:50%; margin-top:-3.2rem; transform:translateX(-4rem); z-index:100;}
	.fwd01 > div:before {content:""; width:0; height:0; border:.65rem solid transparent; border-left:1.2rem solid #ffe200; position:absolute; left:calc(50% + 7.25rem + (50% - 28.25rem) / 2 + 3.5rem); top:50%; margin-top:-3.2rem; transform:translateX(-4rem); z-index:100;}
	.fwd01 > div > div {width:21rem; padding-top:12rem; text-align:center; position:relative;}
	.fwd01 > div > div:nth-of-type(2) {width:14.5rem;}
	.fwd01 > div > div > span {width:8rem; height:8rem; border-radius:100%; position:absolute; left:0; top:0; background:#f7f7f7; overflow:hidden;}
	.fwd01 > div > div > span:nth-of-type(2), .fwd01 > div.fwd_con02 > span:nth-of-type(2) {left:6.5rem;}
	.fwd01 > div > div > span:nth-of-type(3) {left:13rem;}
	.fwd01 > div > div > span:nth-of-type(2):after, .fwd01 > div > div > span:nth-of-type(3):after {content:""; width:100%; height:100%; border-radius:100%; background:#efefef; position:absolute; left:-6.5rem; top:0;}
}

@media only screen and (max-width:1439px) {
	.gyeonggi .spot:nth-of-type(10), .gyeonggi .spot:nth-of-type(13) {width: calc(50% - 182px);}
	.customer li img {width:70%;}

	.fwd01 > div {display:flex; flex-wrap:nowrap; justify-content:space-between; position:relative;}
	.fwd01 > div:after {content:""; width:0; height:0;  border:.8rem solid transparent; border-left:1.5rem solid #ffe200; position:absolute; left:calc(29.4rem + ((50% - 35rem) / 2)); top:50%; margin-top:-2.6rem; transform:translateX(-4rem); z-index:100;}
	.fwd01 > div:before {content:""; width:0; height:0;  border:.8rem solid transparent; border-left:1.5rem solid #ffe200; position:absolute; left:calc(47.4rem + (50% - 35rem) + ((50% - 35rem) / 2)); top:50%; margin-top:-2.6rem; transform:translateX(-4rem); z-index:100;}
	.fwd01 > div > div {width:26rem; padding-top:12rem; text-align:center; position:relative;}
	.fwd01 > div > div:nth-of-type(2) {width:18rem;}
	.fwd01 > div > div > span {width:10rem; height:10rem; border-radius:100%; position:absolute; left:0; top:0; background:#f7f7f7; overflow:hidden;}
	.fwd01 > div > div > span:nth-of-type(2), .fwd01 > div.fwd_con02 > span:nth-of-type(2) {left:8rem;}
	.fwd01 > div > div > span:nth-of-type(3) {left:16rem;}
	.fwd01 > div > div > span:nth-of-type(2):after, .fwd01 > div > div > span:nth-of-type(3):after {content:""; width:100%; height:100%; border-radius:100%; background:#efefef; position:absolute; left:-8rem; top:0;}
}

@media only screen and (max-width:1023px) {	
	.exp_con dl dt:after {opacity:1;}
	.exp_con:hover dl dt:after {transition:none;}
	.exp_con:nth-of-type(even) dl dt:after, .exp_con:nth-of-type(even) .link02:after {background:#0099e8;}

	.link02:after {background:#ffe200; transition:none;}

	.process {width:100%; margin-top:11.2rem; display:flex; flex-wrap:wrap;}
	.process > li {width:50%; position:relative; padding-right:5rem;}
	.process > li:nth-of-type(3n + 1):after {width:calc(100% + 5rem); left:0;}
	.process > li:nth-of-type(even):after {width:calc(100% + 5rem);}
	.process > li:nth-of-type(2) ~ li {margin-top:5rem;}
	.process > li:nth-of-type(2n + 1):after {width:calc(100% + 5rem); left:-5rem;}
	.process > li:nth-of-type(1):after {width:100%; left:0;}
	.process > li:last-child:after {width:0; left:0;}

	.branch:after {transform:rotate(45deg);}
	.branch > dl dd a span {margin-left:1rem; padding-right:5rem; background:url('../imgs/ico/ico_arrow2.svg') no-repeat right center; background-size:4rem;}

	.gyeonggi .spot:nth-of-type(10), .gyeonggi .spot:nth-of-type(13) {width: calc(50% - 112px);}

	.customer li img {width:80%;}

	.fwd01 > div {display:flex; flex-wrap:nowrap; justify-content:space-between; position:relative;}
	.fwd01 > div:after {content:""; width:0; height:0;  border:.65rem solid transparent; border-left:1.2rem solid #ffe200; position:absolute; left:calc(24.5rem + ((50% - 28.25rem) / 2)); top:50%; margin-top:-3.2rem; transform:translateX(-4rem); z-index:100;}
	.fwd01 > div:before {content:""; width:0; height:0; border:.65rem solid transparent; border-left:1.2rem solid #ffe200; position:absolute; left:calc(50% + 7.25rem + (50% - 28.25rem) / 2 + 3.5rem); top:50%; margin-top:-3.2rem; transform:translateX(-4rem); z-index:100;}
	.fwd01 > div > div {width:21rem; padding-top:12rem; text-align:center; position:relative;}
	.fwd01 > div > div:nth-of-type(2) {width:14.5rem;}
	.fwd01 > div > div > span {width:8rem; height:8rem; border-radius:100%; position:absolute; left:0; top:0; background:#f7f7f7; overflow:hidden;}
	.fwd01 > div > div > span:nth-of-type(2), .fwd01 > div.fwd_con02 > span:nth-of-type(2) {left:6.5rem;}
	.fwd01 > div > div > span:nth-of-type(3) {left:13rem;}
	.fwd01 > div > div > span:nth-of-type(2):after, .fwd01 > div > div > span:nth-of-type(3):after {content:""; width:100%; height:100%; border-radius:100%; background:#efefef; position:absolute; left:-6.5rem; top:0;}
	.fr_map {margin:2rem -6rem 0;}

	.gyeongsang .spot:nth-of-type(4) {width:calc(50% - 114px); top:223px;}
}