/* Add here all your CSS customizations */ /* scrollbar */ @media (min-width:992px){ ::-webkit-scrollbar { width:10px; } /* 스크롤바 전체 영역 */ ::-webkit-scrollbar-track { background-color: #fff; } /* 스크롤 배경 */ ::-webkit-scrollbar-thumb { background-color: #0036bc; } /* 스크롤이 움직이는 영역 */ ::-webkit-scrollbar-button:start:decrement, /* 스크롤의 화살표가 포함된 영역 */ ::-webkit-scrollbar-button:end:increment, /* 스크롤의 화살표가 포함된 영역 */ ::-webkit-scrollbar-corner, /* 상하+좌우 스크롤이 만나는 공간 */ ::-webkit-scrollbar-button:vertical:incremen, /* 스크롤 상하방향 */ ::-webkit-scrollbar-button:vertical:decrement, /* 스크롤 상하방향 */ ::-webkit-scrollbar-button:horizontal:increment, /* 스크롤 좌우방향 */ ::-webkit-scrollbar-button:horizontal:decrement /* 스크롤 좌우방향 */{ display:none; } /* IE 스크롤 바 */ html{ scrollbar-3dLight-Color: #fff; /* 스크롤 밖 테두리 컬러 */ scrollbar-arrow-color: #fff; /* 스크롤 상하 버튼 컬러 */ scrollbar-Face-Color: #0036bc; /* 스크롤 바 컬러 */ scrollbar-Track-Color: #fff; /* 스크롤 배경 컬러 */ scrollbar-DarkShadow-Color: #0036bc; /* 스크롤 arrow와 스크롤 바 의 어두운그림자 컬러 */ scrollbar-Highlight-Color: #0036bc; /* 스크롤 arrow와 스크롤 바 의 하이라이트 컬러 */ scrollbar-Shadow-Color: #0036bc; /* 스크롤 arrow와 스크롤 바 의 그림자 컬러 */ /* firefox */ scrollbar-face-color:#0036bc; /* 스크롤 바 컬러 */ scrollbar-track-color: #fff; /* 스크롤 배경 컬러 */ scrollbar-color:#0036bc #fff; /* 2가지 통합 순서 : 스크롤 바 스크롤 배경 scrollbar-face-color scrollbar-track-color; */ scrollbar-width: thin; /* 스크롤 바 넓이 값 옵션 : auto / thin / none */ } } :root{ scroll-behavior: auto; --vh: 100vh !important; --main-color:#0036bc; --main-color2:#082463; } body{ overflow-x:hidden;letter-spacing:0; } .padding-150{ padding:150px 0; } .padding-100{ padding:100px 0; } .padding-80{ padding:80px 0; } .m,.hide{ display:none; } .center{ text-align:center; } .gray-bg{ background:rgba(222,222,222,0.2); } .graygreen-bg{ background:rgba(176,200,174,0.1); } a{ text-decoration:none; } .mt-60{ margin-top:60px; } .mt-40{ margin-top:40px; } .mt-20{ margin-top:20px; } .mb-20{ margin-bottom:20px; } .pt-60{ padding-top:60px; } .pt-40{ padding-top:40px; } .pt-20{ padding-top:20px; } .pb-60{ padding-bottom:60px; } .pb-40{ padding-bottom:40px; } .pb-20{ padding-bottom:20px; } address{ font-style:normal; } .row{ margin-left:-15px;margin-right:-15px; } .row > *{ padding-left:15px;padding-right:15px; } @media (max-width:1439px){ .row{ margin-left:-10px;margin-right:-10px; } .row > *{ padding-left:10px;padding-right:10px; } } @media (max-width:991px){ .padding-150{ padding:120px 0; } } @media (max-width:767px){ .padding-100{ padding:80px 0; } .padding-80{ padding:60px 0; } } @media (max-width:640px){ .padding-150{ padding:100px 0; } .padding-80{ padding:40px 0; } } @media (max-width:480px){ .mt-60{ margin-top:40px; } .pt-60{ padding-top:40px; } .pb-60{ padding-bottom:40px; } .mt-40{ margin-top:30px; } .pt-40{ padding-top:30px; } .pb-40{ padding-bottom:30px; } .container{ padding-left:16px;padding-right:16px; } .row{ margin-left:-8px;margin-right:-8px; } .row > *{ padding-left:8px;padding-right:8px; } } @media (max-width:380px){ .padding-150{ padding:80px 0; } } /* ===================================== Header ===================================== */ #header, #header.header-effect-shrink .header-container{ height:90px !important; } #header.header-effect-shrink .header-container{ min-height:auto !important; } #header .header-logo a{ display:block;position:relative;width:200px;height:50px; } #header .header-logo a img{ position:absolute;width:100%;height:100%;left:0;top:0;transition:all 0.4s; } #header .header-logo a img.logo-w{ opacity:1;visibility:visible;pointer-events:auto; } #header .header-logo a img.logo-b{ opacity:0;visibility:hidden;pointer-events:none; } #header .header-nav-main nav > ul > li > a{ font-size:19px;transition:all 0.4s; } #header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li.leave > a, #header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li.leave > a{ color:rgba(255,255,255,0.5); } #header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li.over > a, #header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li.over > a, #header .header-nav.header-nav-links nav > ul:not(:hover) > li > a.active{ color:rgba(255,255,255,1); } .sticky-header-active #header .header-logo a{ width:178px;height:44px; } .sticky-header-active #header .header-logo a img.logo-w{ opacity:0;visibility:hidden;pointer-events:none; } .sticky-header-active #header .header-logo a img.logo-b{ opacity:1;visibility:visible;pointer-events:auto; } .sticky-header-active #header, .sticky-header-active #header.header-effect-shrink .header-container{ height:70px !important; } .sticky-header-active #header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li > a, .sticky-header-active #header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li > a{ color:#222; } .sticky-header-active #header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li.leave > a, .sticky-header-active #header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li.leave > a{ color:rgba(34,34,34,0.5); } .sticky-header-active #header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li.over > a, .sticky-header-active #header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li.over > a, .sticky-header-active #header .header-nav.header-nav-links nav > ul:not(:hover) > li > a.active{ color:rgba(0,54,188,1); } /* ===================================== common-btn ===================================== */ .common-btn{ display:flex;flex-wrap:wrap;align-items:center;justify-content:center;align-content:center;transition:all 0.3s;font-size:18px;font-weight:500;line-height:1; padding:0 24px;height:50px;border-radius:4px;border-style:solid;border-width:1px;text-align:center;position:relative; } .common-btn .txt{ font-size:inherit;font-weight:inherit;line-height:1; } .arrow-btn{ justify-content:space-between;text-align:left;padding:0 40px; } .arrow-btn i{ font-size:24px;color:inherit;margin-top:-2px; } .arrow-btn:hover{ padding:0 34px; } .common-btn.white{ color:#fff;border-color:#fff; } .common-btn.white:hover{ background:#fff;color:var(--main-color); } .common-btn.blue{ color:var(--main-color);border-color:var(--main-color); } .common-btn.blue:hover{ color:#fff;background:var(--main-color); } @media (max-width:640px){ .common-btn{ font-size:17px;height:48px; } } @media (max-width:480px){ .common-btn{ font-size:16px;height:44px;padding:0 20px; } .arrow-btn{ padding:0 30px; } .arrow-btn:hover{ padding:0 24px; } } /* ===================================== Main ===================================== */ /* main-visual */ .rev_slider li.slide-overlay .slotholder:after{ background: rgba(34,34,34,0.8); } .main-visual{ position:relative;height:var(--vh); } .main-text-wrap{ position:absolute;left:0;bottom:40px;width:100%; } .main-text-row{ margin:0;padding:60px 0;border-radius:20px;overflow:hidden;background:var(--main-color2);box-shadow: 0 7px 20px rgba(0,0,0,0.35); } .main-text-row .text-center{ display:flex;flex-wrap:wrap;align-content:space-between;height:100%; } .main-text-row .text-center > div{ width:100%; } .main-text-row h5{ font-size:16px;line-height:1.1;text-transform:uppercase;color:#eee;margin-bottom:10px;font-weight:300; } .main-text-row h3{ font-size:32px;line-height:1.1;color:#fff;margin-bottom:0px; } .main-text-row p{ font-size:18px;line-height:1.4;font-weight:400;color:#ddd;margin-bottom:0px; } .main-text-row h4{ font-size:28px;color:#fff;margin-bottom:5px; } .main-text-row > div:nth-child(1) p{ margin-top:20px; } .main-text-row > div:nth-child(1) .common-btn{ margin:20px auto 0;width:200px; } .main-text-row > div:nth-child(2) p{ margin-bottom:10px; } @media (max-width:480px){ .main-text-row > div:nth-child(1) .common-btn{ width:170px; } } /* title-bx */ .title-bx h5{ text-transform:uppercase;line-height:1.1;margin-bottom:10px;color:var(--main-color);font-weight:400;letter-spacing:0.75px; } .title-bx h2{ font-size:48px;font-weight:700;line-height:1.2; } .title-bx p{ font-size:18px;font-weight:400;margin-top:20px;color:#666; } .main_h2{ font-size:32px !important; line-height:40px !important; } .main_h3{ font-size:22px !important; line-height:34px !important; } .main_h4,.main_text{ font-size:17px !important; line-height:28px !important; } .main_h5{ font-size:15px !important; line-height:24px !important; } @media (max-width:991px){ .title-bx h2{ font-size:44px; } } @media (max-width:640px){ .title-bx p{ font-size:17px; } } @media (max-width:480px){ .title-bx h2{ font-size:38px; } .title-bx p{ font-size:16px; } } @media (max-width:380px){ .title-bx h2{ font-size:34px; } .title-bx p{ font-size:15px; } } /* main-intro */ .main-intro .common-btn{ width:200px;margin-top:20px; } .main-intro .main-count{ color:#222; } .main-intro .counters.counters-lg label{ font-size:18px;font-weight:300;margin-top:5px;line-height:1.1;color:#666; } @media (max-width:767px){ .main-intro .common-btn{ width:170px; } } @media (max-width:480px){ .main-intro .common-btn{ width:140px; } } /* main_product */ .main_product{ background:url("../images/main/main-product-bg01.jpg") no-repeat center top/cover fixed; } .main_product .title-bx h5{ color:rgba(255,255,255,0.8); } .main_product .title-bx h2{ color:#fff; } .main_product .title-bx p{ color:#ddd; } .main_product .portfolio-item .thumb-info{ border-radius:20px;overflow:hidden; } .main_product .portfolio-item .thumb-info-wrapper{ position:relative;padding-bottom:100%; } .main_product .portfolio-item .thumb-info-wrapper img{ position:absolute;width:100%;height:100%;left:50%;top:50%;transform:scale(1) translate(-50%,-50%); object-fit:cover;object-position:center center;transition:transform 0.6s; } .main_product .portfolio-item:hover .thumb-info-wrapper img{ transform:scale(1.05) translate(-50%,-50%); } .main_product .portfolio-list{ justify-content:center; } .main_product .portfolio-list > div{ width:33.33%;padding:0 15px; } .main_product .portfolio-list > div:nth-child(1), .main_product .portfolio-list > div:nth-child(2), .main_product .portfolio-list > div:nth-child(3){ margin-bottom:30px; } /* ===== main_product ===== */ .main_product .main_h4{ } .main_product .main_h2,.main_product .main_text{ color:#fff; } .main_product .isotope-item2{ padding: 0 10px !important; } .main_product .isotope-item2 .isotope-item{ padding:0 5px !important; } .main_product .main_h3{ font-weight:600; } .main_product .main_text{ letter-spacing:1px; } /*.main_product .portfolio-list{ margin-bottom:10px; }*/ /* ===== main_business ===== */ .main_business{ background:rgba(18,70,125,0.03); } .main_business .feature-box .main_h3{ color:#fff; background:#12467d; padding:15px; border-bottom-right-radius:15px; } .main_business .feature-box .main_text{ padding:30px 15px; } .main_business .feature-box .feature-box-info{ padding-left:0; } .main_business div.row > div:nth-child(2) .feature-box,.main_business div.row > div:nth-child(5) .feature-box{ margin:0 15px; } /* ===== main_portfolio ===== */ .main_portfolio{ background:rgba(0,0,0,0.03); } .main_portfolio .owl-carousel .main_text{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .main_portfolio .common-btn{ background:var(--main-color);color:#fff;width:250px;height:54px;margin:0 auto; } .main_portfolio .common-btn:hover .btn_arrow{ color:#fff; } .main_portfolio .common-btn:hover{ background:var(--main-color2);color:#fff; } .main_portfolio .portfolio-item .thumb-info-title .thumb-info-type{ background:#fff; border-radius:50%; width:40px; height:40px; } .main_portfolio .portfolio-item .thumb-info-title .thumb-info-type .fa-search{ color:#12467d; position: relative; left: 50%; top: 2px; margin-left: -8px; } .main_portfolio .portfolio-item .thumb-info.thumb-info-no-borders .thumb-info-wrapper{ border-radius:20px;padding-bottom:65%; } .main_portfolio .portfolio-item .thumb-info.thumb-info-no-borders .thumb-info-wrapper img{ position:absolute;width:100%;height:100%;left:50%;top:50%; transform:scale(1) translate(-50%,-50%);object-fit:cover;object-position:center center;transition:transform 0.6s; } .main_portfolio .portfolio-item:hover .thumb-info.thumb-info-no-borders .thumb-info-wrapper img{ transform:scale(1.05) translate(-50%,-50%); } /* ===== footer ===== */ #footer{ background:#18233c; } #footer .footer_info{ padding:40px 0; } #footer .footer_info .logo:hover img{ opacity:0.7; transition:0.3s all;} #footer .footer_info .main_h5{ color:#ccc; } #footer .footer_info ul{ position:relative; } #footer .footer_info ul:after{ content:"";display:block;clear:both; } #footer .footer_info ul li{ list-style:none; float:left; } #footer .footer_info ul li:not(:last-child){ margin-right:15px; padding-right:15px; border-right:1px solid rgba(255,255,255,0.5); } #footer .footer-copyright{ padding:20px 0;background:#1d222f; } #footer .footer-copyright p{ text-transform:uppercase;color:#888;font-size:14px !important; } #footer .footer-copyright .footer_arrow{ position:relative; left:-10px; } @media (max-width:991px){ #footer .footer-copyright p{ font-size:12px !important; } } @media (max-width:480px){ #footer .footer-copyright p{ font-size:11px !important;text-align:center;line-height:1.4 !important; } } /* ===================================== sub ===================================== */ /* ===== sub_visual ===== */ .sub_visual{ background:url("../images/sub/sub-visual-img.jpg") no-repeat center top/cover; } .sub_visual .main_text{ color:rgba(255,255,255,0.8); } .sub_visual .sub_visual_text .main_text{ width:73%; } .sub_visual .sub_visual_btn{ display:flex;flex-wrap:wrap;justify-content:end;align-content:center;align-items:center; } .sub_visual .sub_visual_btn .sub_btn{ border:1px solid #fff; color:#fff;text-align:center;padding:10px 30px;width:200px;background:rgba(255,255,255,0.2); } .sub_visual .sub_visual_btn .sub_btn:hover .btn_arrow{ color:#12467d; } .sub_visual .sub_visual_btn .sub_btn:hover{ background:#fff; color:#12467d; } .about_introduction .main_h3 span{ color:var(--main-color) !important; } /* ===== sub_ask ===== */ .sub_ask{ background:#12467d; padding:40px 0;} .sub_ask .main-text-row{ box-shadow:none;background:none;padding:0; } .sub_ask .main_btn{ border:1px solid #fff; color:#fff; padding:10px 30px; margin:0 auto; } .sub_ask .main_btn:hover{ background:#fff; color:#12467d; } .sub_ask .main_btn:hover .btn_arrow{ color:#12467d; } .sub_ask .sub_ask_box:nth-child(1) .main_btn{ width:32%; } .sub_ask .sub_ask_box:nth-child(2) .main_btn{ width:40%; } /* ===== 회사소개 ===== */ /* -- 연혁 -- */ .about_history{ background:rgba(0,0,0,0.03); } .about_history .timeline .timeline-body{ position:relative; } .about_history .timeline .timeline-body:before{ content:"";position:absolute;width:2px;height:100%;left:50%;top:0;transform:translateX(-50%); background: linear-gradient(to bottom, rgba(80, 80, 80, 0) 0%, #ddd 8%, #ddd 92%, rgba(80, 80, 80, 0) 100%); } .about_history .timeline .timeline-box{ width:50%;padding-bottom:60px;position:relative; } .about_history .timeline .timeline-box:first-child{ padding-top:60px; } .about_history .timeline .timeline-box:nth-child(odd){ padding-right:40px; } .about_history .timeline .timeline-box:nth-child(even){ padding-left:40px;margin-left:50%; } .about_history .timeline .timeline-box .portfolio-item{ border:1px solid #ddd;border-radius:20px;position:relative; padding:40px 30px;background:rgba(255,255,255,0.8);text-align:left; } .about_history .timeline .timeline-box .portfolio-item:before, .about_history .timeline .timeline-box .portfolio-item:after{ content:"";position:absolute;top:50%;transform:translateY(-50%); } .about_history .timeline .timeline-box .portfolio-item:before{ width:40px;height:1px;background:#ddd; } .about_history .timeline .timeline-box .portfolio-item:after{ width:8px;height:8px;border-radius:50%; background: #12467d;-webkit-box-shadow: 0 0 0 3px #FFF, 0 0 0 6px #12467d;box-shadow: 0 0 0 3px #FFF, 0 0 0 6px #12467d; } .about_history .timeline .timeline-box:nth-child(odd) .portfolio-item:before{ left:100%; } .about_history .timeline .timeline-box:nth-child(even) .portfolio-item:before{ left:-40px; } .about_history .timeline .timeline-box:nth-child(odd) .portfolio-item:after{ left:calc( 100% + 37px ); } .about_history .timeline .timeline-box:nth-child(even) .portfolio-item:after{ left:-44px; } .about_history .timeline .timeline-box ul{ padding:0; } .about_history .timeline .timeline-box ul li{ position:relative;list-style:none;padding-left:13px; } .about_history .timeline .timeline-box ul li:not(:last-child){ margin-bottom:5px; } .about_history .timeline .timeline-box ul li:before{ content:"";position:absolute;width:5px;height:5px;background:var(--main-color);left:0;top:10px;border-radius:10px; } /* -- 오시는 길 -- */ .about_location{ background:rgba(0,54,188,0.03); } .root_daum_roughmap{ border-radius:20px !important;width:100% !important; } .about_location .location_info{ padding-top:40px;padding-bottom:40px; } .about_location .location_info .location_btn{ background:#12467d; border-radius:30px; padding:10px 35px; color:#fff; } .about_location .location_info .location_btn .btn_arrow{ position:relative; left:5px; transition:0.3s left; } .about_location .location_info .location_btn:hover .btn_arrow{ left:20px; transition:0.3s left; } .about_location .location_info .location_btn_n:hover{ background:#00ab33; } .about_location .location_info .location_btn_k:hover{ background:#ffcc00; color:#231815; } .about_location .location_info .location_btn_k:hover .btn_arrow{ color:#231815; } .about_certi img{ border-radius:20px;overflow:hidden; } /* ===== 제품소개 ===== */ /* -- tab -- */ .sort-source.sort-source-style-3 > li.active > a ,.sort-source.sort-source-style-3 > li:hover > a { border-bottom: 3px solid #12467d !important; color: #12467d !important; border-radius:0; } /* -- product -- */ .product .product_tab li a:hover{ color:#12467d; border-bottom:5px solid #12467d; border-radius:0;} .product .sort-destination-loader .portfolio-list .main_text{ border:1px solid #fff; margin-top:15px; } .product .sort-destination-loader .portfolio-list .main_text:hover{ background:#fff; color:#12467d; transition:0.3s all; } /* -- product_search -- */ .product_search{ width:40%; margin:0 auto;overflow:hidden; } .product_search .form-control{ height:auto !important;/* border-radius:0 !important; */border-radius:5px 0 0 5px !important; } .product_search .btn-primary{ /* border-radius:0 !important; */border-radius:0 5px 5px 0 !important; } /* -- pagination -- */ .pagination .page-link:hover{ background:rgba(18,70,125,0.2) !important; border-color:rgba(18,70,125,0.2) !important; } .page-item:first-child .page-link{ border-radius:0; } /* ===== 제품소개_info ===== */ .product_text .text_box{ min-height:500px; border-top:1px solid rgba(198,198,198,0.5); border-bottom:1px solid rgba(198,198,198,0.5); padding:30px 15px; font-size:17px; font-weight:400; } .product_info_btn{ display:flex;felx-wrap:wrap:justify-content:center;align-items:center;align-content:center; } .product_info_btn .board-btn{ background:var(--main-color2);color:#fff;width:140px;margin:0 auto; } .product_info_btn .board-btn:hover{ background:var(--main-color); } .product_info_btn .sub_btn{ width:120px; border:1px solid #12467d; color:#12467d; padding:10px 30px; } .product_info_btn .sub_btn:hover{ background:#12467d; color:#fff; } .product_info_btn .sub_btn:hover .btn_arrow{ color:#fff; } /* ===== 편의점 창업 ===== */ .operation .op_info .op_img_box{ width:55%; margin:0 auto; } .operation .op_info .common-btn{ border:none;height:54px;background:#222;color:#fff;width:340px; } .operation .op_info .common-btn:hover{ background:#a6bd2d; } /* ===== 유지보수 ===== */ .maintenance-bx .maintenance-item:not(:last-of-type){ margin-bottom:40px; } .maintenance-bx ul{ padding:0; } .maintenance-bx ul li{ position:relative;list-style:none;padding-left:18px; } .maintenance-bx ul li:not(:last-child){ margin-bottom:10px; } .maintenance-bx ul li:before{ position:absolute;left:0; } .maintenance-bx ul:not(.unm-list) li:before{ content:"";width:8px;height:1px;background:#aaa;top:12px; } .maintenance-bx ul.unm-list{ counter-reset:list-number; } .maintenance-bx ul.unm-list li{ counter-increment:list-number; } .maintenance-bx ul.unm-list li:before{ content:counter(list-number)'.';font-size:inherit;font-weight:inherit;color:inherit;line-height:inherit;top:0; } /* ===== 자판기 창업/ 중고매입 ===== */ .startups_place .main_h3 .main_text{ color:rgba(35,24,21,0.4); } .startups_place p{ padding:10px 15px; border:1px solid #12467d; border-bottom-right-radius:15px; width:50%; margin:0 auto; } .startups_place .divider [class*="fa-"], .divider .icons,.divider.divider-style-4 [class*="fa-"]:after, .divider.divider-style-4 .icons:after{ background:none; border:none; } .startups_place .divider.divider-solid { background:#fff; } /* ===== 운영사례 ===== */ .operation_case .portfolio-list .main_text{ border:1px solid #fff; margin-top:15px; } .operation_case .portfolio-list .main_text:hover{ background:#fff; color:#12467d; transition:0.3s all; } .operation_case .portfolio-list .portfolio-item a{ display:block;border-radius:20px;overflow:hidden; } .operation_case .portfolio-list .portfolio-item .img-fluid{ position:absolute;width:100%;height:100%;left:50%;top:50%;transform:translate(-50%,-50%) scale(1); object-fit:cover;object-position:center center; } .operation_case .portfolio-list .portfolio-item a span{ display:block; } .operation_case .portfolio-list .portfolio-item a .thumb-info-wrapper{ position:relative;padding-bottom:80%; } .operation_case .portfolio-list .portfolio-item:hover .img-fluid{ transform:translate(-50%,-50%) scale(1.05); } .operation_case .portfolio-list .portfolio-item .thumb-info-inner{ overflow: hidden;white-space: normal;word-wrap: break-word;display: -webkit-box;-webkit-box-orient: vertical; line-height:2rem;max-height:6rem;-webkit-line-clamp:3; } .operation_case .portfolio-list .portfolio-item a .main_text{ display:inline-block; } /* ===== 고객문의 ===== */ /* -- 공통 -- */ #frmPayment > div{ margin-bottom:30px; padding-bottom:30px; border-bottom:1px solid rgba(35,24,21,0.1); } #frmPayment > div .form-row{ float:left; } #frmPayment .form-row .custom-control{ text-align:center; } .contact .custom-checkbox .custom-control-label::before,.estimate .custom-checkbox .custom-control-label::before{ border-radius:0; } #frmPayment .check_box{ height: 26px; margin: 0 auto; } .contact .custom-control-label::before,.estimate .custom-control-label::before{ top:5px; } #frmPayment .contact_info .form-row{ width:100%; } #frmPayment .contact_privacy .contact_box{ height:300px; overflow-x:hidden; overflow-y:scroll; border:1px solid rgba(35,24,21,0.1); padding:15px; } #frmPayment .contact_privacy .contact_box .col-lg-3{ padding:0 !important; } #frmPayment .contact_privacy .contact_box .pr_box p{ padding:10px 15px; } #frmPayment .contact_privacy .contact_box .pr_box .privacy_t{ border-top:2px solid rgba(35,24,21,0.4); border-bottom:1px solid rgba(35,24,21,0.4); } #frmPayment .contact_privacy .contact_box .pr_box .privacy_t_2{ border-bottom:2px solid rgba(35,24,21,0.4);min-height:74px; } #frmPayment .contact_privacy .contact_box .pr_box > div:not(:last-child){ border-right:1px solid rgba(35,24,21,0.4); } #frmPayment .contact_privacy .form-row{ width:265px; margin:0 auto; float:none; } #frmPayment .contact_privacy,#frmPayment .pr_btn_box{ border-bottom:none; } #frmPayment .pr_btn_box{ margin-bottom:0; padding-bottom:0; } #frmPayment .pr_btn_box .btn{ border-radius:0; } #frmPayment .pr_btn_box .form-group{ margin:0 auto; } .custom-control-label::after{ top:5px; } #frmPayment .contact_info .form-row,#frmPayment .contact_privacy .form-row{ width:100% !important; } /* -- 상담문의 -- */ .contact #frmPayment .sortation .form-row { width:25%; } .contact #frmPayment .install_place .form-row{ width:16.6%; } .contact #frmPayment .vending_machine .form-row,.contact #frmPayment .setup_num .form-row{ width:20%; } /*.contact #frmPayment .sortation .check_box{ width:440px; } .contact #frmPayment .install_place .check_box{ width:590px; } .contact #frmPayment .vending_machine .check_box{ width:676px; } .contact #frmPayment .setup_num .check_box{ width:425px; }*/ .contact #frmPayment .contact_info textarea { min-height:250px; } /* -- 자판기 견적조회 -- */ .estimate #frmPayment .estimate_vm .form-row{ width:20%; } .estimate #frmPayment .estimate_s .form-row{ width:33.3%; } /*.estimate #frmPayment .estimate_vm .check_box{ width:676px; } .estimate #frmPayment .estimate_s .check_box{ width:270px; }*/ /* -- 공지사항 -- */ .notice .notice-table{ width:100%;border-top:2px solid #000;table-layout:fixed; } .notice .notice-table tr{ border-bottom:1px solid #eee;transition:all 0.4s; } .notice .notice-table tr th,.notice .notice-table tr td{ font-size:18px;line-height:1.2;padding:15px; } .notice .notice-table tr th:nth-child(1),.notice .notice-table tr td:nth-child(1){ width:100px; } .notice .notice-table tr th:nth-child(3),.notice .notice-table tr td:nth-child(3){ width:140px; } .notice .notice-table thead{ background:#f5f7fc; } .notice .notice-table thead th{ font-weight:700; } .notice .notice-table tr th,.notice .notice-table tbody tr td:not(:nth-child(2)){ text-align:center; } .notice .notice-table tbody tr td:nth-child(2){ cursor:pointer;white-space:nowrap;overflow: hidden;text-overflow: ellipsis;display:block;transition:all 0.4s; } .notice .notice-table tbody tr td:nth-child(3){ color:#666;font-weight:400; } .notice .notice-table tbody tr.notice-alarm td:nth-child(1){ color:var(--main-color);font-weight:700; } .notice .notice-table tbody tr:hover{ background:#f8f8f8; } .notice .notice-table tbody tr:hover td:nth-child(2){ color:var(--main-color); } /* ===== 개인정보처리방침 ===== */ .privacy .col-lg-3{ padding:0 !important; } .privacy .pr_box{ padding:0 15px; } .privacy .pr_box p{ padding:10px 15px; } .privacy .pr_box .privacy_t{ border-top:2px solid rgba(35,24,21,0.4); border-bottom:1px solid rgba(35,24,21,0.4); } .privacy .pr_box .privacy_t_2{ border-bottom:2px solid rgba(35,24,21,0.4);min-height:74px; } .privacy .pr_box > div:not(:last-child){ border-right:1px solid rgba(35,24,21,0.4); } /* ===================================== 해상도별 미디어쿼리 ===================================== */ @media all and (min-width: 992px) and (max-width: 1200px) { /* ===== font ===== */ .main_h3{ font-size:20px !important; } /* ===== main ===== */ /* -- section1 -- */ .main_section1 .main_section1_box{ padding:50px 0; } .main_section1 .text-center{ padding:0 30px; } .main_section1 .main_section1_box .main_btn{ width:85%; } /* -- main_introduction -- */ .main_introduction .counters{ padding-top:40px; } .main_introduction .main_btn{ width:32%; } /* -- main_business -- */ .main_business .feature-box .main_h3,.main_business .feature-box .main_text{ padding:15px 10px; } /* -- main_portfolio -- */ .main_portfolio .main_btn{ width:23%; } /* ===== sub ===== */ /* -- sub_visual -- */ /* .sub_visual .sub_visual_btn{ top:100px; } */ /* -- sub_ask -- */ .sub_ask .sub_ask_box:nth-child(1) .main_btn{ width:40%; } .sub_ask .sub_ask_box:nth-child(2) .main_btn{ width:48%; } /* -- 회사소개 -- */ /* 오시는 길 */ .about_location .root_daum_roughmap{ width:100% !important; padding:0 !important;} .about_location .location_info{ padding-top:65px; } .about_location .col-6:first-child{ padding-right:0; } .about_location .col-6:last-child{ padding-left:0; } .about_location .col-6:first-child a{ margin-right:5px; } .about_location .col-6:last-child a{ margin-left:5px; } .about_location .location_info .location_btn{ padding:10px 25px; } /* -- 자판기 창업/ 중고매입 -- */ .startups_place p{ width:70%; } } @media (max-width: 991px){ /* ===== header ===== */ #header .header-btn-collapse-nav i{ font-size:24px; color:#12467d; } #header .dropdown .dropdown-menu .dropdown-item{ font-size:15px; } /* ===== main ===== */ /* -- section1 -- */ .main_section1 .main_section1_box{ padding:50px 0; } .main_section1 .text-center{ padding:0 30px; } .main_section1 .main_section1_box .main_btn{ width:35%; } .main_section1 .main_section1_box > div:nth-child(2) .text-center{ margin:30px 0; padding:30px; border-top:1px solid rgba(255,255,255,0.7); border-bottom:1px solid rgba(255,255,255,0.7); } /* -- main_introduction -- */ .main_introduction .main_intro_text{ text-align:center; } .main_introduction .counters{ padding-top:0px; } /* -- main_product -- */ .main_product .portfolio-list .isotope-item:nth-child(1),.main_product .portfolio-list .isotope-item:nth-child(2){ margin-bottom:20px; } .main_product .portfolio-list .isotope-item .portfolio-item { margin-right:0 !important; } /* .main_product .portfolio-list .isotope-item:nth-child(odd) .portfolio-item{ margin-right:7.5px !important; } .main_product .portfolio-list .isotope-item:nth-child(even) .portfolio-item{ margin-left:7.5px !important; } */ /* ===== footer ===== */ #footer .footer_info .logo{ margin-bottom:40px !important; } #footer .footer_info .main_h5{ text-align:center; } #footer .footer_info ul li{ float:none;text-align:center; } #footer .footer_info ul li:not(:last-child){ margin-right:0;padding-right:0;border-right:none; } /* ===== sub ===== */ /* -- sub_visual -- */ .sub_visual .sub_visual_text{ text-align:center; } .sub_visual .sub_visual_text .main_text{ width:70%; margin:0 auto;} .sub_visual .sub_visual_btn{ justify-content:center;margin-top:40px; } /* .sub_visual .sub_visual_btn{ top:50px; } */ /* -- sub_ask -- */ .sub_ask .divider-left-border{ border-left:0; } .sub_ask .sub_ask_box:nth-child(1){ border-bottom:1px solid rgba(255,255,255,0.5); padding-bottom:30px; margin-bottom:30px;} .sub_ask .sub_ask_box:nth-child(1) .main_btn{ width:24%; } .sub_ask .sub_ask_box:nth-child(2) .main_btn{ width:30%; } /* -- 회사소개 -- */ /* 소개 */ .about_introduction .container > p:nth-of-type(3){ margin-bottom:30px !important; } .about_introduction .counters > div{ padding:30px 0; } .about_introduction .counters > div:nth-child(1),.about_introduction .counters > div:nth-child(2){ border-bottom:1px solid rgba(18,70,125,0.5); margin-bottom:0 !important; } .about_introduction .counters > div:nth-child(1),.about_introduction .counters > div:nth-child(3){ border-right:1px solid rgba(18,70,125,0.5); } /* 오시는 길 */ .about_location .root_daum_roughmap{ width:100% !important; padding:0 !important;} .about_location .location_info{ padding-top:40px; } .about_location .location_info .location_text{ text-align:center; } .about_location .location_info .location_text p:nth-of-type(1),.about_location .location_info .location_text p:nth-of-type(2){ border-bottom:1px solid rgba(18,70,125,0.5); padding-bottom:15px; margin-bottom:15px !important;} .about_location .location_info .location_btn{ padding:10px 35%; } /* -- 제품소개 -- */ /* product */ .product .portfolio-list .isotope-item:nth-child(10){ margin-bottom:30px; } /* product_search */ .product_search{ width:50%; } /* 제품소개_info */ .product .page-header .align-items-center > div:not(:nth-of-type(2)){ max-width:20% !important; } .product .page-header .align-items-center > div:nth-of-type(2){ max-width:80% !important; } .product .page-header .portfolio-next h4{ position:relative; right:20px; } /* -- 자판기 위탁운영 -- */ .operation .operation_info > div:first-child{ margin-bottom:30px; } /* -- 운영사례 -- */ .operation_case .page-header .align-items-center > div:not(:nth-of-type(2)){ max-width:20% !important; } .operation_case .page-header .align-items-center > div:nth-of-type(2){ max-width:80% !important; } .operation_case .page-header .portfolio-next h4{ position:relative; right:20px; } /* -- 고객문의 -- */ #frmPayment .contact_privacy{ padding-bottom:0 !important; } #frmPayment .contact_privacy .contact_box{ height:185px; } #frmPayment .contact_privacy .pr_box > div:nth-child(1),#frmPayment .contact_privacy .pr_box > div:nth-child(2){ margin-bottom:15px; } #frmPayment .contact_privacy .pr_box > div:nth-child(2){ border-right:0 !important; } /* -- 개인정보처리방침 -- */ .privacy .pr_box > div:nth-child(1),.privacy .pr_box > div:nth-child(2){ margin-bottom:15px; } .privacy .pr_box > div:nth-child(2){ border-right:0 !important; } } @media all and (min-width: 768px) and (max-width: 991px) { /* ===== main ===== */ /* -- main_introduction -- */ .main_introduction .main_btn{ width:24%; margin:0 auto; text-align:left; } .main_introduction label{ margin-bottom:0; } .main_introduction .counters > div{ padding:30px 0; } .main_introduction .counters > div:nth-child(1),.main_introduction .counters > div:nth-child(2){ border-bottom:1px solid rgba(18,70,125,0.5); margin-bottom:0 !important;} .main_introduction .counters > div:nth-child(1),.main_introduction .counters > div:nth-child(3){ border-right:1px solid rgba(18,70,125,0.5); } /* -- main_business -- */ .main_business .feature-box .main_h3,.main_business .feature-box .main_text{ padding:15px 10px; } .main_business div.row > div:nth-child(even) .feature-box{ margin-left:7px; margin-right:0; } .main_business div.row > div:nth-child(odd) .feature-box{ margin-left:0; margin-right:7px; } /* ===== main_portfolio ===== */ .main_portfolio .main_btn{ width:32%; } /* ===== sub ===== */ /* -- 자판기 위탁운영 -- */ .operation .op_info .op_img_box{ width:80%; } /* -- 자판기 창업/ 중고매입 -- */ .startups_place p{ width:80%; } } @media (max-width: 767px){ .col-xs-6{ float:left !important; width:50% !important; } .container{ max-width: 100% !important; padding-left:15px; padding-right:15px; } /* ===== footer ===== */ #footer .footer_info .logo{ margin-bottom:40px !important; } #footer .footer_info .main_h5{ text-align:center; } /* #footer .footer_info ul{ height:110px; } */ /* #footer .footer_info ul li{ list-style:none; float:none; height:20px; } */ #footer .footer_info ul li:not(:last-child){ margin-right:0; padding-right:0; border-right:0; margin-bottom:10px;} #footer .footer-copyright .col-md-8{ margin-bottom:10px; } /* ===== sub ===== */ /* -- 고객문의 -- */ /* 공통 */ #frmPayment .form-row .custom-control{ text-align:left; } .form-row>.col, .form-row>[class*=col-]{ padding:0 10px; } } @media all and (min-width: 576px) and (max-width: 767px) { /* ===== main ===== */ /* -- main_introduction -- */ .main_introduction .counters{ padding:0 15px !important; } .main_introduction .counters > div{ padding:30px 0; } .main_introduction .counters > div:nth-child(1),.main_introduction .counters > div:nth-child(2){ border-bottom:1px solid rgba(18,70,125,0.5); margin-bottom:0 !important;} .main_introduction .counters > div:nth-child(1),.main_introduction .counters > div:nth-child(3){ border-right:1px solid rgba(18,70,125,0.5); } /* -- main_business -- */ .main_business .feature-box .main_h3{ font-size:17px !important; } .main_business div.row > div:nth-child(even) .feature-box{ margin-left:7px; margin-right:0; } .main_business div.row > div:nth-child(odd) .feature-box{ margin-left:0; margin-right:7px; } /* ===== sub ===== */ /* -- 회사소개 -- */ /* 소개 */ .about_introduction .counters{ padding:0 15px !important; } .about_introduction .container > p:nth-of-type(3){ margin-bottom:30px !important; } .about_introduction .counters > div{ padding:30px 0; } .about_introduction .counters > div:nth-child(1),.about_introduction .counters > div:nth-child(2){ border-bottom:1px solid rgba(18,70,125,0.5); margin-bottom:0 !important; } .about_introduction .counters > div:nth-child(1),.about_introduction .counters > div:nth-child(3){ border-right:1px solid rgba(18,70,125,0.5); } } @media all and (min-width: 548px) and (max-width: 767px) { /* ===== font ===== */ .main_h2{ font-size:30px !important; line-height:40px !important; } .main_h3{ font-size:20px !important; line-height:34px !important; } .main_h4,.main_text{ font-size:16px !important; line-height:28px !important; } .main_h5{ font-size:14px !important; line-height:24px !important; } /* ===== header ===== */ #header .header-btn-collapse-nav i{ font-size:24px; color:#12467d; } #header .header-nav-main nav > ul li a{ font-size:16px !important; } #header .dropdown .dropdown-menu .dropdown-item{ font-size:14px !important; } /* ===== main ===== */ /* -- section1 -- */ .main_section1 .main_section1_box{ width:100%; margin:0 auto; } /* -- main_introduction -- */ .main_introduction .main_btn{ width:170px; margin:0 auto; } .main_introduction label{ margin-bottom:0; } .main_introduction .main_intro_text{ margin-bottom:30px !important; } /* ===== main_product ===== */ .main_product .isotope-item2 > div:first-child .thumb-info{ border-bottom-right-radius:110px; margin-bottom:10px; } .main_product .isotope-item2 > div:first-child .thumb-info, .main_product .isotope-item2 > div:first-child .thumb-info-wrapper{ height:400px; } /* ===== main_portfolio ===== */ .main_portfolio .main_btn{ width:210px; } /* ===== sub ===== */ /* -- sub_ask -- */ .sub_ask .divider-left-border{ border-left:0; } .sub_ask .sub_ask_box:nth-child(1){ border-bottom:1px solid rgba(255,255,255,0.5); padding-bottom:30px; margin-bottom:30px;} .sub_ask .sub_ask_box:nth-child(1) .main_btn{ width:145px; } .sub_ask .sub_ask_box:nth-child(2) .main_btn{ width:180px; } /* -- 제품소개 -- */ /* product */ .product .portfolio-list .isotope-item:nth-child(10){ margin-bottom:30px; } /* product_search */ .product_search{ width:50%; } /* 제품소개_info */ .product .page-header .align-items-center > div:not(:nth-of-type(2)){ max-width:20% !important; } .product .page-header .align-items-center > div:nth-of-type(2){ max-width:80% !important; } .product .page-header .portfolio-next h4{ position:relative; right:20px; } /* -- 자판기 위탁운영 -- */ .operation .op_info .op_img_box{ width:100%; } .operation .operation_info > div:first-child{ margin-bottom:30px; } /* -- 자판기 창업/ 중고매입 -- */ .startups .startups_place{ padding:0 15px !important; } .startups .startups_place > div:first-child{ margin-bottom:30px; padding-bottom:30px; border-bottom :1px solid rgba(18,70,125,0.5); } /* -- 운영사례 -- */ .operation_case .page-header .align-items-center > div:not(:nth-of-type(2)){ max-width:20% !important; } .operation_case .page-header .align-items-center > div:nth-of-type(2){ max-width:80% !important; } .operation_case .page-header .portfolio-next h4{ position:relative; right:20px; } /* -- 고객문의 -- */ /* 공통 */ #frmPayment .check_box{ width:100% !important; height:auto !important;} /* 상담문의 .contact #frmPayment .sortation .form-row{ width:22%; } .contact #frmPayment .sortation .form-row:not(:last-child){ margin-right:4%;} .contact #frmPayment .install_place .form-row{ width:15%; } .contact #frmPayment .install_place .form-row:not(:last-child){ margin-right:2%;} .contact #frmPayment .vending_machine .form-row{ width:30%; } .contact #frmPayment .vending_machine .form-row:not(:last-child){ margin-right:3.333%; } .contact #frmPayment .setup_num .form-row{ width:18%; } .contact #frmPayment .setup_num .form-row:not(:last-child){ margin-right:2.5%;} /* 자판기 견적조회 .estimate #frmPayment .estimate_vm{ height:130px; } .estimate #frmPayment .estimate_vm .form-row{ width:30%; } .estimate #frmPayment .estimate_vm .form-row:not(:last-child){ margin-right:3.333%; } .estimate #frmPayment .estimate_s .form-row{ width:30%; } .estimate #frmPayment .estimate_s .form-row:not(:last-child){ margin-right:3.333%; } /* -- 상담문의 -- */ .contact #frmPayment .sortation{ height:105px; } .contact #frmPayment .sortation .form-row { width:25%; } .contact #frmPayment .install_place .form-row{ width:16.6%; } .contact #frmPayment .vending_machine .form-row{ width:33.3%; } .contact #frmPayment .setup_num .form-row{ width:20%; } /*.contact #frmPayment .sortation .check_box{ width:440px; } .contact #frmPayment .install_place .check_box{ width:590px; } .contact #frmPayment .vending_machine .check_box{ width:676px; } .contact #frmPayment .setup_num .check_box{ width:425px; }*/ .contact #frmPayment .contact_info textarea { min-height:250px; } /* -- 자판기 견적조회 -- */ .estimate #frmPayment .estimate_vm{ height:135px; } .estimate #frmPayment .estimate_vm .form-row,.estimate #frmPayment .estimate_s .form-row{ width:33.3%; } /*.estimate #frmPayment .estimate_vm .check_box{ width:676px; } .estimate #frmPayment .estimate_s .check_box{ width:270px; }*/ } @media all and (min-width: 548px) and (max-width: 625px) { /* ===== sub ===== */ /* -- tab -- */ .product .nav-pills .nav-item{ width:33.3333333333%; } .product .nav-pills .nav-link{ text-align:center; } } @media all and (min-width: 548px) and (max-width: 575px) { /* ===== main ===== */ /* -- main_introduction -- */ .main_introduction label{ margin-bottom:0; } .main_introduction .main_intro_text{ margin-bottom:30px !important; } .main_introduction .counters{ padding:0 15px !important; } .main_introduction .counters > div{ padding:30px 0; } .main_introduction .counters > div:not(:last-child){ border-bottom:1px solid rgba(18,70,125,0.5); margin-bottom:0 !important; } .main_introduction .counters > div:nth-child(1),.main_introduction .counters > div:nth-child(3){ border-right:0; } .main_introduction .counters > div:last-child{ padding-bottom:0; } /* ===== main_business ===== */ .main_business .feature-box .main_h3,.main_business .feature-box .main_text{ padding:15px 10px; } .main_business .feature-box .feature-box-info{ padding-left:0; } .main_business div.row > div:nth-child(2) .feature-box,.main_business div.row > div:nth-child(5) .feature-box{ margin:0; } .main_business div.row > div:not(:last-child){ margin-bottom:15px; } /* ===== main_product ===== */ .main_product .isotope-item2 > div:first-child .thumb-info{ border-bottom-right-radius:110px; margin-bottom:10px; } .main_product .isotope-item2 > div:first-child .thumb-info, .main_product .isotope-item2 > div:first-child .thumb-info-wrapper{ height:400px; } /* ===== sub ===== */ /* -- 회사소개 -- */ /* 소개 */ .about_introduction .counters{ padding:0 15px; } .about_introduction .counters > div{ padding:30px 0; } .about_introduction .counters > div:not(:last-child){ border-bottom:1px solid rgba(18,70,125,0.5); margin-bottom:0 !important; } .about_introduction .counters > div:nth-child(1),.about_introduction .counters > div:nth-child(3){ border-right:0; } .about_introduction .counters > div:last-child{ padding-bottom:0; } /* 오시는 길 */ .about_location .location_info .location_btn{ padding:10px 80px; } /* -- 고객문의 -- */ /* 자판기 견적조회 */ .estimate .contact_info .form-row > div{ width:50% !important; } } @media (max-width: 547px){ /* ===== font ===== */ .main_h2{ font-size:28px !important; line-height:40px !important; } .main_h3{ font-size:18px !important; line-height:34px !important; } .main_h4,.main_text{ font-size:15px !important; line-height:28px !important; } .main_h5{ font-size:13px !important; line-height:24px !important; } /* ===== header ===== */ #header .header-nav-main nav > ul li a{ font-size:15px !important; } #header .dropdown .dropdown-menu .dropdown-item{ font-size:13px !important; } /* ===== main ===== */ /* -- section1 -- */ .main_section1 .main_section1_box{ width:100%; margin:0 auto; } .main_section1 .main_section1_box .main_btn{ width:80%; } /* -- main_introduction -- */ .main_introduction label{ margin-bottom:0; } .main_introduction .main_intro_text{ margin-bottom:30px !important; } .main_introduction .counters{ padding:0 15px !important; } .main_introduction .counters > div{ padding:30px 0; } .main_introduction .counters > div:not(:last-child){ border-bottom:1px solid rgba(18,70,125,0.5); margin-bottom:0 !important; } .main_introduction .counters > div:nth-child(1),.main_introduction .counters > div:nth-child(3){ border-right:0; } .main_introduction .counters > div:last-child{ padding-bottom:0; } /* ===== main_business ===== */ .main_business .feature-box .main_h3,.main_business .feature-box .main_text{ padding:15px 30px; } .main_business .feature-box .feature-box-info{ padding-left:0; } .main_business div.row > div:nth-child(2) .feature-box,.main_business div.row > div:nth-child(5) .feature-box{ margin:0; } .main_business div.row > div:not(:last-child){ margin-bottom:15px; } /* ===== main_portfolio ===== */ .main_portfolio .main_btn{ width:210px; } /* ===== sub ===== */ /* -- sub_visual -- */ /* .sub_visual .sub_visual_text{ top:15px; text-align:center; } .sub_visual .sub_visual_text .main_text{ width:100%; } .sub_visual .sub_visual_btn{ top:50px; } */ /* -- sub_ask -- */ .sub_ask > div > div{ padding:0 15px !important; } .sub_ask .divider-left-border{ border-left:0; } .sub_ask .sub_ask_box:nth-child(1){ border-bottom:1px solid rgba(255,255,255,0.5); padding-bottom:30px; margin-bottom:30px;} .sub_ask .sub_ask_box:nth-child(1) .main_btn{ width:145px; } .sub_ask .sub_ask_box:nth-child(2) .main_btn{ width:180px; } /* -- 회사소개 -- */ /* 소개 */ .about_introduction .counters{ padding:0 15px; } .about_introduction .counters > div{ padding:20px 0; } .about_introduction .counters > div:not(:last-child){ border-bottom:1px solid rgba(18,70,125,0.5); margin-bottom:0 !important; } .about_introduction .counters > div:nth-child(1),.about_introduction .counters > div:nth-child(3){ border-right:0; } .about_introduction .counters > div:last-child{ padding-bottom:0; } /* -- 제품소개 -- */ /* product */ .product .portfolio-list > div { max-width:100% !important; flex:100% !important; } .product .portfolio-list .isotope-item:not(:last-child){ margin-bottom:30px; } /* product_search */ .product_search{ width:100%; } /* 제품소개_info */ .product .page-header .align-items-center > div:not(:nth-of-type(2)){ max-width:15% !important; } .product .page-header .align-items-center > div:nth-of-type(2){ max-width:85% !important; } .product .page-header .portfolio-next h4{ position:relative; right:20px; } .product .owl-carousel { margin-bottom:40px !important; } .product .product_text{ margin-top:40px !important; } .product .product_text .text_box{ min-height:350px; } /* -- 자판기 위탁운영 -- */ .operation .op_info .op_img_box{ width:100% !important; } .operation .operation_info > div:first-child{ margin-bottom:30px; } /* -- 자판기 창업/ 중고매입 -- */ .startups .startups_info .list-icons,.startups .startups_info{ margin-bottom:40px !important; } .startups .startups_place{ padding:0 15px !important; } .startups .startups_place > div:first-child{ margin-bottom:30px; padding-bottom:30px; border-bottom :1px solid rgba(18,70,125,0.5); } .startups .startups_place p{ width:100% !important; } /* -- 운영사례 -- */ .operation_case .portfolio-list > div { max-width:100% !important; flex:100% !important; } .operation_case .portfolio-list .isotope-item:not(:last-child){ margin-bottom:30px; } .operation_case .page-header .align-items-center > div:not(:nth-of-type(2)){ max-width:20% !important; } .operation_case .page-header .align-items-center > div:nth-of-type(2){ max-width:80% !important; } .operation_case .page-header .portfolio-next h4{ position:relative; right:20px; } .operation_case .owl-carousel { margin-bottom:40px !important; } .operation_case .product_text{ margin-top:40px !important; } .operation_case .product_text .text_box{ min-height:350px; } /* -- 고객문의 -- */ /* 공통 */ #frmPayment .check_box{ width:100% !important; height:auto !important; } /* 상담문의 */ #frmPayment .form-row{ width:47.5% !important; margin-right:0 !important; } #frmPayment .form-row:not(:nth-child(odd)){ margin-right:5% !important; } .contact #frmPayment .sortation{ height:135px; } .estimate #frmPayment .estimate_vm{ height:160px; } /*.contact #frmPayment .contact_info .form-row,.estimate #frmPayment .contact_privacy .form-row{ width: 100% !important; } */ } @media all and (min-width: 421px) and (max-width: 547px){ /* ===== main ===== */ /* -- main_introduction -- */ .main_introduction p.main_text{ width:73%; margin:0 auto; } .main_introduction .main_btn{ width:170px; margin:0 auto; } /* ===== main_product ===== */ .main_product .isotope-item2 > div:first-child .thumb-info{ border-bottom-right-radius:110px; margin-bottom:10px; } .main_product .isotope-item2 > div:first-child .thumb-info, .main_product .isotope-item2 > div:first-child .thumb-info-wrapper{ height:385px; } /* ===== sub ===== */ /* -- 제품소개 -- */ /* -- tab -- */ .product .nav-pills .nav-item{ width:33.3333333333%; } .product .nav-pills .nav-link{ text-align:center; } } @media all and (min-width: 320px) and (max-width: 420px){ /* ===== main ===== */ /* -- main_introduction -- */ .main_introduction p.main_text{ width:73%; margin:0 auto; } .main_introduction .main_btn{ width:170px; margin:0 auto; } /* ===== main_product ===== */ .main_product .isotope-item2 > div:first-child .thumb-info{ border-bottom-right-radius:65px; margin-bottom:10px; } .main_product .isotope-item2 > div:first-child .thumb-info, .main_product .isotope-item2 > div:first-child .thumb-info-wrapper{ height:280px; } /* ===== sub ===== */ /* -- sub_visual -- .sub_visual .sub_visual_text{ top:30px; } .sub_visual .sub_visual_btn{ top:50px; } .sub_visual .sub_visual_btn > div > div{ max-width:100% !important; flex:100%;} .sub_visual .sub_visual_btn > div > div:first-child{ margin-bottom:15px; } */ /* -- 제품소개 -- */ /* -- tab -- */ .product .nav-pills .nav-item{ width:50%; } .product .nav-pills .nav-link{ text-align:center; } } @media all and (min-width: 381px) and (max-width: 420px){ /* ===== sub ===== */ /* -- 회사소개 -- */ /* 오시는 길 */ .about_location .location_info .location_btn{ padding:10px 45px; } } @media all and (min-width: 340px) and (max-width: 380px){ /* ===== sub ===== */ /* -- 회사소개 -- */ /* 오시는 길 */ .about_location .location_info .location_btn{ padding:10px 35px; } } @media all and (min-width: 320px) and (max-width: 339px){ /* ===== sub ===== */ /* 오시는 길 */ .about_location .location_info .location_btn{ padding:10px 30px; } } @media all and (min-width: 320px) and (max-width: 371px){ /* ===== sub ===== */ /* -- 개인정보처리방침 -- */ .privacy .pr_box > div:nth-child(1) .privacy_t_2,.privacy .pr_box > div:nth-child(2) .privacy_t_2{ height:75px; } .privacy .pr_box > div:nth-child(2){ border-right:0 !important; } } /* header */ @media (max-width:991px){ #header .header-btn-collapse-nav i{ color:#fff; } html.sticky-header-active #header .header-btn-collapse-nav i, html.mobile-menu-opened #header .header-btn-collapse-nav i{ color:#12467d; } html.mobile-menu-opened #header.header-transparent:not(.header-semi-transparent) .header-body{ background:#fff !important; } html.mobile-menu-opened #header .header-logo a img.logo-w{ opacity: 0;visibility: hidden;pointer-events: none; } html.mobile-menu-opened #header .header-logo a img.logo-b{ opacity: 1;visibility: visible;pointer-events: auto; } } /* main-visual */ @media (max-width:1439px){ .main-visual .negative-ls-2{ text-align:center !important;width:1000px !important;white-space:normal !important;line-height:1.3 !important;margin-top:-50px !important; } } @media (max-width:1199px){ .main-visual{ height:auto; } .main-visual .forcefullwidth_wrapper_tp_banner, .main-visual .tp-fullwidth-forcer{ height:700px !important; } .main-text-wrap{ position:relative;bottom:0;margin-top:-140px; } .main-visual .negative-ls-2{ width:900px !important;margin-top:-120px !important; } } @media (max-width:991px){ .main-text-row{ padding:40px 0; } .main-text-wrap .main-text-row > div:not(:last-child){ margin-bottom:30px;padding-bottom:30px;border-bottom:1px solid rgba(255,255,255,0.2); } .divider-left-border{ border:none; } .main-text-row h3{ margin-bottom:20px; } .main-text-row > div:nth-child(1) p{ margin-top:0; } .main-text-row > div:nth-child(2) p{ margin-bottom:0; } .main-visual .negative-ls-2{ width:690px !important;margin-top:-100px !important;font-size:48px !important; } } @media (max-width:767px){ .main-visual .visual_text{ font-size:18px !important;line-height:1.4 !important; } .main-text-row h5{ font-size:15px; } .main-text-row h3{ font-size:28px; } .main-text-row p{ font-size:17px; } .main-text-row h4{ font-size:24px;line-height:1.2; } .main-visual .negative-ls-2{ width:600px !important;margin-top:-100px !important;font-size:38px !important; } } @media (max-width:640px){ .main-visual .visual_text{ font-size:16px !important; } .main-text-row h5{ font-size:14px; } .main-text-row h3{ font-size:24px; } .main-text-row p{ font-size:16px; } .main-text-row h4{ font-size:20px; } .main-visual .negative-ls-2{ width:540px !important;margin-top:-100px !important;font-size:32px !important; } } @media (max-width:575px){ .main-visual .negative-ls-2{ width:420px !important;margin-top:-90px !important; } } @media (max-width:480px){ .main-text-row br{ display:none; } .main-visual .negative-ls-2{ width:340px !important;margin-top:-120px !important;font-size:30px !important; } } @media (max-width:380px){ .main-visual .visual_text{ font-size:15px !important; } .main-visual .negative-ls-2{ width:250px !important;margin-top:-110px !important;font-size:28px !important; } } @media (max-height:840px){ .main-visual{ height:auto; } .main-visual .forcefullwidth_wrapper_tp_banner, .main-visual .tp-fullwidth-forcer{ height:700px !important; } .main-text-wrap{ position:relative;bottom:0;margin-top:-140px; } } /* main-intro */ .main-intro{ padding-top:100px; } .main-intro .img-bx{ border-radius:20px;overflow:hidden; } .main-intro .common-btn{ margin:40px auto 0; } @media (min-width:992px) and (max-width:1199px){ .main-intro{ padding-top:150px; } } @media (max-width:991px){ .main-intro .img-bx{ position:relative;padding-bottom:70%; } .main-intro .img-bx img{ display:block;position:absolute;width:100%;height:100%;left:50%;top:50%;transform:translate(-50%,-50%);object-fit:cover;object-position:center center; } } @media (max-width:575px){ .main-intro br{ display:none; } } @media (max-width:640px){ .main-intro .img-bx{ padding-bottom:60%; } .main-intro .img-bx img{ object-position:center 40%; } } @media (max-width:480px){ .main-intro .common-btn{ margin:20px auto 0; } } @media (max-width:380px){ .main-intro{ padding-top:80px; } } /* thumb-info */ @media (max-width:991px){ .thumb-info{ border:1px solid #eee !important; } .thumb-info.thumb-info-centered-info:hover .thumb-info-title, .thumb-info.thumb-info-centered-info .thumb-info-title{ position:relative;left:0;width:100%;top:0;opacity:1;transform:translate(0,0); } .thumb-info:hover img{ -webkit-transform: scale(1); transform: scale(1); } .thumb-info .thumb-info-wrapper:after{ display:none; } .thumb-info .thumb-info-inner{ color:#000;font-size:20px !important;margin-top:10px;padding:0 20px;line-height:1.4 !important; } .thumb-info.thumb-info-centered-info .thumb-info-type{ color:var(--main-color);text-align:center;display:block;margin-bottom:10px; } .thumb-info .thumb-info-title{ max-width:100%; } } @media (max-width:480px){ .thumb-info .thumb-info-inner{ font-size:18px !important;line-height:1.1 !important; } } /* main_product */ @media (max-width:1439px){ .main_product .portfolio-list > div{ padding:0 10px; } .main_product .portfolio-list > div:nth-child(1), .main_product .portfolio-list > div:nth-child(2), .main_product .portfolio-list > div:nth-child(3){ margin-bottom:20px; } } @media (max-width:991px){ .main_product .portfolio-item .thumb-info{ border:none !important;background:transparent !important; } .main_product .portfolio-item .thumb-info .thumb-info-title{ position:absolute;width:100%;height:100%;left:0;bottom:0; background: rgb(0,0,0); background: -moz-linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,0.8) 100%); background: -webkit-linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,0.8) 100%); background: linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,0.8) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);display:flex;flex-wrap:wrap;align-items:end; } .main_product .portfolio-item .thumb-info .thumb-info-title .thumb-info-inner{ color:#fff;margin-bottom:20px;padding-left:14px;position:relative;margin-left:20px; text-align:left; } .main_product .portfolio-item .thumb-info .thumb-info-title .thumb-info-inner:before{ content:"";position:absolute;width:3px;height:75%;left:0;top:50%; transform:translateY(-50%);background:#fff;border-radius:10px; } } @media (max-width:767px){ .main_product .portfolio-list > div{ margin:0; } } @media (max-width:640px){ .main_product .portfolio-list{ justify-content:start; } .main_product .portfolio-list > div{ width:50%; } } @media (max-width:480px){ .main_product .portfolio-item .thumb-info .thumb-info-title .thumb-info-inner:before{ height: 95%;top:0;transform:translateY(0); } } @media (max-width:419px){ .main_product .portfolio-item .thumb-info .thumb-info-title .thumb-info-inner{ margin-left:14px;padding-left:10px; } .main_product .portfolio-item .thumb-info .thumb-info-title .thumb-info-inner:before{ top:-1px;width:2px; } } /* .main_portfolio */ @media (max-width:991px){ .main_portfolio .thumb-info-title{ display:none; } .main_portfolio .owl-carousel.show-nav-hover:hover .owl-nav, .main_portfolio .owl-carousel.show-nav-hover .owl-nav{ opacity:1; } } @media (max-width:767px){ .main_portfolio .common-btn{ width:230px;padding:0 34px; } .main_portfolio .common-btn:hover{ padding:0 28px; } } @media (max-width:480px){ .main_portfolio .common-btn{ width:200px;padding:0 24px;height:50px; } .main_portfolio .common-btn:hover{ padding:0 18px; } } /* sub_visual */ .sub_visual{ background:none;position:relative;overflow:hidden; } .sub_visual picture, .sub_visual picture img{ position:absolute;width:100%;height:100%;left:50%;top:50%;transform:translate(-50%,-50%);object-fit:cover;object-position:center center; } @media (max-width:1199px){ .sub_visual .sub_visual_text .main_text{ width:80%; } } @media (max-width:767px){ .sub_visual .sub_visual_btn .sub_btn{ width:160px; } html .sub_visual.overlay-color-dark:not(.no-skin):before { background-color: rgba(0,0,0,0.5) !important; } } @media (max-width:640px){ .sub_visual .sub_visual_btn{ margin-top:30px; } } /* about_introduction */ @media (max-width:991px){ .about_introduction .container > p:nth-of-type(2) br{ display:none; } } @media (max-width:710px){ .about_introduction .container > p:nth-of-type(3) br:nth-child(1){ display:none; } } @media (max-width:640px){ .about_introduction .container > p:nth-of-type(1) br:nth-child(2){ display:none; } } /* about_history */ @media (min-width:768px) and (max-width:991px){ .about_history .timeline .timeline-box{ padding-bottom:40px; } .about_history .timeline .timeline-box:first-child{ padding-top:40px; } .about_history .timeline .timeline-box:nth-child(odd){ padding-right:30px; } .about_history .timeline .timeline-box:nth-child(even){ padding-left:30px; } .about_history .timeline .timeline-box .portfolio-item{ padding:30px; } .about_history .timeline .timeline-box:nth-child(odd) .portfolio-item:after { left: calc( 100% + 27px ); } .about_history .timeline .timeline-box:nth-child(even) .portfolio-item:after { left: -35px; } .about_history .timeline .timeline-box .portfolio-item:before{ width:30px; } .about_history .timeline .timeline-box:nth-child(even) .portfolio-item:before{ left:-30px; } } @media (max-width:767px){ .about_history .timeline .timeline-body:before{ left:10px;transform:translateX(0); } .about_history .timeline .timeline-box{ width:100%;padding-bottom:40px; } .about_history .timeline .timeline-box:first-child{ padding-top:40px; } .about_history .timeline .timeline-box:nth-child(odd), .about_history .timeline .timeline-box:nth-child(even){ padding-right:0;padding-left:40px; } .about_history .timeline .timeline-box:nth-child(odd) .portfolio-item:before{ left:-30px;width:30px; } .about_history .timeline .timeline-box:nth-child(odd) .portfolio-item:after, .about_history .timeline .timeline-box:nth-child(even) .portfolio-item:after{ left:-33px; } .about_history .timeline .timeline-box:nth-child(even){ margin-left:0; } .about_history .timeline .timeline-box .portfolio-item{ padding:30px; } } @media (max-width:480px){ .about_history .timeline .timeline-box{ padding-bottom:30px; } .about_history .timeline .timeline-box .portfolio-item{ padding:30px 20px; } } /* about_certi */ @media (max-width:991px){ .about_certi .row > div:nth-child(1),.about_certi .row > div:nth-child(2){ margin-bottom:20px; } } @media (max-width:480px){ .about_certi .row > div:nth-child(1),.about_certi .row > div:nth-child(2){ margin-bottom:16px; } } /* store */ @media (max-width:991px){ .store .row > div:not(:last-child){ margin-bottom:20px; } } @media (max-width:767px){ .store .op_img{ width:50%;margin-left:auto;margin-right:auto; } .store br{ display:none; } } @media (max-width:575px){ .store .op_img{ width:70%; } } @media (max-width:480px){ .store .op_img{ width:90%; } .store .op_info .common-btn{ height:50px;width:270px; } } @media (max-width:380px){ .store .op_info .common-btn{ width:100%; } } /* maintenance */ @media (max-width:991px){ .maintenance .maintenance-bx .row > div:not(:last-child){ margin-bottom:20px; } } /* operation_case */ @media (max-width:991px){ .operation_case .portfolio-list .portfolio-item{ height:100%;border-radius:20px;border:1px solid #eee;overflow:hidden; } .operation_case .portfolio-list .portfolio-item .thumb-info{ border:none !important; } .operation_case .portfolio-list .portfolio-item a .thumb-info-wrapper{ padding-bottom:0; } .operation_case .portfolio-list .portfolio-item .img-fluid{ position:relative;left:0;top:0;transform:translate(0,0) scale(1); } .operation_case .portfolio-list .portfolio-item:hover .img-fluid{ transform:translate(0,0) scale(1); } } /* notice */ @media (max-width:991px){ .notice .notice-table tr th:nth-child(1), .notice .notice-table tr td:nth-child(1){ padding:15px 10px;width:70px; } .notice .notice-table tr th:nth-child(3), .notice .notice-table tr td:nth-child(3){ padding:15px 10px;width:120px; } } @media (max-width:640px){ .notice .notice-table,.notice .notice-table tbody{ display:block; } .notice .notice-table thead{ display:none; } .notice .notice-table tr{ display:flex;flex-wrap:wrap;align-content:center;padding:30px 20px; } .notice .notice-table tr td{ width:100% !important;padding:0 !important;text-align:left !important; } .notice .notice-table tr td:nth-child(1){ font-size:17px !important;line-height:1 !important;margin-bottom:6px; } .notice .notice-table tr td:nth-child(2){ font-size:21px !important;margin-bottom:20px;font-weight:500;color:#000; } .notice .notice-table tr td:nth-child(3){ font-size:15px !important;line-height:1 !important; } } @media (max-width:480px){ .notice .notice-table tr{ padding:26px 20px; } .notice .notice-table tr td:nth-child(1){ font-size:16px !important; } .notice .notice-table tr td:nth-child(2){ font-size:20px !important;margin-bottom:10px; } .notice .notice-table tr td:nth-child(3){ font-size:14px !important; } } /* privacy */ @media (max-width:991px){ #frmPayment .contact_privacy .contact_box .pr_box > div, .privacy .pr_box > div{ border-bottom:2px solid rgba(35,24,21,0.4); } #frmPayment .contact_privacy .contact_box .pr_box .privacy_t_2, .privacy .pr_box .privacy_t_2{ min-height:auto;border-bottom:none;height:auto !important; } } @media (max-width:767px){ .privacy ul{ padding-left:30px; } } @media (max-width:480px){ #frmPayment .contact_privacy .contact_box .pr_box > div,.privacy .pr_box > div{ width:100% !important;-ms-flex: 0 0 100%;flex: 0 0 100%;max-width:100%; } #frmPayment .contact_privacy .contact_box .pr_box > div:not(:last-child), .privacy .pr_box > div:not(:last-child){ margin-bottom:10px !important;border-right:none; } .privacy ul{ padding-left:19px; } }