html{overflow-x:hidden;} body{overflow-x:hidden; background:#fff;} #wrapper{background:#fff;} body,td,span,h1,h2,h3,h4,h5,div,p,li,ul,ol,dd,dt,section,input,textarea,select,button {margin:0;padding:0; font-size:14px; font-family: 'Poppins', 'Noto Sans KR', sans-serif; font-weight:400; letter-spacing:0.05em;} ul,ol,li{margin:0;padding:0;list-style:none;} a, img{border:0px;} a{text-decoration:none;} strong{font-weight:600;} /* 폰트 */ .f11 { font-size:11px;} .f12 { font-size:12px;} .f13 { font-size:13px;} .f14 { font-size:14px;} .f15 { font-size:15px;} .f16 { font-size:16px;} .f17 { font-size:17px;} .f18 { font-size:18px;} .f19 { font-size:19px;} .f20 { font-size:20px;} .f24 { font-size:24px;} .f30 { font-size:30px;} .f40 { font-size:40px;} .f50 { font-size:50px;} .lh20 {line-height:20px;} .lh24 {line-height:24px;} .lh30 {line-height:30px;} .lh36 {line-height:36px;} .lh40 {line-height:40px;} .pT10 {padding-top:10px;} .pT15 {padding-top:15px;} .pT20 {padding-top:20px;} .pT30 {padding-top:30px;} .pT40 {padding-top:40px;} .pT50 {padding-top:50px;} .pT100 {padding-top:100px;} .pB10 {padding-bottom:10px;} .pB15 {padding-bottom:15px;} .pB20 {padding-bottom:20px;} .pB30 {padding-bottom:30px;} .pB40 {padding-bottom:40px;} .pB50 {padding-bottom:40px;} .pB100 {padding-bottom:100px;} .fc_red {color:#c90d0b;} .fc_org {color:#f0830c;} .fc_darkblue {color:#143e6d;} .fc_blue {color:#2072d4;} .share-kakaotalk{background:#FFF000 !important;} #wrap {width:100%; } #wrap.sub{margin-top:179px;} /* 중간기기~작은기기 모바일 상단 */ #back_cover{position:absolute; display:none; left:0; top:0; width:100%; height:100%; top:0px; background:rgba(0,0,0,0.5); z-index:9999998;} #sideMenu{position:fixed; top:0; left:-320px; width:320px; height:100%; background:#fff; z-index:9999999;} #sideMenu .side_title{height:65px; line-height:65px; text-align:left; font-size:1.3em; cursor:pointer; color:#000; position:relative; margin-bottom:10px;} #sideMenu .side_title img{width:40px; margin-left:10px;} #sideMenu .side_title ul{width:auto; padding:0; margin:0; font-size:0; position:absolute; top:0px; right:0;} #sideMenu .side_title ul li{display:inline-block; margin:0px; text-align:center; transition: 0.5s all ease; } #sideMenu .side_title ul li a{position:relative; display:inline-block; width:40px; height:40px; line-height:40px; font-size:11px; color:#fff;} #sideMenu .side_title ul li:nth-child(1) a{background:url("../image/ic1_bk.png") no-repeat center center;} #sideMenu .side_title ul li:nth-child(2) a{background:url("../image/ic2_bk.png") no-repeat center center;} #sideMenu .side_title ul li:nth-child(3) a{background:url("../image/ic4_bk.png") no-repeat center center;} #sideMenu .side_title ul li:nth-child(4) a{background:url("../image/ic6_bk.png") no-repeat center center;} #sideMenu .navi_bg{width:100%;} #sideMenu .nav{width:100%; margin:0 auto; padding:0; padding-bottom:30px; list-style:none; box-sizing:border-box; overflow:auto; height:auto;} #sideMenu .nav ul{width:100%; margin:0; padding:0;} #sideMenu .navi_set{display:inline; margin:0; padding:10px 0 10px 0; text-align:center;} #sideMenu .navi_set > div{display:block; width:100%; height:40px; line-height:40px; border-bottom:1px solid #ddd; text-align:left; background-color:#fff; color:#333; text-indent:10px; position:relative;} #sideMenu .navi_set > div > a{display:block; width:100%; height:40px; line-height:40px;} #sideMenu .navi_set > div > button{position:absolute; right:0; top:0; display:block; width:40px; height:40px; line-height:40px; background:url("../image/arr_d.png") no-repeat center center; border:0;} #sideMenu .navi_set > div > button.on{background:url("../image/arr_u.png") no-repeat center center;} #sideMenu .navi_set ul{display:none;} #sideMenu .navi_set ul li{list-style:none; border-bottom:1px solid #eee;} #sideMenu .navi_set ul li a{display:block; width:100%; height:30px; line-height:30px; text-align:left; font-size:0.9em; color:#333; cursor:pointer; text-indent:20px; background-color:#fff;} #sideMenu .navi_set ul li a:hover{color:#fff; background-color:#aaa;} #sideMenu .navi_set ul li.mo_sub3r a{text-indent:25px;} .jbmFixed{position:fixed !important; top:0; left:0;} .jbmFixed .inner{border-bottom:1px solid #ddd !important;} #header_all {position:fixed; top:0; left:0; width:100%; height:auto; margin:0 auto; text-align:left; z-index:99999;} #header_area {position:relative; width:100%; height:122px; margin:0 auto; text-align:left;margin:0 auto;} #header_area .header_logo {position:absolute; display:block; left:0; top:0; padding-top:32px; width:100%; text-align:center;} #header_area .header_logo .logo_bk{display:none;} #header_area .mobile_menu{z-index:1; position:absolute; display:block; left:30px; bottom:10px; display:none;} #header_area .mobile_menu a{position:relative; display:inline-block; width:40px; height:40px; line-height:40px; font-size:11px; color:#fff; background:url("../image/ic5.png") no-repeat center center;} #header_area .mobile_menu a:after{position:absolute; background:#f7f7f7; content:""; top:0; left:0; width:40px; height:40px; border-radius:3px; z-index:-1; display:block; transition: 0.5s all ease; opacity:0;} #header_area .mobile_menu a:hover{background:url("../image/ic5_bk.png") no-repeat center center;} #header_area .mobile_menu a:hover:after{opacity:1;} #header_area .search{z-index:1; position:absolute; right:30px; bottom:10px; display:block; } #header_area .search:after{content:""; display:block; clear:both;} #header_area .search ul{width:100%; padding:0; margin:0; font-size:0;} #header_area .search ul li{display:inline-block; margin:0 15px; text-align:center; transition: 0.5s all ease; } #header_area .search ul li a{position:relative; display:inline-block; width:40px; height:40px; line-height:40px; font-size:11px; color:#fff;} #header_area .search ul li .cart-count{position:absolute; background:#fff; color:#000; width:17px; height:17px; border-radius:10px; top:-3px; right:-5px; line-height:17px; text-align:center; transition: 0.5s all ease; font-size:0.9em;} #header_area .search ul li:nth-child(1) a{background:url("../image/ic2.png") no-repeat center center;} #header_area .search ul li:nth-child(1) a:hover{background:url("../image/ic2_bk.png") no-repeat center center;} #header_area .search ul li a:after{position:absolute; background:#f7f7f7; content:""; top:0; left:0; width:40px; height:40px; border-radius:3px; z-index:-1; display:block; transition: 0.5s all ease; opacity:0;} #header_area .search ul li:hover a:after{opacity:1;} #header_area .search ul li:nth-child(2) a{background:url("../image/ic1.png") no-repeat center center;} #header_area .search ul li:nth-child(2) a:hover{background:url("../image/ic1_bk.png") no-repeat center center;} #header_area .search ul li:nth-child(3) a{background:url("../image/ic3.png") no-repeat center center;} #header_area .search ul li:nth-child(3) a:hover{background:url("../image/ic3_bk.png") no-repeat center center;} #header_area .search ul li:nth-child(4) a{background:url("../image/ic4.png") no-repeat center center;} #header_area .search ul li:nth-child(4) a:hover{background:url("../image/ic4_bk.png") no-repeat center center;} #header_all.sub{background:#fff;} #header_all.sub #header_area .header_logo .logo_bk{display:block;} #header_all.sub #header_area .header_logo .logo_wh{display:none;} #header_all.sub #header_area .mobile_menu a{background:url("../image/ic5_bk.png") no-repeat center center;} #header_all.sub #header_area .search ul li .cart-count{background:#000; color:#fff;} #header_all.sub #header_area .search ul li:nth-child(1) a{background:url("../image/ic1_bk.png") no-repeat center center;} #header_all.sub #header_area .search ul li:nth-child(2) a{background:url("../image/ic2_bk.png") no-repeat center center;} #header_all.sub #header_area .search ul li:nth-child(3) a{background:url("../image/ic3_bk.png") no-repeat center center;} #header_all.sub #header_area .search ul li:nth-child(4) a{background:url("../image/ic4_bk.png") no-repeat center center;} #header_all.sub #lnb_wrap {border-bottom:1px solid #ddd;} #header_all.sub #lnb .lnb_wrap > ul > li > a{color:#000; } #header_all.sub #lnb .lnb_wrap > ul > li.current > a:after{background:#4F2E0B;} #header_all.sub #header_wrap{border-bottom:1px solid #ddd;} #hd_sch{display:none;} #hd_sch h3 {position:absolute;font-size:0;line-height:0;overflow:hidden} #hd_sch {border-radius:0px;overflow:hidden} #hd_sch #sch_str {float:left;width:220px;height:45px;padding-left:15px;border-radius:0px;background:#f7f7f7;border:0;border-right:0;font-size:1em;color:#000} #hd_sch #sch_submit {float:left;width:45px;height:45px;border:0;background:#f7f7f7;color:#000;border-radius:0;cursor:pointer;font-size:16px} #hd_sch #sch_submit i{display:block; margin-top:-2px;} #header_wrap{clear:both; width:100%; height:57px; border-bottom:1px solid rgba(255,255,255,0.5);} #header{width:100%; margin:0 auto; background:url("../image/top_m_x.png") repeat-x top center; z-index:1001 !important; height:57px; } #lnb{display:block; height:57px; overflow:hidden;} #lnb .lnb_wrap{position:relative; transition: 0.5s all ease; text-align:center; height:57px;} #lnb .lnb_wrap > ul{} #lnb .lnb_wrap > ul > li{display:inline-block; height:57px; min-height:57px;} #lnb .lnb_wrap > ul > li > a{display:block; width:100%; padding:0 24.5px; font-size:1em; color:#fff; font-weight:300; height:57px; line-height:57px; position:relative;} #lnb .lnb_wrap > ul > li.current > a:after{display:block; position:absolute; width:100%; height:2px; content:""; bottom:0; left:0; background:#fff;} #lnb .lnb_sub_all{z-index:98; position:absolute; width:100%; max-width:95%; left: 50%; transform: translateX(-50%); top:57px; height:0; text-align:center; opacity:0; padding-top:30px;} #lnb .lnbsub{width:100%; max-width:1400px; margin:0 auto;} #lnb .lnb_sub_all:after{content:""; display:block; clear:both;} #lnb .lnb_sub{width:15%; float:left;} #lnb .lnb_sub li{display:inline-block; height:35px; padding:0px; width:100%; text-align:left;} #lnb .lnb_sub li a{position:relative; display:block; height:35px; line-height:35px; font-size:1.05em; color:#000; letter-spacing:0px; width:100%;} #lnb .lnb_sub .sub3r a{font-size:1.05em; font-weight:300; } #lnb .lnb_sub_right{width:62%; float:right; margin-top:10px;} #lnb .lnb_sub_right:after{content:""; display:block; clear:both;} #lnb .lnb_sub_right .sec3 .con_box .txt-box{padding:0px;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all{height:520px; opacity:1; z-index:99;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub li a:hover{color:#000; transition:0.3s all ease;} #lnb .lnb_wrap > ul > li.menu_logo{display:none;} #lnb .lnb_wrap > ul > li.menu_logo img{height:30px;} #lnb .lnb_sub_all1{z-index:98; position:absolute; width:100%; max-width:95%; left: 50%; transform: translateX(-50%); top:57px; height:0px; text-align:center; opacity:1; padding-top:30px;} #lnb .lnb_sub_all1:after{content:""; display:block; clear:both;} #lnb .lnb_sub_all1 .lnbsubimg{height:0; overflow:hidden;} #lnb .lnb_sub_img{display:block;} #lnb .lnb_sub_img li{display:inline-block; height:50px; padding:0px; position:relative; max-width:19%; padding:0 1%;} #lnb .lnb_sub_img li a{position:relative; display:block; width:auto; height:auto; font-size:1.05em; color:#000; letter-spacing:-0.5px;} #lnb .lnb_sub_img li .all-img{width:100%; max-width:400px; } #lnb .lnb_sub_img li div.text{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index:99; color:#fff; font-size:1.1em; line-height:1.1em;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all1{height:520px; opacity:1; z-index:99;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all1 .lnbsubimg{height:auto;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_img li a:hover{color:#000; transition:0.3s all ease;} .t_bnr_t { width:100%; margin:0 auto; display:block; height:auto; border:0px solid red; padding-bottom:20px;} .t_bnr_t .all-txt-1 .txts{height:50px;} #header.header_on{height:580px !important; background:url("../image/top_m_b.png") repeat-x top center; } #header.header_on #lnb{height:100%; overflow:unset;} /*메뉴의 높이를 입력합니다.*/ #header.header_on #lnb .lnb_wrap{height:100%;} #header_all.jbFixed{top:-120px; background:#fff; } #header_all.jbFixed #lnb .lnb_wrap > ul > li:nth-child(1){margin-left:35px;} #header_all.jbFixed #lnb .lnb_wrap > ul > li > a{color:#000;} #header_all.jbFixed #lnb .lnb_wrap > ul > li.menu_logo{display:inline-block;} #header_all.jbFixed #header_wrap{border-bottom:1px solid #ddd;} #header_all.jbFixedM{top:0px !important; background:#fff; border-bottom:1px solid #ddd;} #header_all.jbFixedM #header_area .header_logo .logo_bk{display:block;} #header_all.jbFixedM #header_area .header_logo .logo_wh{display:none;} #header_all.jbFixedM #header_area .search ul li .cart-count{background:#000; color:#fff;} #header_all.jbFixedM #header_area .search ul li:nth-child(1) a{background:url("../image/ic1_bk.png") no-repeat center center;} #header_all.jbFixedM #header_area .search ul li:nth-child(2) a{background:url("../image/ic2_bk.png") no-repeat center center;} #header_all.jbFixedM #header_area .search ul li:nth-child(3) a{background:url("../image/ic3_bk.png") no-repeat center center;} #header_all.jbFixedM #header_area .search ul li:nth-child(4) a{background:url("../image/ic4_bk.png") no-repeat center center;} #header_all.jbFixedM #header_area .mobile_menu{bottom:10px;} #header_all.jbFixedM #header_area .mobile_menu a{background:url("../image/ic5_bk.png") no-repeat center center;} #wrapper_title{text-align:center;} /************************************************ * main_visual ************************************************/ #main_bn{display:block;} #main_bn .owl-nav{ text-align:center; position:relative; width:100%; margin-top:10px; z-index:99; } #main_bn .owl-nav .owl-prev{opacity:0; float:left; z-index:99; margin-top:-280px; margin-left:40px; transition: all 200ms ease-in;} #main_bn .owl-nav .owl-prev span{display:block; width:15px; height:29px; font-size:2em; background:url("../image/btn_prev.gif"); text-indent:-999px; font-size:0px;} #main_bn .owl-nav .owl-prev.disabled span, #main_bn .owl-nav .owl-prev:hover span{background:url("../image/btn_prev.gif");} #main_bn .owl-nav .owl-next{opacity:0; float:right; z-index:99; margin-top:-280px; margin-right:40px; transition: all 200ms ease-in;} #main_bn .owl-nav .owl-next span{display:block; width:15px; height:29px; font-size:2em; background:url("../image/btn_next.gif"); text-indent:-999px; font-size:0px;} #main_bn .owl-nav .owl-next.disabled span, #main_bn .owl-nav .owl-next:hover span{background:url("../image/btn_next.gif");} #main_bn .owl-dots{text-align:center; position:absolute; bottom:35px; width:100%; z-index:98; } #main_bn .owl-dots button{background:url('../image/btn_rollBtn.png') no-repeat left top; width:22px; height:14px; margin:0px 0px; transition: all 200ms ease-in;} #main_bn .owl-dots button.active{background:url('../image/btn_rollBtn_on.png') no-repeat left top; width:22px; height:14px; } #main_bn:hover .owl-nav .owl-prev{opacity:1;} #main_bn:hover .owl-nav .owl-next{opacity:1;} #main_bn .all-txt-main{position: absolute; top:55%; transform: translateY(-50%); text-align:center; width:100%;} #main_bn .all-txt-main .tit1{font-size:3em; color:#fff; line-height:1.4; font-family: "Qwitcher Grypen", cursive; font-weight:700;} #main_bn .all-txt-main .tit2{margin-top:20px; font-size:2em; color:#fff; line-height:1.4; font-weight:300;} #main_bn .all-txt-main .txts{margin-top:25px; font-size:1em; color:#fff; line-height:1.6;} #main_bn .all-txt-main a.btn_view{position:relative; display:inline-block; width:240px; height:65px; line-height:65px; text-align:center; margin-top:30px; background: transparent; border:1px solid #fff; box-sizing:border-box; transition:0.5s all ease;} #main_bn .all-txt-main a.btn_view span{z-index:1; position:relative; font-size:1em; color:#fff;} #main_bn .all-txt-main a.btn_view:hover{background:#000; border:1px solid #000;} #main_bn .all-txt-main a.btn_view:hover span{color:#fff;} #main_bn1{display:none;} #main_bn1 .owl-nav{ text-align:center; position:relative; width:100%; margin-top:10px; z-index:99; } #main_bn1 .owl-nav .owl-prev{opacity:0; float:left; z-index:99; margin-top:-280px; margin-left:40px; transition: all 200ms ease-in;} #main_bn1 .owl-nav .owl-prev span{display:block; width:15px; height:29px; font-size:2em; background:url("../image/btn_prev.gif"); text-indent:-999px; font-size:0px;} #main_bn1 .owl-nav .owl-prev.disabled span, #main_bn1 .owl-nav .owl-prev:hover span{background:url("../image/btn_prev.gif");} #main_bn1 .owl-nav .owl-next{opacity:0; float:right; z-index:99; margin-top:-280px; margin-right:40px; transition: all 200ms ease-in;} #main_bn1 .owl-nav .owl-next span{display:block; width:15px; height:29px; font-size:2em; background:url("../image/btn_next.gif"); text-indent:-999px; font-size:0px;} #main_bn1 .owl-nav .owl-next.disabled span, #main_bn1 .owl-nav .owl-next:hover span{background:url("../image/btn_next.gif");} #main_bn1 .owl-dots{text-align:center; position:absolute; bottom:35px; width:100%; z-index:98; } #main_bn1 .owl-dots button{background:url('../image/btn_rollBtn.png') no-repeat left top; width:22px; height:14px; margin:0px 0px; transition: all 200ms ease-in;} #main_bn1 .owl-dots button.active{background:url('../image/btn_rollBtn_on.png') no-repeat left top; width:22px; height:14px; } #main_bn1:hover .owl-nav .owl-prev{opacity:1;} #main_bn1:hover .owl-nav .owl-next{opacity:1;} #main_bn1 .all-txt-main{position: absolute; top:55%; transform: translateY(-50%); text-align:center; width:100%;} #main_bn1 .all-txt-main .tit1{font-size:3em; color:#fff; line-height:1.4; font-family: "Qwitcher Grypen", cursive; font-weight:700;} #main_bn1 .all-txt-main .tit2{margin-top:20px; font-size:2em; color:#fff; line-height:1.4; font-weight:300;} #main_bn1 .all-txt-main .txts{margin-top:25px; font-size:1em; color:#fff; line-height:1.6;} #main_bn1 .all-txt-main a.btn_view{position:relative; display:inline-block; width:240px; height:65px; line-height:65px; text-align:center; margin-top:30px; background: transparent; border:1px solid #fff; box-sizing:border-box; transition:0.5s all ease;} #main_bn1 .all-txt-main a.btn_view span{z-index:1; position:relative; font-size:1em; color:#fff;} #main_bn1 .all-txt-main a.btn_view:hover{background:#000; border:1px solid #000;} #main_bn1 .all-txt-main a.btn_view:hover span{color:#fff;} .c_bnr_t { width:100%; margin:0 auto; } .c_bnr_t:after{clear:both; display:block; content:"";} .m_bnr_t { width:100%; margin:0 auto; } .m_bnr_t:after{clear:both; display:block; content:"";} .sec1{width:100%; margin:0 auto;} .sec1 .con_box{display:block; width:100%; position:relative;} .sec1 .con_box .txt-box{position:absolute; top:50%; left:0; width:100%; transform:translateY(-50%); text-align:center; z-index:99;} .sec1 .con_box .img-box{position:relative; width:100%; overflow:hidden; } /************************************************ * contents ************************************************/ #contents {width:100%; height:100%; margin:0 auto; } /* 베스트아이템_롤링 */ #best {width:1400px; height:110px; margin:20px auto; } .all-txt-1{width:100%;} .all-txt-1 .tit1{font-size:3.2em; color:#000; line-height:1; font-family: "Qwitcher Grypen", cursive; font-weight:400; word-break:keep-all;} .all-txt-1 .tit2{margin-top:15px; font-size:1.5em; color:#000; line-height:1.4; word-break:keep-all;} .all-txt-1 .txts{margin-top:15px; font-size:1em; color:#333; line-height:1.6; word-break:keep-all;} .all-txt-1 a.btn_view{position:relative; display:inline-block; width:240px; height:65px; line-height:65px; text-align:center; margin-top:30px; background: transparent; border:1px solid #333; box-sizing:border-box; transition:0.5s all ease;} .all-txt-1 a.btn_view span{z-index:1; position:relative; font-size:1em; color:#333;} .all-txt-1 a.btn_view:hover{background:#000; border:1px solid #000;} .all-txt-1 a.btn_view:hover span{color:#fff;} .all-txt-1 a.btn_view1{position:relative; display:inline-block; width:240px; height:35px; line-height:35px; text-align:center; margin-top:20px; background: transparent; box-sizing:border-box; transition:0.5s all ease;} .all-txt-1 a.btn_view1 span{z-index:1; position:relative; font-size:1em; color:#000;} .all-txt-1 a.btn_view1:hover{background:#000; } .all-txt-1 a.btn_view1:hover span{color:#fff;} .all-txt-1.wh .tit1{color:#fff; } .all-txt-1.wh .tit2{color:#fff; } .all-txt-1.wh .txts{color:#fff; } .all-txt-1.wh a.btn_view{border:1px solid #fff;} .all-txt-1.wh a.btn_view span{color:#fff;} .all-txt-1.wh a.btn_view:hover{border:1px solid #000;} .all-txt-1.wh a.btn_view1{position:relative; display:inline-block; width:240px; height:35px; line-height:35px; text-align:center; margin-top:20px; background: transparent; box-sizing:border-box; transition:0.5s all ease;} .all-txt-1.wh a.btn_view1 span{z-index:1; position:relative; font-size:1em; color:#fff;} .all-txt-1.wh a.btn_view1:hover{background:#000; } .all-txt-1.wh a.btn_view1:hover span{color:#fff;} .all-img{position: relative; width:100%; overflow:hidden;} .all-img .imgs{width:100%;} .all-img .imgs .line{z-index:1; position:absolute; content:""; left:50%; top:50%; transform:translate(-50%,-50%); display:block; width:calc(100% - 40px); height:calc(100% - 40px); border:1px solid rgba(255,255,255,.7);} .all-img .imgs img {max-width:100%; width:100%;} #m_bnr1 {width:100%; margin:0 auto; margin-top:40px;} #m_bnr1:after{clear:both; display:block; content:"";} .sec3{width:100%; margin:0 auto;} .sec3 .con_box{display:flex; flex-direction:row; align-items:center; justify-content:center; width:100%; background:#f8f8f8;} .sec3 .con_box:nth-child(even){flex-direction:row-reverse;} .sec3 .con_box .txt-box{width:50%; height:100%; padding:40px 50px; text-align:center;} .sec3 .con_box .txt-box:after{ content:""; display:block; clear:both;} .sec3 .con_box .img-box{position:relative; width:50%; overflow:hidden;} #m_bnr2 { width:100%; margin:0 auto; margin-top:40px;} #m_bnr2:after{clear:both; display:block; content:"";} .sec4{width:100%; margin:0 auto;} .sec4 .con_box{display:block; width:100%; position:relative;} .sec4 .con_box .txt-box{position:absolute; top:50%; left:0; width:100%; transform:translateY(-50%); text-align:center; z-index:999;} .sec4 .con_box .img-box{position:relative; width:100%; overflow:hidden; } .sec4 .con_box .img-box .line{display:none; z-index:100; position:absolute; content:""; left:50%; top:50%; transform:translate(-50%,-50%); display:block; width:calc(100% - 40px); height:calc(100% - 40px); border:1px solid rgba(255,255,255,.7);} .con_box.pc{} .con_box.mobile{display:none;} #m_bnr3 {width:100%; margin:0px auto; } #m_bnr3:after{clear:both; display:block; content:"";} .sec5{width:100%; margin:0 auto;} .sec5 .con_box{display:flex; flex-direction:row-reverse; align-items:center; justify-content:center; width:100%; background:#f8f8f8;} .sec5 .con_box:nth-child(even){flex-direction:row;} .sec5 .con_box .txt-box{width:50%; height:100%; padding:40px 50px; text-align:center;} .sec5 .con_box .txt-box:after{ content:""; display:block; clear:both;} .sec5 .con_box .img-box{position:relative; width:50%; overflow:hidden;} #rolling_bnr{position:relative; width:100%; margin-top:80px; padding:0;} #rolling_bnr .inner{width:100%; margin:0 auto; overflow:hidden;} #rolling_bnr .swiper-box{position:relative; width:100%; max-width:1400px; margin:0 auto;} #rolling_bnr .swiper-slide{display:flex; justify-content:flex-end; width:100%;} #rolling_bnr .swiper-slide > .line{display:none; z-index:100; position:absolute; content:""; left:50%; top:50%; transform:translate(-50%,-50%); width:calc(100% - 40px); height:calc(100% - 40px); border:1px solid rgba(255,255,255,.7);} #rolling_bnr .swiper-slide .img-box{width:75%; text-align:left;} #rolling_bnr .swiper-slide .img-box img{max-width:100%; transition:all 0.5s;} #rolling_bnr .swiper-slide .txt-box-all{position:absolute; width:45%; padding-top:32%; top:50%; transform:translateY(-50%); left:0; text-align:center; z-index:999; background:rgba(100,45,14,0.3); transition:all 0.5s;} #rolling_bnr .swiper-slide:nth-child(even) .txt-box-all{background:rgba(99,100,14,0.3); transition:all 0.5s;} #rolling_bnr .swiper-slide .txt-box-all .line{z-index:1; position:absolute; content:""; left:50%; top:50%; transform:translate(-50%,-50%); display:block; width:calc(100% - 40px); height:calc(100% - 40px); border:1px solid rgba(255,255,255,.7);} #rolling_bnr .swiper-slide .txt-box-all .txt-box{position:absolute; top:50%; left:0; width:100%; transform:translateY(-50%); text-align:center; z-index:9999;} #rolling_bnr .swiper-btn-wrap{z-index:1; position:absolute; top:50%; transform:translateY(-50%); left:0; width:100%; height:50px;} #rolling_bnr .swiper-button-next_A, #rolling_bnr .swiper-button-prev_A{z-index:1; position:absolute; bottom:0; width:50px; height:50px;} #rolling_bnr .swiper-button-prev_A{background:url("../image/btn_prev.gif") no-repeat center center; left:-55px; cursor:pointer;} #rolling_bnr .swiper-button-next_A{background:url("../image/btn_next.gif") no-repeat center center; right:-55px; cursor:pointer;} #rolling_bnr .swiper-slide.swiper-slide-active .txt-box-all{background:rgba(100,45,14,0.5);} #rolling_bnr .swiper-slide.swiper-slide-active:nth-child(even) .txt-box-all{background:rgba(99,100,14,0.5);} #news_letter {width:100%; margin:80px auto;} #news_letter:after{clear:both; display:block; content:"";} #news_letter .title{width:100%; margin:0 auto; position:relative; text-align:center;} #news_rolling_bnr{position:relative; width:100%; margin-top:40px; padding:0;} #news_rolling_bnr .inner{width:100%; margin:0 auto; overflow:hidden;} #news_rolling_bnr .swiper-box{position:relative; width:100%; max-width:900px; margin:0 auto; transition:all 0.5s;} #news_rolling_bnr .swiper-slide{display:flex; flex-direction:row; align-items:center; justify-content:center; width:100%; background:#f8f8f8;} #news_rolling_bnr .swiper-slide .img-box{width:50%; height:100%;text-align:center; position:relative;} #news_rolling_bnr .swiper-slide .img-box .line{z-index:1; position:absolute; content:""; left:50%; top:50%; transform:translate(-50%,-50%); display:block; width:calc(100% - 40px); height:calc(100% - 40px); border:1px solid rgba(255,255,255,.7); } #news_rolling_bnr .swiper-slide .img-box img{max-width:100%; transition:all 0.5s;} #news_rolling_bnr .swiper-slide .txt-box-all{width:50%; height:100%; position:relative;} #news_rolling_bnr .swiper-slide .txt-box-all .txt-box{position:absolute; top:50%; left:50%; width:100%; transform:translate(-50%,-50%); padding:20px; text-align:center; z-index:99;} #news_rolling_bnr .swiper-btn-wrap{z-index:1; position:absolute; top:50%; transform:translateY(-50%); left:0; width:100%; height:50px;} #news_rolling_bnr .swiper-button-next_B, #news_rolling_bnr .swiper-button-prev_B{z-index:1; position:absolute; bottom:0; width:50px; height:50px;} #news_rolling_bnr .swiper-button-prev_B{background:url("../image/btn_prev.gif") no-repeat center center; left:-55px; cursor:pointer;} #news_rolling_bnr .swiper-button-next_B{background:url("../image/btn_next.gif") no-repeat center center; right:-55px; cursor:pointer;} #news_rolling_bnr .all-txt-1 .txts{display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; height:auto; min-height:45px;} #c_btn {width:100%; margin:0px auto;} #c_btn:after{clear:both; display:block; content:"";} #c_btn ul{width:100%; margin:0; padding:0; font-size:0;} #c_btn ul li{width:25%; display:inline-block; vertical-align:top; text-align:center; position:relative; margin-bottom:80px; transition:0.5s all ease;} #c_btn ul li:after{display:block; width:1px; height:50px; background:#ddd; content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);} #c_btn ul li a{display:block; width:100%;} #c_btn ul li img{max-width:100px; width:80%;} #c_btn p.btn_view1{position:relative; display:block; width:80%; max-width:240px; line-height:1.4; text-align:center; margin:0 auto; padding:7px 10px; margin-top:0px; word-break:keep-all; background: transparent; box-sizing:border-box;} #c_btn p.btn_view1 span{z-index:1; position:relative; font-size:1em; color:#000;} #c_btn p.btn_view1 i{display:inline-block; font-size:1em; color:#000;} #c_btn p.btn_view1:hover{background:#000; color:#fff;} #c_btn p.btn_view1:hover i{color:#fff;} /******************************* footer *******************************/ #footer {clear:both; width:100%; overflow:hidden; padding:60px 0; background:#333; } #footer_area{ width:100%; margin:0 auto; margin-top:0px; text-align:center;} #footer_area .copy_logo{display:block; text-align:center; padding-top:20px;} #footer_area .cs{display:block; text-align:center; color:#fff; font-size:1.2em;padding-top:20px;} #footer_area .cs p{display:inline-block; padding-right:40px; font-size:1em;} #footer_area .cs span{padding-left:10px; font-size:1em;} #footer_area .copy{display:block; text-align:center; color:#fff; font-size:0.85em; line-height:1.6em; padding-top:30px; font-weight:300; word-break:keep-all;} #footer_area .copy a {color:#fff;} #footer_area .copy a:hover {color:#fff;} #footer_area ul{margin:0 auto; text-align:center;} #footer_area ul li{display:inline-block; vertical-align:middle; padding:0 10px;} #footer_area ul li a{color:#fff; font-size:0.85em;} #footer_area ul li.comm_bt{display:inline-block;} #footer_area ul li.comm_bt a{display:inline-block; vertical-align:middle; margin-right:10px; font-size:1.3em;} #footer_area ul li.comm_bt a:last-child{margin-right:0;} #footer.sub{margin-top:60px;} /* 버튼효과 */ a.fot_pa:link, a.fot_pa:visited, a.fot_pa:active { display:inline-block; border:1px solid #000; background-color:#000; color:#fff; border-radius:0px; -webkit-border-radius:0px; -moz-border-radius:0px; line-height:45px; height:45px; width:155px; font-size:13px; text-align:center; padding:0; margin:0; font-weight:normal; } a.fot_pa:hover { background-color:#FFF; color:#333; } a.bo_bt:link, a.bo_bt:visited, a.bo_bt:active{ text-align:center; display:inline-block; border:1px solid #666; padding:5px 10px 5px 10px; text-decoration:none; background-color:#666; color:#fff; transition: all 200ms ease-in;} a.bo_bt:hover {color:#fff; background:#333; } /* submit */ .btn_submita { display:inline-block; border:1px solid #999999; background-color:#fff; color:#000; border-radius:0px; -webkit-border-radius:0px; -moz-border-radius:0px; line-height:50px; height:50px; width:160px; transition: all 200ms ease-in; font-size:13px; text-align:center; padding:0; margin:0; font-weight:normal; } .btn_submita:hover { background-color:#333; border:1px solid #333; color:#fff; } .pimg img{ -webkit-transform:scale(1); -moz-transform:scale(1); -o-transform:scale(1); -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; } .pimg:hover img{ -webkit-transform:scale(1.4); -moz-transform:scale(1.4); -o-transform:scale(1.4); } .tbl_head01 thead th{font-size:1.1em; letter-spacing:0;} .bo_tit{font-size:1.1em; font-weight:normal;} #bo_v_title{background:#f7f7f7; padding:15px 10px; padding-top:10px;} #bo_v_title .bo_v_tit{font-size:1.3em;} .cmt_btn span.total{color:#000;} .cmt_btn span.total:after{background:#333;} #bo_w .btn_cancel{min-width:97px;} #bo_w .bo_w_tit #btn_autosave{height:39px; line-height:39px; top:3px; right:3px;} input[type=text], input[type=password], textarea, select{-webkit-box-shadow:none; box-shadow:none !important; border:1px solid #ddd; font-size:14px;} #bo_gall #gall_ul {margin:10px -20px 0;} .gall_row .col-gn-0,.gall_row .col-gn-1,.gall_row .col-gn-2,.gall_row .col-gn-3,.gall_row .col-gn-4,.gall_row .col-gn-5,.gall_row .col-gn-6,.gall_row .col-gn-7,.gall_row .col-gn-8,.gall_row .col-gn-9,.gall_row .col-gn-10 {padding-left:20px; padding-right:20px;} #bo_gall .gall_img{border:0px;} #bo_gall .gall_text_href{text-align:center;} #bo_gall .gall_info{text-align:center;} #bo_gall .bo_cnt{color:#666; } #bo_gall .gall_text_href a{font-weight:normal;} .bo_tit .new_icon{background:#C41B4C !important; color:#fff !important; font-weight:normal !important; font-size:0.6em !important; text-align:left; padding:0 3px; width:auto !important;} #bo_list tbody .even td {background:#fff} #bo_list tbody tr:hover {border-left:0px solid #253dbe; } #bo_list tbody tr:hover td {background:#f7f7f7} #reg_result .reg_result_p{color:#000;} #reg_result{border:0; background:none; text-align:center;} #reg_result .result_txt{text-align:center;} #mb_confirm p strong, #pw_confirm p strong{color:#000;} #bo_cate_ul {padding:0px;margin:10px 0; margin-bottom:20px; border-bottom:1px solid #ddd} #bo_cate_ul h2 {position:absolute;font-size:0;line-height:0;overflow:hidden} #bo_cate_ul ul {zoom:1} #bo_cate_ul ul:after {display:block;visibility:hidden;clear:both;content:""} #bo_cate_ul li {display:inline-block;padding:0px; min-width:150px; padding-right:2px; text-align:center;} #bo_cate_ul a {display:block;line-height:40px;padding:0 20px;border-radius:0px;border:1px solid #ddd; background:#fff; border-bottom:0px; text-align:center; color:#000;} #bo_cate_ul a:focus, #bo_cate_ul a:hover, #bo_cate_ul a:active {text-decoration:none;background:#d2d6dc; border:1px solid #d2d6dc; border-bottom:0px;} #bo_cate_ul #bo_cate_on {z-index:2;background:#333;color:#fff;font-weight:500; border:1px solid #333; border-bottom:0px; box-shadow:none;} #faq_wrap li h3.faq_li_open a{color:#000;} #faq_con .con_inner .closer_btn{color:#000;} h2.con_tit{clear:both; display:block; margin-top:20px; text-align:left; font-size:2em; line-height:1.4; font-weight:400; margin-bottom:30px;} h2.con_tit span{font-size:1em; color:#af941b;} h4.tit{display:block; margin:50px 0 25px 0; font-size:1.5em; line-height:1.4; font-weight:700;} .tcenter{text-align:center !important;} /* 인사말 */ .our_vision {width:100%;} .our_vision:after{content:""; clear:both; display:block;} .our_vision .ceo_message {position:relative; width:100%; min-width:320px; max-width:80%; margin:0 auto; margin-top:-50px; background:#fff; font-size:1.1em;} .our_vision .ceo_message:after{content:""; clear:both; display:block;} .our_vision .ceo_message .left{float:left; width:45%; font-size:0.95em; line-height:1.5em; text-align:justify; padding:50px 0; margin-left:3%;} .our_vision .ceo_message .right{float:right; width:45%; font-size:0.95em; line-height:1.5em; text-align:justify; padding:50px 0; margin-right:3%;} .our_vision .ceo_message .sign {clear:both; display:block; text-align:right; padding-right:0px; font-size:1em; color:#000; margin-top:30px;} .our_vision .ceo_message .sign .ceo_sign {display:block; font-size:2em; font-weight:500; letter-spacing:0em; text-align:right; font-family: "Qwitcher Grypen", cursive; font-weight:700;} .our_vision .ceo_message > img{width:100%; max-width:1200px; margin-bottom:50px;} .our_vision .ceo_message span{font-size:1em;} .our_vision .ceo_message p.circle{padding:50px 0; text-align:left; font-size:0.8em; color:#ccc;} .our_vision .ceo_message p.circle i{padding-right:20px;} .our_vision .ceo_message .all{width:100%; font-size:0.95em; line-height:1.5em; text-align:justify; padding:50px 4%;} .step_box4{width:100%; max-width:1780px; margin:0 auto; margin-bottom:50px; } .step_box4:after{content:""; display:block; clear:both;} .step_box4 ul{width:100%;} .step_box4 ul li{position:relative; float:left; width:21.5%; height:auto; margin-right:4.66%; padding:0px; box-sizing:border-box; background:#f1f1f1;} .step_box4 ul li .line{z-index:1; position:absolute; content:""; left:50%; top:50%; transform:translate(-50%,-50%); display:block; width:calc(100% - 40px); height:calc(100% - 40px); border:1px solid #ddd;} .step_box4 ul li:after{position:absolute; right:-13%; top:50%; transform: translateY(-50%); content:""; display:block; text-align:center; font-size:1em; color:#333; content:'\f219'; font-family: "FontAwesome"; transition: 0.5s all ease;} .step_box4 ul li:last-child{margin-right:0;} .step_box4 ul li:last-child:after{display:none;} .step_box4 ul li .imgs{width:100%;} .step_box4 ul li .imgs img{width:100%;} .step_box4 ul li .txts{position:relative; width:100%; padding:35px; text-align:center; } .step_box4 ul li .txts p{display:block; margin-bottom:15px; font-size:3em; color:#000; line-height:1.4; font-weight:500; font-family: "Qwitcher Grypen", cursive;} .step_box4 ul li .txts span{display:block; font-size:1.1em; color:#333; line-height:1.4; word-break:keep-all; height:50px;} .step_box3{width:100%; max-width:1780px; margin:0 auto; margin-bottom:50px;} .step_box3:after{content:""; display:block; clear:both;} .step_box3 ul{width:100%;} .step_box3 ul li{position:relative; float:left; width:30.2%; height:auto; margin-right:4.66%; padding:0px; box-sizing:border-box; background:#f1f1f1;} .step_box3 ul li .line{z-index:1; position:absolute; content:""; left:50%; top:50%; transform:translate(-50%,-50%); display:block; width:calc(100% - 40px); height:calc(100% - 40px); border:1px solid #ddd;} .step_box3 ul li:after{position:absolute; right:-10%; top:50%; transform: translateY(-50%); content:""; display:block; text-align:center; font-size:1em; color:#333; content:'\f219'; font-family: "FontAwesome"; transition: 0.5s all ease;} .step_box3 ul li:last-child{margin-right:0;} .step_box3 ul li:last-child:after{display:none;} .step_box3 ul li .imgs{width:100%;} .step_box3 ul li .imgs img{width:100%;} .step_box3 ul li .txts{position:relative; width:100%; min-height:200px; padding:35px; text-align:center;} .step_box3 ul li .txts p{display:block; margin-bottom:15px; font-size:1.5em; color:#000; line-height:1.4; font-weight:500; } .step_box3 ul li .txts span{display:block; font-size:1.1em; color:#333; line-height:1.4; word-break:keep-all;} .order_info{width:100%; background:#000; font-size:1em; color:#fff; line-height:1.6; text-align:center; padding:80px 4%; word-break:keep-all; } .order_info p{margin-bottom:20px; font-size:3em; color:#fff; line-height:1; word-break:keep-all; font-weight:500; font-family: "Qwitcher Grypen", cursive} .order_info.headquarters{background:url('../image/sub_visual_headquarters.jpg') no-repeat top left; background-size:250%;} .order_info.style_guide{background:url('../image/sub_visual_style_guide.jpg') no-repeat top left; background-size:200%; } /* 오시는길 */ .map_wrap{width:100%; max-width:1400px; margin:50px auto 0;} .map_wrap:after{content:""; display:block; clear:both;} .map_wrap h2.con_tit{display:block; text-align:center; font-size:2em; line-height:1.4; font-weight:700;} .map_wrap h2.con_tit span{font-size:1em; color:#af941b;} .map_wrap .g_map{width:100%; height:401px; margin-top:30px; background:#eee; overflow:hidden;} .map_wrap .g_map:after{content:""; display:block; clear:both;} .map_wrap .map_info{width:100%; margin-top:20px;} .map_wrap .map_info:after{content:""; display:block; clear:both;} .map_wrap .map_info ul{width:100%; margin:0; text-align:center;} .map_wrap .map_info ul li{width:30%; display:inline-block; vertical-align:top; text-align:center;} .map_wrap .map_info ul li:last-child{margin-right:0;} .map_wrap .map_info ul li strong{display:block; font-size:1.25em; color:#000; line-height:1.4; font-weight:700;} .map_wrap .map_info ul li p{display:block; margin-top:10px; font-size:1.15em; color:#222; line-height:1.6; word-break:keep-all;} .map_wrap .map_all{width:100%; clear:both; margin-bottom:80px; overflow:hidden; border-top:1px solid #eee; margin-top:30px;} .map_wrap .map_all .map_greeting{width:100%; display:block; text-align:center; margin:50px auto; font-size:1.1em;} .map_wrap .map_all .map_img{width:100%; column-count:5;} .map_wrap .map_all .map_img .item{display:inline-block; width:100%; break-inside:avoid; margin-bottom:14px;} .map_wrap .map_all .map_img .item img{width:100%; max-width:700px;} /* 온라인상담접수 */ .repair_online{width:100%; max-width:1200px; padding:0 4%; margin:0 auto;} .repair_online .online_box{width:100%;} .repair_online .online_box:after{content:""; display:block; clear:both;} .repair_online .online_box ul{width:100%; margin:0; padding:0;} .repair_online .online_box ul li{float:left; width:100%; margin-bottom:10px;} .repair_online .online_box ul li .tit{margin:20px 0 10px 0; font-size:1em; color:#000; line-height:1.6; letter-spacing:0.15em; font-weight:500;} .repair_online .online_box ul li:first-child .tit{margin-top:0;} .repair_online .online_box ul li dl{width:100%; vertical-align:top; margin:0; font-size:0;} .repair_online .online_box ul li dl dd{width:100%; display:inline-block; vertical-align:middle;} .repair_online .online_box ul li dl dd.w3{float:left; width:32%; margin-right:2%;} .repair_online .online_box ul li dl dd.w3:last-child{margin-right:0;} .repair_online .online_box ul li dl dd input[type="text"]{width:100%; max-width:100%; height:50px; font-size:1em; color:#000; padding:0 20px; background-color:#fff; border:1px solid #ddd; box-sizing:border-box;} .repair_online .online_box ul li dl dd input::placeholder{font-size:1em; color:#a2a2a2;} .repair_online .online_box ul li dl dd textarea { width:100%; height:120px; font-size:1em; padding:15px 20px; resize:none; border:1px solid #ddd; box-sizing:border-box; background-color:#fff;} .repair_online .online_box ul li dl dd textarea::placeholder{font-size:1em; color:#a2a2a2;} .repair_online .agree {width:100%; text-align:center; margin-top:25px;} .repair_online .agree label{display:inline-block; vertical-align:middle; color:#272727; font-size:1em; cursor:pointer;} .repair_online .agree a{display:inline-block; vertical-align:middle; color:#fff; font-size:0.9em; margin-left:10px; padding:2px 8px; background:#aaa; transition:0.5s all ease;} .repair_online .agree a:hover{background:#333;} .btn_all{display:block; text-align:center; margin:50px auto;} .btn_all .rebtn{background:#fff; border:1px solid #000; display:inline-block; width:240px; height:65px; line-height:65px; padding:0; text-align:center; color:#000; cursor:pointer; transition:all 200ms ease-in;} .btn_all .rebtn:hover{color:#fff; background:#000;} /* 수선절차 */ .repair_step{width:100%; max-width:1780px; margin:100px auto; padding:0 4%;} .repair_step:after{content:""; display:block; clear:both;} .repair_step ul{width:100%;} .repair_step ul li{position:relative; float:left; width:21.5%; height:auto; margin-right:4.66%; padding:0px; box-sizing:border-box; background:#fff; border:1px solid #ddd;} .repair_step ul li .line{z-index:1; position:absolute; content:""; left:50%; top:50%; transform:translate(-50%,-50%); display:block; width:calc(100% - 40px); height:calc(100% - 40px); border:1px solid #ddd;} .repair_step ul li:after{position:absolute; right:-13%; top:50%; transform: translateY(-50%); content:""; display:block; text-align:center; font-size:2em; color:#333; content:'\f105'; font-family: "FontAwesome"; transition: 0.5s all ease;} .repair_step ul li:last-child{margin-right:0;} .repair_step ul li:last-child:after{display:none;} .repair_step ul li img{width:100%; max-width:500px;} .repair_step ul li i{display:block; width:50px; height:50px; line-height:50px; margin:0 auto; font-size:2em; color:#000; font-style:normal; font-family: "FontAwesome";} .repair_step ul li .txts{width:100%; padding:35px; text-align:center; } .repair_step ul li .txts p{position:absolute; left:0; top:0; display:block; width:40px; height:40px; font-size:1em; color:#fff; line-height:40px; font-weight:500; background:#000;} .repair_step ul li .txts span{display:block; font-size:1.1em; color:#333; line-height:1.6; word-break:keep-all; height:50px;} /*팀원소개*/ .team_intro{width:100%; max-width:1600px; margin:50px auto;} .team_intro ul{width:100%;} .team_intro ul li{position:relative; float:left; width:30%; height:auto; margin-right:5%; padding:0px; box-sizing:border-box; text-align:center; margin-bottom:70px;} .team_intro ul li:nth-child(3n+1){clear:both;} .team_intro ul li:nth-child(3n){margin-right:0;} .team_intro ul li img{width:100%; max-width:500px; margin-bottom:20px; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); shape-outside: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);} .team_intro ul li p.name{font-size:1.3em; font-weight:600; text-align:center;} .team_intro ul li p.jik{font-size:1em; text-align:center; margin-top:10px; border-bottom:1px solid #ddd; padding-bottom:10px;} .team_intro ul li p.expl{font-size:1em; text-align:center; margin-top:10px;} .lview{} .sview{display:none;} .mview{display:none;} .saview{display:none;} @media all and (max-width:1700px){ #rolling_bnr .swiper-box{max-width:1000px;} #header.header_on{height:580px !important;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all{height:500px;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all1{height:500px;} #lnb .lnb_sub_all{max-width:95%;} #lnb .lnb_sub_right{width:60%;} } @media all and (max-width:1600px){ #header.header_on{height:560px !important;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all{height:480px;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all1{height:480px;} } @media all and (max-width:1500px){ #header.header_on{height:540px !important;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all{height:480px;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all1{height:480px;} #rolling_bnr .swiper-slide .txt-box h4.tit{font-size:2.5em;} #rolling_bnr .swiper-slide .txt-box .txts strong{font-size:1.25em;} #rolling_bnr .swiper-slide .txt-box .txts p{font-size:1em;} #news_rolling_bnr .swiper-slide{overflow:hidden;} #news_rolling_bnr .swiper-slide .img-box{height:auto;} #news_rolling_bnr .swiper-slide .txt-box{height:auto;} #news_rolling_bnr .swiper-slide .txt-box h4.tit{font-size:2.5em;} #news_rolling_bnr .swiper-slide .txt-box .txts strong{font-size:1.25em;} #news_rolling_bnr .swiper-slide .txt-box .txts p{font-size:1em;} .our_vision .ceo_message{max-width:94%;} } @media all and (max-width:1400px){ #header.header_on{height:520px !important;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all{height:460px;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all1{height:460px;} } @media all and (max-width:1300px){ #lnb .lnb_wrap > ul > li > a{padding:0 15px;} #header.header_on{height:480px !important;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all{height:420px;} #lnb .lnb_wrap > ul > li.notlogo:hover .lnb_sub_all1{height:420px;} } @media all and (max-width:1200px){ #wrap.sub{margin-top:70px;} #header_all.sub{border-bottom:1px solid #ddd;} #header_wrap{display:none;} #header_area .mobile_menu{display:block;} #header_area{height:70px;} #header_area .header_logo{padding-top:13px;} #header_area .header_logo img{width:40px;} #header_area .mobile_menu{left:5px; bottom:5px;} #header_area .search{right:15px; bottom:10px;} #header_area .search ul li{margin:0px;} #header_area .search ul li.pc{display:none;} #main_bn{width:100%; min-height:auto;} } @media all and (max-width:1100px){ .map_wrap .map_all{margin-bottom:0;} .map_wrap .map_all .map_img{column-count:4;} .step_box4 ul li{width:47%; margin-right:6%; margin-bottom:4%;} .step_box4 ul li:after{right:-8.5%;} .step_box4 ul li:nth-child(even):after{display:none;} .step_box4 ul li:nth-child(even){float:right; margin-right:0;} .repair_step ul li{width:47%; margin-right:6%; margin-bottom:4%;} .repair_step ul li:after{right:-8.5%;} .repair_step ul li:nth-child(even):after{display:none;} .repair_step ul li:nth-child(even){float:right; margin-right:0;} } @media all and (max-width:1024px){ #main_bn .all-txt-main a.btn_view{width:200px; height:50px; line-height:50px;} .m_bnr_t{padding:50px 4%;} .all-txt-1 .tit1{font-size:3em;} .all-txt-1 .tit2{font-size:1.25em;} .all-txt-1 a.btn_view{width:200px; height:50px; line-height:50px;} .sec3 .con_box{flex-direction:column !important;} .sec3 .con_box .img-box{width:100%;} .sec3 .con_box .txt-box{width:100%; padding:40px 4% 50px 4%;} .sec4 .con_box .txt-box{width:100%; padding:40px 4% 50px 4%;} .sec5 .con_box{flex-direction:column !important;} .sec5 .con_box .img-box{width:100%;} .sec5 .con_box .txt-box{width:100%; padding:20px 4% 30px 4%;} #rolling_bnr .swiper-box{width:80% !important;} #rolling_bnr .swiper-slide{flex-direction:column;} #rolling_bnr .swiper-slide .img-box{width:100%;} #rolling_bnr .swiper-slide .img-box img{width:100%;} #rolling_bnr .swiper-slide .txt-box-all{position:relative; width:100%; min-height:300px; padding-top:unset; top:unset; transform:unset; } #rolling_bnr .swiper-slide.swiper-slide-active .txt-box-all{background:rgba(100,45,14,1);} #rolling_bnr .swiper-slide.swiper-slide-active:nth-child(even) .txt-box-all{background:rgba(99,100,14,1);} #news_rolling_bnr .swiper-box{max-width:600px;} #c_btn{margin-bottom:50px;} #c_btn ul li{width:50%; margin:25px 0px;} .con_box.pc{display:none;} .con_box.mobile{display:block;} #main_bn1 .all-txt-main{padding:0 5%; margin:0 auto;} #main_bn1 .all-txt-main .tit1{ line-height:1em;} #main_bn1 .all-txt-main a.btn_view{width:200px; height:50px; line-height:50px;} } @media all and (max-width:992px){ #rolling_bnr .swiper-slide .txt-box-all .line{display:block; border-bottom:0; height:calc(100% - 20px); top:calc(50% + 10px);} #rolling_bnr .swiper-slide > .line{display:block;} .our_vision .ceo_message {width:94%; max-width:100%; margin:0 auto;} .our_vision .ceo_message .left {width:100%; float:none; margin:0 auto; padding:40px 1%; } .our_vision .ceo_message .right {width:100%; float:none; margin:0 auto; padding:40px 1%; padding-top:0; } .our_vision .ceo_message p.circle{padding:30px 0; font-size:0.6em;} .our_vision .ceo_message p.circle i{padding-right:10px;} .btn_all .rebtn{width:200px; height:50px; line-height:50px;} h2.con_tit{text-align:center; font-size:1.5em; margin-bottom:20px;} .step_box3{max-width:100%;} .step_box4{width:94%; max-width:100%;} .team_intro{width:94%;} .team_intro ul li{width:46%; margin-right:8%;margin-bottom:30px;} .team_intro ul li:nth-child(3n+1){clear:none;} .team_intro ul li:nth-child(3n){margin-right:8%;} .team_intro ul li:nth-child(2n+1){clear:both;} .team_intro ul li:nth-child(2n){margin-right:0;} } /* 기기 900px 이하 */ @media all and (max-width:900px){ #main_bn{display:none;} #main_bn1{display:block;} #main_bn1 .all-txt-main{top:50%;} .step_box4 ul li:after{right:-10%;} .step_box4 ul li .txts{padding:30px 25px;} .step_box4 ul li .txts p{margin-bottom:0;} .step_box3 ul li{display:flex; align-items:center; width:100%; margin-right:0; margin-bottom:40px;} .step_box3 ul li:after{right:unset; top:unset; left:50%; bottom:-25px; transform:translateX(-50%);} .step_box3 ul li:last-child{margin-bottom:0;} .step_box3 ul li .imgs{width:50%;} .step_box3 ul li .txts{width:50%; min-height:auto; padding:35px 25px;} .repair_step{margin:50px auto;} .repair_step ul li:after{right:-10%;} .repair_step ul li .txts{padding:30px 10px;} .repair_step ul li .txts p{width:35px; height:35px; line-height:35px;} } @media all and (max-width:768px){ #main_bn .owl_pager{display:none;} #main_bn1 .all-txt-main .tit1{font-size:2.5em; line-height:1em;} #main_bn1 .all-txt-main .tit2{font-size:1.5em;} .all-txt-1 a.btn_view{width:100%;} .all-txt-1 a.btn_view span{font-size:0.9em;} .all-txt-1 a.btn_view1{width:100%;} .all-txt-1 a.btn_view1 span{font-size:0.9em;} .sec4 .all-txt-1 a.btn_view{width:200px !important;} #rolling_bnr .swiper-btn-wrap{display:none;} #news_letter {margin-bottom:40px;} #news_rolling_bnr .swiper-slide{flex-direction:column; } #news_rolling_bnr .swiper-slide .img-box{width:100%; text-align:center;} #news_rolling_bnr .swiper-slide .txt-box{width:100%;} #news_rolling_bnr .swiper-slide .txt-box-all{width:100%;} #news_rolling_bnr .swiper-slide .txt-box-all .txt-box{position:relative; top:unset; left:unset; transform:unset;} #news_rolling_bnr .swiper-btn-wrap{display:none;} #news_rolling_bnr .swiper-button-prev_B{left:0;} #news_rolling_bnr .swiper-button-next_B{right:0;} #footer{padding:60px 4%;} #footer_area ul li{padding:0 5px;} #footer_area ul li.comm_bt{display:block; margin-top:20px;} #footer_area .cs p{display:block; padding-right:0; } .map_wrap .map_info ul li{width:100%; margin-top:20px; text-align:left;} .map_wrap .map_all .map_img{column-count:3;} .step_box4 ul li{width:45%; margin-right:10%;} .step_box4 ul li:after{right:-15%;} .step_box4 ul li .txts{padding:15px 25px;} .order_info{background-size:cover !important;} } @media all and (max-width:640px){ .index_main20 .owl-nav{height:22px;} .line{width:calc(100% - 20px) !important; height:calc(100% - 20px) !important;} #rolling_bnr .swiper-slide .txt-box-all .line{top:calc(50% + 5px); height:calc(100% - 10px) !important;} .step_box4 ul li{width:100%; margin-right:0; margin-bottom:40px;} .step_box4 ul li:after{right:unset; left:50%; top:unset; bottom:-25px; transform: translateX(-50%);} .step_box4 ul li:nth-child(even):after{display:block;} .step_box4 ul li:last-child:after{display:none;} .step_box3 ul li{flex-direction:column;} .step_box3 ul li .imgs{width:100%;} .step_box3 ul li .txts{width:100%;} .all-txt-1.wh a.btn_view1{width:auto; padding:0 10px;} } @media all and (max-width:480px){ .sec3 .con_box .txt-box{width:100%; padding:20px 6% 50px 6%;} .sec4 .con_box .txt-box{width:100%; padding:20px 6% 50px 6%;} .sec5 .con_box .txt-box{width:100%; padding:20px 4% 30px 4%;} #c_btn ul li img{max-width:80px;} #c_btn p.btn_view1{font-size:0.9em; padding:7px 15px;} .all-txt-1 .txts{padding:0 15px;} #footer_area .cs p{font-size:0.9em;} #footer_area .cs span{font-size:0.9em;} #footer_area .copy_logo img{width:50px;} .map_wrap .map_all .map_img{column-count:2;} .team_intro ul li{width:100%; margin-right:0;margin-bottom:50px;} .team_intro ul li:nth-child(3n+1){clear:both;} .team_intro ul li:nth-child(3n){margin-right:0;} .team_intro ul li:nth-child(2n+1){clear:both;} .team_intro ul li:nth-child(2n){margin-right:0;} }