@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');

/* LAYOUT */
body { -webkit-text-size-adjust: 100%; }
#wrap { overflow: hidden; margin: 0 auto; -webkit-overflow-scrolling : touch; }
#header { position: fixed; width: 100%; left: 0; top: 0; background-color: #ffffff; border-bottom: 1px solid #ededed; z-index: 11; }
#container { overflow: hidden; margin: 100px auto 0; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#footer { position: relative; margin-top: 110px; padding: 50px; background-color: #333333; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }

/* 공통 */
.radius8 { -webkit-border-radius:8px; -moz-border-radius:8px; border-radius:8px; }
.radius80 { -webkit-border-radius:80px; -moz-border-radius:80px; border-radius:80px; }

:root {
	--font-16: 16px;
	--font-17: 17px;
	--font-18: 18px;
	--font-20: 20px;
	--font-26: 26px;
	--font-30: 30px;
	--font-40: 40px;

	--line-17: 17px;
	--line-20: 20px;
	--line-30: 30px;
	--line-34: 34px;
	--line-40: 40px;
	--line-48: 48px;

	--color-whitecfd: #cfd4f9;
	--color-whitefff: #ffffff;
}


/* HEADER */
#header > .outer { display: flex; position: relative; justify-content: space-between; width:1720px; margin:0 auto; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#header > .outer h1 { margin: 0; padding: 0; line-height: 0; }
#header > .outer h1 img { height:100px; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }


/* HEADER - GNB */
#header > .outer .gnb { position: absolute; height: 61px; right: 0; top: 40px; }
#header > .outer .gnb ul { margin: 0; padding: 0; }
#header > .outer .gnb li { position: relative; list-style: none; float: left; margin: 0 0 0 40px; }
#header > .outer .gnb li:first-child { margin: 0; }
#header > .outer .gnb a,
#header > .outer .gnb a:hover { display: block; font-weight: 500; font-size: 18px; line-height: 18px; color: #333333; text-align: left; }
#header > .outer .gnb:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#header > .outer .gnb .sub_menu { position: absolute; width: 180px; left: 0; top: 61px; margin-left: -54px; background-color: #0e133b; z-index: 1; display: none; }
#header > .outer .gnb .sub_menu.v1 { margin-left: -34px; }
#header > .outer .gnb .sub_menu ul { margin: 0; padding: 20px 0; }
#header > .outer .gnb .sub_menu li { list-style: none; float: none; margin: 0;}
#header > .outer .gnb .sub_menu a,
#header > .outer .gnb .sub_menu a:hover { display: block; font-size: 13.5px; line-height: 30px; font-weight: 300; color: #e4e4e4; letter-spacing: -1px; text-align: center; }

#header > .outer .gnb .sub_menu ul li.select a,
#header > .outer .gnb .sub_menu ul li.select a:hover { color: #ffd906; }


/* 모바일버튼 */
#header .gnb_btn { z-index: 12; position:absolute; top:20px; right:3.5%; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition: all 0.5s ease; transition:all 0.5s ease; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity:0; opacity:0; visibility: hidden; }
#header .gnb_btn .btn_nav { position:relative; width:26px; height:20px; cursor:pointer; }
#header .gnb_btn .btn_nav span { display:block; position:absolute; width:100%; height:3px; left:0; background:#333; -webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.3s ease-in-out;-moz-transition:.3s ease-in-out;-o-transition:.3s ease-in-out;transition:.3s ease-in-out; }
#header .gnb_btn .btn_nav span.ico1 { top:0px; }
#header .gnb_btn .btn_nav span.ico2,
#header .gnb_btn .btn_nav span.ico3 { top:8px; }
#header .gnb_btn .btn_nav span.ico4 { top:16px; }
#header .gnb_btn .btn_nav.open span.ico1 { width:0%; left:50%; top:18px; }
#header .gnb_btn .btn_nav.open span.ico2 { width:100%; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg);}
#header .gnb_btn .btn_nav.open span.ico3 { width:100%; -webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg); transform:rotate(-45deg); }
#header .gnb_btn .btn_nav.open span.ico4 { width:0%; top:18px; left:50%;}


