/* 숨기기 공통 css */ .hide { opacity: 0; } #subP #content_wrap { padding: 100px 0; } /* 상단 고정 탑메뉴 */ #topmenu { padding: 0 50px; display: flex; justify-content: space-between; background-color: rgba(51,51,51,0.6); height: 100px; flex-wrap: nowrap; vertical-align: middle; align-items: center; z-index: 80; } #topmenu h1 { position: initial; margin: 0; } #topmenu h1 a { display: block; } #topmenu h1 a img { width: 100%; height: auto; } #topmenu.scroll_htop { background-color: rgba(0,0,0,0.6); border: 0; } #topmenu.scroll_htop .main_menu .depth02 { background-color: rgba(0,0,0,0.6); border: 0; } #topmenu .main_menu { position: initial; float: right; display: block; box-sizing: initial; display: flex; align-items: center; } #topmenu .main_menu .top_menubar { cursor: pointer; margin-left: 20px; } #topmenu .main_menu .depth01 { display: flex; } #topmenu .main_menu .depth01 > li { min-width: 155px; position: relative; } #topmenu .main_menu .depth01 > li > a { line-height: 100px; padding: 0 20px; font-size: 18px; color: #fff; text-decoration: none; display: block; transition: 0.2s; } #topmenu .main_menu .depth01 > li:hover > a { opacity: 0.5; } #topmenu .main_menu .depth01 > li:hover .depth02 > li { height: 40px; } #topmenu .main_menu .depth02 { position: absolute; width: 100%; top: 100%; left: 0; background-color: rgba(51, 51, 51, 0.6); } #topmenu .main_menu .depth02 > li { width: 100%; display: block; transition: 0.2s; height:0; overflow: hidden; } #topmenu .main_menu .depth02 > li > a { display: block; line-height: 40px; color: #fff; text-decoration: none; font-size: 13px; transition: 0.2s; } #topmenu .main_menu .depth02 > li:hover > a { opacity: 0.5; } /* 상단 고정 탑메뉴 */ #topmenu2 { padding: 0 50px; display: flex; justify-content: space-between; height: 100px; flex-wrap: nowrap; vertical-align: middle; align-items: center; z-index: 80; background-color: rgba(51,51,51,0.6); } #topmenu2 h1 { position: initial; margin: 0; } #topmenu2 h1 a { display: block; } #topmenu2 h1 a img { width: 100%; height: auto; } #topmenu2.scroll_htop { background-color: rgba(0,0,0,0.6); border: 0; } #topmenu2.scroll_htop .main_menu .depth02 { background-color: rgba(0,0,0,0.6); border: 0; } #topmenu2 .main_menu { position: initial; float: right; display: block; box-sizing: initial; display: flex; align-items: center; } #topmenu2 .main_menu .top_menubar { cursor: pointer; margin-left: 20px; } #topmenu2 .main_menu .depth01 { display: flex; } #topmenu2 .main_menu .depth01 > li { min-width: 155px; position: relative; } #topmenu2 .main_menu .depth01 > li > a { line-height: 100px; padding: 0 20px; font-size: 18px; color: #fff; text-decoration: none; display: block; transition: 0.2s; } #topmenu2 .main_menu .depth01 > li:hover > a { opacity: 0.5; } #topmenu2 .main_menu .depth01 > li:hover .depth02 > li { height: 40px; } #topmenu2 .main_menu .depth02 { position: absolute; width: 100%; top: 100%; left: 0; background-color: rgba(51, 51, 51, 0.6); } #topmenu2 .main_menu .depth02 > li { width: 100%; display: block; transition: 0.2s; height:0; overflow: hidden; } #topmenu2 .main_menu .depth02 > li > a { display: block; line-height: 40px; color: #fff; text-decoration: none; font-size: 13px; transition: 0.2s; } #topmenu2 .main_menu .depth02 > li:hover > a { opacity: 0.5; } /* 햄버거 메뉴 */ #topmenu .main_menu .top_menubar span { width: 20px; height: 2px; display: block; background-color: #fff; margin-bottom: 5px; transition: all ease 0.3s; z-index: 1000; } #topmenu .main_menu .top_menubar span:first-child { margin-top: 2px; } #topmenu .main_menu .top_menubar span:last-child { margin-bottom: 0; } #topmenu .main_menu .top_menubar:hover span:first-child { width: 15px; } #topmenu .main_menu .top_menubar:hover span:last-child { width: 15px; } /* 햄버거 메뉴 팝업 */ #menu_pop { position: fixed; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; z-index: -1;} #menu_pop.open_pop { opacity: 1; z-index: 200; } #menu_pop:after { display: block; clear: both; content: ""; } #menu_pop .left { width: 70%; height: 100%; object-fit: cover; float: left; position: relative; left: -100%; transition: all ease 0.75s; } #menu_pop .left img { width: 100%; height: 100%; object-fit: cover; } #menu_pop .right { width:30%; height: 100%; background-color: #333; padding: 120px 50px 120px; text-align: left; position: relative; float: right; right: -100%; transition: all ease 0.75s; } #menu_pop .right i { color: #fff; position: absolute; top: 40px; right: 45px; font-size: 30px; cursor: pointer; } #menu_pop .right h2 { display: block; margin-bottom: 100px; } #menu_pop .right .depth03 { } #menu_pop .right .depth03 > li { margin-bottom: 45px; } #menu_pop .right .depth03 > li.gallery_li { margin-bottom: 65px; } #menu_pop .right .depth03 > li:hover > a { opacity: 0.5; } #menu_pop .right .depth03 > li > a { display: block; font-size: 20px; color: #fff; text-decoration: none; transition: 0.2s; } #menu_pop .right .depth03 > li:hover .depth04 > li { height: 18px; } #menu_pop .right .depth04 > li { display: block; margin-top: 10px; height: 0; overflow: hidden; transition: 0.2s; padding-left: 5px; } #menu_pop .right .depth04 > li:hover > a { opacity: 0.5; } #menu_pop .right .depth04 > li > a { font-size:14px; color: #fff; text-decoration: none; transition: 0.2s; } #menu_pop .right .sns_box { position: relative; left: 0; bottom: 0; } #menu_pop .right .sns_box > a { display: inline-block; margin-right: 30px; } #menu_pop .right .sns_box > a:hover img { opacity: 0.5; } #menu_pop .right .sns_box > a > img { width: 100%; display: block; transition: 0.2s; cursor: pointer; } #menu_pop.slide_pop .left { left: 0; } #menu_pop.slide_pop .right { right: 0; } /* 햄버거 메뉴 */ #topmenu2 .main_menu .top_menubar span { width: 20px; height: 2px; display: block; background-color: #fff; margin-bottom: 5px; transition: all ease 0.3s; z-index: 1000; } #topmenu2 .main_menu .top_menubar span:first-child { margin-top: 2px; } #topmenu2 .main_menu .top_menubar span:last-child { margin-bottom: 0; } #topmenu2 .main_menu .top_menubar:hover span:first-child { width: 15px; } #topmenu2 .main_menu .top_menubar:hover span:last-child { width: 15px; } /* 햄버거 메뉴 팝업 */ #menu_pop { position: fixed; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; z-index: -1;} #menu_pop.open_pop { opacity: 1; z-index: 200; } #menu_pop:after { display: block; clear: both; content: ""; } #menu_pop .left { width: 70%; height: 100%; object-fit: cover; float: left; position: relative; left: -100%; transition: all ease 0.75s; } #menu_pop .left img { width: 100%; height: 100%; object-fit: cover; } #menu_pop .right { width:30%; height: 100%; background-color: #333; padding: 120px 50px 120px; text-align: left; position: relative; float: right; right: -100%; transition: all ease 0.75s; } #menu_pop .right i { color: #fff; position: absolute; top: 40px; right: 45px; font-size: 30px; cursor: pointer; } #menu_pop .right h2 { display: block; margin-bottom: 100px; } #menu_pop .right .depth03 { } #menu_pop .right .depth03 > li { margin-bottom: 45px; } #menu_pop .right .depth03 > li.gallery_li { margin-bottom: 65px; } #menu_pop .right .depth03 > li:hover > a { opacity: 0.5; } #menu_pop .right .depth03 > li > a { display: block; font-size: 20px; color: #fff; text-decoration: none; transition: 0.2s; } #menu_pop .right .depth03 > li:hover .depth04 > li { height: 18px; } #menu_pop .right .depth04 > li { display: block; margin-top: 10px; height: 0; overflow: hidden; transition: 0.2s; padding-left: 5px; } #menu_pop .right .depth04 > li:hover > a { opacity: 0.5; } #menu_pop .right .depth04 > li > a { font-size:14px; color: #fff; text-decoration: none; transition: 0.2s; } #menu_pop .right .sns_box { position: relative; left: 0; bottom: 0; } #menu_pop .right .sns_box > a { display: inline-block; margin-right: 30px; } #menu_pop .right .sns_box > a:hover img { opacity: 0.5; } #menu_pop .right .sns_box > a > img { width: 100%; display: block; transition: 0.2s; cursor: pointer; } #menu_pop.slide_pop .left { left: 0; } #menu_pop.slide_pop .right { right: 0; } /* 메인이미지 */ #main-image {display: flex; flex-direction: column; margin-bottom: 40px; postion: relative;} #main-image img {width: 100%; height: auto; display: block; margin-bottom: 40px;} /* 메인슬라이드 배너 */ #main_banner img { width: 100%; } #main_banner { position: relative; } #main_banner .main_tbox { position: absolute; top: 250px; left: 140px; z-index: 10; } #main_banner .main_tbox h2 { color: #fff; font-size: 80px; text-align: left; display: block; margin-top: 5px; } #main_banner .main_tbox p { color: #fff; font-size: 60px; display: block; position: relative; padding-bottom: 5px; } #main_banner .main_tbox p:after { display: block; content: ""; width: 550px; height: 2px; background-color: #fff; position: absolute; bottom: 0; left: 0; } #main_banner .swiper-button-next { color: #fff; top: auto; bottom: 20px; width: 60px; height: 60px; border-radius: 50%; border: 1px solid #fff; right: 15px; } #main_banner .swiper-button-prev { color: #fff; top: auto; bottom: 90px; width: 60px; height: 60px; border-radius: 50%; border: 1px solid #fff; left: auto; right: 15px; } #main_banner .swiper-button-next:after, #main_banner .swiper-button-prev:after { display: none; } #main_banner .swiper-button-next i, #main_banner .swiper-button-prev i { font-size: 20px; } #main_banner.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal { bottom: auto; top: 170px; left: auto; right: 30px; width: fit-content; } #main_banner .swiper-pagination-bullet { display: block; width: 2px; height: 170px; background: #fff; margin: 0; } #main_banner .swiper-horizontal>.swiper-scrollbar,#main_banner .swiper-scrollbar.swiper-scrollbar-horizontal {transform: rotateZ(90deg); width: 540px; top: 440px; bottom: auto; left: auto; right: -240px;} #main_banner .swiper-scrollbar-drag { background: #fff; } #main_banner .swiper-scrollbar { background: rgba(255,255,255,0.3); } /* 모바일슬라이드 배너 */ #mo-main_banner { display: none; height:auto;} #mo-main_banner img { width: 100%; } #mo-main_banner .swiper-wrapper{height:auto;} #mo-main_banner { position: relative; } #mo-main_banner .main_tbox { position: absolute; top: 250px; left: 140px; z-index: 10; } #mo-main_banner .main_tbox h2 { color: #fff; font-size: 80px; text-align: left; display: block; margin-top: 5px; } #mo-main_banner .main_tbox p { color: #fff; font-size: 60px; display: block; position: relative; padding-bottom: 5px; } #mo-main_banner .main_tbox p:after { display: block; content: ""; width: 550px; height: 2px; background-color: #fff; position: absolute; bottom: 0; left: 0; } #mo-main_banner .swiper-button-next { color: #fff; top: auto; bottom: 20px; width: 60px; height: 60px; border-radius: 50%; border: 1px solid #fff; right: 15px; } #mo-main_banner .swiper-button-prev { color: #fff; top: auto; bottom: 90px; width: 60px; height: 60px; border-radius: 50%; border: 1px solid #fff; left: auto; right: 15px; } #mo-main_banner .swiper-button-next:after, #mo-main_banner .swiper-button-prev:after { display: none; } #mo-main_banner .swiper-button-next i, #mo-main_banner .swiper-button-prev i { font-size: 20px; } #mo-main_banner.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal { bottom: auto; top: 170px; left: auto; right: 30px; width: fit-content; } #mo-main_banner .swiper-pagination-bullet { display: block; width: 2px; height: 170px; background: #fff; margin: 0; } #mo-main_banner .swiper-horizontal>.swiper-scrollbar,#mo-main_banner .swiper-scrollbar.swiper-scrollbar-horizontal {transform: rotateZ(90deg); width: 540px; top: 440px; bottom: auto; left: auto; right: -240px;} #mo-main_banner .swiper-scrollbar-drag { background: #fff; } #mo-main_banner .swiper-scrollbar { background: rgba(255,255,255,0.3); } /* con1 */ #con1 { display: flex; padding: 100px; position: relative; align-items: center; } #con1 .con1-left { text-align: left; margin-right: 190px; margin-bottom: 200px; } #con1 .con1-left h2 { font-size: 60px; display: block; margin-bottom: 45px; } #con1 .con1-left a { display: flex; text-decoration: none; font-size: 30px; position: relative; z-index: 5; } #con1 .con1-left a:after { position: absolute; bottom: 0; left: 0; width: 0; height: 10px; background-color: #333; display: block; content: ""; opacity: 0.2; transition: all ease 0.3s; } #con1 .con1-left a:hover:after { width: 150px; } #con1 .con1-right { display: flex; justify-content: space-between; overflow:hidden;} #con1 .con1-right .right_imgbox {position:relative;top:200px; width:45%; border-radius: 10px; overflow:hidden; margin-bottom: 100px; box-shadow: 10px 10px 10px rgba(51,51,51,0.2); transition:0.75s ease; opacity:0;} #con1 .con1-right .right_imgbox img { width: 100%; } #con1 .con1-right .left_imgbox {position:relative;top:200px; width: 45%; margin-top: 100px; border-radius: 10px; overflow:hidden; box-shadow: 10px 10px 10px rgba(51,51,51,0.2); transition:0.35s ease; opacity:0;} #con1 .con1-right .left_imgbox img { width: 100%; } #con1 .con1-right .left_imgbox.act{top:0;opacity:1;} #con1 .con1-right .right_imgbox.act{top:0;opacity:1;} /* con2 */ #con2 { padding: 100px; background-color: #dfdfdf; } #con2 .con2_box > h2 { text-align: left; font-size: 30px; color: #333; display: block; margin-bottom: 50px; } #con2 .con2_box .con2_about { display: flex; justify-content: space-between; } #con2 .con2_box .con2_about >div { width: 100%; max-width: 550px; position: relative; overflow: hidden; margin-right: 35px; } #con2 .con2_box .con2_about >div.con2_prd { margin-right: 0; } #con2 .con2_box .con2_about >div > img { width: 100%; opacity: 1; transition: 0.5s; } #con2 .con2_box .con2_about > div:hover .con2_textbox { opacity: 1; } #con2 .con2_box .con2_about > div:hover > img { transform: scale(1.1); } #con2 .con2_box .con2_about > div .con2_textbox { position: absolute; bottom: 0; left: 0; width: 100%; text-align: left; opacity: 0; transition: 0.5s; padding: 30px;; box-sizing: border-box; } #con2 .con2_box .con2_about > div .con2_textbox > h2 { color: #fff; font-size: 20px; margin-bottom: 10px; display: block; } #con2 .con2_box .con2_about > div .con2_textbox > p { color: #fff; font-size: 13px; line-height: 20px; } /* con3 */ #con3 { padding: 100px; margin-top: 100px } #con3 h2 { text-align: left; font-size: 30px; margin-bottom: 50px; display: block; } #con3 .gallery_box td > a > img { width: 100%; height: auto; margin-bottom: 10px; border-radius: 10px; overflow: hidden; transition: 0.2s; } #con3 .gallery_box td > a > img:hover { filter: grayscale(1); } /* con4 */ #con4 { background-image: url(../img/custom/middle.jpg); padding: 400px 0; background-position: center; background-size: cover; background-attachment: fixed; margin-bottom: 100px; } #con4 .con4_tbox h2 { font-size: 50px; color: #fff; margin-bottom: 25px; display: block; } #con4 .con4_tbox p { font-size: 30px; color: #fff; display: block; margin-bottom: 25px; } #con4 .con4_tbox span { font-size: 30px; color: #fff; display: inline-block; cursor: pointer; position: relative; } #con4 .con4_tbox span:hover i { animation-name: moving; animation-duration: 1s; animation-iteration-count: infinite; } #con4 .con4_tbox span i { margin-left: 5px; position: absolute; top: 0; left: 100%; } @keyframes moving{ 50% { left: 103%; } 100%{ left: 100%; } } /* footer */ #wrap #footer_wrap { background-color: #333; height: 200px; padding: 0 100px; } #wrap .content_footer { width: 100%; display: flex; justify-content: space-between; align-items: center; height: 200px; } #wrap .content_footer .footer_logo { display: block; } #wrap .content_footer .footer_logo img { display: block; width: 100%; } #wrap .content_footer .footer_text { color: #fff; font-size: 13px; line-height: 25px; letter-spacing: 1px; } #wrap .content_footer .footer_text p.top_footer { display: block; margin-bottom: 25px; word-break: keep-all; } #wrap .content_footer .sns_box { display: flex; } #wrap .content_footer .sns_box li { margin-right: 30px; } #wrap .content_footer .sns_box li img { cursor: pointer; transition: 0.2s; width: 100%; } #wrap .content_footer .sns_box li:last-child { margin-right: 0; } #wrap .content_footer .sns_box li:hover img { opacity: 0.5; } #wrap #mofooter_wrap { display: none; } /* swiper공통 css */ .swiper { width: 100%; height: auto; } .swiper-slide { text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; } /*.swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; }*/ .swiper-slide img { display: block; width: 100%;} /* 서브페이지 회사소개 */ #subP #topmenu .main_menu .depth02 { background-color: rgba(51,51,51,0.6); } #subP .visual_area { position: relative; width: 100%; } #subP .visual_area img { width: 100%; height: auto; } #subP .visual_area .brand_toptbox { position: absolute; top: 50%; left: 0; width: 100%; } #subP .visual_area .brand_toptbox h2 { font-size: 40px; color: #fff; margin-bottom: 15px; } #subP .visual_area .brand_toptbox p { font-size: 18px; color: #fff; } #subP .visual_area .brand_toptbox p.title01{ font-size: 24px; line-height:1.2em;margin-bottom:8px;color: #fff; } #subP .visual_area .brand_toptbox p.title02{ font-size: 18px; color: #fff; } #subP .brand_list { width: 100%; background-color: #333; padding: 0 260px; height: 100px; } #subP .brand_list ul { display: flex; justify-content: space-between; width: 100%; height: 100px; line-height: 100px; } #subP .brand_list ul li { width:33.33%; transition: 0.2s; } #subP .brand_list ul li.click { background-color: #fff; } #subP .brand_list ul li.click > a { color: #333; } #subP .brand_list ul li a { display: block; width: 100%; font-size: 18px; color: #fff; text-decoration: none; } #subP .brand_list ul li:hover { background-color: #fff; } #subP .brand_list ul li:hover a { color: #333; } #subP .brand_list ul.grid01 li{width:100%;} #subP .brand_list ul.grid02 li{width:50%;} #subP .brand_list ul.grid03 li{width:33.3333;} #subP .brand_list ul.grid04 li{width:25%;} #subP .brand_list ul.grid05 li{width:20%;} /* 각 메뉴별 상단 이미지 */ .mo_img { display: none; } #subP #content_wrap { width: 100%; max-width: 1400px; margin: 0 auto; } #subP #content_wrap .brand_com { width: 100%; } #subP #content_wrap .brand_com .com_img img { width: 100%; height: auto } #subP #content_wrap .brand_com .com_tbox { width: 80%; border: 1px solid #efefef; position: relative; background-color: #fff; top: -100px; left: 50%; z-index: 10; padding: 50px 120px; transform: translate(-50%); } #subP #content_wrap .brand_com .com_tbox h2 { font-size: 35px; display: block; margin-bottom: 50px; } #subP #content_wrap .brand_com .com_tbox p { text-align: left; font-size: 16px; line-height: 32px; display: block; margin-bottom: 50px; word-break: keep-all; } #subP #content_wrap .brand_com .com_tbox span { font-size: 25px; font-weight: bold; text-align: right; float: right; } #subP #com_info { width: 100%; } #subP #com_info h2 { display: block; text-align: left; font-size: 30px; margin-bottom: 50px; } #subP #com_info .info_list { display: flex; justify-content: space-between; width: 100%; align-items: center; } #subP #com_info .info_list li { width: 24%; border-radius: 10px; border: 1px solid #3c3c3c; padding: 45px 0; } #subP #com_info .info_list li .info_img { width: 150px; height: 150px; border-radius: 50%; border: 1px solid #3c3c3c; display: flex; justify-content: center; align-items: center; margin: 0 auto; } #subP #com_info .info_list li .info_img img { height: 50px; width: auto; } #subP #com_info .info_list li h4 { display: block; font-size: 30px; margin-bottom: 20px; margin-top: 15px; } #subP #com_info .info_list li > div.co_tbox { font-size: 20px; font-weight: bold; color: #4e4e4e; } /* 서브페이지 회사연혁 */ #subP #company_ing { display: flex; justify-content: space-between; overflow: hidden; } #subP #company_ing .coming_left { width: 100%; max-width: 650px; } #subP #company_ing .coming_left img { width: 100%; height: auto; border-radius: 10px; overflow: hidden; box-shadow: 10px 10px 10px rgba(51,51,51,0.2); } #subP #company_ing .coming_right { width: 100%; max-width: 600px; } #subP #company_ing .coming_right .comming_title > li { display: flex; position: relative; font-size: 32px; font-weight: bold; margin-bottom: 30px; } #subP #company_ing .coming_right .comming_title > li:after { display: block; content: ""; position: absolute; top: 15px; left: 0; width: 100px; height: 20px; background-color: #efefef; z-index: -1; } #subP #company_ing .coming_right .comming_subtitle > li { list-style: disc; text-align: left; font-size: 20px; font-weight: normal; margin-left: 80px; margin-bottom: 10px; } #subP #company_ing .coming_right .comming_subtitle > li:first-child { margin-top: 10px; } /* 서브페이지 오시는 길*/ #subP #com_map .map_info { text-align: left; width: 100%; } #subP #com_map .map_info li { display: flex; padding: 28px 0; border-bottom: 1px solid #b3b3b3; align-items: center; } #subP #com_map .map_info li h2 { margin-left: 50px; display: block; font-size: 20px; width: 75px; } #subP #com_map .map_info li p { margin-left: 100px; font-size: 18px; } #subP #com_map .map_info li p span { margin-left: 30px; } /* 서브페이지 사업소개1 */ #subP #business_1 { width: 100%; overflow: hidden; } #subP #business_1 .business1_top { margin-bottom: 100px; display: flex; justify-content: space-between; } #subP #business_1 .business1_top >div { width: 100%; max-width: 650px; height: auto; } #subP #business_1 .business1_top .business1_tright { order: 2; } #subP #business_1 .business1_top >div img { width: 100%; margin-bottom: 20px } #subP #business_1 .business1_top >div h2 { display: block; font-size: 30px; margin-bottom: 20px; } #subP #business_1 .business1_top >div p { display: block; font-size: 18px; font-weight: normal; color: #6c6c6c; } #subP #business_1 .business1_top .business1_tleft { margin-top: 200px; order: 1; } #subP #business_1 .business1_bottom { margin-bottom: 100px; display: flex; justify-content: space-between; } #subP #business_1 .business1_bottom >div { width: 100%; max-width: 650px; height: auto; } #subP #business_1 .business1_bottom >div h2 { display: block; font-size: 30px; margin-bottom: 20px; } #subP #business_1 .business1_bottom >div p { display: block; font-size: 18px; font-weight: normal; color: #6c6c6c; } #subP #business_1 .business1_bottom >div img { width: 100%; margin-bottom: 20px; } #subP #business_1 .business1_bottom .business1_bright { order: 2; } #subP #business_1 .business1_bottom .business1_bleft { margin-top: 200px; order: 1; } /* 서브페이지 사업소개2 */ #subP #business_2 { width: 100%; overflow: hidden; } #subP #business_2 ul { width: 100%; } #subP #business_2 ul li { padding: 100px 0; display: flex; justify-content: space-between; border-bottom: 1px solid #afafaf; align-items: center; } #subP #business_2 ul li img { width: 100%; max-width: 800px; height: auto; } #subP #business_2 ul li:first-child { padding-top: 0; } #subP #business_2 ul li:last-child { padding-bottom: 0; border: 0; } #subP #business_2 ul li h2 { font-size: 30px; display: block; text-align: left; width: 100%; max-width: 560px; } #subP #business_2 ul li p { font-size: 18px; font-weight: normal; display: block; margin-top: 40px; word-break: keep-all; } /* 서브페이지 사업소개3 */ #subP #business_3 { width: 100%;max-width:1200px;margin:0 auto;overflow: hidden; } #subP #business_3 .business3_top { display: flex; justify-content: space-between; margin-bottom: 40px; column-gap:1.2vw;} #subP #business_3 .business3_top > div { width: 50%; max-width: 680px; height: auto; border-radius: 20px; border: 1px solid #bbbbbb; box-shadow: 5px 5px 7px rgba(51,51,51,0.1); overflow: hidden; } #subP #business_3 .business3_top > div img { width: 100%; height: auto; object-fit: cover; } #subP #business_3 .business3_top > div h2 { display: block; font-size: 30px; padding: 30px 0 30px 60px; text-align: left; } #subP #business_3 .business3_top > div p { display: block; font-size: 18px; padding: 0 60px 50px 60px; text-align: left; font-weight: normal; color: #6c6c6c; line-height: 32px; word-break: keep-all; } #subP #business_3 .business3_bottom { display: flex; justify-content: space-between; margin-bottom:40px;column-gap:1.2vw;} #subP #business_3 .business3_bottom > div { width: 50%; max-width: 680px; height: auto; border-radius: 20px; border: 1px solid #bbbbbb; box-shadow: 5px 5px 7px rgba(51,51,51,0.1); overflow: hidden; } #subP #business_3 .business3_bottom > div img { width: 100%; height: auto; object-fit: cover; } #subP #business_3 .business3_bottom > div h2 { display: block; font-size: 30px; padding: 30px 0 30px 60px; text-align: left; } #subP #business_3 .business3_bottom > div p { display: block; font-size: 18px; padding: 0 60px 50px 60px; text-align: left; font-weight: normal; color: #6c6c6c; line-height: 32px; word-break: keep-all; } #subP #content_wrap #global{text-align:center;} #subP #content_wrap #global img{max-width:100%;height:auto;} /* #subP #business_3 { width: 100%; max-width:1200px;margin:0 auto;overflow: hidden; } #subP #business_3 .business3_top { display: flex; justify-content: space-between; margin-bottom: 40px; } #subP #business_3 .business3_top > div { width: 30%; max-width: 680px; height: auto; border-radius: 20px; border: 1px solid #bbbbbb; box-shadow: 5px 5px 7px rgba(51,51,51,0.1); overflow: hidden; } #subP #business_3 .business3_top > div img { width: 100%; height: auto; object-fit: cover; } #subP #business_3 .business3_top > div h2 { display: block; font-size: 30px; padding: 30px 0 30px 60px; text-align: left; } #subP #business_3 .business3_top > div p { display: block; font-size: 18px; padding: 0 60px 50px 60px; text-align: left; font-weight: normal; color: #6c6c6c; line-height: 32px; word-break: keep-all; } #subP #business_3 .business3_bottom { display: flex; justify-content: space-between; margin-bottom: 40px; } #subP #business_3 .business3_bottom > div { width: 30%; max-width: 680px; height: auto; border-radius: 20px; border: 1px solid #bbbbbb; box-shadow: 5px 5px 7px rgba(51,51,51,0.1); overflow: hidden; } #subP #business_3 .business3_bottom > div img { width: 100%; height: auto; object-fit: cover; } #subP #business_3 .business3_bottom > div h2 { display: block; font-size: 30px; padding: 30px 0 30px 60px; text-align: left; } #subP #business_3 .business3_bottom > div p { display: block; font-size: 18px; padding: 0 60px 50px 60px; text-align: left; font-weight: normal; color: #6c6c6c; line-height: 32px; word-break: keep-all; } */ /* 서브페이지 상품소개1 */ #subP .prd_list { margin: 100px 0; width: 100%; } #subP .prd_list .board_output_gallery_img a img { width: 100%; height: auto; } #subP .prd_list .board_output_gallery_subject { text-align: center; font-size: 20px; padding: 20px 0 6px; display: block; } #subP .prd_list .board_output_gallery_subject a { display: block; font-size: 20px; font-family: 'Archivo','Noto Sans KR', sans-serif; text-decoration: none; } /* 서브페이지 상품보기 */ #post_area { max-width: 1400px; margin: 0 auto; font-size: 30px; font-weight: bold; text-align: center; } #post_area img { width: 100% !important; height: auto !important; margin-top: 50px; } #subP .brand_list.product_list ul li { width: 100%; font-size: 18px; color: #fff; } #subP .brand_list.product_list ul li:hover { background-color: #333; color: #fff; } /* 서브페이지 갤러리 게시판 */ #subP .brand_list.gallery_list ul li { width: 100%; font-size: 18px; color: #fff; } #subP .brand_list.gallery_list ul li:hover { background-color: #333; color: #fff; }