@charset "utf-8"; /*─────────────────────────────────────────────────────────── header, footer, main 관련 작성 css 파일입니다. ** 이와 서브페이지 관련 css는 /css/sub.css 에 있습니다. ───────────────────────────────────────────────────────────*/ /*─────────────────────────────────────────────────────────── layout common ───────────────────────────────────────────────────────────*/ /* pc 일반 */ #wrap {width:100%;margin:0;padding:0;box-sizing:border-box;-webkit-overflow-scrolling:touch;} /* #header 와 #container, #footer 전체 감싸는 영역 */ #wrap #header {overflow:visible;} #wrap #container {width:100%;margin:0;padding:0;} #wrap #footer {width:100%;margin:0;} #contents_wrap {width:100%;max-width:1270px;padding:0 15px;margin:0 auto;position:relative;z-index:1;box-sizing:border-box;} /* #container 안의 컨텐츠 감싸는 영역 */ #contents_wrap #side_box {width:100%;padding:110px 0 0 0;box-sizing:border-box;} /* lnb 감싸는 영역 */ #contents_wrap #contents_box {width:100%;padding:102px 0 10% 0;box-sizing:border-box;} /* 컨텐츠를 감싸는 영역 */ #contents_wrap #side_box + #contents_box {padding-top:0;} /* lnb와 컨텐츠가 float 일때 사이즈 재설정 */ #contents_wrap .nav_wrap {box-sizing:border-box;} #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;/* overflow:hidden; */} #content .sub_content:after {clear:both;content:"";display:block;} .w_custom {width:100%;max-width:1270px;padding:0 15px;text-align:left;margin:0 auto;box-sizing:border-box;position: relative;} @media only screen and (max-width:1217px) { body.on {height:100%;overflow:hidden;} } @media only screen and (max-width:1023px) { #contents_wrap #side_box {padding: 85px 0 0 0;} #contents_wrap #contents_box {padding:80px 0 11% 0;} } @media only screen and (max-width:860px) { #contents_wrap #side_box {padding: 85px 0 0 0;} } @media only screen and (max-width:767px) { #contents_wrap #side_box {display:none;} .sub_goods #contents_wrap #side_box {display:block;padding:0;} } @media only screen and (max-width:640px) { #contents_wrap #contents_box {padding:60px 0 15% 0;} } @media only screen and (max-width:479px) { #contents_wrap #contents_box {padding:40px 0 20% 0;} } @media only screen and (max-width:340px) { #contents_wrap, .w_custom {padding-left:10px !important;padding-right:10px !important;} } /*─────────────────────────────────────────────────────────── 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;} /* 일반 */ .menu-trigger {padding:0;width:22px;height:17px;position:relative;box-sizing:border-box;display:none;vertical-align:middle; margin-left:20px;} .menu-trigger span {transition:0.3s;position:absolute;width:100%;height:2px;background-color:#fff;left:0;} .menu-trigger span:nth-of-type(1) {top:50%;transform:translateY(-8px) rotate(0deg);} .menu-trigger span:nth-of-type(2) {top:50%;margin-top:-1px;} .menu-trigger span:nth-of-type(3) {top:50%;transform:translateY(6px) rotate(0deg);} .menu-trigger.active-1 {} .menu-trigger.active-1 span {background-color: #111;} .menu-trigger.active-1 span:nth-of-type(1) {transform:translateY(-50%) rotate(-45deg);} .menu-trigger.active-1 span:nth-of-type(2) {opacity:0;} .menu-trigger.active-1 span:nth-of-type(3) {transform:translateY(-50%) rotate(45deg);} #header.on .menu-trigger span, #aside {background-color:#111;} ul.lang_list {font-size:0;vertical-align:top;} ul.lang_list li {padding-right:12px;line-height:16px;padding-top:4px;vertical-align:top;display:inline-block;} ul.lang_list li + li {padding-left:12px;padding-right:0;position:relative;z-index:1;} ul.lang_list li + li:before {height:10px;display:inline-block;content:"";width:1px;background:#ddd;position:absolute;left:0;top: calc(50% + 2px);transform:translateY(-50%);} ul.lang_list li a {font-size:14px;letter-spacing:0;font-weight:400;color:#aaa;font-family: 'Lexend',-apple-system,BlinkMacSystemFont,Roboto,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',Dotum,sans-serif;text-transform:uppercase;} ul.lang_list li:nth-of-type(1) a {color:#fff;} #header.on ul.lang_list li:nth-of-type(1) a {color:#111;} #header {position:sticky;background:#fff; padding:0 15px;height:80px;overflow:visible;left:0;top:0;margin:0 auto;border:0;text-align:center;z-index:999;width:100%;box-sizing:border-box;font-size:0;transition:background 0.3s;} #header.on {background:#fff !important; box-shadow:0 0 8px 2px rgba(0, 0, 0, 0.12);} #header.aside_on{box-shadow:none;} #header .header_cont {padding:0;height: 80px;position:relative;z-index:1;width:100%;max-width: 1740px;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;} #header .hd_logo a {width:154px;height:0;padding:16.88% 0 0;margin:0;background-image:url(../images/skin/logo@2x.png);background-repeat:no-repeat;background-position:0 0;background-size:cover;display:inline-block;vertical-align:top;font-size:0;} #header.on .hd_logo a, #header.aside_on .hd_logo a {background-image:url(../images/skin/logo@2x.png) !important;} #header .hd_lnb {left:50%;transform: translate(-50%, -50%);width: calc(100% - 600px);z-index:10;font-size:0;height: 100%;} #header .hd_lnb > li, #header .hd_lnb > li > a {padding:0;line-height:26px;font-size:16px;letter-spacing:0;font-weight: 400;color:#111;vertical-align:top;text-align:center;display:inline-block;box-sizing:border-box;transition: all .2s;letter-spacing: 0.03em;} .main_index #header .hd_lnb > li, .main_index #header .hd_lnb > li > a{color:#fff;} #header.on .hd_lnb > li, #header.on .hd_lnb > li > a {color: #111111;} #header .hd_lnb > li {padding: 0 1.3vw;position:relative;display: inline-flex;align-items: center;height: 100%;} #header .hd_lnb > li.now > a {} #header .hd_lnb > li.on > a, #header.on .hd_lnb > li.now > a {color:#b42e2b;} #header .hd_lnb > li .hd_lnb_dep2 {z-index:55;position:absolute;left:50%;transform: translateX(-50%);width:100%;width:max-content;min-width:128px;top:100%;padding:0;height:0;opacity:0;overflow:hidden;transition:all 0.5s;} #header .hd_lnb > li.on .hd_lnb_dep2 {height:auto;overflow:initial;opacity:1;} #header .hd_lnb > li .hd_lnb_dep2 > ul {padding: 6px 25px 14px;border-radius:0 0 4px 4px;text-align:center;background:#fff;box-shadow:0 4px 3px 0 rgba(0, 0, 0, 0.22);box-sizing:border-box;width: max-content; min-width:160px;} #header .hd_lnb > li .hd_lnb_dep2 > ul > li {padding:5px 0;} #header .hd_lnb > li .hd_lnb_dep2 > ul > li > a {line-height:1;font-size:14px;font-weight:400;color:#666;font-family: 'Lexend',-apple-system,BlinkMacSystemFont,Roboto,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',Dotum,sans-serif;position:relative;z-index:1;} #header .hd_lnb > li .hd_lnb_dep2 > ul > li > a:before {background:#0f1f4b;width:0;height:1px;left:0;bottom:0;display:inline-block;position:absolute;content:"";transition: all .2s;} #header .hd_lnb > li .hd_lnb_dep2 > ul > li:hover > a {color:#0f1f4b;} #header .hd_lnb > li .hd_lnb_dep2 > ul > li:hover > a:before {width:100%;} #header .hd_right {right:0;z-index:15; display:inline-flex; align-items:center;} #header .hd_right .lang{display:inline-flex;} #header .hd_right .lang li{} #header .hd_right .lang li + li{margin-left:14px;} #header .hd_right .lang li a{font-size:15px; font-weight:300; color:#ccc;} .main_index #header .hd_right .lang li.on a{color:#fff;} #header .hd_right .lang li.on a, #header.on .hd_right .lang li.on a{color:#333; font-weight:400;} .conta_btn{display:inline-flex; align-items:center; padding:0 20px; box-sizing:border-box; font-size:14px; font-weight:400; color:#fff; background:#b42e2b; border-radius:30px; height:45px; margin-left:40px;} .conta_btn:after{display:inline-flex; content:''; width:24px; height:24px; background:url('../images/skin/hd_right_icon.png') no-repeat center; margin-left:15px;} /* main header style */ .main_index #header {position:fixed; background: transparent;} .main_index #header .hd_logo a {background-image:url(../images/skin/logo-wh@2x.png);} @media only screen and (max-width:1500px) { #header .hd_lnb{width:calc(100% - 550px);} #header .hd_lnb > li{padding:0 1vw;} #header .hd_lnb > li, #header .hd_lnb > li > a{font-size:15px;} .conta_btn{margin-left:2vw;} } @media only screen and (max-width:1320px) { #header .hd_lnb > li, #header .hd_lnb > li > a{font-size:14px;} #header .hd_right .lang li a{font-size:14px;} .conta_btn{font-size:13px; padding:0 15px;} } @media only screen and (max-width:1240px) { ul.lang_list li {padding-right:9px;line-height:16px;padding-top:4px;} ul.lang_list li + li {padding-left:8px;} ul.lang_list li a {font-size:14px;} #header .hd_lnb{left:46%; width:calc(100% - 420px);} #header .hd_lnb > li {} #header .hd_right .hd_lang {padding-right:28px;} #header .hd_right .hd_custom a {font-size:16px;line-height:20px;background-size:20px auto;} #header .hd_right .dis_table .hd_cate {display:table-cell;padding-left:20px;} } @media only screen and (max-width:1140px) { ul.lang_list li {padding-right:7px;padding-top:3px;} ul.lang_list li + li {padding-left:8px;} ul.lang_list li a {font-size:13px;} #header, #header .header_cont {height:74px;} #header .hd_lnb > li, #header .hd_lnb > li > a {font-size:13px;} #header .hd_lnb > li {} #header .hd_right .hd_lang {padding-right:22px;} #header .hd_right .hd_custom a {font-size:15px;background-size:18px auto;padding:10px 40px 10px 20px;} #header .hd_right .dis_table .hd_cate {padding-left:16px;} } @media only screen and (max-width:1060px) { #header .hd_lnb > li, #header .hd_lnb > li > a {font-size:12px;} } @media only screen and (max-width:1023px) { .menu-trigger{display:inline-block;} #header .hd_lnb {display:none;} .conta_btn{height:40px; margin-left:20px;} .conta_btn:after{width:22px; height:22px; background-size:100% auto; margin-left:10px;} } @media only screen and (max-width:860px) { #header, #header .header_cont {height:70px;} #header .hd_logo a, #aside .aside_logo a {width:145px;} } @media only screen and (max-width:767px) { #header .hd_logo a, #aside .aside_logo a {width:138px;} #header .hd_right .dis_table .hd_lang {display:none;} #header .hd_right .hd_custom a {font-size:14px;line-height:20px;background-size:17px auto;} } @media only screen and (max-width:640px) { #header, #header .header_cont {height:64px;} #header .hd_logo a, #aside .aside_logo a {width:132px;} #header .hd_right .dis_table .hd_lang {display:none;} } @media only screen and (max-width:500px) { #header, #header .header_cont {height:64px;} #header .hd_logo a, #aside .aside_logo a {width:132px;} #header .hd_right .hd_custom a{padding: 5px 30px 5px 10px;background-position: 93% center;} } @media only screen and (max-width:479px) { .conta_btn{display:none;} } @media only screen and (max-width:375px) { .menu-trigger {width:18px;height:14px;} .menu-trigger span:nth-of-type(1) {transform:translateY(-7px) rotate(0deg);} .menu-trigger span:nth-of-type(3) {transform:translateY(5px) rotate(0deg);} #header {padding:0 15px;height:60px;} #header .header_cont {height:60px;} #header .hd_logo a, #aside .aside_logo a {width:121px;} } @media only screen and (max-width:360px) { } @media only screen and (max-width:320px) { #header {padding-left:10px;padding-right:10px;} } /*─────────────────────────────────────────────────────────── ASIDE | outline/header.html, outline/nav.html ───────────────────────────────────────────────────────────*/ /* aside */ .aside_bg{width:36%;height:100%;position: fixed;top:0;left:-35%;opacity:0;transition:all 0.5s;background:url('../images/skin/cate-bg.jpg')no-repeat center top;background-size:cover;z-index:997;} .aside_bg.on{left:0%;opacity:1;transition:all 0.5s;} .aside_bg .aside_logo{display:block;vertical-align: top;padding:29px 0 27px 72px;position:absolute;top:0;left:0;width:100%;box-sizing:border-box;} #aside {top:0px;right:-64%;width:64%;transition:0.8s;height:100%;box-sizing:border-box;box-sizing:border-box;position:fixed;background:#fff;z-index:998;opacity:0;transition:all 0.5s;} #aside.on {right:0%;opacity:1;transition:all 0.5s;} @media only screen and (min-width:1023px){ #aside, .aside_bg{display:none !important;} } #aside .aside_box {width:100%;height:100%;margin:0;overflow:hidden;position:relative;z-index:1;box-sizing:border-box;display:block;font-size:0;} #aside .aside_box .aside_container{width:100%;height:100%;position: relative;font-size:0;} #aside .aside_hd{position: absolute;top:0;left:0;width:100%;height:100px;box-sizing:border-box;background:transparent;z-index:5;} #aside .aside_hd:after{clear:both;content:"";display: block;} #aside .aside_logo{display:none;vertical-align: top;padding:29px 0 28px 72px;} #aside .aside_logo a{display: block;width:100%;height:100%;} #aside .aside_right{display:flex;align-items:center;height:100%;padding-right:90px;vertical-align: top;float: right;font-size:0;} #aside .hd_lang{position:relative;display: inline-block;vertical-align: middle;margin-right:25px;} #aside .hd_lang dt{position:relative;font-size:18px;font-weight:600;color:#666;display: flex;cursor: pointer;} #aside .hd_lang dt span{display: flex;font-size:inherit;font-weight:inherit;color:inherit;padding-right:28px;align-items: center; } #aside .hd_lang dt span:before{display:inline-flex; content:''; width:25px; height:25px; background:url('../images/skin/icon-global-ov.png') no-repeat center;background-size:auto 100%;margin-right:10px; transition:all 0.4s;} #aside .hd_lang dt span:after{position:absolute;content:'';top:10px;right:0;border-top:4px solid #666;border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:none;transition:all 0.4s;opacity:0.7;} #aside .hd_lang dt.on span:after{transform:rotate(180deg);top:13px;} #aside .hd_lang dd{display:none;text-transform:uppercase;position:absolute;top: calc(100% + 5px);left:50%;width: 100%;transform:translateX(-50%);text-align: center;background: #fff;border: 1px solid #ddd;box-sizing: border-box;} #aside .hd_lang dd ul{padding: 11px 16px;} #aside .hd_lang dd ul li{} #aside .hd_lang dd ul li a{position:relative;display: inline-block;font-size: 14px;font-weight: 400;color:#333;padding: 7px 0;transition:all 0.4s;} #aside .hd_lang dd ul li a:before{position:absolute;content:'';width:0;height:1px;background:#a60000;left:50%;bottom: 8px;transform:translateX(-50%);transition:all 0.4s;} #aside .btn_cate{display: inline-block;box-sizing:border-box;vertical-align: top;width:24px;height:24px;position: relative;} #aside .btn_cate a{display: block;width:100%;height:100%;position: relative;background:url('../images/skin/btn-close.png')no-repeat center;background-size:auto 100%;} #aside .slide_container{width:100%;height:100%;display:inline-block;box-sizing:border-box;vertical-align: top;display: inline-flex;align-items: center;} #aside .slide_box{display:flex;align-items:center;height: 83%;position: relative;} #aside .slide_box .slidemenu{width:100%;padding:0 109px 0 127px;box-sizing: border-box;height: 100%;overflow-y: auto;} #aside .slide_box .slidemenu > li{border-bottom:1px solid #ddd;display:flex;align-items:center;} #aside .slide_box .slidemenu > li:last-child{border:none;} #aside .slide_box .slidemenu > li > a{font-size:30px;color:#333;font-weight:700;letter-spacing:-0.84px;display: inline-block;width: 220px;vertical-align: top;line-height: 90px;transition:all 0.4s;} #aside .slide_box .slidemenu > li .depth{display: inline-block;box-sizing:border-box;vertical-align: top;width: calc(100% - 220px);font-size:0;padding: 30px 0 20px;} #aside .slide_box .slidemenu > li .depth li{display: inline-block;box-sizing:border-box;vertical-align: top;margin:0 31px 10px;} #aside .slide_box .slidemenu > li .depth li a{font-size: 18px;color:#666;font-weight:400;transition:all 0.4s;} #aside .conta_btn{display:none;} @media only screen and (min-width:1024px) { #aside .slide_box .slidemenu > li:hover > a{color:#00c5a8;} #aside .slide_box .slidemenu > li .depth li:hover a{color:#333;} } @media only screen and (max-width:1900px) { #aside .slide_box .slidemenu{padding:0 45px;} } @media only screen and (max-width:1650px) { #aside .slide_box .slidemenu > li > a{font-size:24px;width: 200px;} #aside .slide_box .slidemenu > li .depth{width: calc(100% - 200px);padding: 18px 0 15px;} } @media only screen and (max-width:1024px) { .aside_bg .aside_logo{padding:22px 0 23px 20px;} .aside_bg .aside_logo a{height:35px;} .aside_bg .aside_logo img{height:100%;} #aside .aside_hd{height:80px;} #aside .aside_right{padding-right:30px;} #aside .slide_box .slidemenu{padding:0 20px;} #aside .slide_box .slidemenu > li > a{font-size:20px;width: 120px;line-height: 74px;} #aside .slide_box .slidemenu > li .depth{margin-left: 0;width: calc(100% - 120px);} #aside .slide_box .slidemenu > li .depth li{margin:0 10px 10px;} #aside .slide_box .slidemenu > li .depth li a{font-size: 15px;} } @media only screen and (max-width:860px) { #aside .slide_box .slidemenu > li > a{font-size:17px; width:110px;} #aside .slide_box .slidemenu > li .depth{width:calc(100% - 110px); padding:15px 0 12px;} #aside .slide_box .slidemenu > li .depth li a{font-size:14px;} } @media only screen and (max-width:640px) { .aside_bg.on{display: none;} #aside{top: 0;border-top:1px solid #ddd;width:100%;right:-100%;z-index:101;padding-top: 78px;} #aside .aside_box{overflow-y:auto;overflow-x:hidden;} #aside .aside_hd, #aside .aside_bnr{display: none;} #aside .slide_container{display: block;width:100%;margin-top: 0;height:auto;} #aside .slide_box{width:100%;display: block;height:auto;} #aside .aside_box .aside_container{height:auto;padding-bottom:200px;text-align: center;} #aside .aside_box .aside_container:before{bottom:0;right:50%;transform:translateX(50%);width:300px;height:110px;} #aside .slide_box .slidemenu{box-sizing:border-box;} #aside .slide_box .slidemenu > li{display: block;text-align: center;position: relative;box-sizing:border-box;padding:0;border:none;} #aside .slide_box .slidemenu > li > a{width: auto;font-size:22px;display: block;width:100%;border-bottom:1px solid #ddd;line-height:55px;} #aside .slide_box .slidemenu li.on > a{color:#00c5a8 !important;} #aside .slide_box .slidemenu .icons{display: inline-block;box-sizing:border-box;position: relative;width:55px;height:55px;position: absolute;top:0;right:0;cursor:pointer;} #aside .slide_box .slidemenu .icons:before{width:10px;height:10px;content:"";border:1px solid #888;border-width:1px 1px 0 0;position: absolute;top:50%;left:50%;transform:translate(-50%, -86%) rotate(135deg);} #aside .slide_box .slidemenu li.on .icons:before{transform:translate(-50%, -41%) rotate(-45deg);border-color:#00c5a8;} #aside .slide_box .slidemenu > li .depth{width:100%;padding: 30px 0 30px;margin: 0;display: none;background: #f5f5f5;} #aside .slide_box .slidemenu > li .depth li{display: block;margin:0;} #aside .slide_box .slidemenu > li .depth li + li{margin-top:20px;} #aside .slide_box .slidemenu > li .depth li a{font-size:18px;display: block;} #aside .m_multi_lang{display: block;margin-top:60px;} #aside .m_multi_lang ul{font-size:0;text-align: center;} #aside .m_multi_lang ul li{display: inline-block;box-sizing:border-box;vertical-align: top;position: relative;} #aside .m_multi_lang ul li + li{margin-left:40px;padding-left:40px;} #aside .m_multi_lang ul li + li:before{width:1px;height:15px;content:"";background:#ddd;position: absolute;left:0;top:4px;} #aside .m_multi_lang ul li a{font-size:20px;color:#888;font-weight:400;text-transform:uppercase;} #aside .m_multi_lang ul li.on a{color:#333;} } @media only screen and (max-width:479px) { #aside{top: 0;padding-top: 65px;} #aside .slide_container{} #aside .slide_box .slidemenu > li > a{font-size:20px;line-height:60px;padding:0;} #aside .slide_box .slidemenu .icons{width:60px;height:60px;} #aside .slide_box .slidemenu .icons:before{left:71%;} #aside .slide_box .slidemenu li.on .icons:before{transform:translate(-50%, -26%) rotate(-45deg);} #aside .slide_box .slidemenu > li .depth{padding: 14px 0 15px 0;} #aside .slide_box .slidemenu > li .depth li + li{margin-top:0;} #aside .slide_box .slidemenu > li .depth li a{font-size:14px;color:#666;font-weight:400;line-height:38px;} #aside .m_multi_lang{margin-top:34px;} #aside .m_multi_lang ul li + li{margin-left:19px;padding-left:19px;} #aside .m_multi_lang ul li + li:before{height:11px;} #aside .m_multi_lang ul li a{font-size:17px;} #aside .conta_btn{display:inline-flex;margin: 30px 0 0 0;} } /*─────────────────────────────────────────────────────────── FOOTER | outline/footer.html ───────────────────────────────────────────────────────────*/ .loading_img{width:100%;height:100%;position: fixed;top:0;left:0;z-index:10;background:rgba(0,0,0,0.7);} .loading_img .img_box{position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);text-align: center;} .loading_img .img_box img{width:25%;} @media only screen and (max-width:640px){ .loading_img .img_box img{width:50%;} } /* pc일반 */ #footer {padding-top:60px;padding-bottom:100px;background-color:#09132e;background-image:url(../images/skin/bg-ft-map.png);background-repeat:no-repeat;background-position:405px 0;background-size:648px auto;position:relative;z-index:1;} #footer .ft_inner {} #footer .ft_cs {float:left;width:100%;font-size:0;} #footer .ft_cs + .ft_cs{margin-top:25px;} #footer .ft_cs .ft_logo {padding-bottom:36px;} #footer .ft_cs .ft_logo a{display: inline-block;box-sizing:border-box;} #footer .ft_cs .ft_logo a, #footer .ft_cs .ft_logo img {vertical-align:top;} #footer .ft_cs .ft_logo img {width:auto;height:38px;} #footer .ft_cs .ft_logo p{display: inline-block;box-sizing:border-box;vertical-align: top;font-size:30px;color:#fff;font-weight:500;line-height:38px;margin-left:25px;padding-left:25px;position: relative;} #footer .ft_cs .ft_logo p:before{width:2px;height:20px;content:"";background:#fff;position: absolute;top:11px;left:0;} #footer .ft_cs .cs_address {font-size:16px;padding-left:23px;background:url(../images/skin/icon-ft-address@2x.png) no-repeat 0 2px;background-size:11px auto;line-height:1.43em;font-weight:400;color:#fff;white-space:normal;word-break:keep-all;word-wrap:break-word;display: inline-block;margin-right: 50px;} #footer .ft_cs > dl dt, #footer .ft_cs > dl dd, #footer .ft_cs address {font-family: 'Lexend',-apple-system,BlinkMacSystemFont,Roboto,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',Dotum,sans-serif;white-space:normal;word-break:keep-all;word-wrap:break-word;} #footer .ft_cs address a {font-size:inherit;font-weight:inherit;color:Inherit;margin-left:15px;} #footer .ft_cs > dl {padding: 0;display:inline-block;display: inline-flex;margin-right: 30px;} #footer .ft_cs > dl + dl {} #footer .ft_cs > dl dt, #footer .ft_cs > dl dd {line-height:16px;display:block;margin:0;padding:0;box-sizing:border-box;} #footer .ft_cs > dl dt {padding-bottom:2px;font-size:14px;font-weight:400;color:rgba(255, 255, 255, 0.3);margin-right: 9px;} #footer .ft_cs > dl dd, #footer .ft_cs > dl dd a {font-size:16px;font-weight:400;color:rgba(255, 255, 255, 0.6);} #footer .ft_cs address {font-size:14px;line-height:1.4em;font-weight:400;font-style:normal;color:rgba(255, 255, 255, 0.3);white-space:normal;word-break:keep-all;word-wrap:break-word;margin-top: 28px;} #footer .ft_bnr {float:right;text-align:right;font-size:0;vertical-align:top;} #footer .ft_bnr.for_pc {display:block;} #footer .ft_bnr.for_m {display:none;} #footer .ft_bnr li {display:inline-block;vertical-align:top;} #footer .ft_bnr li + li {margin-left:20px;} #footer .ft_bnr li img {width:auto;height:99px;vertical-align:top;} @media only screen and (max-width:1270px) { #footer {padding-top:4.84vw;padding-bottom:7.06vw;background-position:32.6vw 0;} } @media only screen and (max-width:1140px) { #footer {background-position:30.6vw 0;} } @media only screen and (max-width:1024px) { #footer {background-position:26.6vw 0;} } @media only screen and (max-width:960px) { #footer {padding-top:5.84vw;padding-bottom:10.06vw;background-position:21.6vw 0;} #footer .ft_cs .ft_logo img {height:34px;} #footer .ft_cs .cs_address {font-size:15px;padding-left:21px;margin-right: 40px;} #footer .ft_cs > dl {margin-right: 20px;} #footer .ft_cs > dl + dl {} #footer .ft_cs > dl dd, #footer .ft_cs > dl dd a {font-size:15px;} } @media only screen and (max-width:860px) { #footer {padding-top:6.93vw;padding-bottom:11.67vw;background-position:10.6vw 0;background-size:82% auto;} #footer .ft_cs .ft_logo img {height:32px;} #footer .ft_cs > dl {} } @media only screen and (max-width:767px) { #footer {padding-top:8.93vw;padding-bottom:12.67vw;background-position:5vw 0;background-size:90% auto;} #footer .ft_cs .cs_address{display:block;} #footer .ft_cs {float:none;width:100%;} #footer .ft_cs > dl {padding-top:12px;} #footer .ft_bnr {float:none;text-align:left;padding-bottom:37px;} #footer .ft_bnr.for_pc {display:none;} #footer .ft_bnr.for_m {display:block;} } @media only screen and (max-width:640px) { #footer {padding-bottom:13.67vw;background-position:50% 0;background-size:100% auto;} #footer .ft_cs .ft_logo {display:none;} #footer .ft_cs .cs_address {background-position:0 2px;} #footer .ft_cs > dl + dl {} #footer .ft_cs address a {margin-left:0;display:block;} #footer .ft_bnr {padding-bottom:37px;} } @media only screen and (max-width:479px) { #footer .ft_cs .cs_address {font-size:14px;} #footer .ft_cs > dl {padding-bottom:0;display:block;} #footer .ft_cs > dl + dl {margin-left:0;padding-top: 10px;} #footer .ft_cs > dl dt, #footer .ft_cs > dl dd {line-height:14px;display:inline-block;} #footer .ft_cs > dl dt {padding-bottom:2px;width: 30px;} #footer .ft_cs > dl dd{width: calc(100% - 42px);} #footer .ft_cs > dl dd, #footer .ft_cs > dl dd a {font-size:14px;} #footer .ft_cs address {font-size:13px;} #footer .ft_bnr {padding-bottom:37px;padding-top:34px;} } /*─────────────────────────────────────────────────────────── MAIN | index.html ───────────────────────────────────────────────────────────*/ /* pc일반 */ .main_index #container {padding-top:0 !important;} .main {width:100%;overflow:hidden;} .main .w_custom {max-width:1270px;} /*메인비주얼*/ .main_visual, #wrap .main_visual .slick-slide{width:100%;height:calc(100vh + 139px);position: relative;box-sizing:border-box; overflow:hidden;} .main_visual .thumb{width:100%; height:100%; position: absolute;top:50%;left:50%;transform:translate(-50%, -50%); transition:all 3s; background-size:cover; background-position:center; background-repeat:no-repeat;} .main_visual .thumb:before{position:absolute; content:''; width:100%; height:100%; background:rgba(0,0,0,0.3); top:0; left:0;} .main_visual .slick-slide > a{position:absolute; top:0; left:0; width:100%; height:100%; z-index:3;} .main_visual .txt{position: absolute;top:50%;left:50%;transform:translate(-50%, -50%);text-align: center; z-index:3;} .main_visual .txt p{font-size:30px;color:#fff;font-weight:400;opacity:0.8;} .main_visual .txt h2{font-size:78px;color:#fff;font-weight:500;} .main_visual .txt .mail{margin-top:40px;background: rgba(255,255,255,0.8);padding: 30px 20px;} .main_visual .txt .mail span{font-size:20px;color:#333;font-weight:700;display: block;margin-bottom:20px;} /* .main_visual .txt .mail dl{text-align: left;} */ .main_visual .txt .mail dl + dl{margin-top:30px;} .main_visual .txt .mail dl dt{font-size:20px;color:#333;font-weight:400;} .main_visual .txt .mail dl dd{margin-top:10px;} .main_visual .txt .mail dl dd a{font-size:16px;color:#333;font-weight:400;background:url('../images/skin/icon_map03_ov.png')no-repeat left center;padding-left:30px;} .main_visual .active .thumb{transform:translate(-50%, -50%) scale(1.05);} /* pc 타이틀 */ .main_title {text-align:center;} .main_title span, .main_title h3, .main_title p {font-weight:400;line-height:1.32em;margin:0;padding:0;vertical-align:top;display:block;box-sizing:border-box;white-space:normal;word-break:keep-all;word-wrap:break-word;} .main_title span {font-size:18px;color:#285694;} .main_title h3, .main_title h3 span {font-size:44px;font-weight:700;color:#111;} .main_title h3 span{display:inline-block;} .main_title h3 strong{font-size:inherit; font-weight:inherit; color:#285694;} .main_title #contact_txt {display:inline-block; vertical-align:top;} .main_title p {font-size:20px;color:#555;line-height:1.6em;} .main_title span + h3 {padding-top:16px;} .main_title h3 + p {padding-top:25px;} .main_title p .m_br, .main_title p .m_br + br {display:none;} .btn_more {font-size:16px;padding:0 29px 0 0;line-height:20px;background:url(../images/skin/btn-main-more@2x.png) no-repeat 100% 50%;background-size:20px auto;font-weight:600;color:#111;display:inline-block; transition:all 0.4s;} @media only screen and (max-width:1200px) { } @media only screen and (max-width:1140px) { .btn_more {font-size:15px;} } @media only screen and (max-width:960px) { .btn_more {font-size:14px;} } @media only screen and (max-width:767px) { } @media only screen and (max-width:375px) { .btn_more {font-size:13px;} } @media only screen and (max-width:350px) { .btn_more {font-size:12px;} } /* 비주얼영역 */ .main_visual_bnr {background:#08112a;height:100vh; position:relative; z-index:2; overflow: hidden;} .main_visual_bnr div, .main_visual_bnr p, .main_visual_bnr strong, .main_visual_bnr h3, .main_visual_bnr dt, .main_visual_bnr dd, .main_visual_bnr span {white-space:normal;word-break:keep-all;word-wrap:break-word;} .main_visual_bnr.for_pc {display:block;} .main_visual_bnr.for_m {display:none;} .visual_title {width:50%;max-width:630px;padding:0 15px;left: calc(50% - 55px);transform:translateX(-100%);top:26%;position:absolute;z-index:5;box-sizing:border-box;}/*1350 675*/ .visual_title strong, .visual_title h3, .visual_title p {color:#fff;margin:0;padding:0;vertical-align:top;display:block;line-height:1;} .visual_title strong {font-size:46px;font-weight:300;} .visual_title h3 {font-size:64px;font-weight:600;padding-top:23px;padding-bottom:28px;} .visual_title p {font-size:17px;line-height:1.64em;color: rgba(255, 255, 255, 0.8);} .visual_tab {padding:0 15px;transform:translateX(-675px);left:50%;top:59.8%;display:inline-block;margin:0 auto 0 0;position:absolute;z-index:5;box-sizing:border-box;} .visual_tab li {font-size:18px;line-height:22px;font-weight:300;color:rgba(255, 255, 255, 0.6);cursor:pointer;transition:color 0.3s;} .visual_tab li:hover {color:#26ffff;} .visual_tab li.on {font-size:22px;font-weight:500;color:#26ffff;} .visual_tab li + li {margin-top:28px;} .visual_btn {width:996px;top:22.8%;right:0;background:url(../images/skin/bnr-main-visual.png) no-repeat 50% 50%;position:absolute;z-index:4;} .visual_content {} .visual_content ul {} .visual_content li {width:410px;box-sizing:border-box;display:none;position:absolute;z-index:3;cursor:pointer;} .visual_content li.on {display:block;z-index:4;} .visual_content li:nth-of-type(1) {left:36.1%;top:2.2%;} .visual_content li:nth-of-type(2) {left:20.5%;top:17.2%;} .visual_content li:nth-of-type(3) {left:34.3%;top:35.8%;} .visual_content li:nth-of-type(4) {left:50.4%;top:51.6%;} .visual_content li .content_wrap {display:flex;flex-flow:row nowrap;justify-content:space-between;align-items:stretch;} .visual_content li .content_thumb {border:2px #fff solid;flex-basis:32.2%;flex-grow:1;padding:53.17% 0 0;height:0;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;box-sizing:border-box;} .visual_content li .content_info {flex-basis:67.8%;flex-grow:1;} .visual_content li:nth-of-type(odd) .content_thumb {order:2;} .visual_content li:nth-of-type(odd) .content_info {order:1;padding-right:30px;} .visual_content li:nth-of-type(even) .content_thumb {order:1;} .visual_content li:nth-of-type(even) .content_info {order:2;padding-left:30px;} .visual_content li:nth-of-type(4) .content_thumb {order:2;} .visual_content li:nth-of-type(4) .content_info {order:1;padding-right:30px;padding-left:0;} .visual_content li:nth-of-type(1) .content_thumb {background-image:url(../images/skin/bnr-main-visual-ov-01.jpg);} .visual_content li:nth-of-type(2) .content_thumb {background-image:url(../images/skin/bnr-main-visual-ov-02.jpg);} .visual_content li:nth-of-type(3) .content_thumb {background-image:url(../images/skin/bnr-main-visual-ov-03.jpg);} .visual_content li:nth-of-type(4) .content_thumb {background-image:url(../images/skin/bnr-main-visual-ov-04.jpg);} .visual_content li .content_info dl {} .visual_content li .content_info dt, .visual_content li .content_info dd {color:#fff; font-family: 'Lexend','Pretendard',-apple-system,BlinkMacSystemFont,Roboto,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',Dotum,sans-serif;} .visual_content li .content_info dt {font-size:24px;line-height:1.35;padding-bottom:18px;font-weight:400; letter-spacing:0;position:relative;z-index:1;/* text-transform: uppercase; */} .visual_content li .content_info dt:before {width:40px;height:1px;display:inline-block;content:"";position:absolute;bottom:0;background:#26ffff;} .visual_content li .content_info dt:before {left:0;} .visual_content li .content_info dd {line-height:1.54;padding-top:16px;font-size:13px;font-weight:300;color: rgba(255, 255, 255, 0.8); word-break: keep-all;} .visual_btn .visual_btn_box {height:628px;width:100%;position:relative;z-index:1;} .visual_btn.on_dim .visual_btn_box:before {background-color:rgba(8, 17, 42, 0.7);display:inline-block;z-index:1;content:"";position:absolute;left:0;top:0;width:100%;height:100%;} .visual_btn .visual_btn_box > ul li {width:64px;height:108px;border-color:rgba(255, 255, 255, 1);border-width:1px;border-style:solid;position:absolute;z-index:0;box-sizing:border-box;cursor:pointer;} .visual_btn.on_dim .visual_btn_box > ul li {border-color:rgba(255, 255, 255, 0.2);} .visual_btn .visual_btn_box > ul li.on {z-index:2;}/*border-color:#26ffff;background-color:rgba(38, 255, 255, 0.2);*/ .visual_btn .visual_btn_box > ul li:nth-of-type(1) {left:67.7%;top:16.7%;} .visual_btn .visual_btn_box > ul li:nth-of-type(2) {left:23.5%;top:26.2%;} .visual_btn .visual_btn_box > ul li:nth-of-type(3) {left:66.3%;top:45.4%;} .visual_btn .visual_btn_box > ul li:nth-of-type(4) {left:82.4%;top:60.6%;} .solution.bnr_swipe .visual_content{width:100%;height:100%;overflow:visible;} .solution.bnr_swipe .visual_content li{display: block;transform:translate(0) !important;height:auto !important;opacity:0 !important;} .solution.bnr_swipe .visual_content li.swiper-slide-active{opacity:1 !important;} .solution.bnr_swipe .visual_content li:nth-child(1){z-index:5 !important;} .solution.bnr_swipe .visual_content li:nth-child(2){z-index:4 !important;} .solution.bnr_swipe .visual_content li:nth-child(3){z-index:3 !important;} .solution.bnr_swipe .visual_content li:nth-child(4){z-index:2 !important;} .solution.bnr_swipe .visual_btn .visual_btn_box .zoom_img li{z-index:8 !important;} .solution.bnr_swipe .visual_content li .content_info dt{font-size:26px;} .solution.bnr_swipe .visual_content li .content_info dd{font-size:17px;} .solution.bnr_swipe .visual_content li:nth-child(3) .content_info dt{font-size:22px;} .solution.bnr_swipe .swiper-pagination {padding:0 15px;transform:translateX(-675px);left:50%;top:63.8%;display:inline-block;margin:0 auto 0 0;position:absolute;z-index:5;box-sizing:border-box;text-align:left;} .solution.bnr_swipe .door_tab{position: static;width:auto;height:auto;border-radius:0;opacity:1;background:none;display: block;outline:none;} .solution.bnr_swipe .door_tab + .door_tab {margin-top:28px;} .solution.bnr_swipe .door_tab span {font-size:18px;line-height:22px;font-weight:300;color:rgba(255, 255, 255, 0.6);cursor:pointer;transition:color 0.3s;} .solution.bnr_swipe .door_tab.swiper-pagination-bullet-active span, .solution.doorpop .door_tab:hover span {color:#26ffff;font-size:22px;font-weight:500;} .solution.bnr_swipe .visual_btn .visual_btn_box:before {background-color:rgba(8, 17, 42, 0.7);display:inline-block;z-index:1;content:"";position:absolute;left:0;top:0;width:100%;height:100%;} @media only screen and (max-width:1380px){ .solution.bnr_swipe .swiper-pagination{left:0;transform:none;} } /* 텍스트 영역 */ .main_approach {padding-top:116px;} .main_approach .m_br, .main_approach .m_br + br {display:none;} /* 코어 영역 */ .main_core {padding-top:15px;} .core_wrap {padding:80px 0 50px;background:url(../images/skin/bg-main-approach.png) no-repeat 100% 100%;background-size:1329px auto;text-align:left;} .core_wrap .main_title {padding-bottom:37px;} .core_wrap .core_thumb {width:1047px;height:0;padding:57.98% 0 0;margin:0 auto;margin-left:11.13%;background:url(../images/skin/bnr-main-approach.png) no-repeat 50% 50%;background-size:cover;position:relative;z-index:1;} .core_wrap .w_custom {position:relative;z-index:1;} .core_wrap .core_list {} .core_wrap .core_list li {position:absolute;z-index:2;text-align:left;} .core_wrap .core_list li div {padding-left:10px;font-size:18px;line-height:1.39;color:#333;font-family: 'GmarketSansMedium';position:relative;z-index:1;white-space:normal;word-break:keep-all;word-wrap:break-word;} .core_wrap .core_list li div:before {font-size:inherit;line-height:inherit;font-family:inherit;color:inherit;content:"·";display:inline-block;position:absolute;left:0;top:0;} .core_wrap .core_list li:nth-of-type(1) {left:18.1%;top:10.66%;transform:translate(0%, 0%);} .core_wrap .core_list li:nth-of-type(2) {left:13.11%;bottom:18.81%;transform:translate(0%, 0%);} .core_wrap .core_list li:nth-of-type(3) {left:8.91%;top:36.83%;transform:translate(0%, 0%);} .core_wrap .core_list li:nth-of-type(4) {left:82.84%;top:39.68%;transform:translate(0%, 0%);} .core_wrap .core_list li:nth-of-type(5) {left:46.21%;bottom:7.12%;transform:translate(0%, 0%);} .core_wrap .core_list li:nth-of-type(6) {left:78.57%;bottom:18.55%;transform:translate(0%, 0%);} /* 솔루션 영역 */ .main_solution {padding-top:80px;} .main_solution .main_title {margin-bottom:-0.32em;text-align:left;} .solution_bnr {} .solution_bnr ul {} .solution_bnr li {width:550px;text-align:left;float:left;} .solution_bnr li:nth-of-type(1) {padding-top:156px;} .solution_bnr li:nth-of-type(2) {float:right;} .solution_bnr li .bnr_wrap {width:100%;position:relative;z-index:1;} .solution_bnr li .bnr_wrap a {position:absolute;left:0;top:0;width:100%;height:100%;display:block;z-index:3;} .solution_bnr li .bnr_wrap .thumb {width:100%;height:0;padding:0;padding-top:450px;background-repeat:no-repeat;background-position:50% 0;background-size:cover;position:relative;z-index:1;} .solution_bnr li:nth-of-type(1) .bnr_wrap .thumb {background-image:url(../images/skin/bnr-main-solution-01@2x.jpg);} .solution_bnr li:nth-of-type(2) .bnr_wrap .thumb {background-image:url(../images/skin/bnr-main-solution-02@2x.jpg);} .solution_bnr li .bnr_wrap .txt {width:72.73%;margin-top:-70px;padding-top:39px;padding-bottom:43px;padding-left:20px;padding-right:20px;box-sizing:border-box;position:relative;z-index:2;} .solution_bnr li .bnr_wrap .txt:before {background:#fff;width:100%;left:0;top:0;display:inline-block;content:"";position:absolute;height:100%;z-index:-1;} .solution_bnr li .bnr_wrap .txt h4, .solution_bnr li .bnr_wrap .txt p {margin:0;padding:0;vertical-align:top;white-space:normal;word-break:keep-all;word-wrap:break-word;box-sizing:border-box;position:relative;z-index:1;} .solution_bnr li .bnr_wrap .txt h4 {font-size:36px;line-height:1;font-weight:700;color:#111;} .solution_bnr li .bnr_wrap .txt p {font-size:18px;line-height:1.67em;padding-top:30px;padding-bottom:53px;font-weight:400;color:#555;} .solution_bnr li .bnr_wrap:hover .btn_more {color: #b42e2b;} /* 사용장소 영역 */ .main_coverage {padding-top:84px;padding-bottom:140px;} .main_coverage .main_title {padding-bottom:73px;} .coverage_slide {width: calc(100% + 70px);margin-left:-35px;margin-right:-35px;padding:0 0 58px;overflow:hidden;position:relative;z-index:1;} .coverage_slide .swiper-pagination {width: calc(100% - 70px);height:2px;background:#ddd;position:absolute;left:50%;bottom:0;transform:translateX(-50%);} .coverage_slide .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background:#0f1f4b;} .coverage_slide .slide_list_wrap {} .coverage_slide .slide_cut {padding:0;box-sizing:border-box;float:left;text-align:center;} .coverage_slide .slide_cut .thumb {width: calc(100% - 70px);position:relative;z-index:1;margin:0 auto; overflow: hidden;} /* .coverage_slide .slide_cut .thumb:before {z-index:2;position:absolute;left:0;top:0;display:inline-block;width:100%;height:100%;background:rgba(0, 0, 0, 0.5);content:"";} */ /* .coverage_slide .slide_cut .thumb a {z-index:4;position:absolute;left:0;top:0;display:inline-block;width:100%;height:100%;} */ .coverage_slide .slide_cut .thumb img {transition: all 0.3s; z-index:1;} .coverage_slide .slide_cut .thumb:hover img {transform: scale(1.1); transform-origin: center;} .coverage_slide .slide_cut span {font-size:20px;padding:0 20px 18px;right:0;bottom:0;max-width:100%;box-sizing:border-box;font-weight:500;color: #333;line-height:1;position: relative;display: block;text-align: center;z-index:3;margin-top: 25px;} .main_coverage .coverage_arw{position: absolute;top:66%;background:none;font-size:0;width:35px;height:35px;border:2px solid #0f1f4b;border-width:2px 2px 0 0;} .main_coverage .swiper-button-prev{left:-25px;transform:rotate(-135deg);} .main_coverage .swiper-button-next{right:-25px;transform:rotate(45deg);} .main_coverage .swiper-button-prev:after, .main_coverage .swiper-button-next:after{display: none;} /* 숫자 영역 */ .main_count {padding-top:68px;padding-bottom:68px;background:#ebeef5;} .main_count .main_title{padding-bottom:50px;} .main_count ul {text-align:center;font-size:0;vertical-align:top;} .main_count li {width:33.32%;vertical-align:top;display:inline-block;} .main_count li .count_icon {padding:40px 0 0;height:0;display:block;vertical-align:top;box-sizing:border-box;background-repeat:no-repeat;background-position:50% 50%;background-size:auto 100%;} .main_count li:nth-of-type(1) .count_icon {background-image:url(../images/skin/icon-main-count-01@2x.png);} .main_count li:nth-of-type(2) .count_icon {background-image:url(../images/skin/icon-main-count-02@2x.png);} .main_count li:nth-of-type(3) .count_icon {background-image:url(../images/skin/icon-main-count-03@2x.png);} .main_count li .count_num {padding:22px 0 14px;display:block;vertical-align:top;} .main_count li .count_num span, .main_count li .count_num em {line-height:1;color:#111;display:inline-block;box-sizing:border-box;} .main_count li .count_num em {font-size:22px;font-weight:400;padding:30px 0 4px;} .main_count li:nth-of-type(3) .count_num em {padding:0;} .main_count li .count_num span, .main_count li:nth-of-type(3) .count_num em {font-size:56px;font-weight:300;font-family: 'Lexend',-apple-system,BlinkMacSystemFont,Roboto,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',Dotum,sans-serif;} .main_count li .count_num span.n-count {animation-duration: 1s;animation-delay: 0s;} .main_count li .count_txt {font-size:18px;font-weight:400;color:#555;line-height:1;display:block;vertical-align:top;} /* 게시글 영역 */ .main_custom {padding-top:146px;padding-bottom:180px;} .main_custom .main_title {text-align:left;position:relative;z-index:1;} .custom_bbs_wrap {position:relative;z-index:2;} .main_bbs_write {padding-top:46px;position:relative;z-index:2;} .main_bbs_write .bbs_write_box {width:43.3%;max-width:550px;float:left;} .main_bbs_write .bbs_write_box + .bbs_write_box {float:right;} .main_bbs_write .bbs_write_box > dl {padding:13px 0;border-bottom:1px #ddd solid;vertical-align:top;font-size:0;box-sizing:border-box;} .main_bbs_write .bbs_write_box > dl > dt, .main_bbs_write .bbs_write_box > dl > dd, .main_bbs_write .bbs_write_box > div {font-size:18px;line-height:22px;min-height:40px;font-weight:400;display:inline-block;vertical-align:top;box-sizing:border-box;} .main_bbs_write .bbs_write_box > dl > dt {padding:9px 0;font-weight:500;color:#111;width:25.5%;} .main_bbs_write .bbs_write_box > dl > dd {width:74.5%;} .main_bbs_write .bbs_write_box > dl > dd > input[type="text"], .main_bbs_write .bbs_write_box > dl > dd > input[type="password"] {height:40px;padding:9px 0;line-height:inherit;border:0;outline:0;font-size:inherit;font-weight:inherit;color:#333;width:100%;margin:0;box-sizing:border-box;} .main_bbs_write .bbs_write_box > dl > dd > input[type="text"]::-webkit-input-placeholder, .main_bbs_write .bbs_write_box > dl > dd > input[type="password"]::-webkit-input-placeholder, .main_bbs_write .bbs_write_box > dl > dd > input[type="text"]:-ms-input-placeholder, .main_bbs_write .bbs_write_box > dl > dd > input[type="password"]:-ms-input-placeholder, .main_bbs_write .bbs_write_box > dl > dd > input[type="text"]:placeholder, .main_bbs_write .bbs_write_box > dl > dd > input[type="password"]:placeholder {font-size:inherit;font-weight:400;color:#999;} .main_bbs_write .bbs_write_box > dl > dd #captcha_box {display:inline-block;vertical-align:top;} .main_bbs_write .bbs_write_box > dl > dd input#captcha {width:calc(100% - 240px);margin:0 10px;background:#f5f5f5;display:inline-block;vertical-align:top;padding:0 10px;} .main_bbs_write .bbs_write_box > dl > dd span#refreshCode {width:40px;height:40px;background:#fff url(../images/skin/icon-bbs-refresh@2x.png) no-repeat 50% 50%;background-size:12px auto;border:1px #0f1f4b solid;box-sizing:border-box;font-size:0;outline:0;display:inline-block;vertical-align:top;cursor:pointer;} .main_bbs_write .bbs_write_box .edit-box {padding:0 0 23px;} .main_bbs_write .bbs_write_box .edit-box textarea#contents {height:186px;padding:21px 25px;line-height:inherit;border:0;outline:0;font-size:inherit;font-weight:inherit;color:#333;width:100%;margin:0;box-sizing:border-box;background:#f5f5f5;} .main_bbs_write .bbs_write_box .edit-box textarea#contents::-webkit-input-placeholder, .main_bbs_write .bbs_write_box .edit-box textarea#contents:-ms-input-placeholder, .main_bbs_write .bbs_write_box .edit-box textarea#contents:placeholder {font-size:inherit;font-weight:400;color:#999;} .main_bbs_write .bbs_write_box .policy_cont {width:100%;} .main_bbs_write .bbs_write_box .policy_cont .clear {vertical-align:top;line-height:26px;padding:0 0 20px;} .main_bbs_write .bbs_write_box .policy_cont .clear label {font-size:16px;line-height:26px;height:26px;font-weight:400;color:#555;vertical-align:top;} .main_bbs_write .bbs_write_box .policy_cont .clear label:before {width:26px;height:26px;margin:0 11px 0 0;background:url(../images/skin/icon-chk-off.png) no-repeat 0 50%;background-size:100% 100%;vertical-align:top;} .main_bbs_write .bbs_write_box .policy_cont .clear input[type="checkbox"]:checked + label:before {background:url(../images/skin/icon-chk-po.png) no-repeat 0 50%;background-size:100% 100%;} .main_bbs_write .bbs_write_box .policy_cont .clear a {font-size:15px;height:22px;line-height:21px;font-weight:400;color:#999;float:right;display:inline-block;position:relative;z-index:1;} .main_bbs_write .bbs_write_box .policy_cont .clear a:before {background:#999;width:100%;height:1px;position:absolute;left:0;bottom:0;display:inline-block;content:"";} .main_bbs_write .bbs_write_box .policy_cont > textarea {border:1px #ddd solid;background:#fff;font-size:12px;font-weight:400;color:#999;line-height:18px;padding:10px 12px;box-sizing:border-box;outline:0;} .main_bbs_write .btn_contact_send {width:60px;height:60px;top:-51px;right:0;border-radius:100%;background:#0f1f4b url(../images/skin/icon-main-submit@2x.png) no-repeat 50% 50%;background-size:18px auto;font-size:0;outline:0;border:0;display:inline-block;position:absolute;} .main_bbs_write .btn_contact_send a {display:inline-block;width:100%;height:100%;font-size:0;} @media only screen and (max-width:1600px) { .main_visual, #wrap .main_visual .slick-slide{height:85vh;} } @media only screen and (max-width:1460px) { /* 비주얼영역 */ .visual_title {max-width:604px;left: calc(50% - 81px);} /* 사용장소 영역 */ .coverage_slide {width: calc(100% + 50px);margin-left:-25px;margin-right:-25px;} .coverage_slide .swiper-pagination, .coverage_slide .slide_cut .thumb {width: calc(100% - 50px);} } @media only screen and (max-width:1400px) { .main_coverage .w_custom{padding:0 40px;} .main_coverage .swiper-button-prev{left:15px;} .main_coverage .swiper-button-next{right:15px;} } @media only screen and (max-width:1380px) { /* 비주얼영역 */ .visual_title {width:auto;max-width:inherit;left:0;transform:translateX(0);display:inline-block;} .visual_tab {transform:translateX(0);left:0;} } @media only screen and (max-width:1340px) { /* 사용장소 영역 */ .coverage_slide {width: calc(100% + 30px);margin-left:-15px;margin-right:-15px;} .coverage_slide .swiper-pagination, .coverage_slide .slide_cut .thumb {width: calc(100% - 30px);} } @media only screen and (max-width:1300px) { .main_visual video{width:auto;height:100%;} } @media only screen and (max-width:1270px) { /* pc 타이틀 */ .main_title h3, .main_title h3 span {font-size:42px;} /* 비주얼영역 */ .visual_title {top:18%;} .visual_title strong {font-size: 40px;} .visual_title h3 {font-size: 60px;} .visual_title p {font-size: 16px;} .visual_tab {top:59.8%;} .visual_tab li {font-size: 16px;} .visual_tab li.on {font-size: 20px;} .visual_tab li + li {margin-top: 24px;} .visual_btn {top:17%; right: -3%;} /* 텍스트 영역 */ .main_approach {padding-top:9.13vw;} /* 코어 영역 */ .main_core {padding-top:1.18vw;} .core_wrap {padding:6.3vw 0 3.94vw;} .core_wrap .w_custom {text-align:center;} .core_wrap .main_title {padding-bottom:2.91vw;} .core_wrap .core_thumb {margin-left:auto;transform:translateX(5%);} .core_wrap .core_list li div {padding-left:9px;font-size:17px;} /* 솔루션 영역 */ .main_solution {padding-top:6.3vw;} .solution_bnr li {width:44.36%;} .solution_bnr li:nth-of-type(1) {padding-top:12.6vw;} .solution_bnr li .bnr_wrap .txt {padding-top:36px;padding-bottom:36px;} .solution_bnr li .bnr_wrap .txt p {padding-top:28px;padding-bottom:48px;} /* 사용장소 영역 */ .main_coverage {padding-top:6.61vw;padding-bottom:11.02vw;} .main_coverage .main_title {padding-bottom:5.75vw;} /* 숫자 영역 */ .main_count {padding-top:5.35vw;padding-bottom:5.35vw;} /* 게시글 영역 */ .main_custom {padding-top:11.49vw;padding-bottom:14.17vw;} } @media only screen and (max-width:1140px) { /* pc 타이틀 */ .main_title span, .main_title h3, .main_title h3 span, .main_title p {line-height:1.35em;} .main_title h3, .main_title h3 span{font-size:38px;} .main_title p {font-size:19px;line-height:1.53em;} .main_title span + h3 {padding-top:14px;} .main_title h3 + p {padding-top:22px;} /* 비주얼영역 */ /*.main_visual_bnr {height:auto;} .main_visual_bnr.for_pc {display:none;} .main_visual_bnr.for_m {padding:0 20px;padding-top:15.6vw;padding-bottom:8.14vw;display:;box-sizing:border-box;} .visual_title {width:100%;} .visual_title strong {font-size:46px;} .visual_title h3 {font-size:60px;} .visual_title p {font-size:17px;} */ .main_visual_bnr.for_pc{display: none;} .main_visual_bnr.for_m {display:block;/* padding-top:21.6vw; */padding-top:14vw;padding-bottom:10.14vw; height:auto; background:#08112a url('../images/skin/bnr-main-visual-m.png') no-repeat 61% 74.7%; background-size:947px auto;} .visual_title{position:relative; top:0; padding:0 20px;} .visual_title strong {font-size:35px;} .visual_title h3 {font-size:55px;padding-top:17px;padding-bottom:18px;} /* .visual_title p {font-size:16px;} */ .visual_content {width:100%;} .visual_content ul {padding-top:8.2vw;display:flex;flex-flow:row wrap;justify-content:space-between;align-items:stretch;} /*.visual_content li {width:50%;flex-basis:50%;} .visual_content li:nth-of-type(1) {order:1;} .visual_content li:nth-of-type(2) {order:3;} .visual_content li:nth-of-type(3) {order:2;} .visual_content li:nth-of-type(4) {order:4;} .visual_content li:nth-of-type(odd) {padding-right:20px;} .visual_content li:nth-of-type(even) {margin-top:80px;padding-left:20px;} .visual_content li .content_thumb {flex-basis:29%;padding-top:43.5%;} .visual_content li .content_info {flex-basis:71%;}*/ .visual_content li{position:relative; top:0 !important; left:0 !important; display:block; width:50%; margin-bottom:20px;} .visual_content li:nth-of-type(4) .content_thumb{order:1;} .visual_content li:nth-of-type(4) .content_info{order:2; text-align:left; padding-left: 30px; /* padding-right:0; */} .visual_content li:nth-of-type(odd) {padding-right:10px;} .visual_content li:nth-of-type(even) {padding-left:10px; margin-top:0;} /* .visual_content li:nth-of-type(odd) .content_info {padding-right:15px;} .visual_content li:nth-of-type(even) .content_info {padding-left:15px;} */ .visual_content li .content_info {padding: 0 30px;} .visual_content li .content_info dt {font-size:20px;line-height:1.47;} .visual_content li:nth-of-type(3) .content_info dt {font-size:20px;line-height:1.47;} .visual_content li .content_info dt:before {width:24px;} .visual_content li:nth-of-type(4) .content_info dt:before{left:0; right:auto;} .visual_content li .content_info dd {letter-spacing:-0.02em;} /*.visual_content li:nth-of-type(even) .content_thumb {order:1;} .visual_content li:nth-of-type(even) .content_info {order:2;padding-left:30px;} .visual_content li:nth-of-type(odd) .content_thumb, .visual_content li:nth-of-type(4) .content_thumb {order:2;} .visual_content li:nth-of-type(odd) .content_info, .visual_content li:nth-of-type(4) .content_info {order:1;padding-right:30px;text-align:right;} .visual_content li:nth-of-type(1) .content_thumb {background-image:url(../images/skin/bnr-main-visual-ov-01-m.jpg);} .visual_content li:nth-of-type(2) .content_thumb {background-image:url(../images/skin/bnr-main-visual-ov-02-m.jpg);} .visual_content li:nth-of-type(3) .content_thumb {background-image:url(../images/skin/bnr-main-visual-ov-03-m.jpg);} .visual_content li:nth-of-type(4) .content_thumb {background-image:url(../images/skin/bnr-main-visual-ov-04-m.jpg);}*/ .visual_content li .content_info dl {} .visual_content li .content_info dt {font-size:22px;} .visual_content li:nth-of-type(3) .content_info dt {font-size:22px;} .visual_content li:nth-of-type(odd) .content_info {text-align: right;} .visual_content li:nth-of-type(odd) .content_info dt:before {left:auto; right:0;} /* 텍스트 영역 */ .main_approach {padding-top:9.8vw;} /* 코어 영역 */ .main_core {padding-top:1.18vw;} .core_wrap {padding:8.2vw 0 4.2vw;background-position-x:50%;background-size:114% auto;} .core_wrap .main_title {padding-bottom:4.06vw;} .core_wrap .core_thumb {width:100%;max-width:1047px;} /* 솔루션 영역 */ .main_solution {padding-top:8.3vw;} .solution_bnr li {width:46.4%;} .solution_bnr li .bnr_wrap .txt {padding-top:32px;padding-bottom:32px;padding-left:15px;padding-right:15px;} .solution_bnr li .bnr_wrap .txt h4 {font-size:33px;} .solution_bnr li .bnr_wrap .txt p {font-size:17px;line-height:1.53em;padding-top:24px;padding-bottom:42px;} /* 사용장소 영역 */ .main_coverage {padding-top:8.8vw;padding-bottom:11.67vw;} .main_coverage .main_title {padding-bottom:5.75vw;} .coverage_slide {width: calc(100% + 15px);margin-left:-7.5px;margin-right:-7.5px;padding-bottom:58px;} .coverage_slide .swiper-pagination {width: calc(100% - 15px);} .coverage_slide .slide_cut .thumb {width: calc(100% - 15px);} .coverage_slide .slide_cut span {font-size:19px;} /* 숫자 영역 */ .main_count {padding-top:6.2vw;padding-bottom:6.07vw;} /* 게시글 영역 */ .main_custom {padding-top:12.46vw;padding-bottom:16.86vw;} .main_bbs_write {padding-top:4.32vw;} .main_bbs_write .bbs_write_box {width:46%;max-width:550px;} .main_bbs_write .bbs_write_box > dl > dt, .main_bbs_write .bbs_write_box > dl > dd, .main_bbs_write .bbs_write_box > div {font-size:17px;} .main_bbs_write .bbs_write_box .policy_cont .clear {line-height:24px;} .main_bbs_write .bbs_write_box .policy_cont .clear label {font-size:15px;line-height:24px;height:24px;} .main_bbs_write .bbs_write_box .policy_cont .clear label:before {width:24px;height:24px;margin-right:10px;} .main_bbs_write .bbs_write_box .policy_cont .clear a {font-size:14px;} } @media only screen and (max-width:1023px) { /* pc 타이틀 */ .main_title h3, .main_title h3 span {font-size:36px;} /* 비주얼영역 */ /* .main_visual_bnr.for_m {padding-top:19.6vw;padding-bottom:10.14vw;} */ .visual_title strong {font-size:32px;} .visual_title h3 {font-size:52px;padding-top:18px;padding-bottom:22px;} .visual_title p {font-size: 15px;} /* .visual_content ul {padding-top:11.2vw;} */ /* .visual_content li:nth-of-type(even) {margin-top:20px;} */ .visual_content li:nth-of-type(odd) .content_info {padding-right:20px;} .visual_content li:nth-of-type(even) .content_info {padding-left:20px;} .visual_content li .content_info dt {font-size:20px;line-height:1.35;} .visual_content li .content_info dt:before {width:30px;} .visual_content li:nth-of-type(3) .content_info dt {font-size:20px;} .visual_content li .content_info dd {line-height:1.38;padding-top:13px;} /* 텍스트 영역 */ .main_approach {} /* 코어 영역 */ .core_wrap {padding:10.2vw 0 4.2vw;} .core_wrap .core_thumb {transform:translateX(2%);} .core_wrap .core_list li div {padding-left:8px;font-size:16px;} .core_wrap .core_list li:nth-of-type(1) {left:15.1%;} .core_wrap .core_list li:nth-of-type(2) {left:10.11%;} .core_wrap .core_list li:nth-of-type(3) {left:5.91%;} .core_wrap .core_list li:nth-of-type(4) {left:79.84%;} .core_wrap .core_list li:nth-of-type(5) {left:43.21%;} .core_wrap .core_list li:nth-of-type(6) {left:75.57%;} /* 솔루션 영역 */ .main_solution {padding-top:9.3vw;} .solution_bnr li {width:47.4%;} .solution_bnr li .bnr_wrap .txt {margin-top:-56px;padding-top:28px;padding-bottom:28px;} .solution_bnr li .bnr_wrap .txt h4 {font-size:31px;} .solution_bnr li .bnr_wrap .txt p {font-size:16px;line-height:1.43em;padding-top:22px;padding-bottom:36px;} /* 숫자 영역 */ .main_count {padding-top:7.2vw;padding-bottom:7.07vw;} .main_count li .count_num {padding:22px 0 12px;} .main_count li .count_num em {font-size:21px;padding:30px 0 3px;} .main_count li:nth-of-type(3) .count_num em {padding:0;} .main_count li .count_num span, .main_count li:nth-of-type(3) .count_num em {font-size:54px;} .main_count li .count_txt {font-size:17px;} /* 게시글 영역 */ .main_bbs_write .bbs_write_box {width:48%;} .main_bbs_write .bbs_write_box > dl > dt, .main_bbs_write .bbs_write_box > dl > dd, .main_bbs_write .bbs_write_box > div {min-height:36px;} .main_bbs_write .bbs_write_box > dl > dt {padding:7px 0;width:24.5%;} .main_bbs_write .bbs_write_box > dl > dd {width:75.5%;} .main_bbs_write .bbs_write_box > dl > dd > input[type="text"], .main_bbs_write .bbs_write_box > dl > dd > input[type="password"] {height:36px;padding:7px 0;} .main_bbs_write .bbs_write_box > dl > dd img#captcha {width:162px !important;height:36px !important;} .main_bbs_write .bbs_write_box > dl > dd input#captcha {width:calc(100% - 218px);} .main_bbs_write .bbs_write_box > dl > dd span#refreshCode {width:36px;height:36px;} .main_bbs_write .bbs_write_box .edit-box {padding-bottom:20px;} .main_bbs_write .bbs_write_box .edit-box textarea#contents {height:173px;padding:20px;} .main_bbs_write .bbs_write_box .policy_cont .clear {line-height:22px;padding-bottom:15px;} .main_bbs_write .bbs_write_box .policy_cont .clear label {line-height:22px;height:22px;} .main_bbs_write .bbs_write_box .policy_cont .clear label:before {width:22px;height:22px;background:url(../images/skin/icon-chk-off-m.png) no-repeat 0 50%;background-size:auto 100%;} .main_bbs_write .bbs_write_box .policy_cont .clear input[type="checkbox"]:checked + label:before {background:url(../images/skin/icon-chk-po-m.png) no-repeat 0 50%;background-size:auto 100%;} } @media only screen and (max-width: 960px) { /* 비주얼영역 */ .main_visual_bnr.for_m {padding-top:17vw;padding-bottom:10.14vw;} .visual_content ul {padding-top:11.2vw;} /* 솔루션 영역 */ .main_solution {padding-top:10.3vw;} .solution_bnr li {width: calc(50% - 10px);} .solution_bnr li:nth-of-type(1) {padding-top:15.6vw;} .solution_bnr li .bnr_wrap .txt {width:82%;margin-top:-46px;padding-top:20px;padding-bottom:20px;padding-left:10px;padding-right:10px;} .solution_bnr li .bnr_wrap .txt h4 {font-size:29px;} .solution_bnr li .bnr_wrap .txt p {padding-top:22px;padding-bottom:36px;} /* 사용장소 영역 */ .main_coverage {padding-top:10.8vw;} .main_coverage .w_custom{padding:0 15px;} .main_coverage .main_title {padding-bottom:6.26vw;} .coverage_slide {padding-bottom:52px;width: calc(100% + 30px);margin-left:-15px;margin-right:-15px;padding-left:7px;padding-right:7px;box-sizing:border-box;} .coverage_slide .slide_cut span {font-size:18px;} .coverage_slide .swiper-pagination {width: calc(100% - 30px);} .main_coverage .coverage_arw{display: none;} /* 게시글 영역 */ .main_bbs_write .bbs_write_box > dl {padding:10px 0;} .main_bbs_write .bbs_write_box > dl > dt, .main_bbs_write .bbs_write_box > dl > dd, .main_bbs_write .bbs_write_box > div {font-size:16px;} .main_bbs_write .bbs_write_box .edit-box textarea#contents {height:143px;padding:20px;} .main_bbs_write .bbs_write_box .policy_cont .clear {line-height:20px;} .main_bbs_write .bbs_write_box .policy_cont .clear label {line-height:20px;height:20px;} .main_bbs_write .bbs_write_box .policy_cont .clear label:before {width:20px;height:20px;} .main_bbs_write .bbs_write_box .policy_cont .clear a {font-size:13px;} } @media only screen and (max-width: 860px) { /* pc 타이틀 */ .main_title span, .main_title h3, .main_title h3 span, .main_title p {line-height:1.4em;} .main_title span {font-size:17px;} .main_title h3, .main_title h3 span {font-size:35px;} .main_title p {font-size:18px;line-height:1.43em;} .main_title h3 + p {padding-top:20px;} /* 비주얼영역 */ .visual_content li .content_info {padding: 0 20px;} /* 텍스트 영역 */ .main_approach {padding-top:10.8vw;} /* 코어 영역 */ .main_core {padding-top:0;} .core_wrap {padding:12.2vw 0 5.2vw;background-position-x:50%;background-size:114% auto;} .core_wrap .main_title {padding-bottom:5.06vw;} .core_wrap .core_thumb {width:106%;margin-left:-3%;margin-right:-3%;padding-top:64.98%;transform:translateX(4%);background-size:100% auto;} .core_wrap .core_list li:nth-of-type(1) {left:12.1%;} .core_wrap .core_list li:nth-of-type(2) {left:7.11%;} .core_wrap .core_list li:nth-of-type(3) {left:15px;} .core_wrap .core_list li:nth-of-type(4) {left:auto;right:15px;} .core_wrap .core_list li:nth-of-type(5) {left:46.21%;} .core_wrap .core_list li:nth-of-type(6) {left:auto;right:15px;bottom:16.55%;} /* 솔루션 영역 */ .solution_bnr li:nth-of-type(1) {padding-top:18.6vw;} .solution_bnr li .bnr_wrap .txt {margin-top:-40px;padding-top:20px;padding-bottom:20px;} .solution_bnr li .bnr_wrap .txt h4 {font-size:27px;} .solution_bnr li .bnr_wrap .txt p {padding-top:18px;padding-bottom:30px;} /* 사용장소 영역 */ .main_coverage {padding-top:12.8vw;padding-bottom:11.67vw;} /* 숫자 영역 */ .main_count {padding-top:9.2vw;padding-bottom:9.07vw;} .main_count li .count_num em {font-size:20px;padding:27px 0 4px;} .main_count li:nth-of-type(3) .count_num em {padding:0;} .main_count li .count_num span, .main_count li:nth-of-type(3) .count_num em {font-size:51px;} /* 게시글 영역 */ .main_custom {padding-top:13.46vw;padding-bottom:19.86vw;} .main_bbs_write {text-align:center;} .main_bbs_write .bbs_write_box {width:100%;max-width:100%;float:none;text-align:left;} .main_bbs_write .bbs_write_box + .bbs_write_box {float:none;padding-top:10px;} .main_bbs_write .bbs_write_box .edit-box textarea#contents {height:200px;} .main_bbs_write .btn_contact_send {margin:30px auto 0;position:static;} } @media only screen and (max-width:800px) { .main_visual video{width:auto;height:100%;} } @media only screen and (max-width:767px) { /* pc 타이틀 */ .main_title h3, .main_title h3 span {font-size:32px;} /* 비주얼 영역 */ .main_visual_bnr.for_m {padding-top: 20vw;} .visual_title strong {font-size:30px;} .visual_title h3 {font-size:48px;} .visual_content ul {padding-top: 13vw;} /* 텍스트 영역 */ .main_approach {} /* 코어 영역 */ .core_wrap {padding:13.2vw 0 5.2vw;background-position-x:28%;background-size:130% auto;} .core_wrap .core_thumb {width:110%;margin-left:-5%;margin-right:-5%;padding-top:74.98%;} .core_wrap .core_list li div {font-size:15px;} .core_wrap .core_list li:nth-of-type(1) {top:13.66%;} .core_wrap .core_list li:nth-of-type(2) {bottom:21.81%;} .core_wrap .core_list li:nth-of-type(3) {top:36.83%;} .core_wrap .core_list li:nth-of-type(4) {top:38.68%;} /* 솔루션 영역 */ .solution_bnr li {width:70%;max-width:550px;} .solution_bnr li:nth-of-type(1) {padding-top:7.4vw;} .solution_bnr li:nth-of-type(2) {margin-top:7.93vw;} /* 사용장소 영역 */ .main_coverage {padding-top:13.8vw;padding-bottom:13.67vw;} .main_coverage .main_title {padding-bottom:7.26vw;} .coverage_slide {padding-bottom:46px;} /* 숫자 영역 */ .main_count {padding-top:11.2vw;padding-bottom:11.07vw;} .main_count li .count_icon {padding-top:38px;} .main_count li .count_num {padding:19px 0 12px;} .main_count li .count_num em {padding:24px 0 3px;} .main_count li:nth-of-type(3) .count_num em {padding:0;} .main_count li .count_num span, .main_count li:nth-of-type(3) .count_num em {font-size:47px;} .main_count li .count_txt {font-size:16px;} } @media only screen and (max-width: 640px) { /* pc 타이틀 */ .main_title span {font-size:16px;} .main_title h3, .main_title h3 span{font-size:29px;} .main_title p {font-size:17px;} .main_title span + h3 {padding-top:12px;} .main_title h3 + p {padding-top:18px;} .main_title p .m_br + br {display:inline-block;} /* 비주얼영역 */ .main_visual_bnr.for_m {padding-top:20vw;padding-bottom:12.14vw;} .visual_title strong {font-size:28px;} .visual_title h3 {font-size:44px;} .visual_content ul {display:block;padding-top:14.2vw; padding-left:20px; padding-right:20px;} .visual_content li {width:100%;} .visual_content li:nth-of-type(odd) {padding-right:0;} .visual_content li:nth-of-type(even) {padding-left:0;} .visual_content li + li, .visual_content li:nth-of-type(even) {margin-top:40px;} .visual_content li:nth-of-type(odd) .content_info {padding-right:25px;} .visual_content li:nth-of-type(even) .content_info {padding-left:25px;} .visual_content li .content_info dt {font-size:19px;} .visual_content li:nth-of-type(3) .content_info dt {font-size:19px;} .visual_content li .content_info dd {letter-spacing:0;} /* 텍스트 영역 */ .main_approach {padding-top:11.8vw;} /* 코어 영역 */ .core_wrap {padding:15.2vw 0 6.2vw;background-position-x:45%;background-size:182% auto;} .core_wrap .main_title {padding-bottom:8.06vw;} .core_wrap .core_thumb {width: calc(100% + 30px);margin-left:-15px;margin-right:-15px;padding-top:84.4%;transform:translateX(0);background:url(../images/skin/bnr-main-approach-m.png) no-repeat 50% 100%;background-size:100% auto;} .core_wrap .core_list ul {font-size:0;vertical-align:top;} .core_wrap .core_list li {left:auto;right:auto;top:auto;bottom:auto;display:inline-block;position:static;vertical-align:top;box-sizing:border-box;} .core_wrap .core_list li div {font-size:15px;} .core_wrap .core_list li div br {display:none;} .core_wrap .core_list li:nth-of-type(n + 3) {margin-top:12px;} .core_wrap .core_list li:nth-of-type(1), .core_wrap .core_list li:nth-of-type(3) {width:57%;} .core_wrap .core_list li:nth-of-type(2), .core_wrap .core_list li:nth-of-type(4) {width:43%;} .core_wrap .core_list li:nth-of-type(5), .core_wrap .core_list li:nth-of-type(6) {width:100%;} /* 솔루션 영역 */ .main_solution {padding-top:11.3vw;} .solution_bnr li {width:84%;} .solution_bnr li .bnr_wrap .txt h4 {font-size:25px;} .solution_bnr li .bnr_wrap .txt p {font-size:15px;padding-top:18px;padding-bottom:18px;} .solution_bnr li .bnr_wrap:hover .btn_more {color: #111;} /* 사용장소 영역 */ .main_coverage {padding-top:14.8vw;padding-bottom:15.67vw;} .main_coverage .main_title {padding-bottom:8.26vw;} .coverage_slide {padding-bottom:46px;} .coverage_slide .slide_cut span {font-size:17px;} .coverage_slide .slide_cut .thumb:hover img {transform: none;} /* 숫자 영역 */ .main_count .main_title{padding-bottom:20px;} .main_count li .count_num em {font-size:18px;padding:20px 0 3px;} .main_count li:nth-of-type(3) .count_num em {padding:0;} .main_count li .count_num span, .main_count li:nth-of-type(3) .count_num em {font-size:41px;} .main_count li .count_txt {font-size:15px;} /* 게시글 영역 */ .main_bbs_write {padding-top:5.32vw;} .main_bbs_write .bbs_write_box > dl > dt, .main_bbs_write .bbs_write_box > dl > dd, .main_bbs_write .bbs_write_box > div {font-size:15px;line-height:20px;} .main_bbs_write .bbs_write_box > dl > dt {padding:8px 0;} .main_bbs_write .bbs_write_box > dl > dd > input[type="text"], .main_bbs_write .bbs_write_box > dl > dd > input[type="password"] {padding:8px 0;} } @media only screen and (max-width:479px) { /* pc 타이틀 */ .main_title span {font-size:14px;} .main_title h3, .main_title h3 span {font-size:27px;} .main_title p {font-size:15px;} .main_title h3 + p {padding-top:16px;} /* 비주얼영역 */ .main_visual_bnr.for_m {padding-top:25vw;padding-bottom:15.14vw;} .visual_title strong {font-size:26px;} .visual_title h3 {font-size:41px;} .visual_title p {font-size:14px;} .visual_content ul {padding-top:22.2vw;} .visual_content li .content_thumb {border:1px #fff solid; padding:44% 0 0;} .visual_content li:nth-of-type(odd) .content_info {} .visual_content li:nth-of-type(even) .content_info {padding-left:20px;} .visual_content li .content_info dt {font-size:18px;} .visual_content li .content_info dt:before {width:20px;} .visual_content li:nth-of-type(3) .content_info dt {font-size:18px;} .main_visual .txt h2{font-size:16vw;} /* 텍스트 영역 */ .main_approach br {display:none;} .main_approach .m_br + br {display:inline-block;} /* 코어 영역 */ .core_wrap {padding:16.2vw 0 6.2vw;background-position-x:45%;background-size:182% auto;}/*17.2vw 7.2vw*/ .core_wrap .w_custom {text-align:center;} .core_wrap .main_title {padding-bottom:8.06vw;}/*9.06vw*/ .core_wrap .core_thumb {width: calc(100% + 30px);margin-left:-15px;margin-right:-15px;padding-top:84.4%;transform:translateX(0);background:url(../images/skin/bnr-main-approach-m.png) no-repeat 50% 100%;background-size:100% auto;} .core_wrap .core_list ul {font-size:0;vertical-align:top;} .core_wrap .core_list li {left:auto;right:auto;top:auto;bottom:auto;display:inline-block;position:static;vertical-align:top;box-sizing:border-box;} .core_wrap .core_list li div {font-size:15px;}/*14*/ .core_wrap .core_list li div br {display:none;} .core_wrap .core_list li:nth-of-type(n + 3) {margin-top:12px;} .core_wrap .core_list li:nth-of-type(1), .core_wrap .core_list li:nth-of-type(3) {width:57%;} .core_wrap .core_list li:nth-of-type(2), .core_wrap .core_list li:nth-of-type(4) {width:43%;} .core_wrap .core_list li:nth-of-type(5), .core_wrap .core_list li:nth-of-type(6) {width:100%;} /* 솔루션 영역 */ .solution_bnr li {float:none;width:100%;} .solution_bnr li:nth-of-type(2) {float:none;} .solution_bnr li .bnr_wrap .thumb {padding-top:81.64%;} .solution_bnr li .bnr_wrap .txt {padding-bottom:6px;} .solution_bnr li .bnr_wrap .txt:before {width:80%;} .solution_bnr li .bnr_wrap .txt p {padding-top:16px;padding-bottom:16px;} /* 사용장소 영역 */ .main_coverage {padding-top:15.8vw;padding-bottom:17.67vw;} .main_coverage .main_title {padding-bottom:9.26vw;} .coverage_slide {padding-bottom:42px;} .coverage_slide .slide_cut span {font-size:16px;margin-top: 20px;} /* 숫자 영역 */ .main_count {padding-top:12.2vw;padding-bottom:12.07vw;} .main_count ul {padding-left:0 !important;padding-right:0 !important;} .main_count li .count_icon {padding-top:35px;} .main_count li .count_num {padding:19px 0 9px;} .main_count li .count_num em {font-size:16px;padding:19px 0 3px;} .main_count li:nth-of-type(3) .count_num em {padding:0;} .main_count li .count_num span, .main_count li:nth-of-type(3) .count_num em {font-size:38px;} .main_count li .count_txt {font-size:14px;} /* 게시글 영역 */ .main_custom {padding-top:14.46vw;padding-bottom:20.86vw;} .main_bbs_write {padding-top:6.32vw;} .main_bbs_write .bbs_write_box > dl > dt, .main_bbs_write .bbs_write_box > dl > dd, .main_bbs_write .bbs_write_box > div {font-size:14px;line-height:20px;min-height:30px;} .main_bbs_write .bbs_write_box > dl > dt {padding:5px 0;width:22.5%;} .main_bbs_write .bbs_write_box > dl > dd {width:77.5%;} .main_bbs_write .bbs_write_box > dl > dd > input[type="text"], .main_bbs_write .bbs_write_box > dl > dd > input[type="password"] {height:30px;padding:5px 0;} .main_bbs_write .bbs_write_box > dl > dd img#captcha {width:135px !important;height:30px !important;} .main_bbs_write .bbs_write_box > dl > dd input#captcha {width:calc(100% - 175px);margin:0 5px;padding:0 5px;} .main_bbs_write .bbs_write_box > dl > dd span#refreshCode {width:30px;height:30px;} .main_bbs_write .bbs_write_box .edit-box textarea#contents {padding:15px;} .main_bbs_write .bbs_write_box .policy_cont .clear {padding-bottom:16px;} .main_bbs_write .bbs_write_box .policy_cont .clear label {font-size:14px;} .main_bbs_write .bbs_write_box .policy_cont .clear a {font-size:12px;} .main_bbs_write .bbs_write_box .policy_cont > textarea {font-size:11px;line-height:17px;padding:12px 15px;} } @media screen and (max-width:375px) { /* pc 타이틀 */ .main_title span {font-size:13px;} .main_title h3, .main_title h3 span{font-size:25px;} .main_title p {font-size:14px;} /* 비주얼영역 */ .main_visual_bnr.for_m {padding-top:31.6vw;padding-bottom:16.14vw;} .visual_title strong {font-size:25px;} .visual_title h3 {font-size:40px;} .visual_title p {font-size:13px;} .visual_content ul {padding-top:22.2vw;} .visual_content li .content_info dt {font-size:17px;} .visual_content li:nth-of-type(3) .content_info dt {font-size:17px;} /* 텍스트 영역 */ .main_approach {padding-top:12.8vw;} .main_approach br {display:none;} .main_approach .m_br + br {display:inline-block;} /* 코어 영역 */ .core_wrap {padding:17.2vw 0 7.2vw;} .core_wrap .main_title {padding-bottom:9.06vw;} .core_wrap .core_list li div {font-size:14px;} /* 솔루션 영역 */ .main_solution {padding-top:12.67vw;} .solution_bnr li:nth-of-type(1) {padding-top:8.4vw;} .solution_bnr li:nth-of-type(2) {margin-top:8.93vw;} .solution_bnr li:nth-of-type(1) .bnr_wrap .thumb {background-image:url(../images/skin/bnr-main-solution-01-m.jpg);} .solution_bnr li:nth-of-type(2) .bnr_wrap .thumb {background-image:url(../images/skin/bnr-main-solution-02-m.jpg);} .solution_bnr li .bnr_wrap .txt:before {width:59.7%;} .solution_bnr li .bnr_wrap .txt h4 {font-size:23px;} .solution_bnr li .bnr_wrap .txt p {font-size:14px;} /* 사용장소 영역 */ .main_coverage {padding-top:16.8vw;padding-bottom:18.67vw;} .main_coverage .main_title {padding-bottom:10.26vw;} .coverage_slide {width: calc(100% + 30px);margin-left:-15px;margin-right:-15px;padding-left:7px;padding-right:7px;padding-bottom:42px;} .coverage_slide .swiper-pagination {width: calc(100% - 30px);} .coverage_slide .slide_cut .thumb {width: calc(100% - 15px);} .coverage_slide .slide_cut span {font-size:15px;} /* 숫자 영역 */ .main_count {padding-top:13.2vw;padding-bottom:13.07vw;} .main_count li .count_num em {font-size:14px;padding:18px 0 3px;} .main_count li:nth-of-type(3) .count_num em {padding:0;} .main_count li .count_num span, .main_count li:nth-of-type(3) .count_num em {font-size:35px;} .main_count li .count_txt {font-size:13px;} /* 게시글 영역 */ .main_custom {padding-top:15.46vw;padding-bottom:22.86vw;} .main_bbs_write {padding-top:7.32vw;} .main_bbs_write .bbs_write_box > dl > dt {width:77px} .main_bbs_write .bbs_write_box > dl > dd {width: calc(100% - 77px);} .main_bbs_write .bbs_write_box .policy_cont .clear label {font-size:13px;} } @media screen and (max-width:360px) { /* 게시글 영역 */ .main_bbs_write .bbs_write_box > dl > dd img#captcha {width:135px !important;height:30px !important;margin-bottom:5px;display:block;} .main_bbs_write .bbs_write_box > dl > dd input#captcha {width:calc(100% - 36px);margin:0 6px 0 0;padding:0 3px;} } @media screen and (max-width:350px) { /* pc 타이틀 */ .main_title span {font-size:13px;} .main_title h3, .main_title h3 span {font-size:24px;} .main_title p {font-size:14px;} /* 비주얼영역 */ .main_visual_bnr.for_m {padding-top:32.6vw;padding-bottom:17.14vw;} .visual_title strong {font-size:23px;} .visual_title h3 {font-size:38px;} .visual_title p {font-size:13px;} .visual_content ul {padding-top:23.2vw;} .visual_content li + li, .visual_content li:nth-of-type(even) {margin-top:32px;} .visual_content li:nth-of-type(odd) .content_info {padding-right:18px;} .visual_content li:nth-of-type(even) .content_info {padding-left:18px;} .visual_content li .content_info dt {font-size:16px;} .visual_content li:nth-of-type(3) .content_info dt {font-size:16px;} .visual_content li .content_info dd {font-size:12px;} /* 텍스트 영역 */ .main_approach {padding-top:13.8vw;} /* 코어 영역 */ .core_wrap {padding:18.2vw 0 8.2vw;} .core_wrap .main_title {padding-bottom:10.06vw;} .core_wrap .core_list li div {font-size:13px;} .core_wrap .core_list li:nth-of-type(n + 3) {margin-top:9px;} /* 솔루션 영역 */ .solution_bnr li .bnr_wrap .txt h4 {font-size:22px;} .solution_bnr li .bnr_wrap .txt p {font-size:13px;} /* 게시글 영역 */ .main_custom {padding-bottom:24.86vw;} .main_bbs_write .bbs_write_box > dl > dt, .main_bbs_write .bbs_write_box > dl > dd, .main_bbs_write .bbs_write_box > div {font-size:13px;} } @media screen and (max-width:320px) { /* 코어 영역 */ .core_wrap .core_thumb {width: calc(100% + 20px);margin-left:-10px;margin-right:-10px;} /* 사용장소 영역 */ .coverage_slide {width: calc(100% + 20px);margin-left:-10px;margin-right:-10px;padding-left:5px;padding-right:5px;} .coverage_slide .swiper-pagination {width: calc(100% - 20px);} .coverage_slide .slide_cut .thumb {width: calc(100% - 11px);} /* 숫자 영역 */ .main_count ul {padding-left:0 !important;padding-right:0 !important;} }