/* 모바일 메뉴영역 */
.gnb_m_bg { position:fixed; overflow-y:auto; width:100%; height:100vh; left:0; top:0; background-color:rgba(0,0,0,0.6); -webkit-overflow-scrolling:touch; z-index:99999999; display:none; }
.gnb_m { position:fixed; overflow-y:auto; width:85%; height:100vh; left:-100%; top:0; margin-right:15%; background-color:#1c43a6; opacity:0; -webkit-overflow-scrolling:touch; z-index:99999999; -webkit-transition: none; -moz-transition: none; -o-transition: none; transition:none; }
.gnb_m .head { height:55px; background-color:#fff; }

.gnb_m .head .member_message { display: inline-block; vertical-align: middle; margin: 10px 30px 10px; font-family:'Pretendard'; color:#333; font-size:14px; line-height:35px; font-weight:400; letter-spacing:0; }
.gnb_m .head .member_message ul { margin: 0; padding: 0; }
.gnb_m .head .member_message li { list-style: none; float: left; margin-left: 15px; }
.gnb_m .head .member_message li:first-child { margin-left: 0; }
.gnb_m .head .member_message:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}
.gnb_m .head .member_message a,
.gnb_m .head .member_message a:hover { display: block; font-family:'Pretendard'; color:#333; font-size:14px; line-height:35px; font-weight:400; letter-spacing:0; }

.gnb_m .head .gnb_btn_close { position:absolute; right:20px; top:16px; width:20px; cursor:pointer; }
.gnb_m .head .gnb_btn_close img { width:100%; }

.gnb_m .list { position:relative; margin-bottom:100px; -webkit-overflow-scrolling:touch; z-index:99999999; }
.gnb_m .list ul { margin:0; padding:0; }
.gnb_m .list li { position:relative; list-style:none; min-height:42px; border-bottom:1px solid #4c55c6; cursor:pointer; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition: all 0.5s ease; transition:all 0.5s ease; }
.gnb_m .list .list_title { margin:0 0 0 30px; font-family:'Pretendard'; color:#ffffff; font-size:13px; line-height:50px; font-weight:500; letter-spacing:1px; }

.gnb_m .list li.select { background-color:#123590; }
.gnb_m .list li.select .list_title { color:#fff; }

.gnb_m .list .sub_list { background-color:#fff; display:none; -webkit-transition: none; -moz-transition: none; -o-transition: none; transition:none; }
.gnb_m .list .sub_list ul { margin:0; padding:0; }
.gnb_m .list .sub_list li { padding:0 0 0 30px; list-style:none; border-top:1px solid #ccc; border-bottom:none; font-family:'Pretendard'; color:#666666; font-size:13px; line-height:50px; font-weight:500; letter-spacing:0; }
.gnb_m .list .sub_list a,
.gnb_m .list .sub_list a:hover { display: block; font-family:'Pretendard'; color:#666666; font-size:13px; line-height:50px; font-weight:500; letter-spacing:0; }
.gnb_m .list .sub_list li.select { background-color:#fff; }
.gnb_m .list .sub_list li.select a,
.gnb_m .list .sub_list li.select a:hover { color:#1c43a6; }

.gnb_m .list:after { content:""; clear:both; display:block; }

.gnb_m .list li.on { background-color:#123590; }
.gnb_m .list li.on .list_title { color:#fff; }
.gnb_m .list li.select .sub_list { display:block; }


/* NOT FOUNT */
#not_found { display: flex; flex-direction: column;; justify-content: center; align-items: center; gap: 48px; width:100%; height:100vh; }
#not_found .found_content { display:flex; flex-direction:column; align-items: center; gap:20px; }
#not_found .found_content .found_info { display:flex; flex-direction:column; align-items: center; gap:8px; }
#not_found .found_content .found_info .found_title { font-family:'Pretendard'; font-weight:700; color:#1D5CEE; font-size:24px; line-height:140%; letter-spacing:-0.5px; text-align:center; }
#not_found .found_content .found_info .found_text { font-family:'Pretendard'; font-weight:400; color:#5F5F5F; font-size:14px; line-height:140%; letter-spacing:-0.5px; text-align:center; word-break: keep-all; }

#not_found .found_btn { display:flex; justify-content: center; align-items: center; gap:6px }
#not_found .found_btn a,
#not_found .found_btn a:hover { display:block; padding:9px 20px; font-family:'Pretendard'; font-weight:500; color:#737373; font-size:14px; line-height:130%; letter-spacing:0; text-align:center; background-color: #F8F8F8; border: 1px solid #D9D9D9; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }
#not_found .found_btn a.v1,
#not_found .found_btn a.v1:hover { font-weight:400; color:#ffffff; background-color: #0082DA; border: 1px solid #0082DA; }



/* CONTAINER */
#container .slide { position: relative; opacity:0; }
#container .slide ul { margin:0; padding:0; }
#container .slide li { list-style:none; height: 930px; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#container .slide:after { content:""; clear:both; display:block; }

#container .slide .outer { display: flex; justify-content: center; flex-direction: column; width:1720px; height: 100%; margin:0 auto; padding:0 25px 10px; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#container .slide .outer .thum { line-height:0; text-align:left; }
#container .slide .outer .slogan { margin-top: 30px; font-size:60px; font-weight: 700; color:#040c6c; }
#container .slide .outer .info { margin-top: 30px; font-size:24px; line-height: 37px; font-weight: 500; color:#333333; word-break: keep-all; }
#container .slide .outer .info i { display:block; }



#container .slide_animation {
	animation-name: slide_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 1s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes slide_fade {
	0% { opacity: 0; padding:100px 0 0; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; padding:0 0 0; } /* 100% 대신 to 로 대체가능 */
}



/* CONTAINER - OUTER */
#container .container_outer { width:1720px; margin:80px auto 0; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }


/* CONTAINER - OUTER - BANNER */
#container .container_outer .banner { display:flex; }
#container .container_outer .banner .banner_item { cursor: pointer; display: flex; flex-direction: column; justify-content: center; width:50%; height:240px; padding:0 60px; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#container .container_outer .banner .banner_item.inquiry { background:url("/images/main/inquiry_bg.png") no-repeat center; background-size: 100%; border-top-left-radius: 10px; border-bottom-left-radius: 10px; opacity:0; }
#container .container_outer .banner .banner_item.inquiry:hover { background:url("/images/main/inquiry_bg.png") no-repeat center; background-size:110%; }
#container .container_outer .banner .banner_item.location { background:url("/images/main/location_bg.png") no-repeat center; background-size: 100%; border-top-right-radius: 10px; border-bottom-right-radius: 10px; opacity:0; }
#container .container_outer .banner .banner_item.location:hover { background:url("/images/main/location_bg.png") no-repeat center; background-size:110%; }
#container .container_outer .banner .banner_item h2 { margin: 0; padding: 0; font-size:36px; font-weight: 700; color:#222222; }
#container .container_outer .banner .banner_item p { margin: 10px 0 0; padding: 0; font-size:18px; line-height: 26px; font-weight: 300; color:#444444; }


.inquiry_animation {
	animation-name: inquiry_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.5s; /* 속도 */
	animation-delay: 0.5s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes inquiry_fade {
	0% { opacity: 0; margin-left:150px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-left:0 0 0; } /* 100% 대신 to 로 대체가능 */
}

.location_animation {
	animation-name: location_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.5s; /* 속도 */
	animation-delay: 0.5s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes location_fade {
	0% { opacity: 0; margin-right:150px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-right:0 0 0; } /* 100% 대신 to 로 대체가능 */
}


/* CONTAINER - OUTER - SERVICE */
#container .container_outer .service { display: flex; gap: 20px; margin:60px 0 0; opacity:0; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#container .container_outer .service .service_item { cursor: pointer; flex-shrink: 1; width:33.33333%; box-shadow:5px 5px 10px rgba(0, 0, 0, 0.2); border-radius:10px; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#container .container_outer .service .service_item .thum { overflow: hidden; line-height:0; border-top-left-radius: 10px; border-top-right-radius: 10px; }
#container .container_outer .service .service_item .thum img { border-top-left-radius: 10px; border-top-right-radius: 10px; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition: all 0.5s ease; transition:all 0.5s ease; }
#container .container_outer .service .service_item:hover .thum img { transform:scale(1.15); -webkit-transform:scale(1.15); -moz-transform:scale(1.15); -o-transform:scale(1.15); } 
#container .container_outer .service .service_item .info { display: flex; flex-direction: column; justify-content: center; height: 220px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; background-color:#2e3191; }
#container .container_outer .service .service_item .info.v1 { background-color:#5a8de8; }
#container .container_outer .service .service_item .info.v2 { background-color:#9badbb; }

#container .container_outer .service .service_item .info h2 { margin: 0; padding: 0; font-size:36px; font-weight: 700; color:#ffffff; text-align:center; }
#container .container_outer .service .service_item .info p { margin: 10px 0 0; padding: 0; font-size:18px; line-height: 28px; font-weight: 300; color:#d5d6ff; text-align:center; word-break: keep-all; }

#container .container_outer .service .service_item .info.v1 p { color:#e6efff; }
#container .container_outer .service .service_item .info.v2 p { color:#ecf7ff; }

#container .container_outer .service .service_item .info p i { display:block; }


.service_animation {
	animation-name: service_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.8s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes service_fade {
	0% { opacity: 0; padding-top:150px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; padding-top:0; } /* 100% 대신 to 로 대체가능 */
}

/* CONTAINER - OUTER - PARTNER / 환율 */
#container .container_outer .side { display:flex; align-items: center; margin:50px auto 0; opacity:0; }
#container .container_outer .side .partner { width:1190px; }
#container .container_outer .side .partner ul { margin:0; padding:0; }
#container .container_outer .side .partner li { list-style: none; float: left; border:1px solid #eaeaea; }
#container .container_outer .side .partner li:first-child { margin-left:0; }
#container .container_outer .side .partner img { width:100%; }
#container .container_outer .side .partner:after { content:""; clear:both; display:block; }

#container .container_outer .side .exchange { flex-grow:1; }
#container .container_outer .side .exchange .outer { width:330px; margin:0 auto; }
#container .container_outer .side .exchange .outer .title { font-size: 17px; line-height: 38px; font-weight: 400; color: #fff; text-align: center; background-color:#2e3191; }
#container .container_outer .side .exchange .outer .info { font-size: 16px; line-height: 36px; font-weight: 500; color: #2e3191; text-align: center; border-bottom:1px solid #cbcbcb; }



.side_animation {
	animation-name: side_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.8s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes side_fade {
	0% { opacity: 0; padding-top:150px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; padding-top:0; } /* 100% 대신 to 로 대체가능 */
}


/* FOOTER */
#footer .menu { margin: 0; }
#footer .menu ul { margin: 0; padding: 0; }
#footer .menu li { position: relative; list-style: none; float: left; margin-right: 22px; }
#footer .menu a,
#footer .menu a:hover { display: block; font-weight: 300; font-size: 16px; line-height: 30px; color: #ffffff; text-align: left; }
#footer .menu:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#footer .copyright { margin: 10px 0 0; }
#footer .copyright ul { margin: 0; padding: 0; }
#footer .copyright li { position: relative; list-style: none; float: left; margin-right: 35px; font-weight: 300; font-size: 15px; line-height: 28px; color: #999999; text-align: left; }
#footer .copyright li.v1 { clear:both; }
#footer .copyright:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#footer .tel { position:absolute; right:50px; top:45px; }
#footer .tel a,
#footer .tel a:hover { display: block; font-weight: 600; font-size: 28px; line-height: 28px; color: #ffffff; letter-spacing: 0; text-align: right; }


/* SPOT */
#spot { display: flex; justify-content: center; align-items: center; height:350px; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#spot span { font-weight: 600; font-size:50px; letter-spacing: 2.5px; color: #fff; text-align:center; text-shadow:2px 2px 2px rgba(0, 0, 0, 0.2); -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#spot.company { background:url('/images/company/spot.jpg') no-repeat center; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#spot.service { background:url('/images/service/spot.jpg') no-repeat center; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#spot.inquiry { background:url('/images/inquiry/spot.jpg') no-repeat center; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#spot.customer { background:url('/images/customer/spot.jpg') no-repeat center; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }


/* SUB CONTAINER */
#sub_container { margin:100px auto 0; padding-bottom:20px; }
#sub_container h2 { width:1400px; margin: 0 auto; padding:0 0 40px; font-weight:600; font-size:44px; color:#111111; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }


/* COMAPNY */
#company { width:1400px; margin: 0 auto; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
#company .message { font-weight:300; font-size:20px; line-height:36px; letter-spacing: -1px; color:#555555; word-break: keep-all; opacity:0; }
#company .message i { display:block; }
#company .sign { margin-top: 50px; font-weight:600; font-size:26px; letter-spacing: -1px; color:#111111; text-align:right; opacity:0; }


#container .message_animation {
	animation-name: message_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes message_fade {
	0% { opacity: 0; padding:100px 0 0; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; padding:0 0 0; } /* 100% 대신 to 로 대체가능 */
}

#container .sign_animation {
	animation-name: sign_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.8s; /* 속도 */
	animation-delay: 0.2s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes sign_fade {
	0% { opacity: 0; padding: 0 100px 0 0; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; padding:0; } /* 100% 대신 to 로 대체가능 */
}



#company .location { display: flex; gap: 25px; margin: 100px 0 0; }
#company .location .location_item { flex-grow: 1; width:450px; opacity:0; }
#company .location .location_item .subject { padding: 28px 0; font-weight: 600; font-size: 24px; line-height: 24px; color: #ffffff; text-align: center; background-color: #2e3191; border-radius:10px; }
#company .location .location_item .info { margin-top: 10px; border-radius:10px; box-shadow:5px 5px 5px rgba(0, 0, 0, 0.2); }
#company .location .location_item .info .thum { line-height: 0; border-top-left-radius:10px; border-top-right-radius:10px; }
#company .location .location_item .info .thum img { width: 100%; line-height: 0; border-top-left-radius:10px; border-top-right-radius:10px; }
#company .location .location_item .info .thum_info { min-height: 480px; padding: 40px 35px; font-size: 17px; line-height: 28px; color: #d5d6ff; background-color: #2e3191; border-bottom-left-radius:10px; border-bottom-right-radius:10px; }
#company .location .location_item .info .thum_info strong { display: block; padding-bottom: 15px; font-weight: 700; font-size: 24px; color: #ffffff; }
#company .location .location_item .info .thum_info strong.v1 { padding-top:40px; }
#company .location .location_item .info .thum_info p { margin: 0; padding: 0; font-family: 'Noto Sans KR'; font-weight: 400; font-size: 17px; line-height: 28px; color: #d5d6ff; word-break: keep-all; }

#company .location .location_item.v1 .subject { background-color: #5a8de8; }
#company .location .location_item.v1 .info .thum_info { color: #e6efff; background-color: #5a8de8; }
#company .location .location_item.v1 .info .thum_info p { color: #e6efff; }

#company .location .location_item.v2 .subject { background-color: #9badbb; }
#company .location .location_item.v2 .info .thum_info { color: #ecf7ff; background-color: #9badbb; }
#company .location .location_item.v2 .info .thum_info p { color: #ecf7ff; }




#container .location1_animation {
	animation-name: location1_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes location1_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .location2_animation {
	animation-name: location2_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.4s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes location2_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .location3_animation {
	animation-name: location3_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.8s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes location3_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}


/* SERVICE */
#service { width:1400px; margin: 0 auto 100px; }
#service .message { font-weight:300; font-size:20px; line-height:36px; letter-spacing: -1px; color:#555555; word-break: keep-all; }
#service .message i { display:block; }

#service .distribution { display: flex; gap: 25px; margin:70px auto 0; }
#service .distribution .distribution_item { width:450px; opacity:0; }
#service .distribution .distribution_item .thum { line-height: 0; border-radius:10px; box-shadow:5px 5px 5px rgba(0, 0, 0, 0.2); }
#service .distribution .distribution_item .thum img { width: 100%; line-height: 0; border-radius:10px; }
#service .distribution .distribution_item .thum_info { margin: 40px 10px 0; }
#service .distribution .distribution_item .thum_info h3 { margin:0; padding:0; font-weight:700; font-size:24px; letter-spacing: 0; color:#000000; }
#service .distribution .distribution_item .thum_info p { margin: 15px 0 0; padding: 0; font-family: 'Noto Sans KR'; font-weight: 400; font-size: 17px; line-height: 36px; color: #555555; letter-spacing: -1px; word-break: keep-all; }
#service .distribution .distribution_item .thum_info p i { display:block; }

#service .distribution .distribution_item .thum_info .list { margin:15px 0 0; padding:0; }
#service .distribution .distribution_item .thum_info .list ul { margin:0; padding:0; }
#service .distribution .distribution_item .thum_info .list li { position: relative; list-style:none; padding-left:15px; font-family: 'Noto Sans KR'; font-weight: 400; font-size: 17px; line-height: 36px; color: #555555; letter-spacing: -1px; word-break: keep-all; }
#service .distribution .distribution_item .thum_info .list li:after { content:""; position:absolute; width:5px; height:2px; left: 0; top: 18px; background-color:#808080; }
#service .distribution .distribution_item .thum_info .list:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}


#container .distribution1_animation {
	animation-name: distribution1_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes distribution1_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .distribution2_animation {
	animation-name: distribution2_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.4s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes distribution2_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .distribution3_animation {
	animation-name: distribution3_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.8s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes distribution3_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

.distribution_banner { display: flex; flex-direction: column; justify-content: center; position: relative; height:480px; background: url('/images/service/distribution_banner.jpg') no-repeat center; background-attachment:fixed; opacity:0; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
.distribution_banner:after { content: ""; position:absolute; left:0; right: 0; top:0; bottom:0; background-color:rgba(46, 49, 145, 0.8); }
.distribution_banner .inner { z-index:10; }
.distribution_banner .inner h4 { margin:0; padding:0; font-weight:600; font-size:40px; line-height:40px; color:#ffffff; letter-spacing: -1px; text-align:center; }
.distribution_banner .inner .banner { display: flex; flex-wrap: wrap; width: 1400px; margin: 45px auto 0; }
.distribution_banner .inner .banner .banner_item { width:16.66666%; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
.distribution_banner .inner .banner .banner_item .thum { text-align:center; line-height:0; }
.distribution_banner .inner .banner .banner_item .thum_info { margin:20px 0 0; font-family: 'Noto Sans KR'; font-weight: 400; font-size:17px; line-height:26px; color:#f2f2fd; text-align:center; }


#container .distribution_banner_animation {
	animation-name: distribution_banner_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes distribution_banner_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}



/* 해상물류서비스 */
#service .sea { display: flex; gap: 40px; margin:70px auto 0; }
#service .sea .sea_item { flex-grow: 1; width:680px; opacity:0; }
#service .sea .sea_item .thum { line-height: 0; border-radius:10px; box-shadow:5px 5px 5px rgba(0, 0, 0, 0.2); }
#service .sea .sea_item .thum img { width: 100%; line-height: 0; border-radius:10px; }
#service .sea .sea_item .thum_info { margin: 40px 10px 0; }
#service .sea .sea_item .thum_info h3 { margin:0; padding:0; font-weight:700; font-size:24px; letter-spacing: 0; color:#000000; }

#service .sea .sea_item .thum_info .list { margin:15px 0 0; padding:0; }
#service .sea .sea_item .thum_info .list ul { margin:0; padding:0; }
#service .sea .sea_item .thum_info .list li { position: relative; list-style:none; padding-left:15px; font-family: 'Noto Sans KR'; font-weight: 400; font-size: 17px; line-height: 36px; color: #555555; letter-spacing: -1px; word-break: keep-all; }
#service .sea .sea_item .thum_info .list li.v1 { float:left; width:50%; }
#service .sea .sea_item .thum_info .list li:after { content:""; position:absolute; width:5px; height:2px; left: 0; top: 18px; background-color:#808080; }
#service .sea .sea_item .thum_info .list:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

.sea_banner { display: flex; flex-direction: column; justify-content: center; position: relative; height:480px; background: url('/images/service/sea_banner.jpg') no-repeat center; background-attachment:fixed; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; opacity:0; }
.sea_banner:after { content: ""; position:absolute; left:0; right: 0; top:0; bottom:0; background-color:rgba(46, 49, 145, 0.8); }
.sea_banner .inner { z-index:10; }
.sea_banner .inner h4 { margin:0; padding:0; font-weight:600; font-size:40px; line-height:40px; color:#ffffff; letter-spacing: -1px; text-align:center; }
.sea_banner .inner .banner { display: flex; flex-wrap: wrap; gap: 20px 0; width: 1400px; margin: 45px auto 0; }
.sea_banner .inner .banner .banner_item { width:33.33333%; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
.sea_banner .inner .banner .banner_item .info { font-family: 'Noto Sans KR'; font-weight: 400; font-size:17px; line-height:26px; color:#f2f2fd; text-align:center; letter-spacing:-1px; }


#container .sea1_animation {
	animation-name: sea1_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes sea1_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .sea2_animation {
	animation-name: sea2_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.4s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes sea2_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .sea_banner_animation {
	animation-name: sea_banner_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes sea_banner_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}



/* 항공물류 서비스 */
#service .aviation { display: flex; gap: 70px 40px; flex-wrap: wrap; margin:70px auto 0; }
#service .aviation .aviation_item { flex-grow: 0; width:440px; opacity:0; }
#service .aviation .aviation_item .thum { line-height: 0; border-radius:10px; box-shadow:5px 5px 5px rgba(0, 0, 0, 0.2); }
#service .aviation .aviation_item .thum img { width: 100%; line-height: 0; border-radius:10px; }
#service .aviation .aviation_item .thum_info { margin: 30px 10px 0; }
#service .aviation .aviation_item .thum_info h3 { margin:0; padding:0; font-weight:700; font-size:24px; letter-spacing: -0.75px; color:#000000; word-break: keep-all; }

.aviation_banner { display: flex; flex-direction: column; justify-content: center; position: relative; height:480px; background: url('/images/service/aviation_banner.jpg') no-repeat center; background-attachment:fixed; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; opacity:0; }
.aviation_banner:after { content: ""; position:absolute; left:0; right: 0; top:0; bottom:0; background-color:rgba(46, 49, 145, 0.8); }
.aviation_banner .inner { z-index:10; }
.aviation_banner .inner h4 { margin:0; padding:0; font-weight:600; font-size:40px; line-height:40px; color:#ffffff; letter-spacing: -1px; text-align:center; }
.aviation_banner .inner .banner { display: flex; flex-wrap: wrap; gap: 20px 0; width: 1400px; margin: 45px auto 0; }
.aviation_banner .inner .banner .banner_item { width:33.33333%; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; }
.aviation_banner .inner .banner .banner_item .info { font-family: 'Noto Sans KR'; font-weight: 400; font-size:17px; line-height:26px; color:#f2f2fd; text-align:center; letter-spacing:-1px; }


#container .aviation1_animation {
	animation-name: aviation1_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes aviation1_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .aviation2_animation {
	animation-name: aviation2_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.2s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes aviation2_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .aviation3_animation {
	animation-name: aviation3_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.4s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes aviation3_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .aviation4_animation {
	animation-name: aviation4_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.6s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes aviation4_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .aviation5_animation {
	animation-name: aviation5_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.8s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes aviation5_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .aviation6_animation {
	animation-name: aviation6_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes aviation6_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}


#container .aviation_banner_animation {
	animation-name: aviation_banner_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes aviation_banner_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}



/* 내륙운송 서비스 */
#service .transport { display: flex; flex-direction: column; gap: 50px; margin:70px auto 0; }
#service .transport .transport_item { display:flex; gap:60px; align-items:center; opacity:0; }

#service .transport .transport_item .thum { flex-shrink: 0; width: 325px; line-height: 0; border-radius:10px; box-shadow:5px 5px 5px rgba(0, 0, 0, 0.2); }
#service .transport .transport_item .thum img { width: 100%; line-height: 0; border-radius:10px; }

#service .transport .transport_item .thum_info { }
#service .transport .transport_item .thum_info h3 { margin:0; padding:0; font-weight:700; font-size:24px; color:#000000; word-break: keep-all; }
#service .transport .transport_item .thum_info p { margin: 15px 0 0; padding: 0; font-family: 'Noto Sans KR'; font-weight: 400; font-size: 17px; line-height: 36px; color: #555555; letter-spacing: -1px; word-break: keep-all; }
#service .transport .transport_item .thum_info p i { display:block; }



#container .transport1_animation {
	animation-name: transport1_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes transport1_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .transport2_animation {
	animation-name: transport2_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.1s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes transport2_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .transport3_animation {
	animation-name: transport3_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.2s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes transport3_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}

#container .transport4_animation {
	animation-name: transport4_fade; /* 이름 */ /* 키프레임을 두개지정하고 두개선언할 수 있다. */
	animation-duration: 0.6s; /* 속도 */
	animation-delay: 0.2s; /* 대기시간 */
	animation-iteration-count: 1; /* 반복 횟수 (숫자) 또는 infinite(계속) */
	animation-fill-mode: forwards; /* 애니메이션이 끝난 후의 상태를 설정. forwards(애니메이션 마지막 상태 유지), backwards(애니메이션 첫 상태 유지), both(애니메이션 첫 상태와 마지막 상태 모두 유지) */
	animation-timing-function: linear; /* 모션방법 linear , ease , ease-in , ease-out , ease-in-out */
	animation-direction: alternate; /* 애니메이션 루프 방향은 alternate 번갈아가며 변경되며 시작에서 끝 그리고 끝에서 시작 형태로 반복됩니다.*/
}

@keyframes transport4_fade {
	0% { opacity: 0; margin-top: 100px; } /* 0% 대신 from 으로 대체가능 */
	100% { opacity: 1; margin-top:0; } /* 100% 대신 to 로 대체가능 */
}




/* 통관서비스 */
#service .customs { margin:70px auto 0; }
#service .customs .customs_item { display: flex; gap: 50px; align-items:center; }

#service .customs .customs_item .thum { width: 680px; line-height: 0; border-radius:10px; box-shadow:5px 5px 5px rgba(0, 0, 0, 0.2); }
#service .customs .customs_item .thum img { width: 100%; line-height: 0; border-radius:10px; }

#service .customs .customs_item .thum_info { }
#service .customs .customs_item .thum_info ul { margin:0; padding:0; }
#service .customs .customs_item .thum_info li { position: relative; list-style: none; padding-left: 15px; font-family: 'Noto Sans KR'; font-weight: 400; font-size: 17px; line-height: 36px; color: #555555; letter-spacing: -1px; word-break: keep-all; }
#service .customs .customs_item .thum_info li:after { content:""; position:absolute; width:5px; height:2px; left: 0; top: 18px; background-color:#808080; }
#service .customs .customs_item .thum_info:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}



#content { width:1400px; margin:0 auto; }





@media screen and (max-width:1720px) {

	/* HEADER */
	#header > .outer { width:auto; padding: 0 30px; }

	/* HEADER - GNB */
	#header > .outer .gnb { right: 30px; }


	/* CONTAINER */
	#container .slide { position: relative; }
	#container .slide li { height: 700px; }

	#container .slide .outer { width:100%; padding:0 60px 10px; }
	#container .slide .outer .thum img { width:260px; }
	#container .slide .outer .slogan { margin-top: 20px; font-size:45px; }
	#container .slide .outer .info { margin-top: 20px; font-size:22px; line-height: 34px; }


	/* CONTAINER - OUTER */
	#container .container_outer { width:auto; margin:60px 3.5% 0; }


	/* CONTAINER - OUTER - BANNER */
	#container .container_outer .banner .banner_item { height:auto; padding:40px; }
	#container .container_outer .banner .banner_item h2 { font-size:30px; }


	/* CONTAINER - OUTER - SERVICE */
	#container .container_outer .service .service_item { flex-shrink: 1; width:auto; box-shadow:5px 5px 10px rgba(0, 0, 0, 0.2); border-radius:10px; }
	#container .container_outer .service .service_item .thum img { width:100%; }


	/* CONTAINER - OUTER - PARTNER / 환율 */
	#container .container_outer .side .partner { flex-grow:1; width:50%; }


	/* SUB CONTAINER */
	#sub_container { margin:100px 0 0; }
	#sub_container h2 { width:auto; margin: 0 3.5%; }


	/* COMAPNY */
	#company { width:auto; margin:0 3.5%; }
	#company .message i { display:none; }
	#company .location .location_item { width:33.33333%; }


	/* SERVICE */
	#service { width:auto; margin: 0 3.5% 100px; }
	#service .message i { display:none; }

	#service .distribution .distribution_item { flex-grow: 1; width:450px; }
	#service .distribution .distribution_item .thum_info p i { display:none; }


	/* 항공물류 서비스 */
	#service .aviation .aviation_item { flex-grow: 1; width:33%; }


	/* 내륙운송 서비스 */
	#service .transport .transport_item .thum_info p i { display: none; }

	#content { width:auto; margin:0 3.5%; }

}


@media screen and (max-width:1320px) {

	/* CONTAINER - OUTER - BANNER */
	#container .container_outer .banner .banner_item { padding:40px; }
	#container .container_outer .banner .banner_item h2 { font-size:26px; }
	#container .container_outer .banner .banner_item.inquiry { background-size: cover; }
	#container .container_outer .banner .banner_item.inquiry:hover { background-size: cover; }
	#container .container_outer .banner .banner_item.location { background-size: cover; }
	#container .container_outer .banner .banner_item.location:hover { background-size: cover; }


	/* CONTAINER - OUTER - SERVICE */
	#container .container_outer .service .service_item .info { padding:0 15px }
	#container .container_outer .service .service_item .info h2 { font-size:26px; }
	#container .container_outer .service .service_item .info p i { display:none; }


	/* SPOT */
	#spot { height:300px; }
	#spot span { font-size:46px; }


	/* COMAPNY */
	#company .message { font-size:18px; line-height:32px; }
	#company .sign { margin-top: 50px; font-size:24px; }

	#company .location .location_item .subject { font-size: 20px; letter-spacing:-1px; }


	/* SERVICE */
	.distribution_banner .inner .banner { gap: 20px 0; width: auto; margin: 45px auto 0; }
	.distribution_banner .inner .banner .banner_item { width:33.33333%; }
	.distribution_banner .inner .banner .banner_item .thum img { height:65px; }
	.distribution_banner .inner .banner .banner_item .thum_info { margin:10px 0 0; }


	/* 해상물류서비스 */
	#service .sea .sea_item .thum_info .list li.v1 { float:none; width:auto; }
	.sea_banner .inner .banner { width: auto; }


	/* 항공물류 서비스 */
	.aviation_banner .inner .banner { width: auto; }


	/* 통관서비스 */
	#service .customs .customs_item { align-items:start; }


}



@media screen and (max-width:760px) {

	#container { margin: 60px auto 0; }

	/* HEADER */
	#header > .outer { margin:0 20px; padding:0; }
	#header > .outer h1 { padding: 5px 0; }
	#header > .outer h1 img { height: 60px; }


	#header > .outer .gnb { display: none; }
	#header .gnb_btn { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); -moz-opacity:1.0; -khtml-opacity:1.0; opacity:1.0; visibility: visible; }


	/* CONTAINER */
	#container .slide li { height: 400px; }

	#container .slide .outer { padding:0 20px 10px; }
	#container .slide .outer .thum { text-align:center; }
	#container .slide .outer .thum img { width:150px; }
	#container .slide .outer .slogan { margin-top: 10px; font-size:30px; text-align:center; }
	#container .slide .outer .info { margin-top: 10px; font-size:16px; line-height: 28px; text-align:center; }
	#container .slide .outer .info i { display:none; }


	/* CONTAINER - OUTER */
	#container .container_outer { margin:40px 3.5% 0; }


	/* CONTAINER - OUTER - BANNER */
	#container .container_outer .banner { flex-direction:column; gap:20px; }
	#container .container_outer .banner .banner_item { flex-grow: 1; width:100%; height:180px; padding:0 30px; }
	#container .container_outer .banner .banner_item h2 { font-size:26px; }
	#container .container_outer .banner .banner_item p { font-size:17px; line-height: 26px; }
	#container .container_outer .banner .banner_item.inquiry { border-radius: 10px; }
	#container .container_outer .banner .banner_item.location { border-radius: 10px; }



	/* CONTAINER - OUTER - SERVICE */
	#container .container_outer .service { flex-direction: column; gap: 20px; margin:40px 0 0; }
	#container .container_outer .service .service_item:hover .thum img { transform:scale(1); -webkit-transform:scale(1); -moz-transform:scale(1); -o-transform:scale(1); } 
	#container .container_outer .service .service_item .info { height: auto; padding:25px 20px; }

	#container .container_outer .service .service_item .info p { font-size:17px; line-height: 26px; }


	/* CONTAINER - OUTER - PARTNER / 환율 */
	#container .container_outer .side { flex-direction: column; align-items: center; margin:50px auto 0; }
	#container .container_outer .side .partner { width:100%; }

	#container .container_outer .side .exchange { width: 100%; margin-top:20px; }
	#container .container_outer .side .exchange .outer { width:100%; margin:0 auto; }



	/* FOOTER */
	#footer { margin-top: 100px; padding: 40px 10px; }

	#footer .menu ul { text-align:center; font-size:0; }
	#footer .menu li { display: inline-block; float: none; margin: 0 10px; }
	#footer .menu a,
	#footer .menu a:hover { display: block; font-weight: 300; font-size: 16px; line-height: 30px; color: #ffffff; text-align: left; }

	#footer .copyright ul { text-align:center; font-size:0; }
	#footer .copyright li { display: inline-block; float: none; margin: 0 10px; text-align:center; }

	#footer .tel { margin-top: 25px; position:relative; right:auto; top:auto; }
	#footer .tel a,
	#footer .tel a:hover { font-size: 26px; line-height: 26px; text-align: center; }



	/* SPOT */
	#spot { height:200px; }
	#spot span { font-size:36px; }
	#spot.company { background-size:cover; }
	#spot.service { background-size:cover; }
	#spot.inquiry { background-size:cover; }
	#spot.customer { background-size:cover; }


	/* SUB CONTAINER */
	#sub_container { margin:50px 0 0; }
	#sub_container h2 { width:auto; padding:0 0 30px; font-size:30px; color:#111111; }


	/* COMAPNY */
	#company .message { font-size:18px; line-height:32px; }
	#company .sign { margin-top: 50px; font-size:22px; letter-spacing:-1px; }

	#company .location { gap: 50px; flex-direction: column; margin: 60px 0 0; }
	#company .location .location_item { width:100%; }
	#company .location .location_item .subject { font-size: 20px; letter-spacing:-1px; }
	#company .location .location_item .info .thum_info { min-height: 200px; padding: 30px 30px; }
	#company .location .location_item .info .thum_info strong { font-size: 22px; }


	#container .location1_animation {
		animation-delay: 0.1s; /* 대기시간 */
	}

	#container .location2_animation {
		animation-delay: 0.1s; /* 대기시간 */
	}

	#container .location3_animation {
		animation-delay: 0.1s; /* 대기시간 */
	}

	/* SERVICE */
	#service .message { font-size:18px; line-height:32px; }
	#service .distribution { gap: 50px; flex-direction: column; margin: 60px 0 0; }
	#service .distribution .distribution_item { width:100%; }
	#service .distribution .distribution_item .thum_info h3 { font-size:22px; }
	#service .distribution .distribution_item .thum_info p { margin: 10px 0 0; }

	#service .distribution .distribution_item .thum_info .list { margin:10px 0 0; }

	#container .distribution1_animation {
		animation-delay: 0.1s; /* 대기시간 */
	}


	#container .distribution2_animation {
		animation-delay: 0.1s; /* 대기시간 */
	}

	#container .distribution3_animation {
		animation-delay: 0.1s; /* 대기시간 */
	}

	/* SERVICE */
	.distribution_banner { height:auto; padding:50px 0; background-size:cover; }
	.distribution_banner .inner h4 { font-size:30px; line-height:30px; }
	.distribution_banner .inner .banner { gap: 20px 0; margin: 35px auto 0; }
	.distribution_banner .inner .banner .banner_item { width:50%; }
	.distribution_banner .inner .banner .banner_item .thum img { height:50px; }
	.distribution_banner .inner .banner .banner_item .thum_info { font-size:16px; }


	/* 해상물류서비스 */
	#service .sea { display: flex; flex-direction: column; gap: 40px; margin:70px auto 0; }
	#service .sea .sea_item { width:auto; }
	#service .sea .sea_item .thum_info h3 { font-size:22px; }

	#service .sea .sea_item .thum_info .list { margin:10px 0 0; }

	.sea_banner { height:auto; padding:50px 0; background-size:cover; }
	.sea_banner .inner h4 { font-size:30px; line-height:30px; }
	.sea_banner .inner .banner { margin: 35px auto 0; }
	.sea_banner .inner .banner .banner_item { width:50%; }
	.sea_banner .inner .banner .banner_item .info { font-size:16px; }


	/* 항공물류 서비스 */
	#service .aviation { gap: 40px 20px; }
	#service .aviation .aviation_item { width:45%; }
	#service .aviation .aviation_item .thum_info { margin: 20px 10px 0; }
	#service .aviation .aviation_item .thum_info h3 { font-size:18px; line-height:28px; }

	.aviation_banner { height:auto; padding:50px 0; background-size:cover; }
	.aviation_banner .inner h4 { font-size:30px; line-height:30px; }
	.aviation_banner .inner .banner { margin: 35px auto 0; }
	.aviation_banner .inner .banner .banner_item { width:50%; }
	.aviation_banner .inner .banner .banner_item .info { font-size:16px; }


	/* 내륙운송 서비스 */
	#service .transport .transport_item { display:flex; flex-direction: column; gap:30px; align-items:start; }
	#service .transport .transport_item .thum { flex-shrink: 1; flex-grow: 1; width: 100%; }

	#service .transport .transport_item .thum_info h3 { font-size:22px; }
	#service .transport .transport_item .thum_info p { margin: 10px 0 0; }


	/* 통관서비스 */
	#service .customs .customs_item { flex-direction: column; gap: 30px; }

	#service .customs .customs_item .thum { width: auto; }



}