@charset "utf-8"; /*─────────────────────────────────────────────────────────── header, footer, main 관련 작성 css 파일입니다. ** 이와 서브페이지 관련 css는 /css/sub.css 에 있습니다. ───────────────────────────────────────────────────────────*/ /*─────────────────────────────────────────────────────────── layout common ───────────────────────────────────────────────────────────*/ #wrap {height:100%;width:100%;margin:0;padding:0;overflow:initial;} /* #header 와 #container, #footer 전체 감싸는 영역 */ #wrap #container {width:100%;margin:0;padding:0;overflow:hidden;} #wrap #footer {width:100%;margin:0;} /* #container 안의 레이아웃 */ #contents_wrap {width:100%;max-width:1430px;margin:0 auto;padding:0;position:relative;z-index:1;box-sizing:border-box;} /* #container 안의 컨텐츠 감싸는 영역 */ #contents_wrap #contents_box {width:100%;padding:0 0 7.2% 0;box-sizing:border-box;} /* 컨텐츠를 감싸는 영역 */ /* navigation layout */ #contents_wrap .nav_wrap {box-sizing:border-box;} /* #content */ #content {width:100%;margin:0;padding:0;text-align:left;box-sizing:border-box;} /* navigation 을 제외한 컨텐츠 */ #content .sub_content{width:100%;margin:0 auto;background:#fff;box-sizing:border-box;} #content .sub_content:after {clear:both;content:"";display:block;} /* 컨텐츠 전체 가로 사이즈 */ .w_custom {width:100%;max-width:1430px;text-align:left;margin:0 auto;padding:0;padding-left:15px !important;padding-right:15px !important;box-sizing:border-box;} @media only screen and (max-width:1217px) { body.on {height:100%;overflow:hidden;} } @media only screen and (max-width:1023px) { #contents_wrap #contents_box {padding:0 0 6.4% 0;} } @media only screen and (max-width:640px) { #contents_wrap #contents_box {padding:0 0 10.4% 0;} } @media only screen and (max-width:479px) { #contents_wrap #contents_box {padding:0 0 12% 0;} } @media only screen and (max-width:320px) { .w_custom{padding-left:10px !important;padding-right:10px !important;} #contents_wrap {padding-left:10px !important;padding-right:10px !important;} } /*─────────────────────────────────────────────────────────── 공통 버튼 ───────────────────────────────────────────────────────────*/ a.btn_custom_point {width:200px;height:50px;line-height:50px;border-radius:10px;text-align:center;display:inline-block;box-sizing:border-box;position:relative;z-index:1;} a.btn_custom_point:before, a.btn_custom_point:after {width:44px;top:0;z-index:1;height:100%;border-style:solid;border-color:#f08326;position:absolute;display:inline-block;content:"";box-sizing:border-box;} a.btn_custom_point:before {left:0;border-width:2px 0 2px 2px;border-radius:10px 0 0 10px;} a.btn_custom_point:after {right:0;border-width:2px 2px 2px 0;border-radius:0 10px 10px 0;} a.btn_custom_point span {font-size:16px;font-weight:500;color:#f08326;line-height:inherit;height:inherit;display:inline-block;vertical-align:top;box-sizing:bordere-box;font-family:'Roboto',-apple-system,BlinkMacSystemFont,Roboto,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',Dotum,sans-serif;} a.btn_custom_point span:before, a.btn_custom_point span:after {width: calc(100% - 98px);height:2px;z-index:1;background:#f08326;position:absolute;display:inline-block;content:"";box-sizing:border-box;transition:all 0.3s;} a.btn_custom_point span:before {top:0;right:44px;} a.btn_custom_point span:after {bottom:0;left:44px;} a.btn_custom_white {width:200px;height:50px;line-height:50px;border-radius:10px;text-align:center;display:inline-block;box-sizing:border-box;position:relative;z-index:1;} a.btn_custom_white:before, a.btn_custom_white:after {width:44px;top:0;z-index:1;height:100%;border-style:solid;border-color:#fff;position:absolute;display:inline-block;content:"";box-sizing:border-box;} a.btn_custom_white:before {left:0;border-width:2px 0 2px 2px;border-radius:10px 0 0 10px;} a.btn_custom_white:after {right:0;border-width:2px 2px 2px 0;border-radius:0 10px 10px 0;} a.btn_custom_white span {font-size:16px;font-weight:500;color:#fff;line-height:inherit;height:inherit;display:inline-block;vertical-align:top;box-sizing:bordere-box;font-family:'Roboto',-apple-system,BlinkMacSystemFont,Roboto,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',Dotum,sans-serif;} a.btn_custom_white span:before, a.btn_custom_white span:after {width: calc(100% - 98px);height:2px;z-index:1;background:#fff;position:absolute;display:inline-block;content:"";box-sizing:border-box;transition:all 0.3s;} a.btn_custom_white span:before {top:0;left:44px;} a.btn_custom_white span:after {bottom:0;right:44px;} /*─────────────────────────────────────────────────────────── HEADER | outline/header.html, outline/nav.html ───────────────────────────────────────────────────────────*/ .skip_nav {position:relative;z-index:9999;} .skip_nav a {display:block;height:1px;width:1px;margin-bottom:-1px;overflow:hidden;font-size:12px;color:#fff;font-weight:bold;white-space:nowrap;text-align:center;} .skip_nav a:focus, .skip_nav a:active {height:auto;width:100%;padding:0;margin-bottom:0;position:absolute;left:0;top:0;} /* 일반 */ #header {padding:15px 15px 14px;height:90px;overflow:visible;left:0;top:0;margin:0 auto;border:0;text-align:center;position:sticky;z-index:10;width:100%;box-sizing:border-box;font-size:0;background:#fff;} #header.on {box-shadow:0 0 8px 2px rgba(0, 0, 0, 0.12);} #header .header_cont {padding:0;height:61px;position:relative;z-index:1;width:100%;max-width:1800px;margin:0 auto;box-sizing:border-box;text-align:center;} #header .hd_logo, #header .hd_lnb, #header .hd_right {position:absolute;margin:0;padding:0;top:50%;transform: translateY(-50%);box-sizing:border-box;display:inline-block;vertical-align:top;} #header .hd_logo {left:0;z-index:15; height:50px} #header .hd_logo a, #header .hd_logo img {vertical-align:top;} #header .hd_logo a{display:block; width:100%; height:100%;} #header .hd_logo img {width:auto; height:100%} #header .hd_lnb {left:50%;transform: translate(-50%, -50%);width:80%;z-index:10;font-size:0;} #header .hd_lnb > li, #header .hd_lnb > li > a {padding:0;line-height:1;font-size:18px;letter-spacing:-0.03em;font-weight:500;color:#222;vertical-align:top;text-align:center;display:inline-block;box-sizing:border-box;transition: all .2s;font-family:'Roboto','SpoqaHanSansNeo','Spoqa Han Sans',-apple-system,BlinkMacSystemFont,Roboto,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',Dotum,sans-serif;} #header .hd_lnb > li {padding:20px 39px;position:relative;} #header .hd_lnb > li.on > a, #header .hd_lnb > li.now > a {color:#f08326;} #header .hd_lnb > li:nth-last-of-type(1) a img {width:auto;height:20px;} #header .hd_lnb > li .hd_lnb_dep2 {z-index:55;position:absolute;left:50%;transform: translateX(-50%);width:100%;top:100%;padding:0;height:0;opacity:0;overflow:hidden;transition:all 0.5s;min-width:150px;} #header .hd_lnb > li.on .hd_lnb_dep2 {height:auto;overflow:initial;opacity:1;} #header .hd_lnb > li:nth-of-type(1) .hd_lnb_dep2 {min-width:152px;} #header .hd_lnb > li .hd_lnb_dep2 > ul {padding:13px 10px 14px;border-radius:6px;text-align:center;background:#fff;box-shadow:0 0 9px 0 rgba(0, 0, 0, 0.22);box-sizing:border-box;width:100%;} #header .hd_lnb > li .hd_lnb_dep2 > ul > li {padding:10px 0;} #header .hd_lnb > li .hd_lnb_dep2 > ul > li > a {line-height:1;font-size:16px;font-weight:400;color:#555;} #header .hd_lnb > li .hd_lnb_dep2 > ul > li:hover > a {color:#f08326;} #header .hd_lnb > li .hd_lnb_dep2 > ul > li + li {} #header .hd_right {right:0;transform: translateY(-25px);z-index:15;} #header .hd_right .dis_table > div {display:table-cell;vertical-align:middle;box-sizing:border-box;border-collapse:collapse;text-align:right;} #header .hd_right .hd_search {padding-right:21px;} #header .hd_right .hd_search a, #header .hd_right .hd_search img {vertical-align:middle;} #header .hd_right .hd_search img {width:auto;height:24px;} #header .hd_right .hd_tax_menu {} #header .hd_right .dis_table .hd_cate {display:none;} #header .hd_right .hd_cate .menu-trigger {padding:0;width:22px;height:18px;position:relative;box-sizing:border-box;display:inline-block;vertical-align:middle;} #header .hd_right .hd_cate .menu-trigger span {transition:0.3s;position:absolute;width:100%;height:2px;background-color:#333;left:0;} #header .hd_right .hd_cate .menu-trigger span:nth-of-type(1) {top:50%;transform:translateY(-9px) rotate(0deg);} #header .hd_right .hd_cate .menu-trigger span:nth-of-type(2) {top:50%;margin-top:-1px;} #header .hd_right .hd_cate .menu-trigger span:nth-of-type(3) {top:50%;transform:translateY(7px) rotate(0deg);} #header .hd_right .hd_cate .menu-trigger.active-1 {} #header .hd_right .hd_cate .menu-trigger.active-1 span {} #header .hd_right .hd_cate .menu-trigger.active-1 span:nth-of-type(1) {transform:translateY(-50%) rotate(-45deg);} #header .hd_right .hd_cate .menu-trigger.active-1 span:nth-of-type(2) {opacity:0;} #header .hd_right .hd_cate .menu-trigger.active-1 span:nth-of-type(3) {transform:translateY(-50%) rotate(45deg);} /* aside */ #aside {top:78px;height: calc(100% - 78px);right:-100%;width:100%;transition:0.8s;box-sizing:border-box;position:fixed;border-top:1px #ddd solid;background:#fff;z-index:99;display:none;} #aside.on {right:0%;} #aside .aside_box {width:100%;height:100%;margin:0;padding:23px 30px;overflow-y:auto;position:relative;z-index:1;box-sizing:border-box;display:block;text-align:center;} #aside ul.aside_menu {padding:24px 0 52px;font-size:0;vertical-align:top;} #aside ul.aside_menu > li {width: calc(25% - 20px);display:inline-block;vertical-align:top;text-align:left;} #aside ul.aside_menu > li:nth-last-of-type(1) {width:80px;} #aside ul.aside_menu > li > a {line-height:1;font-size:17px;letter-spacing:-0.03em;color:#111;font-weight:500;display:block;} #aside ul.aside_menu > li > ul {padding:16px 0 0;} #aside ul.aside_menu > li > ul > li {padding:4px 0;} #aside ul.aside_menu > li > ul > li > a {font-size:14px;font-weight:400;letter-spacing:-0.03em;color:#777;line-height:1;} #aside ul.aside_menu > li {} #aside ul.slidemenu {display:none;} #header a.btn_custom_point:hover span:before, #header a.btn_custom_point:hover span:after, #aside a.btn_custom_point:hover span:before, #aside a.btn_custom_point:hover span:after {width: calc(100% - 76px);} @media only screen and (max-width:1650px) { #header .hd_lnb > li {padding:20px 20px;} } @media only screen and (max-width:1440px) { #header .hd_lnb > li {padding:20px 12px;} #header .hd_lnb > li, #header .hd_lnb > li > a {line-height:18px;font-size:15px;} #header .hd_right .hd_search {padding-right:18px;} } @media only screen and (max-width:1340px) { #header .hd_lnb > li:nth-last-of-type(1) a img {height:19px;} #header .hd_lnb > li:nth-of-type(1) .hd_lnb_dep2 {min-width:146px;} #header .hd_lnb > li .hd_lnb_dep2 > ul > li {padding:9px 0;} #header .hd_lnb > li .hd_lnb_dep2 > ul > li > a {font-size:15px;} } @media only screen and (max-width:1240px) { #header .hd_lnb{left:53%;} #header .hd_lnb > li:nth-last-of-type(1) a img {height:18px;} #header .hd_lnb > li:nth-of-type(1) .hd_lnb_dep2 {min-width:146px;} #header .hd_lnb > li:nth-of-type(2) .hd_lnb_dep2 {min-width:140px;} #header .hd_lnb > li:nth-last-of-type(1) .hd_lnb_dep2 {min-width:88px;} #header a.btn_custom_point span, #aside a.btn_custom_point span {font-size:15px;} } @media only screen and (max-width:1180px) { } @media only screen and (max-width:1140px) { #header {padding:13px 15px 12px;height:82px;} #header .header_cont {height:57px;} #header .hd_logo {height:50px;} #header .hd_lnb {display:none;} #header .hd_right {transform: translateY(-50%);} #header .hd_right .dis_table .hd_tax_menu {display:none;} #header .hd_right .dis_table .hd_cate {padding-right:0;display:table-cell;} #header .hd_right .hd_search {padding-right:20px;} #header a.btn_custom_point, #aside a.btn_custom_point {height:46px;line-height:46px;} #header a.btn_custom_point span:before, #header a.btn_custom_point span:after, #header a.btn_custom_point:hover span:before, #header a.btn_custom_point:hover span:after, #aside a.btn_custom_point span:before, #aside a.btn_custom_point span:after, #aside a.btn_custom_point:hover span:before, #aside a.btn_custom_point:hover span:after {width: calc(100% - 98px);} #aside {display:block;} } @media only screen and (max-width:1023px) { #header {padding:13px 15px 12px;height:78px;} #header .header_cont {height:53px;} } @media only screen and (max-width:940px) { #header {padding:13px 15px 12px;height:74px;} #header .header_cont {height:49px;} #aside {top:74px;height: calc(100% - 74px);} } @media only screen and (max-width:860px) { #header {padding:13px 15px 12px;height:70px;} #header .header_cont {height:45px;} #aside {top:70px;height: calc(100% - 70px);} #aside ul.aside_menu {padding:16px 0 48px;} } @media only screen and (max-width:767px) { #header {padding:12px 15px;height:66px;} #header .header_cont {height:42px;} #aside {top:66px;height: calc(100% - 66px);} #aside ul.aside_menu {display:none;} #aside ul.slidemenu {padding:0 0 34px;display:block;} #aside ul.slidemenu li a.depth1_a, #aside ul.slidemenu li .icons {display:inline-block;vertical-align:middle;cursor:pointer;} #aside ul.slidemenu li .icons {width:44px;height:49px;margin-right:-15px;background:url(../images/skin/icon-cate-toggle.png) no-repeat 50% 50%;background-size:14px auto;} #aside ul.slidemenu li.on .icons {background:url(../images/skin/icon-cate-toggle-on.png) no-repeat 50% 50%;background-size:14px auto;} #aside ul.slidemenu .depth1_li {margin:0;padding:0;text-align:left;display:block;vertical-align:top;font-size:0;position:relative;} #aside ul.slidemenu .depth1_li a {width:calc(100% - 44px);} #aside ul.slidemenu .depth1_li .depth1_a {transition:0.2s;padding:16px 0;line-height:1;font-size:17px;letter-spacing:-0.03em;color:#333;} #aside ul.slidemenu .depth1_li.on .depth1_a {color:#f08326;} #aside ul.slidemenu .depth1_li .depth1_a img {width:auto;height:18px;} #aside ul.slidemenu .depth1_li .depth {padding:8px 15px;border:0;display:none;} #aside ul.slidemenu .depth1_li .depth li {padding-left:0;position:relative;} #aside ul.slidemenu .depth1_li .depth li a {font-size:15px;line-height:1;color:#666;padding:15px 0;letter-spacing:-0.03em;position:relative;display:inline-block;} } @media only screen and (max-width:640px) { #header {padding:11px 15px;height:64px;} #header .hd_logo{height:40px;} #header .hd_right .hd_search {padding-right:20px;} #header .hd_right .hd_search img {height:21px;} #header .hd_right .dis_table .hd_cate {display:table-cell;} #aside {top:64px;height: calc(100% - 64px);} #aside .aside_box {padding:23px 30px;} #aside ul.aside_menu {display:none;} #aside ul.slidemenu {padding:0 0 34px;display:block;} #aside ul.slidemenu .depth1_li .depth1_a {padding:16px 0;font-size:17px;} #aside ul.slidemenu .depth1_li .depth1_a img {height:18px;} #aside ul.slidemenu .depth1_li .depth {padding:8px 15px;} #aside ul.slidemenu .depth1_li .depth li a {font-size:15px;padding:15px 0;} } @media only screen and (max-width:360px) { #aside .aside_box {padding:20px 25px;} #aside ul.slidemenu {padding-bottom:30px;} #aside ul.slidemenu li .icons {height:46px;} #aside ul.slidemenu .depth1_li .depth1_a {padding:15px 0;font-size:16px;} #aside ul.slidemenu .depth1_li .depth {padding:8px 12px;} #aside ul.slidemenu .depth1_li .depth li a {font-size:14px;padding:14px 0;} } @media only screen and (max-width:320px) { #header {padding:11px 10px;} #aside .aside_box {padding:15px 20px;} #aside ul.slidemenu {padding-bottom:25px;} #aside ul.slidemenu li .icons {height:42px;} #aside ul.slidemenu .depth1_li .depth1_a {padding:13px 0;} #aside ul.slidemenu .depth1_li .depth {padding:8px 10px;} #aside ul.slidemenu .depth1_li .depth li a {padding:12px 0;} } /*─────────────────────────────────────────────────────────── FOOTER | outline/footer.html ───────────────────────────────────────────────────────────*/ /* 일반 */ .btn_top_quick {position:fixed;right:15px;bottom:40px;z-index:10;display: none;} .btn_top_quick ul{margin-bottom:10px;} .btn_top_quick ul li{width:50px;height:50px;box-sizing:border-box;border-radius:100%;background:#003E8D;overflow:hidden;margin:0 auto;} /* .btn_top_quick ul li.hpoint{background: #611CF9;} */ .btn_top_quick ul li + li{margin-top:10px;} .btn_top_quick ul li a{display: flex;width:100%;height:100%;align-items: center;justify-content: center;} .btn_top_quick ul li img{max-height:50%;} .btn_top_quick ul li.hpoint img{max-width:57%;} .btn_top_quick span {width:60px;height:60px;border-radius:4px;background:#003e8d url(../images/skin/icon-quick-arrow@2x.png) no-repeat 50% 50%;background-size:16px auto;box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.35);display:inline-block;cursor:pointer;font-size:0;} #footer {background:#222;padding-top:90px;padding-bottom:98px;} #footer .w_custom {width:100%;max-width:1430px;margin:0 auto;box-sizing:border-box;padding-left:15px;padding-right:15px;text-align:left;} #footer .ft_gnb {width:31.8%;float:left;} #footer .ft_gnb .ft_logo {height:40px;} #footer .ft_gnb .ft_logo a, #footer .ft_gnb .ft_logo img {vertical-align:top;} #footer .ft_gnb .ft_logo a{display:block; width:100%; height:100%;} #footer .ft_gnb .ft_logo img {height:100%;width:auto;} #footer .ft_gnb > ul {padding-top:50px;} #footer .ft_gnb > ul > li {} #footer .ft_gnb > ul > li + li {padding-top:22px;} #footer .ft_gnb > ul > li:last-child {padding-top:49px;} #footer .ft_gnb > ul > li a, #footer .ft_gnb > ul > li img {vertical-align:top;} #footer .ft_gnb > ul > li a {line-height:1;font-size:14px;font-weight:400;color:#888;} #footer .ft_gnb > ul > li a img {height:23px;width:auto;} #footer .ft_gnb > ul > li a strong {color:#fff;font-size:inherit;font-weight:inherit;} #footer .ft_content {width:68.2%;float:right;} #footer .ft_lnb {} #footer .ft_lnb .ft_lnb_list {display: flex;justify-content: flex-end;} #footer .ft_lnb .ft_lnb_list > li {width: 20%;padding-right:26px;box-sizing:border-box;float:left;} /* #footer .ft_lnb .ft_lnb_list > li:last-child {width:auto;float:right;} */ #footer .ft_lnb .ft_lnb_list > li + li {} #footer .ft_lnb .ft_lnb_list > li > dl {} #footer .ft_lnb .ft_lnb_list > li > dl > dt, #footer .ft_lnb .ft_lnb_list > li > dl > dd {} #footer .ft_lnb .ft_lnb_list > li > dl > dt, #footer .ft_lnb .ft_lnb_list > li > dl > dt a {line-height:1;font-size:18px;font-weight:500;color:#fff;vertical-align:top;} #footer .ft_lnb .ft_lnb_list > li > dl > dt {padding-bottom:17px;} #footer .ft_lnb .ft_lnb_list > li > dl > dt a {} #footer .ft_lnb .ft_lnb_list > li > dl > dd {} #footer .ft_lnb .ft_lnb_list > li > dl > dd > ul {} #footer .ft_lnb .ft_lnb_list > li > dl > dd > ul > li, #footer .ft_lnb .ft_lnb_list > li > dl > dd > ul > li > a {line-height:1;font-size:14px;font-weight:300;color:#888;vertical-align:top;} #footer .ft_lnb .ft_lnb_list > li > dl > dd > ul > li {padding:9px 0;} #footer .ft_lnb .ft_lnb_list > li > dl > dd > ul > li + li {} #footer .ft_lnb .ft_lnb_list > li > dl > dd > ul > li > a {} #footer .ft_info {padding-top:94px;} #footer .ft_info p, #footer .ft_info p a {line-height:30px;font-size:14px;font-weight:400;color:#888;} #footer .ft_info p {} #footer .ft_info p strong {font-weight:500;color:#fff;font-size:inherit;line-height:inherit;} #footer .ft_info p .bar {display:inline-block;width:22px;height:1em;vertical-align:top;margin:0;padding:0;} #footer .ft_info p .m_br, #footer .ft_info p .m_br + br {display:none;} #footer .ft_info address {padding-top:22px;line-height:1;font-size:14px;font-weight:300;color:#888;font-family:'Roboto',-apple-system,BlinkMacSystemFont,Roboto,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',Dotum,sans-serif;} @media only screen and (max-width:1430px) { #footer {padding-top:6.29vw;padding-bottom:6.85vw;} #footer .ft_gnb > ul {padding-top:3.49vw;} #footer .ft_gnb > ul > li:last-child {padding-top:3.49vw;} #footer .ft_info {padding-top:6.57vw;} } @media only screen and (max-width:1200px) { #footer .ft_gnb .ft_logo {height: 37px;} #footer .ft_gnb > ul > li a img {height:22px;} #footer .ft_lnb .ft_lnb_list > li {width: calc(25% - 17px);padding-right:14px;} #footer .ft_lnb .ft_lnb_list > li:last-child {width:auto;} } @media only screen and (max-width:1024px) { .btn_top_quick {bottom:30px;} .btn_top_quick ul li{width:44px;height:44px;} .btn_top_quick span {width:48px;height:48px;background-size:14px auto;} #footer .ft_gnb {width:100%;float:none;} #footer .ft_gnb .ft_logo {height: 33px;} #footer .ft_gnb > ul {padding-top:3.49vw;} #footer .ft_gnb > ul > li {float:left;} #footer .ft_gnb > ul > li + li, #footer .ft_gnb > ul > li:last-child {padding-top:0;padding-left:27px;} #footer .ft_gnb > ul > li a img {height:22px;margin:-4px 0;} #footer .ft_content {width:100%;float:none;} #footer .ft_lnb {display:none;} #footer .ft_info {padding-top:6.4vw;} } @media only screen and (max-width:767px) { .btn_top_quick {right:15px;} .btn_top_quick span {width:42px;height:42px;border-radius:3px;background-size:13px auto;box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.35);} #footer {padding-top:8.67vw;padding-bottom:9.67vw;} #footer .ft_gnb .ft_logo {height: 29px;} #footer .ft_info p, #footer .ft_info p a {line-height:28px;} #footer .ft_info address {font-size:13px;} } @media only screen and (max-width:640px) { #footer {padding-top:9.67vw;padding-bottom:11.67vw;} #footer .ft_gnb .ft_logo {height: 27px;} #footer .ft_gnb > ul {padding-top:5.49vw;} #footer .ft_gnb > ul > li a img {height:20px;margin:-3px 0;} #footer .ft_info p, #footer .ft_info p a {line-height:26px;} } @media only screen and (max-width:500px) { #footer .ft_gnb .ft_logo {height: 25px;} #footer .ft_gnb > ul {padding-top:6.49vw;} #footer .ft_gnb > ul > li + li, #footer .ft_gnb > ul > li:last-child {padding-left:27px;} #footer .ft_gnb > ul > li a img {height:20px;margin:-3px 0;} #footer .ft_info {padding-top:6.4vw;} #footer .ft_info p, #footer .ft_info p a {line-height:26px;font-size:14px;} #footer .ft_info p .bar {width:22px;} #footer .ft_info p .m_br + br {display:inline-block;} #footer .ft_info p .m_br + br + .bar {display:none;} #footer .ft_info address {padding-top:22px;font-size:13px;} } @media only screen and (max-width:414px) { #footer {padding-top:10.67vw;padding-bottom:12.67vw;} #footer .ft_gnb > ul {padding-top:7.46vw;} #footer .ft_gnb > ul > li + li, #footer .ft_gnb > ul > li:last-child {padding-left:27px;} #footer .ft_gnb > ul > li a img {height:18px;margin:-2px 0;} #footer .ft_info {padding-top:6.4vw;} #footer .ft_info p, #footer .ft_info p a {line-height:22px;font-size:13px;} #footer .ft_info address {padding-top:6.4vw;font-size:12px;} } @media only screen and (max-width:375px) { #footer {padding-top:10.67vw;padding-bottom:12.67vw;} #footer .w_custom {padding-left:15px;padding-right:15px;} #footer .ft_gnb > ul {padding-top:7.46vw;} #footer .ft_gnb > ul > li + li, #footer .ft_gnb > ul > li:last-child {padding-left:26px;} #footer .ft_gnb > ul > li a img {height:18px;margin:-2px 0;} #footer .ft_info {padding-top:6.4vw;} #footer .ft_info p, #footer .ft_info p a {line-height:20px;;} #footer .ft_info p .bar {width:22px;} #footer .ft_info address {padding-top:6.4vw;} } @media only screen and (max-width:340px) { #footer .w_custom {padding-left:15px;padding-right:15px;} #footer .ft_gnb > ul > li + li, #footer .ft_gnb > ul > li:last-child {padding-left:22px;} #footer .ft_info p .bar {width:18px;} } @media only screen and (max-width:320px) { .btn_top_quick {right:10px;bottom:26px;} #footer .w_custom {padding-left:10px;padding-right:10px;} } /*─────────────────────────────────────────────────────────── MAIN | index.html ───────────────────────────────────────────────────────────*/ /* 일반 */ .main_index #container {padding-top:0 !important;} /* visual */ .main_visual .slick-slide {} .main_visual_wrap {} .main_visual {height: calc(100vh - 90px);padding:0;position:relative;width:100%;margin:0 auto;box-sizing:border-box;overflow:hidden;z-index:1;} .main_visual .slick-slide {height: calc(100vh - 90px);overflow:hidden;position:relative;text-align:center;z-index:1;} .main_visual .slick-slide .thumb {background-position: center;background-size:cover !important;height:100%;width: 100%;margin:0 auto;text-align:Center;position:absolute;left: 0;top:0;outline:0;z-index:1;} .main_visual .slick-slide .txt_box {width:100%;padding:0 44px;left:50%;top:24.1%;text-align:center;transform:translate(-50%, 0%);position:absolute;font-size:0;z-index:3;box-sizing:border-box;} .main_visual .slick-slide .txt_box h3, .main_visual .slick-slide .txt_box p, .main_visual .slick-slide .txt_box em {text-shadow: 0px 4px 8px rgba(0, 0, 0, 0.45);letter-spacing:-0.04em;color:#fff;line-height:1;font-weight:700;margin:0;padding:0;text-align:center;vertical-align:top;display:block;} .main_visual .slick-slide .txt_box em {font-size:40px;font-weight:500;margin-bottom:38px;font-family:'Roboto',-apple-system,BlinkMacSystemFont,Roboto,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',Dotum,sans-serif;} .main_visual .slick-slide .txt_box h3 {font-size:60px;line-height:1.2em;margin-bottom:29px;} .main_visual .slick-slide .txt_box p {font-size:20px;line-height:1.4em;margin-bottom:66px;font-weight:500;} .main_visual .slick-slide .txt_box a.btn_custom_white {width:170px;height:60px;line-height:60px;box-shadow: 0px 4px 8px 0 rgba(0, 0, 0, 0.45);} .main_visual .slick-slide .txt_box a.btn_custom_white span {font-size:18px;font-weight:400;text-shadow: 0px 4px 8px rgba(0, 0, 0, 0.45);letter-spacing:-0.04em;} .main_visual .slick-slide .txt_box a.btn_custom_white:before, .main_visual .slick-slide .txt_box a.btn_custom_white:after {width:22px;} .main_visual .slick-slide .txt_box a.btn_custom_white span:before {left:22px;width: calc(100% - 54px);} .main_visual .slick-slide .txt_box a.btn_custom_white span:after {right:22px;width: calc(100% - 64px);} .main_visual .slick-slide .txt_box a.btn_custom_white:hover span:before {width: calc(100% - 38px);} .main_visual .slick-slide .txt_box a.btn_custom_white:hover span:after {width: calc(100% - 38px);} .main_visual .slick-arrow {width:34px;height:66px;top:50%;opacity:0.5;transform:translateY(-50%);position:absolute;z-index:6;font-size:0;display:inline-block;vertical-align:top;margin:0;padding:0;border:0;outline:0;font-size:0;transition:all 0.3s;} .main_visual .slick-arrow:hover {opacity:1;} .main_visual .slick-arrow:before {display:none;} .main_visual .slick-prev {left:60px;background:url(../images/skin/icon-visual-prev@2x.png) no-repeat 50% 50%;background-size:cover;} .main_visual .slick-next {right:60px;background:url(../images/skin/icon-visual-next@2x.png) no-repeat 50% 50%;background-size:cover;} .main_visual .visual_control {width:55%;max-width:386px;padding:0;left:50%;transform:translateX(-50%);bottom:60px;top:auto;position:absolute;text-align:center;z-index:1;box-sizing:border-box;vertical-align:top;font-size:0;} .main_visual .visual_control > span, .main_visual .slider-progress-wrap, .main_visual .slide_btn {height:12px;line-height:12px;vertical-align:top;display:inline-block;box-sizing:border-box;margin:0;padding:0;outline:0;border:0;font-size:0;font-family:'Roboto',-apple-system,BlinkMacSystemFont,Roboto,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',Dotum,sans-serif;letter-spacing:0;} .main_visual .visual_control > span {font-size:16px;font-weight:400;color:#fff;} .main_visual .visual_control > span.slideCount_now {width:9.6%;max-width:37px;text-align:left;} .main_visual .visual_control > span.slideCount_total {width:14.3%;max-width:55px;text-align:center;} .main_visual .slider-progress-wrap {width:72.54%;max-width:280px;height:2px;line-height:2px;margin:5px 0;z-index:1;transition:all 6s;text-align:left;position:relative;} .main_visual .slider-progress-wrap .slider-progress {width:100%;background:rgba(255, 255, 255, 0.5);display: inline-block;vertical-align:top;box-sizing:border-box;text-align:left;} .main_visual .slider-progress-wrap .slider-progress .progress {height:2px;background: rgba(255, 255, 255,1);width:0;} .main_visual .slider-progress-wrap .slider-progress .progress.active {width:100%;} .main_visual .slide_btn {width:9px;background-size:auto 100% !important;background-repeat:no-repeat !important;background-position:50% 50% !important;position:relative;z-index:6;} .main_visual .slide_btn.btn_pause {background-image:url(../images/skin/icon-visual-pause@2x.png);} .main_visual .slide_btn.btn_play {background-image:url(../images/skin/icon-visual-play@2x.png);} /* visual active */ .main_visual .slick-slide .thumb {transition:transform 5s ease-in-out, opacity 5s ease-in-out;transform:scale(1.08) rotate(0.003deg);opacity: .95;} .main_visual .slick-slide.slick-active .thumb {animation: step01 5s ease-in-out;animation-fill-mode:forwards;animation-delay: 0.1s;}/*transition:transform 5s ease-in-out, opacity 5s ease-in-out;transform:scale(1) rotate(0.003deg);opacity:1;*/ .main_visual .slick-slide .txt_box h3, .main_visual .slick-slide .txt_box p, .main_visual .slick-slide .txt_box em, .main_visual .slick-slide .txt_box .visual_btn_more {opacity:0;transform:translateY(70px);} .main_visual .slick-slide.slick-current .txt_box h3, .main_visual .slick-slide.slick-current .txt_box p, .main_visual .slick-slide.slick-current .txt_box em, .main_visual .slick-slide.slick-current .txt_box .visual_btn_more {opacity:0;transform:translateY(80px);-webkit-animation: fadeup 1.3s ease-in-out 1;animation: fadeup 1.3s ease-in-out 1;animation-fill-mode:forwards;} .main_visual .slick-slide.slick-current .txt_box em {animation-delay:0.5s;} .main_visual .slick-slide.slick-current .txt_box h3 {animation-delay:0.5s;} .main_visual .slick-slide.slick-current .txt_box p {animation-delay:0.8s;} .main_visual .slick-slide.slick-current .txt_box .visual_btn_more {animation-delay:1.0s;} @keyframes fadeup{ 0% {opacity:0;transform:translateY(70px);} 100%{opacity:1;transform:translateY(0px);} } @keyframes step01{ 0%{transition:transform 5s ease-in-out, opacity 5s ease-in-out;transform:scale(1.08) rotate(0.003deg);opacity: .95;} 100%{transition:transform 5s ease-in-out, opacity 5s ease-in-out;transform:scale(1) rotate(0.003deg);opacity:1;} } /* 메인공통 */ .main_section {margin:0 auto;padding:0;width:100%;text-align:center;} .main_section .w_custom {text-align:center;} /* 메인메뉴 */ .main_section.main_menu {} .main_section.main_menu > ul {display:table;width:100%;margin:0;table-layout:fixed;border-collapse:collapse;font-size:0;vertical-align:top;text-align:center;} .main_section.main_menu > ul li.menu_sec {height: calc(100vh - 90px);padding:0;box-sizing:border-box;display:table-cell;vertical-align:middle;border-collapse:collapse;position:relative;z-index:1;background-repeat:no-repeat !important;background-size:cover !important;background-position:50% 50% !important;cursor:pointer;} .main_section.main_menu > ul li.menu_sec.on {z-index:2;} .main_section.main_menu > ul li.menu_sec:before {background:rgba(0, 0, 0, 0.2);position:absolute;left:0;top:0;width:100%;height:100%;display:inline-block;z-index:1;transition:all 0.6s;content:"";opacity:1;} .main_section.main_menu > ul li.menu_sec.on:before {background:rgba(0, 0, 0, 0.5);} .main_section.main_menu > ul li.menu_sec:nth-of-type(1) {background-image:url(../images/skin/bg-main-intro-01.jpg);} .main_section.main_menu > ul li.menu_sec:nth-of-type(2) {background-image:url(../images/skin/bg-main-intro-02.jpg);} .main_section.main_menu > ul li.menu_sec:nth-of-type(3) {background-image:url(../images/skin/bg-main-intro-03.jpg);} .main_section.main_menu > ul li.menu_sec:nth-of-type(4) {background-image:url(../images/skin/bg-main-intro-04.jpg);} .main_section.main_menu > ul li.menu_sec > dl {transform:translate(-50%, -50%);transition:all 0.5s;width:75.4%;position:absolute;left:50%;top:50%;z-index:2;text-align:left;} .main_section.main_menu > ul li.menu_sec > dl > dt, .main_section.main_menu > ul li.menu_sec > dl > dd {box-sizing:border-box;} .main_section.main_menu > ul li.menu_sec > dl > dt {font-size:38px;padding:0 0 38px;line-height:1;font-weight:700;color:#fff;} .main_section.main_menu > ul li.menu_sec > dl > dd {} .main_section.main_menu > ul li.menu_sec > dl > dd span.menu_detail {font-size:16px;padding:20px 30px 20px 0;margin-top:-20px;line-height:1;background:url(../images/skin/icon-btn-arrow-wh@2x.png) no-repeat 100% 50%;background-size:6px auto;font-weight:400;color:#fff;display:inline-block;cursor:pointer;} .main_section.main_menu > ul li.menu_sec.on > dl > dd span.menu_detail {display:none;} .main_section.main_menu > ul li.menu_sec > dl > dd ul {height:0;opacity:0;margin-top:0px;overflow:hidden;transition:all 0.9s;width:100%;margin-left:0;margin-right:auto;max-width:260px;} .main_section.main_menu > ul li.menu_sec.on > dl > dd ul {animation-delay:0s;animation: fademenu2 0.6s ease-in-out 1;animation-fill-mode:forwards;} .main_section.main_menu > ul li.menu_sec:nth-of-type(1).on > dl > dd ul {animation: fademenu1 0.6s ease-in-out 1;animation-fill-mode:forwards;} .main_section.main_menu > ul li.menu_sec:nth-of-type(4).on > dl > dd ul {animation: fademenu3 0.6s ease-in-out 1;animation-fill-mode:forwards;} .main_section.main_menu > ul li.menu_sec > dl > dd ul:after {clear:both;content:"";display:block;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li {text-align:left;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li + li {margin-top:10px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a, .main_section.main_menu > ul li.menu_sec > dl > dd ul li a span {border-radius:4px;font-size:18px;line-height:18px;letter-spacing:-0.046em;font-weight:400;color:#fff;display:inline-block;vertical-align:top;box-sizing:border-box;transition:all 0.3s;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a {padding:20px 30px;height:60px;border-color:rgba(255, 255, 255, 0.4);border-width:1px;border-style:solid;width:100%;background-color:rgba(255, 255, 255, 0);} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a span {width:100%;background:url(../images/skin/icon-btn-arrow-wh@2x.png) no-repeat 100% 50%;background-size:6px auto;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a:hover {border-color:rgba(0, 71, 157, 1);background-color:rgba(0, 71, 157, 1);} @keyframes fademenu1{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:200px;opacity:1;transform:translateY(0px);} } @keyframes fademenu2{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:270px;opacity:1;transform:translateY(0px);} } @keyframes fademenu3{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:340px;opacity:1;transform:translateY(0px);} } /* 와이드배너 */ .main_section.main_wide_bg {height:800px;background:url(../images/skin/bg-main-fix.jpg) no-repeat 50% 50%;background-size:cover;} /* 스텝 & 서비스제공 컨텐츠 */ .main_step_list {font-size:0;vertical-align:top;text-align:center;} .main_step_list > li {width:33.32%;padding:0 10px;text-align:center;display:inline-block;vertical-align:top;position:relative;z-index:1;box-sizing:border-box;white-space:normal;word-break:keep-all;word-wrap:break-word;} .main_step_list > li + li {} .main_step_list > li + li:before {display:inline-block;content:"";position:absolute;top:50%;transform:translate(-50%, -50%);left:0;} .main_step_list > li > span {width:100%;display:inline-block;margin:0 auto;background-repeat:no-repeat !important;background-position-x:50% !important;} .main_step_list > li > dl {} .main_step_list > li > dl > dt {margin:40px 0 21px;font-size:24px;line-height:32px;letter-spacing:-0.04em;font-weight:500;color:#fff;white-space:normal;word-break:keep-all;word-wrap:break-word;} .main_step_list > li > dl > dd {font-size:16px;line-height:24px;letter-spacing:-0.04em;font-weight:400;color:#fff;white-space:normal;word-break:keep-all;word-wrap:break-word;} .main_step_list > li .pc_br, .main_step_list > li .t_br, .main_step_list > li .t_br + br {display:none;} .main_step_list > li .pc_br + br {display:inline-block;} /* 스텝 */ .main_section.main_step {padding-top:100px;padding-bottom:117px;background:#222;} .main_section.main_step .main_step_list {} .main_section.main_step .main_step_list > li {} .main_section.main_step .main_step_list > li + li:before {width:60px;height:60px;border-radius:100%;background:#f5f5f5;opacity:0.1;z-index:1;top: calc(50% - 24px);} .main_section.main_step .main_step_list > li + li:after {left:0;width:9px;height:12px;background:url(../images/skin/icon-step-arrow@2x.png) no-repeat 50% 50%;background-size:cover;z-index:2;display:inline-block;content:"";position:absolute;top: calc(50% - 24px);transform:translate(-50%, -50%);} .main_section.main_step .main_step_list > li > span {height:80px;} .main_section.main_step .main_step_list > li:nth-of-type(1) > span {background-image:url(../images/skin/icon-step-01.png);background-position-y:100%;background-size:auto 77px;} .main_section.main_step .main_step_list > li:nth-of-type(2) > span {background-image:url(../images/skin/icon-step-02.png);background-position-y:50%;background-size:auto 65px;} .main_section.main_step .main_step_list > li:nth-of-type(3) > span {background-image:url(../images/skin/icon-step-03.png);background-position-y:0%;background-size:auto 71px;} .main_section.main_step .main_step_list > li .pc_br {} .main_section.main_step .main_step_list > li .pc_br + br {display:inline-block;} /* 비디오영상 */ .main_section.main_video {background:#222;} .main_section.main_video .w_custom {} .main_section.main_video .video_box {border-radius:10px;height:0;padding:54.24% 0 0;overflow:hidden;position:relative;z-index:1;} .main_section.main_video .video_box #play_main1 {outline-color:#fff;outline-style:dashed;outline-width:1px;padding:10px;border-radius:100%;display:inline-block;position:absolute;left:50%;top:50%;z-index:3;box-sizing:border-box;vertical-align:top;transform:translate(-50%, -50%);} .main_section.main_video .video_box #play_main1 span {width:100px;height:100px;background:#fff url(../images/skin/icon-video-play@2x.png) no-repeat 55% 50%;background-size:auto 34px;display:inline-block;border-radius:100%;font-size:0;vertical-align:top;} .main_section.main_video .video_box .thumb_main1 {position:absolute;left:50%;top:50%;width:100%;transform:translate(-50%, -50%);z-index:2;text-align:center;font-size:0;} .main_section.main_video .video_box .thumb_main1 img {width:100%;height:auto;} .main_section.main_video .video_box .thumb_main1 .thumb_pc {display:block;} .main_section.main_video .video_box .thumb_main1 .thumb_m {display:none;} .main_section.main_video .video_box > iframe {position:absolute;left:50%;top:50%;width:100%;height:100%;transform:translate(-50%, -50%);} .main_section.main_video .video_box .video_play {position:absolute;left:50%;top:50%;width:100%;height:100%;transform:translate(-50%, -50%);z-index:1;} .main_section.main_video .video_box .video_play.on {z-index:5;} /* 서비스 제공 */ .main_section.main_offer {padding-top:100px;padding-bottom:140px;background:#222;} .main_section.main_offer .main_step_list {padding-bottom:80px;} .main_section.main_offer .main_step_list > li {} .main_section.main_offer .main_step_list > li + li:before {width:1px;height:100%;max-height:280px;background:#ddd;opacity:0.1;} .main_section.main_offer .main_step_list > li > span {margin-top:8px;height:84px;} .main_section.main_offer .main_step_list > li:nth-of-type(1) > span {background-image:url(../images/skin/icon-step-04.png);background-position-y:100%;background-size:auto 78px;} .main_section.main_offer .main_step_list > li:nth-of-type(2) > span {background-image:url(../images/skin/icon-step-05.png);background-position-y:50%;background-size:auto 63px;} .main_section.main_offer .main_step_list > li:nth-of-type(3) > span {background-image:url(../images/skin/icon-step-06.png);background-position-y:100%;background-size:auto 84px;} .main_section.main_offer .main_step_list > li .pc_br {} .main_section.main_offer .main_step_list > li .pc_br + br {display:inline-block;} .main_section.main_offer a.btn_custom_point {width:290px;height:60px;line-height:60px;margin-left:auto;margin-right:auto;} .main_section.main_offer a.btn_custom_point span {font-size:18px;letter-spacing:-0.04em;} .main_section.main_offer a.btn_custom_point:before, .main_section.main_offer a.btn_custom_point:after {width:32px;} .main_section.main_offer a.btn_custom_point span:before, .main_section.main_offer a.btn_custom_point span:after {width: calc(100% - 76px);} .main_section.main_offer a.btn_custom_point span:before {right:32px;} .main_section.main_offer a.btn_custom_point span:after {left:32px;} .main_section.main_offer a.btn_custom_point:hover span:before {width: calc(100% - 38px);} .main_section.main_offer a.btn_custom_point:hover span:after {width: calc(100% - 38px);} /* 거래내역조회 */ .main_section.main_deal_history {padding-top:150px;padding-bottom:150px;min-height:900px;background:url(../images/skin/bg-main-deal.jpg) no-repeat 50% 50%;background-size:cover;display:flex;align-content: center;align-items: center;} .main_deal_history .w_custom {width: calc(100% - 30px);border-radius:20px;max-width:1100px;text-align:center;background-color:rgba(255, 255, 255, 0.1);} .main_deal_history .tit {width:100%;max-width:900px;margin:0 auto;padding-top:80px;padding-bottom:28px;} .main_deal_history .tit p {font-size:20px;letter-spacing:-0.03em;font-weight:500;color:#fff;line-height:1em;margin:0;padding:0;} .main_deal_history .tit h3 {font-size:40px;font-weight:700;color:#fff;line-height:1em;padding:38px 0;margin:0 0 40px;border-bottom:2px #fff solid;} .main_deal_history .tit > span {font-size:16px;font-weight:400;color:#fff;line-height:1em;display:block;vertical-align:top;} .main_deal_history .tit .m_br, .main_deal_history .tit .m_br + br {display:none;} .main_deal_history .history_api_wrap {width:100%;max-width:900px;margin:0 auto;margin-bottom:83px;box-sizing:border-box;} .history_api_wrap .history_search_form {width:100%;max-width:760px;margin:0 auto;font-size:0;vertical-align:top;} #wrap .history_api_wrap .history_search_form .history_input {font-size:14px;height:60px;padding:22px 20px;border-radius:4px;line-height:1em;width: calc(50% - 40px);border:1px #fff solid;background:none;font-weight:400;color:#fff;letter-spacing:-0.03em;box-sizing:border-box;vertical-align:top;display:inline-block;float:left;outline:0;} #wrap .history_api_wrap .history_search_form .history_input:placeholder {font-size:14px;font-weight:400;color:#fff;letter-spacing:-0.03em;} #wrap .history_api_wrap .history_search_form .history_input::placeholder {font-size:14px;font-weight:400;color:#fff;letter-spacing:-0.03em;} #wrap .history_api_wrap .history_search_form .history_input:-webkit-input-placeholder {font-size:14px;font-weight:400;color:#fff;letter-spacing:-0.03em;} #wrap .history_api_wrap .history_search_form .history_input:-ms-input-placeholder {font-size:14px;font-weight:400;color:#fff;letter-spacing:-0.03em;} #wrap .history_api_wrap .history_search_form .history_input + .history_input {margin-left:10px;} #wrap .history_api_wrap .history_search_form .history_input + .history_submit {margin-left:10px;} #wrap .history_api_wrap .history_search_form .history_submit {width:60px;height:60px;border-radius:4px;background:#f58237 url(../images/skin/icon-main-search@2x.png) no-repeat 50% 50%;background-size:24px auto;font-size:0;border:0;outline:0;vertical-align:top;display:inline-block;float:right;} .history_api_wrap .history_list_table {} .history_api_wrap .history_search_form + .history_list_table {padding-top:40px;} .history_api_wrap .history_list_table .list_table_wrap {width:100%;margin:0;} .history_api_wrap .history_list_table table {border-collapse:collapse;table-layout:fixed;width:100%;} .history_api_wrap .history_list_table th, .history_api_wrap .history_list_table td {box-sizing:border-box;vertical-align:middle;text-align:center;border-collapse:collapse;line-height:1.2em;} .history_api_wrap .history_list_table th {font-size:16px;padding:20.4px 5px;font-weight:500;color:#fff;background:#222;} .history_api_wrap .history_list_table th:nth-of-type(1) {border-radius:4px 0 0 4px;} .history_api_wrap .history_list_table th:nth-of-type(5) {border-radius:0 4px 4px 0;} .history_api_wrap .history_list_table td {font-size:14px;height:53px;padding:9px 5px;font-weight:400;color:#ccc;letter-spacing:-0.03em;border-bottom:1px #fff solid;} @media only screen and (max-width:1920px) { /* visual */ .main_visual .slick-prev {left:3.125%;} .main_visual .slick-next {right:3.125%;} /* 와이드배너 */ .main_section.main_wide_bg {height:800px;background-size:auto 100%;} /* 거래내역조회 */ .main_section.main_deal_history {background-size:auto 100%;} } @media only screen and (max-width:1447px) { /* visual */ .main_visual .slick-prev {left:15px;} .main_visual .slick-next {right:15px;} /* 메인메뉴 */ .main_section.main_menu > ul li.menu_sec > dl {width:82%;} /* 와이드배너 */ .main_section.main_wide_bg {height:55.95vw;} /* 스텝 */ .main_section.main_step {padding-top:7vw;padding-bottom:8.18vw;} /* 서비스 제공 */ .main_section.main_offer {padding-top:7vw;padding-bottom:9.79vw;} .main_section.main_offer .main_step_list {padding-bottom:6vw;} /* 거래내역조회 */ .main_section.main_deal_history {padding-top:10.4vw;padding-bottom:10.4vw;min-height:62.94vw;} .main_deal_history .tit {padding-top:5.6vw;padding-bottom:1.95vw;} .main_deal_history .tit h3 {padding:2.64vw 0;margin-bottom:2.78vw;} .main_deal_history .history_api_wrap {margin-bottom:5.76vw;} .history_api_wrap .history_search_form + .history_list_table {padding-top:2.78vw;} } @media only screen and (max-width:1240px) { /* 메인메뉴 */ .main_section.main_menu > ul li.menu_sec > dl {width: calc(100% - 30px);} .main_section.main_menu > ul li.menu_sec > dl > dt {font-size:34px;padding-bottom:34px;} .main_section.main_menu > ul li.menu_sec > dl > dd span.menu_detail {padding:16px 30px 16px 0;margin-top:-16px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a, .main_section.main_menu > ul li.menu_sec > dl > dd ul li a span {font-size:17px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a {padding:16px 24px;height:52px;} @keyframes fademenu1{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:176px;opacity:1;transform:translateY(0px);} } @keyframes fademenu2{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:238px;opacity:1;transform:translateY(0px);} } @keyframes fademenu3{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:300px;opacity:1;transform:translateY(0px);} } /* 와이드배너 */ .main_section.main_wide_bg {height:55.95vw;background-size:auto 100%;} /* 스텝 & 서비스제공 컨텐츠 */ .main_step_list > li > dl > dt {font-size:23px;line-height:31px;} .main_step_list > li > dl > dd {line-height:23px;} /* 스텝 */ .main_section.main_step .main_step_list > li + li:before {width:52px;height:52px;} .main_section.main_step .main_step_list > li + li:after {width:8px;height:11px;} .main_section.main_step .main_step_list > li > span {height:76px;} .main_section.main_step .main_step_list > li:nth-of-type(1) > span {background-size:auto 74px;} .main_section.main_step .main_step_list > li:nth-of-type(2) > span {background-size:auto 62px;} .main_section.main_step .main_step_list > li:nth-of-type(3) > span {background-size:auto 68px;} /* 비디오영상 */ .main_section.main_video .video_box #play_main1 {padding:9px;} .main_section.main_video .video_box #play_main1 span {width:90px;height:90px;background-size:auto 30px;} /* 서비스 제공 */ .main_section.main_offer .main_step_list > li > span {margin-top:6px;height:81px;} .main_section.main_offer .main_step_list > li:nth-of-type(1) > span {background-size:auto 75px;} .main_section.main_offer .main_step_list > li:nth-of-type(2) > span {background-size:auto 60px;} .main_section.main_offer .main_step_list > li:nth-of-type(3) > span {background-size:auto 81px;} /* 거래내역조회 */ .main_section.main_deal_history {padding-top:10.4vw;padding-bottom:10.4vw;min-height:62.94vw;background-size:auto 100.1%;} .main_deal_history .tit {padding-top:6.6vw;padding-bottom:2.95vw;} .main_deal_history .tit p {font-size:19px;} .main_deal_history .tit h3 {font-size:36px;padding:3.64vw 0;margin-bottom:3.78vw;} .main_deal_history .tit > span {font-size:15px;} .main_deal_history .history_api_wrap {margin-bottom:6.76vw;} .history_api_wrap .history_search_form + .history_list_table {padding-top:3.78vw;} .history_api_wrap .history_list_table th {font-size:15px;} } @media only screen and (max-width:1140px) { /* visual */ .main_visual, .main_visual .slick-slide {height: calc(100vh - 82px);} .main_visual .slick-slide .txt_box {padding:0 38px;} .main_visual .slick-slide .txt_box em {font-size:35px;margin-bottom:30px;} .main_visual .slick-slide .txt_box h3 {font-size:55px;line-height:1.17em;margin-bottom:25px;} .main_visual .slick-slide .txt_box p {font-size:19px;line-height:1.43em;margin-bottom:62px;} .main_visual .slick-slide .txt_box a.btn_custom_white {width:160px;height:56px;line-height:56px;} .main_visual .slick-slide .txt_box a.btn_custom_white span {font-size:17px;} .main_visual .slick-slide .txt_box a.btn_custom_white span:before, .main_visual .slick-slide .txt_box a.btn_custom_white:hover span:before {width: calc(100% - 54px);left:21px;} .main_visual .slick-slide .txt_box a.btn_custom_white span:after, .main_visual .slick-slide .txt_box a.btn_custom_white:hover span:after {width: calc(100% - 58px);right:21px;} .main_visual .slick-arrow {width:28px;height:54px;opacity:1;} .main_visual .visual_control {bottom:50px;} .main_visual .visual_control > span {font-size:15px;} .main_visual .slide_btn {background-size:auto 11px !important;} /* 메인메뉴 */ .main_section.main_menu > ul li.menu_sec {height: calc(100vh - 82px);} .main_section.main_menu > ul li.menu_sec > dl > dt {font-size:32px;padding-bottom:32px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul {max-width:100%;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a, .main_section.main_menu > ul li.menu_sec > dl > dd ul li a span {letter-spacing:-0.03em;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a {padding:16px 20px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a:hover {background-color:rgba(255, 255, 255, 0);border-color:rgba(255, 255, 255, 0.4);} /* 와이드배너 */ .main_section.main_wide_bg {height:58.3vw;} /* 스텝 & 서비스제공 컨텐츠 */ .main_step_list > li > dl > dt {margin:34px 0 18px;font-size:22px;line-height:28px;} .main_step_list > li > dl > dd {font-size:16px;line-height:22px;} /* 스텝 */ .main_section.main_step .main_step_list > li + li:before {width:48px;height:48px;top: calc(50% - 22px);} .main_section.main_step .main_step_list > li + li:after {top: calc(50% - 22px);} .main_section.main_step .main_step_list > li > span {height:72px;} .main_section.main_step .main_step_list > li:nth-of-type(1) > span {background-size:auto 69px;} .main_section.main_step .main_step_list > li:nth-of-type(2) > span {background-size:auto 57px;} .main_section.main_step .main_step_list > li:nth-of-type(3) > span {background-size:auto 63px;} /* 비디오영상 */ .main_section.main_video .video_box #play_main1 {padding:8px;} .main_section.main_video .video_box #play_main1 span {width:80px;height:80px;background-size:auto 26px;} /* 서비스 제공 */ .main_section.main_offer {padding-bottom:10vw;} .main_section.main_offer .main_step_list > li > span {margin-top:4px;height:76px;} .main_section.main_offer .main_step_list > li:nth-of-type(1) > span {background-size:auto 70px;} .main_section.main_offer .main_step_list > li:nth-of-type(2) > span {background-size:auto 55px;} .main_section.main_offer .main_step_list > li:nth-of-type(3) > span {background-size:auto 76px;} .main_section.main_offer a.btn_custom_point {height:56px;line-height:56px;} .main_section.main_offer a.btn_custom_point span {font-size:17px;} .main_section.main_offer a.btn_custom_point span:before, .main_section.main_offer a.btn_custom_point span:after, .main_section.main_offer a.btn_custom_point:hover span:before, .main_section.main_offer a.btn_custom_point:hover span:after {width: calc(100% - 76px);} } @media only screen and (max-width:1023px) { /* visual */ .main_visual, .main_visual .slick-slide {height: calc(100vh - 78px);} .main_visual .slick-slide .txt_box {padding:0 34px;} .main_visual .slick-slide .txt_box h3, .main_visual .slick-slide .txt_box p, .main_visual .slick-slide .txt_box em {text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.45);} .main_visual .slick-slide .txt_box em {font-size:34px;margin-bottom:26px;} .main_visual .slick-slide .txt_box h3 {font-size:50px;margin-bottom:26px;} .main_visual .slick-slide .txt_box p {font-size:18px;margin-bottom:57px;} .main_visual .slick-slide .txt_box a.btn_custom_white {width:32%;max-width:140px;height:52px;line-height:52px;box-shadow: 0px 3px 6px 0 rgba(0, 0, 0, 0.45);} .main_visual .slick-slide .txt_box a.btn_custom_white span {font-size:16px;text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.45);} .main_visual .slick-slide .txt_box a.btn_custom_white:before, .main_visual .slick-slide .txt_box a.btn_custom_white:after {width:18px;} .main_visual .slick-slide .txt_box a.btn_custom_white span:before, .main_visual .slick-slide .txt_box a.btn_custom_white:hover span:before {width: calc(100% - 46px);left:18px;} .main_visual .slick-slide .txt_box a.btn_custom_white span:after, .main_visual .slick-slide .txt_box a.btn_custom_white:hover span:after {width: calc(100% - 50px);right:18px;} .main_visual .slick-arrow {width:24px;height:47px;} .main_visual .visual_control {bottom:48px;} .main_visual .visual_control > span {font-size:14px;} .main_visual .slide_btn {background-size:auto 10px !important;} /* 메인메뉴 */ .main_section.main_menu > ul li.menu_sec {height: calc(100vh - 78px);} .main_section.main_menu > ul li.menu_sec > dl > dt {font-size:30px;padding-bottom:30px;} .main_section.main_menu > ul li.menu_sec > dl > dd span.menu_detail {font-size:15px;padding:14px 20px 14px 0;margin-top:-14px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a, .main_section.main_menu > ul li.menu_sec > dl > dd ul li a span {font-size:16px;line-height:16px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a {padding:14px 18px;height:46px;} @keyframes fademenu1{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:158px;opacity:1;transform:translateY(0px);} } @keyframes fademenu2{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:214px;opacity:1;transform:translateY(0px);} } @keyframes fademenu3{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:270px;opacity:1;transform:translateY(0px);} } /* 와이드배너 */ .main_section.main_wide_bg {height:61.3vw;} /* 스텝 & 서비스제공 컨텐츠 */ .main_step_list > li > dl > dt {margin:28px 0 15px;font-size:21px;line-height:26px;} .main_step_list > li > dl > dd {font-size:15px;line-height:21px;} /* 스텝 */ .main_section.main_step .main_step_list > li + li:before {width:44px;height:44px;top: calc(50% - 21px);} .main_section.main_step .main_step_list > li + li:after {width:7px;height:10px;top: calc(50% - 21px);} .main_section.main_step .main_step_list > li > span {height:64px;} .main_section.main_step .main_step_list > li:nth-of-type(1) > span {background-size:auto 64px;} .main_section.main_step .main_step_list > li:nth-of-type(2) > span {background-size:auto 52px;} .main_section.main_step .main_step_list > li:nth-of-type(3) > span {background-size:auto 58px;} /* 비디오영상 */ .main_section.main_video .video_box #play_main1 {padding:7px;} .main_section.main_video .video_box #play_main1 span {width:70px;height:70px;background-size:auto 22px;} /* 서비스 제공 */ .main_section.main_offer .main_step_list > li > span {margin-top:0;height:71px;} .main_section.main_offer .main_step_list > li:nth-of-type(1) > span {background-size:auto 65px;} .main_section.main_offer .main_step_list > li:nth-of-type(2) > span {background-size:auto 50px;} .main_section.main_offer .main_step_list > li:nth-of-type(3) > span {background-size:auto 71px;} .main_section.main_offer a.btn_custom_point {height:54px;line-height:54px;} .main_section.main_offer a.btn_custom_point span {font-size:16px;} .main_section.main_offer a.btn_custom_point:before, .main_section.main_offer a.btn_custom_point:after {width:30px;} .main_section.main_offer a.btn_custom_point span:before, .main_section.main_offer a.btn_custom_point span:after, .main_section.main_offer a.btn_custom_point:hover span:before, .main_section.main_offer a.btn_custom_point:hover span:after {width: calc(100% - 72px);} .main_section.main_offer a.btn_custom_point span:before {right:30px;} .main_section.main_offer a.btn_custom_point span:after {left:30px;} } @media only screen and (max-width:960px) { /* 와이드배너 */ .main_section.main_wide_bg {height:64.3vw;} /* 스텝 & 서비스제공 컨텐츠 */ .main_step_list > li > dl > dt {margin:25px 0 13px;font-size:20px;line-height:25px;} /* 스텝 */ .main_section.main_step .main_step_list > li + li:before {width:40px;height:40px;} .main_section.main_step .main_step_list > li + li:after {width:7px;height:9px;} .main_section.main_step .main_step_list > li > span {height:59px;} .main_section.main_step .main_step_list > li:nth-of-type(1) > span {background-size:auto 59px;} .main_section.main_step .main_step_list > li:nth-of-type(2) > span {background-size:auto 47px;} .main_section.main_step .main_step_list > li:nth-of-type(3) > span {background-size:auto 53px;} /* 비디오영상 */ .main_section.main_video .video_box #play_main1 {padding:5px;} .main_section.main_video .video_box #play_main1 span {width:60px;height:60px;background-size:auto 19px;} /* 서비스 제공 */ .main_section.main_offer {padding-bottom:12vw;} .main_section.main_offer .main_step_list > li > span {height:66px;} .main_section.main_offer .main_step_list > li:nth-of-type(1) > span {background-size:auto 60px;} .main_section.main_offer .main_step_list > li:nth-of-type(2) > span {background-size:auto 45px;} .main_section.main_offer .main_step_list > li:nth-of-type(3) > span {background-size:auto 66px;} .main_section.main_offer .main_step_list > li .pc_br + br {display:none;} .main_section.main_offer .main_step_list > li .t_br + br {display:inline-block;} .main_section.main_offer a.btn_custom_point {width:267px;height:52px;line-height:52px;} .main_section.main_offer a.btn_custom_point span {font-size:16px;} .main_section.main_offer a.btn_custom_point:before, .main_section.main_offer a.btn_custom_point:after {width:28px;} .main_section.main_offer a.btn_custom_point span:before, .main_section.main_offer a.btn_custom_point span:after, .main_section.main_offer a.btn_custom_point:hover span:before, .main_section.main_offer a.btn_custom_point:hover span:after {width: calc(100% - 68px);} .main_section.main_offer a.btn_custom_point span:before {right:28px;} .main_section.main_offer a.btn_custom_point span:after {left:28px;} /* 거래내역조회 */ .main_section.main_deal_history {min-height:70.6vw;} .main_deal_history .tit h3 {font-size:32px;} .main_deal_history .history_api_wrap {margin-bottom:6.76vw;} #wrap .history_api_wrap .history_search_form .history_input {height:50px;width: calc(50% - 35px);} #wrap .history_api_wrap .history_search_form .history_submit {width:50px;height:50px;border-radius:4px;background-size:21px auto;} } @media only screen and (max-width:940px) { /* visual */ .main_visual, .main_visual .slick-slide {height: calc(100vh - 74px);} .main_visual .slick-slide .txt_box {padding:0 30px;} .main_visual .slick-slide .txt_box em {font-size:31px;margin-bottom:24px;} .main_visual .slick-slide .txt_box h3 {font-size:45px;margin-bottom:24px;} .main_visual .slick-slide .txt_box p {font-size:17px;} .main_visual .slick-slide .txt_box a.btn_custom_white {max-width:130px;height:50px;line-height:50px;} .main_visual .slick-slide .txt_box a.btn_custom_white span {font-size:16px;} .main_visual .slick-slide .txt_box a.btn_custom_white:before, .main_visual .slick-slide .txt_box a.btn_custom_white:after {width:14px;} .main_visual .slick-slide .txt_box a.btn_custom_white span:before, .main_visual .slick-slide .txt_box a.btn_custom_white:hover span:before {width: calc(100% - 38px);left:14px;} .main_visual .slick-slide .txt_box a.btn_custom_white span:after, .main_visual .slick-slide .txt_box a.btn_custom_white:hover span:after {width: calc(100% - 42px);right:14px;} .main_visual .slick-arrow {width:20px;height:39px;} /* 메인메뉴 */ .main_section.main_menu > ul li.menu_sec {height: calc(100vh - 74px);} .main_section.main_menu > ul li.menu_sec > dl > dt {font-size:28px;padding-bottom:28px;} .main_section.main_menu > ul li.menu_sec > dl > dd span.menu_detail {background-size:5px auto;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a, .main_section.main_menu > ul li.menu_sec > dl > dd ul li a span {font-size:15px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a {padding:12px 15px;height:42px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a span {background-size:5px auto;} @keyframes fademenu1{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:146px;opacity:1;transform:translateY(0px);} } @keyframes fademenu2{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:198px;opacity:1;transform:translateY(0px);} } @keyframes fademenu3{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:250px;opacity:1;transform:translateY(0px);} } } @media only screen and (max-width: 860px) { /* visual */ .main_visual, .main_visual .slick-slide {height: calc(100vh - 70px);} .main_visual .slick-slide .txt_box em {font-size:28px;} .main_visual .slick-slide .txt_box h3 {font-size:40px;margin-bottom:20px;} .main_visual .slick-slide .txt_box p {font-size:16px;} .main_visual .slick-slide .txt_box a.btn_custom_white {height:46px;line-height:46px;} .main_visual .slick-slide .txt_box a.btn_custom_white span {font-size:15px;} /* 메인메뉴 */ .main_section.main_menu > ul li.menu_sec {height: calc(100vh - 70px);} .main_section.main_menu > ul li.menu_sec > dl > dt {font-size:26px;} .main_section.main_menu > ul li.menu_sec > dl > dd span.menu_detail {font-size:14px;padding:12px 18px 12px 0;margin-top:-12px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a, .main_section.main_menu > ul li.menu_sec > dl > dd ul li a span {font-size:14px;line-height:14px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a {height:40px;} @keyframes fademenu1{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:140px;opacity:1;transform:translateY(0px);} } @keyframes fademenu2{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:190px;opacity:1;transform:translateY(0px);} } @keyframes fademenu3{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:240px;opacity:1;transform:translateY(0px);} } /* 와이드배너 */ .main_section.main_wide_bg {height:66.3vw;} /* 스텝 & 서비스제공 컨텐츠 */ .main_step_list > li > dl > dt {font-size:19px;line-height:23px;} /* 스텝 */ .main_section.main_step .main_step_list > li + li:before {width:40px;height:40px;top: calc(50% - 21px);} .main_section.main_step .main_step_list > li + li:after {width:7px;height:9px;top: calc(50% - 21px);} .main_section.main_step .main_step_list > li > span {height:53px;} .main_section.main_step .main_step_list > li:nth-of-type(1) > span {background-position-y:50%;background-size:auto 53px;} .main_section.main_step .main_step_list > li:nth-of-type(2) > span {background-position-y:50%;background-size:auto 45px;} .main_section.main_step .main_step_list > li:nth-of-type(3) > span {background-position-y:50%;background-size:auto 48px;} /* 비디오영상 */ .main_section.main_video .video_box #play_main1 span {width:50px;height:50px;background-size:auto 18px;} /* 서비스 제공 */ .main_section.main_offer {padding-bottom:14vw;} .main_section.main_offer .main_step_list > li > span {height:68px;} .main_section.main_offer .main_step_list > li:nth-of-type(1) > span {background-position-y:50%;background-size:auto 56px;} .main_section.main_offer .main_step_list > li:nth-of-type(2) > span {background-position-y:50%;background-size:auto 45px;} .main_section.main_offer .main_step_list > li:nth-of-type(3) > span {background-position-y:50%;background-size:auto 68px;} .main_section.main_offer a.btn_custom_point {width:250px;} .main_section.main_offer a.btn_custom_point:before, .main_section.main_offer a.btn_custom_point:after {width:24px;} .main_section.main_offer a.btn_custom_point span:before, .main_section.main_offer a.btn_custom_point span:after, .main_section.main_offer a.btn_custom_point:hover span:before, .main_section.main_offer a.btn_custom_point:hover span:after {width: calc(100% - 60px);} .main_section.main_offer a.btn_custom_point span:before {right:24px;} .main_section.main_offer a.btn_custom_point span:after {left:24px;} /* 거래내역조회 */ .main_section.main_deal_history {padding-top:12vw;padding-bottom:12vw;} } @media only screen and (max-width:767px) { /* visual */ .main_visual, .main_visual .slick-slide {height: calc(100vh - 66px);} .main_visual .slick-slide .txt_box h3, .main_visual .slick-slide .txt_box p, .main_visual .slick-slide .txt_box em {text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.45);} .main_visual .slick-slide .txt_box a.btn_custom_white {max-width:120px;height:42px;line-height:42px;box-shadow: 0px 2px 4px 0 rgba(0, 0, 0, 0.45);} .main_visual .slick-slide .txt_box a.btn_custom_white span {text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.45);} .main_visual .slick-slide .txt_box a.btn_custom_white:before, .main_visual .slick-slide .txt_box a.btn_custom_white:after {width:12px;} .main_visual .slick-slide .txt_box a.btn_custom_white span:before, .main_visual .slick-slide .txt_box a.btn_custom_white:hover span:before {width: calc(100% - 35px);left:11px;} .main_visual .slick-slide .txt_box a.btn_custom_white span:after, .main_visual .slick-slide .txt_box a.btn_custom_white:hover span:after {width: calc(100% - 35px);right:11px;} /* 메인메뉴 */ .main_section.main_menu > ul {display:block;} .main_section.main_menu > ul li.menu_sec {height:30vw;width:100%;display:block;background-size:100vw auto !important;transition:height 0.3s;text-align:center;} .main_section.main_menu > ul li.menu_sec:nth-of-type(1) {background-image:url(../images/skin/bg-main-intro-01-m.jpg);} .main_section.main_menu > ul li.menu_sec:nth-of-type(2) {background-image:url(../images/skin/bg-main-intro-02-m.jpg);} .main_section.main_menu > ul li.menu_sec:nth-of-type(3) {background-image:url(../images/skin/bg-main-intro-03-m.jpg);} .main_section.main_menu > ul li.menu_sec:nth-of-type(4) {background-image:url(../images/skin/bg-main-intro-04-m.jpg);} .main_section.main_menu > ul li.menu_sec.on {height:41.46vw;} .main_section.main_menu > ul li.menu_sec > dl {max-width:600px;text-align:center;} .main_section.main_menu > ul li.menu_sec > dl > dt {font-size:25px;padding-bottom:0;text-align:center;} .main_section.main_menu > ul li.menu_sec > dl > dd span.menu_detail {display:none;} .main_section.main_menu > ul li.menu_sec > dl > dd ul {font-size:0;text-align:left;} .main_section.main_menu > ul li.menu_sec.on > dl > dd ul {margin-top:28px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li {width: calc(50% - 7.5px);display:inline-block;vertical-align:top;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li + li {margin-top:0;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li:nth-of-type(2n) {margin-left:15px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li:nth-of-type(n + 3) {margin-top:15px;} .main_section.main_menu > ul li.menu_sec.on > dl > dd ul {animation-delay:0s;animation: fademenu1 0.6s ease-in-out 1;animation-fill-mode:forwards;} @keyframes fademenu1{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:95px;opacity:1;transform:translateY(0px);} } @keyframes fademenu3{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:150px;opacity:1;transform:translateY(0px);} } /* 와이드배너 */ .main_section.main_wide_bg {background-image:url(../images/skin/bg-main-fix-m.jpg);background-size:cover;} /* 스텝 & 서비스제공 컨텐츠 */ .main_step_list > li {width:100%;padding:8.13vw 0 7.86vw;font-size:0;vertical-align:top;} .main_step_list > li > dl > dt {margin-top:22px;} .main_step_list > li > dl > dd {font-size:14px;line-height:20px;} /* 스텝 */ .main_section.main_step {padding-top:0;padding-bottom:5.2vw;} .main_section.main_step .main_step_list > li + li:before {top:0;left:50%;} .main_section.main_step .main_step_list > li + li:after {top:0;left:50%;transform:translate(-50%, -50%) rotate(90deg);} .main_section.main_step .main_step_list > li > span {width:34.8%;vertical-align:middle;} .main_section.main_step .main_step_list > li > dl {display:inline-block;width:65.2%;text-align:left;vertical-align:middle;} .main_section.main_step .main_step_list > li > dl > dt {margin-top:0;} /* 비디오영상 */ .main_section.main_video .video_box {padding-top:56.25%;background:#666;} .main_section.main_video .video_box .thumb_main1 .thumb_pc {display:none;} .main_section.main_video .video_box .thumb_main1 .thumb_m {display:block;} /* 서비스 제공 */ .main_section.main_offer {padding-top:2px;} .main_section.main_offer .main_step_list {padding-bottom:3.66vw;} .main_section.main_offer .main_step_list > li {padding:6.13vw 0 5.86vw;} .main_section.main_offer .main_step_list > li + li:before {width:100%;height:1px;left:0;top:0;transform:translate(0%, 0%);} .main_section.main_offer .main_step_list > li .pc_br + br {display:inline-block;} .main_section.main_offer .main_step_list > li .t_br + br {display:none;} .main_section.main_offer a.btn_custom_point {width:238px;height:48px;line-height:48px;} .main_section.main_offer a.btn_custom_point span {font-size:15px;} .main_section.main_offer a.btn_custom_point:before, .main_section.main_offer a.btn_custom_point:after {width:20px;} .main_section.main_offer a.btn_custom_point span:before, .main_section.main_offer a.btn_custom_point span:after, .main_section.main_offer a.btn_custom_point:hover span:before, .main_section.main_offer a.btn_custom_point:hover span:after {width: calc(100% - 52px);} .main_section.main_offer a.btn_custom_point span:before {right:20px;} .main_section.main_offer a.btn_custom_point span:after {left:20px;} /* 거래내역조회 */ .main_section.main_deal_history {padding-top:14vw;padding-bottom:14vw;min-height:70.6vw;background-image:url(../images/skin/bg-main-deal-m.jpg);background-size:cover;} .main_deal_history .tit {padding-top:8.8vw;padding-bottom:3.8vw;} .main_deal_history .tit p {font-size:18px;} .main_deal_history .tit h3 {font-size:28px;padding:3.9vw 0 5.3vw;margin-bottom:5.2vw;} .main_deal_history .history_api_wrap {margin-bottom:7.6vw;} #wrap .history_api_wrap .history_search_form .history_input {height:44px;padding:14px 15px;width: calc(50% - 32px);} #wrap .history_api_wrap .history_search_form .history_submit {width:44px;height:44px;background-size:19px auto;} .history_api_wrap .history_search_form + .history_list_table {padding-top:5vw;} .history_api_wrap .history_list_table th {font-size:14px;padding:16px 5px;} .history_api_wrap .history_list_table td {height:46px;padding:6px 5px;} } @media only screen and (max-width:640px) { /* visual */ .main_visual, .main_visual .slick-slide {height: calc(100vh - 64px);} .main_visual .slick-slide .txt_box {padding:0 15px;} .main_visual .slick-slide .txt_box h3 {font-size:38px;} .main_visual .slick-slide .txt_box a.btn_custom_white {height:40px;line-height:40px;} .main_visual .slick-arrow {display:none !important;} /* 메인메뉴 */ .main_section.main_menu > ul li.menu_sec {height:42vw;} .main_section.main_menu > ul li.menu_sec.on {height:53.46vw;} /* 거래내역조회 */ .main_deal_history .tit p {font-size:17px;} .main_deal_history .tit h3 {font-size:27px;} .main_deal_history .tit > span {font-size:15px;line-height:1.46em;} .main_deal_history .tit .m_br + br {display:inline-block;} #wrap .history_api_wrap .history_search_form .history_input {width:100%;} #wrap .history_api_wrap .history_search_form .history_input + .history_input {margin-left:0px;margin-top:10px;width:calc(100% - 54px);} #wrap .history_api_wrap .history_search_form .history_input + .history_submit {margin-left:0px;margin-top:10px;} .history_api_wrap .history_list_table {width:100%;overflow-x:scroll;white-space:nowrap;} .history_api_wrap .history_list_table::-webkit-scrollbar {width:8px;height:8px;cursor:pointer;} .history_api_wrap .history_list_table::-webkit-scrollbar-track {background: linear-gradient(0deg, #aaa 30%, rgba(255, 255, 255, 0) 30%);} .history_api_wrap .history_list_table::-webkit-scrollbar-thumb {background: linear-gradient(0deg, #f08326 30%, rgba(255, 255, 255, 0) 30%);cursor:pointer;} .history_api_wrap .history_list_table::-webkit-scrollbar-thumb:hover {background: linear-gradient(0deg, #f08326 30%, rgba(255, 255, 255, 0) 30%);} .history_api_wrap .history_list_table .list_table_wrap {width:660px;margin-bottom:5.6vw;} .history_api_wrap .history_list_table th {padding:14px 5px;} .history_api_wrap .history_list_table td {height:42px;padding:4px 5px;} } @media only screen and (max-width: 500px) { /* visual */ .main_visual .slick-slide .txt_box em {font-size:26px;} .main_visual .slick-slide .txt_box h3 {font-size:36px;} .main_visual .slick-slide .txt_box p, .main_visual .slick-slide .txt_box a.btn_custom_white span {font-size:15px;} /* 메인메뉴 */ .main_section.main_menu > ul li.menu_sec {height:50vw;} .main_section.main_menu > ul li.menu_sec.on {height:61.46vw;} /* 와이드배너 */ .main_section.main_wide_bg {height:70.3vw;} /* 스텝 & 서비스제공 컨텐츠 */ .main_step_list > li {padding:10.13vw 0 9.86vw;} .main_step_list > li > dl > dt {font-size:18px;line-height:22px;margin-top:16px;} .main_step_list > li > dl > dd {font-size:13px;line-height:19px;} /* 스텝 */ .main_section.main_step {padding-top:0;padding-bottom:5.2vw;} .main_section.main_step .main_step_list > li + li:after {width:6px;height:8px;} /* 서비스 제공 */ .main_section.main_offer {padding-bottom:16vw;} .main_section.main_offer .main_step_list {padding-bottom:2.66vw;} .main_section.main_offer .main_step_list > li {padding:8.13vw 0 7.86vw;} .main_section.main_offer a.btn_custom_point {width:238px;height:46px;line-height:46px;} .main_section.main_offer a.btn_custom_point:before, .main_section.main_offer a.btn_custom_point:after {width:12px;} .main_section.main_offer a.btn_custom_point span:before, .main_section.main_offer a.btn_custom_point span:after, .main_section.main_offer a.btn_custom_point:hover span:before, .main_section.main_offer a.btn_custom_point:hover span:after {width: calc(100% - 36px);} .main_section.main_offer a.btn_custom_point span:before {right:12px;} .main_section.main_offer a.btn_custom_point span:after {left:12px;} /* 거래내역조회 */ .main_section.main_deal_history {padding-top:16vw;padding-bottom:16vw;min-height:145.6vw;} .main_deal_history .w_custom {border-radius:10px;} .main_deal_history .tit {padding-top:11.8vw;padding-bottom:3.8vw;} .main_deal_history .tit p {font-size:16px;} .main_deal_history .tit h3 {font-size:26px;padding:3.9vw 0 6.3vw;margin-bottom:6.2vw;} .main_deal_history .tit > span {font-size:14px;} .main_deal_history .history_api_wrap {margin-bottom:9.6vw;} #wrap .history_api_wrap .history_search_form .history_input {font-size:13px;height:40px;padding:14px 15px;border-radius:2px;} #wrap .history_api_wrap .history_search_form .history_input:placeholder {font-size:13px;} #wrap .history_api_wrap .history_search_form .history_input::placeholder {font-size:13px;} #wrap .history_api_wrap .history_search_form .history_input:-webkit-input-placeholder {font-size:13px;} #wrap .history_api_wrap .history_search_form .history_input:-ms-input-placeholder {font-size:13px;} #wrap .history_api_wrap .history_search_form .history_submit {width:40px;height:40px;border-radius:2px;background-size:16px auto;} .history_api_wrap .history_search_form + .history_list_table {padding-top:7vw;} .history_api_wrap .history_list_table .list_table_wrap {margin-bottom:5.6vw;} .history_api_wrap .history_list_table th {font-size:13px;padding:12px 5px;} .history_api_wrap .history_list_table th:nth-of-type(1) {border-radius:2px 0 0 2px;} .history_api_wrap .history_list_table th:nth-of-type(5) {border-radius:0 2px 2px 0;} .history_api_wrap .history_list_table td {font-size:13px;height:38px;padding:4px 5px;} } @media only screen and (max-width:479px) { /* visual */ .main_visual .slick-slide .txt_box {top:25.6%;} .main_visual .slick-slide .txt_box em {font-size:25px;} .main_visual .slick-slide .txt_box h3 {font-size:35px;} .main_visual .slick-slide .txt_box p, .main_visual .slick-slide .txt_box a.btn_custom_white span {font-size:14px;} /* 메인메뉴 */ .main_section.main_menu > ul li.menu_sec {height:60vw;background-size:auto 71.46vw !important;} .main_section.main_menu > ul li.menu_sec:nth-of-type(4) {background-size:auto 86.46vw !important;} .main_section.main_menu > ul li.menu_sec.on {height:71.46vw;} /* 와이드배너 */ .main_section.main_wide_bg {height:73.3vw;} /* 비디오영상 */ .main_section.main_video .video_box {border-radius:5px;} /* 서비스 제공 */ .main_section.main_offer {padding-bottom:20vw;} .main_section.main_offer .main_step_list > li {padding:13.32vw 0 12.53vw;} .main_section.main_offer a.btn_custom_point {width:65.8%;min-width:228px;max-width:280px;} .main_section.main_offer a.btn_custom_point span {font-size:14px;} .main_section.main_offer a.btn_custom_point span:before, .main_section.main_offer a.btn_custom_point span:after, .main_section.main_offer a.btn_custom_point:hover span:before, .main_section.main_offer a.btn_custom_point:hover span:after {width: calc(100% - 34px);} /* 거래내역조회 */ .main_deal_history .tit {padding-top:12.8vw;padding-bottom:4.8vw;} .main_deal_history .tit p {font-size:15px;} .main_deal_history .tit h3 {font-size:25px;padding:4.9vw 0 7.3vw;margin-bottom:7.2vw;} .main_deal_history .tit > span {font-size:13px;} .main_deal_history .history_api_wrap {margin-bottom:10.6vw;} #wrap .history_api_wrap .history_search_form .history_input {font-size:12px;padding:13px 10px;} #wrap .history_api_wrap .history_search_form .history_input:placeholder {font-size:12px;} #wrap .history_api_wrap .history_search_form .history_input::placeholder {font-size:12px;} #wrap .history_api_wrap .history_search_form .history_input:-webkit-input-placeholder {font-size:12px;} #wrap .history_api_wrap .history_search_form .history_input:-ms-input-placeholder {font-size:12px;} #wrap .history_api_wrap .history_search_form .history_submit {background-size:15px auto;} .history_api_wrap .history_search_form + .history_list_table {padding-top:8vw;} } @media only screen and (max-width:360px) { /* visual */ .main_visual .slick-slide .txt_box em {font-size:24px;} .main_visual .slick-slide .txt_box h3 {font-size:33px;} .main_visual .visual_control {width:59%;} .main_visual .visual_control > span {font-size:13px;} .main_visual .visual_control > span.slideCount_now {width:9%;} .main_visual .visual_control > span.slideCount_total {width:16%;} .main_visual .slider-progress-wrap {width:70%;} /* 메인메뉴 */ .main_section.main_menu {} .main_section.main_menu > ul li.menu_sec {height:66vw;background-size:auto 78.46vw !important;} .main_section.main_menu > ul li.menu_sec:nth-of-type(4) {background-size:auto 93.46vw !important;} .main_section.main_menu > ul li.menu_sec.on {height:78.46vw;} .main_section.main_menu > ul li.menu_sec > dl > dt {font-size:23px;} .main_section.main_menu > ul li.menu_sec.on > dl > dd ul {margin-top:24px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li {width: calc(50% - 5px);} .main_section.main_menu > ul li.menu_sec > dl > dd ul li:nth-of-type(2n) {margin-left:10px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li:nth-of-type(n + 3) {margin-top:10px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a, .main_section.main_menu > ul li.menu_sec > dl > dd ul li a span {font-size:13px;} .main_section.main_menu > ul li.menu_sec > dl > dd ul li a {padding-left:10px;padding-right:10px;} @keyframes fademenu1{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:90px;opacity:1;transform:translateY(0px);} } @keyframes fademenu3{ 0% {height:0;opacity:0;transform:translateY(50px);} 100%{height:140px;opacity:1;transform:translateY(0px);} } /* 와이드배너 */ .main_section.main_wide_bg {height:73.3vw;} /* 스텝 & 서비스제공 컨텐츠 */ .main_step_list > li {padding:10.13vw 0 9.86vw;} .main_step_list > li > dl > dt {margin:10px 0 13px;font-size:17px;line-height:21px;} .main_step_list > li > dl > dd {font-size:13px;line-height:19px;} /* 스텝 */ .main_section.main_step {padding-bottom:5.2vw;} .main_section.main_step .main_step_list > li + li:before {width:32px;height:32px;} .main_section.main_step .main_step_list > li + li:after {width:6px;height:8px;} .main_section.main_step .main_step_list > li > span {height:49px;width:33%;} .main_section.main_step .main_step_list > li:nth-of-type(1) > span {background-size:auto 49px;} .main_section.main_step .main_step_list > li:nth-of-type(2) > span {background-size:auto 41px;} .main_section.main_step .main_step_list > li:nth-of-type(3) > span {background-size:auto 44px;} .main_section.main_step .main_step_list > li > dl {width:67%;} .main_section.main_step .main_step_list > li > dl > dt {margin-top:0;} /* 비디오영상 */ .main_section.main_video .video_box {border-radius:5px;padding-top:56.25%;} .main_section.main_video .video_box #play_main1 span {width:46px;height:46px;background-size:auto 14px;} /* 서비스 제공 */ .main_section.main_offer {padding-bottom:20vw;} .main_section.main_offer .main_step_list {padding-bottom:2.66vw;} .main_section.main_offer .main_step_list > li {padding:13.32vw 0 12.53vw;} .main_section.main_offer .main_step_list > li > span {height:64px;} .main_section.main_offer .main_step_list > li:nth-of-type(1) > span {background-size:auto 52px;} .main_section.main_offer .main_step_list > li:nth-of-type(2) > span {background-size:auto 41px;} .main_section.main_offer .main_step_list > li:nth-of-type(3) > span {background-size:auto 64px;} /* 거래내역조회 */ .main_section.main_deal_history {min-height:155.6vw;} .main_deal_history .tit h3 {font-size:24px;} } @media only screen and (max-width:340px) { /* visual */ .main_visual .slick-slide .txt_box {padding:0 10px;} .main_visual .slick-slide .txt_box em {font-size:22px;} .main_visual .slick-slide .txt_box h3 {font-size:31px;} .main_visual .slick-slide .txt_box p, .main_visual .slick-slide .txt_box a.btn_custom_white span {font-size:13px;} .main_visual .visual_control {width:59%;bottom:42px;} .main_visual .visual_control > span.slideCount_now {width:10%;} .main_visual .visual_control > span.slideCount_total {width:17%;} .main_visual .slider-progress-wrap {width:68%;} .main_visual .slide_btn {background-size:auto 9px !important;} /* 거래내역조회 */ .main_deal_history .tit p {font-size:14px;} .main_deal_history .tit h3 {font-size:23px;} .main_deal_history .tit > span {font-size:12px;} } @media only screen and (max-width:320px) { }