@charset "UTF-8"; .tabDepth>a, .lastDepth>a, .depth3>a, .depth3>a>span:before, .faq_list>li .q, .faq_list>li .q>.bul, #mVisual .visualRoll .slider>div, #mVisual .vTxtArea .ii, #mVisual .slick-dots>li button, #mVisual .slick-dots>li button:before, #mVisual .vTxt .ii, #mVisual .iconMenu .inConts>a, .swiper-button, .swiper-pagination-bullet, .m-tab>a, #quick-right>a, .store-area>.store-map .thumb .finding-map-link, .store-area>.store-map .thumb .finding-map-link:after, #quick-right, #quick-social{transition: all .3s ease-out; transform-origin: 50% 50%;} .historyArea .history_box>.logo>span, .historyArea .history_box>.list:before, #mVisual .vTxt .ii{transition: all .5s ease-out; transform-origin: 50% 50%;} #mainVisual .vTxt .ii{transition: all .7s ease-out; transform-origin: 50% 50%;} #mVisual .visualRoll .slider .photoBox p{transition: all 1s ease-out; transform-origin: 50% 50%;} #mainVisual .visualRoll .swiper-slide>img{transition: all 2s ease-out; transform-origin: 50% 50%;} /*[s] All Style */ .f0{font-size:0; line-height:0;} .depth-three{width:100%; margin-bottom:3rem; font-size:0; line-height:0; text-align: center; overflow:hidden; display: flex; justify-content: center; } .depth-three>a{width:20rem; height:6.5rem; background-color: #f8f8f8; border:1px solid #e2e2e2; font-weight:500; font-size:1.8rem; line-height:1.2; color: #666; display: flex; align-items: center; justify-content: center; transition: all .3s ease-out; position: relative;} .depth-three>a+a{margin-left:-1px;} .depth-three>a:is(:hover, .active){background-color: var(--point); border-color:var(--point); color:#fff; z-index:2;} .depth-three-conts{display:none;} h4.bul{margin-bottom:4rem; padding-left:1.7rem; font-weight: 600; font-size:2.8rem; line-height:1; color: #111; position: relative;} h4.bul:before{content: ""; width: 0.6rem; height: 2.8rem; background-color: var(--point); position:absolute; left: 0; top:0;} /**+h4.bul{margin-top:6.5rem;}*/ .lattice{background-size: 1rem, 3rem, 1rem 1rem, 3rem 3rem; background-image: linear-gradient(90deg, #ededed 1px, transparent 1px), linear-gradient(90deg, #ededed 1px, transparent 1px), linear-gradient(#ededed 1px, transparent 1px), linear-gradient(#ededed 1px, transparent 1px);} .wideFrame{height: 0; padding-bottom: 56.25%; position: relative;} .wideFrame>video, .wideFrame>iframe{width: 100%; height: 100%; position: absolute; left: 0; top: 0;} .wideFrame.h740{height: 74rem; padding-bottom: 0;} .wideKakao{width: 100%; margin: 0 auto; position: relative;} .wideKakao>.root_daum_roughmap{width: 100%; height:56rem;} .wideKakao>.root_daum_roughmap .wrap_map{height:100%; position: absolute; left: -1px; right: -1px; top: -1px;} .wideKakao .hide {display: none;} .hd-bar{padding-top:4px; background:linear-gradient( to right, #0a9680 0, #0a9680 58%, #221e1f 58%, #221e1f 72%, #d8922a 72%, #d8922a) no-repeat; background-size:100% 4px;} .scrollTb{display:inline-block; font-size:0; line-height:0; text-align: center;} .scrollTb img{max-width:none;} .nTable.scrollTb{padding-bottom:2rem;} .scroll_info{width:100%; padding:4rem 0; font-size:0; line-height:0; position: relative; display:none;} .scroll_info:before{content:"← scroll →"; margin-top:0; font-size:1.8rem; line-height:1; color: #ff0000; display:inline-block; position: absolute; left:44%; top:2rem; animation-duration: 1s; animation-iteration-count:infinite; animation-name: scrollMove; animation-timing-function:ease-In-Out;animation-direction:alternate;} @keyframes scrollMove { from {color: #222; left:42%;} to {color: var(--point); left:46%;} } select.base{width:100%; height:4rem; padding:0 5rem 0 2rem; background:#fff url('/images/bg_select_arr_m.png') no-repeat right center; background-size:3rem; border:1px solid #ccc; font-weight: 400; font-size:1.5rem; line-height:3.8rem; color: #666; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius:5px; box-sizing:border-box;} select.base::-ms-expand{display:none;} .bg_bk{background-color:#000 !important;} .fw_7{font-weight:700 !important;} .fw_6{font-weight:700 !important;} .num_list{counter-reset:num_li;} .num_list > *{counter-increment:num_li;} .num_list > *::before{content:counter(num_li);} .dash_list > *{padding-left:1.2rem; position:relative;} .dash_list > *::before{content:"-"; position:absolute; left:0; top:0;} .sw_common .swiper-pagination.swiper-pagination-bullets{width:auto; display: flex; align-items: center; gap:1rem; flex-direction:column; position:absolute; right:3rem; top:3rem; left:auto; z-index:8;} .sw_common .swiper-pagination-bullet{width:1.2rem; height:1.2rem; border:1px solid #fff; border-radius:0; background-color:transparent; transform:rotate(45deg); opacity:1;} .sw_common .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color:#001E78;} .hex_tit, .hex_btn{display: inline-flex; align-items: center; justify-content: center; vertical-align:bottom;} .hex_btn::before{content:""; display:block; width:2.6rem; height:4.7rem; background:url("/images/hex_btn_left_w.svg") no-repeat right center/contain;} .hex_btn::after{content:""; display:block; width:2.6rem; height:4.7rem; background:url("/images/hex_btn_right_w.svg") no-repeat left center/contain;} .hex_btn span{display:inline-block; padding:0.7rem 0.4rem 1rem; line-height:1.3; font-size:2rem; font-weight:500; color:#fff; border-top:0.2rem solid #fff; border-bottom:0.2rem solid #fff} .hex_btn.gray::before{background-image:url("/images/hex_btn_left_g.svg");} .hex_btn.gray::after{background-image:url("/images/hex_btn_right_g.svg");} .hex_btn.gray span{color:#9FA0A0; border-color:#D9D9D9;} .hex_btn.gray_w::before{background-image:url("/images/hex_btn_left_g_w.svg");} .hex_btn.gray_w::after{background-image:url("/images/hex_btn_right_g_w.svg");} .hex_btn.gray_w span{color:#9FA0A0; border-color:#9FA0A0; background-color:#fff;} .hex_btn.sky_blue::before{background-image:url("/images/hex_btn_left_sb.svg");} .hex_btn.sky_blue::after{background-image:url("/images/hex_btn_right_sb.svg");} .hex_btn.sky_blue span{color:#99C1DA; border-color:#99C1DA;} .hex_btn.fill span{color:#111; background-color:#fff;} .hex_btn.fill::before{background-image:url("/images/hex_btn_left_fill.svg");} .hex_btn.fill::after{background-image:url("/images/hex_btn_right_fill.svg");} .hex_btn.offline::before, .hex_btn.offline::after{display:none;} .hex_tit::before{content:""; display:block; width:1.8rem; height:3.5rem; background:url("/images/hex_tit_left.svg") no-repeat right center/contain;} .hex_tit::after{content:""; display:block; width:1.8rem; height:3.5rem; background:url("/images/hex_tit_right.svg") no-repeat left center/contain;} .hex_tit span{display:inline-block; padding:0.1rem 0.2rem 0.2rem; font-size:2.3rem; line-height:1.3; font-weight:400; color:#9FA0A0; border-top:1px solid #9FA0A0; border-bottom:1px solid #9FA0A0; background-color:#fff;} .main_sect_tit{font-size:6.8rem; line-height:1.3; font-weight:700; color:#111; text-align:center;} .main_sect_int{margin-top:1.5rem; font-size:2.8rem; line-height:1.2; color:#9FA0A0; text-align:center;} .bg_bk .main_sect_tit{color:#fff} .bg_bk .main_sect_int{color:#8b8b8b} .angle_t{display:inline-flex; align-items:center; line-height:normal; vertical-align:bottom;} .angle_t::before{content:""; display:inline-block; width:3.6rem; height:6.5rem; background:url("/images/ico_angle_t_left_w.svg") no-repeat center/contain;} .angle_t::after{content:""; display:inline-block; width:3.6rem; height:6.5rem; background:url("/images/ico_angle_t_right_w.svg") no-repeat center/contain;} .main_bann{position:relative;} .main_bann .txt_box{padding:7rem; display:flex; align-content:flex-end; flex-wrap:wrap; color:#fff; position:absolute; inset:0 0 0 0;} .main_bann .txt_box .tit{width:100%; font-size:5.4rem; line-height:7rem; white-space:normal;} .main_bann .txt_box .tit+.txt{margin-top:1.3rem;} .main_bann .txt_box .txt{width:100%; font-size:2.6rem; line-height:1.3;} .sw_box03 .sw_contain{overflow:hidden;} .sw_box03 .sw_contain .swiper-slide{width:45rem;} .sw_box03 .sw_contain .swiper-slide > a{color:#9FA0A0;} .sw_box03 .sw_contain .swiper-slide .thumb img{width:100%; height:100%; aspect-ratio:1/1; object-fit:cover;} .sw_box03 .sw_contain .swiper-slide .cont_box{padding-top:2.5rem;} .sw_box03 .sw_contain .swiper-slide .cont_box .tit{font-size:2.4rem; line-height:1.3; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; /*white-space:nowrap;*/ overflow:hidden;} .sw_box03 .sw_contain .swiper-slide .cont_box .txt{margin-top:1rem; font-size:2.4rem; line-height:1.3;} .sw_box03 .sw_contain .swiper-slide .cont_box .txt.bk_t{color:#333} .sw_box03 .sw_contain .control_box{margin-top:4rem; display:flex; justify-content:space-between; align-items:center; gap:1rem} .sw_box03 .sw_contain .swiper-button{width:2.3rem; height:2.3rem; margin:0; border:1px solid #9FA0A0; background-repeat:no-repeat; background-position:center; background-size:contain; position:static;} .sw_box03 .sw_contain .swiper-button-prev{background-image:url("/images/ico_sw_prev.svg");} .sw_box03 .sw_contain .swiper-button-next{background-image:url("/images/ico_sw_next.svg");} .sw_box03 .sw_contain .swiper-button::after{display:none;} .sw_box03 .sw_contain .swiper-pagination{position:static; background-color:transparent;} .sw_box03 .sw_contain .swiper-pagination::before{content:""; margin-top:0.2rem; display:block; width:100%; height:0.2rem; background-color:#d9d9d9;} .sw_box03 .sw_contain .swiper-pagination .swiper-pagination-progressbar-fill{height:0.6rem; background-color:#00215C;} .sw_box03.sw_project .sw_contain .swiper-slide .cont_box .txt{margin-top:1.3rem; font-family:var(--stevie);} *[data-color-type="trinity_bespoke"]{--color_type : #7B1822 !important;} *[data-color-type="honors"]{--color_type : #003668 !important;} *[data-color-type="trinity"]{--color_type : #C2000E !important;} *[data-color-type="diamond"]{--color_type : #1EA0F0 !important;} *[data-color-type="platinum"]{--color_type : #005EBE !important;} *[data-color-type="gold"]{--color_type : #A67C00 !important;} .hex_btn_li>li>a, .hex-g{padding:0 calc((5.8rem * 0.70710678) / 1.41421356237); display: inline-flex; align-items: center; justify-content: center; position: relative;} .hex_btn_li>li>a:before, .hex_btn_li>li>a:after, .hex-g:before, .hex-g:after{content:""; background-color:#fff; border:1px solid #9FA0A0; block-size:calc(100% - 2px); aspect-ratio:1/1; position:absolute; top:50%; transform-origin:center; transition: all .3s ease-out} .hex_btn_li>li>a:before, .hex-g:before{left:0; transform:translate(0%, -50%) rotate(45deg) scale(0.70710678);} .hex_btn_li>li>a:after, .hex-g:after {right:0; transform:translate(0%, -50%) rotate(45deg) scale(0.70710678);} .hex_btn_li>li>a>span, .hex-g>span{padding:1.5rem 2rem; border-top:1px solid #9FA0A0; border-bottom:1px solid #9FA0A0; background-color: #fff; font-size:2rem; line-height:1.3; color: #333; display: flex; align-items: center; justify-content: center; position: relative; z-index:2; transition: all .3s ease-out} .hex-g.trans{overflow:hidden;} .hex-g.trans>span, .hex-g.trans::before, .hex-g.trans::after{background-color:transparent;} .hex-g.trans::before{border-right:none; border-top:none;} .hex-g.trans::after{border-left:none; border-bottom:none;} /*[e] All Style */ /*[s] Main Popup Style */ #hd_pop {z-index:101;position:relative;margin:0 auto;height:0} #hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden} .hd_pops{width:auto !important; max-width:100%; height:auto !important; background-color:#fff; position:absolute; display:block; border-radius: 1rem; overflow:hidden; box-sizing:border-box; box-shadow:0 0 3rem rgba(0,0,0,0.5);} .hd_pops img{width:100%} .hd_pops_con{} .hd_pops_footer{display: flex; gap: 1rem; justify-content: space-between; padding: 15px 2rem; font-size: 0; line-height: 0; color:#888; text-align:left;position:relative} .hd_pops_footer.white{background-color: #fff;} .hd_pops_footer.black{background-color: #000;} .hd_pops_footer .hd_pops_reject {position: relative; font-size: 14px; line-height: 1; color: #888; padding: 0 0 0 20px;} .hd_pops_footer .hd_pops_reject::before{position: absolute; content: ''; width: 14px; height: 14px; top: 0; left: 0; border: 1px solid #888; background-color: #fff;} .hd_pops_footer .hd_pops_reject::after{position: absolute; content: ''; width: 10px; height: 10px; top: 2px; left: 2px; background-image: url('/img/icon_check.svg'); background-repeat: no-repeat; background-size: contain; background-position: center;} .hd_pops_footer .hd_pops_close{width: 14px; height: 14px;/* background-image: url('/img/icon_close.svg'); background-repeat: no-repeat; background-size: contain; background-position: center; */} /* black */ .hd_pops_footer.black .hd_pops_reject {color: #fff;} .hd_pops_footer.black .hd_pops_reject::before{border: 1px solid #fff;} /* .hd_pops_footer.black .hd_pops_reject::after{filter: brightness(0) saturate(100%) invert(100%);} */ .hd_pops_footer.black .hd_pops_close{filter: brightness(0) saturate(100%) invert(100%);} #popLayer{width:100%; height:100%; font-size:0; line-height:0; position:fixed; left:0; top:0; z-index:99; overflow:hidden; overflow-y:auto;} #popLayer.disNone{display:none !important;} #popLayer #moPopArea{width:100vw; height:100vh; padding:10rem 3rem; box-sizing: border-box; display: flex; flex-wrap: wrap; flex-direction: row; align-items: flex-start; justify-content: flex-start; -ms-flex-align:center;} #popLayer #moPopArea .moPop{width:100%; max-width:50rem; margin:0; position: relative;} #popLayer #moPopArea #moPopRoll{background-color: #fff; border-radius:2rem; overflow:hidden; box-shadow:0 2rem 4rem rgba(0,0,0,0.3);} #popLayer .slider{width:100%; border-radius:2rem 2rem 0 0; box-sizing:border-box; overflow:hidden;} #popLayer .slider img{width:100%; vertical-align: top;} #popLayer .slider .HKeditorContent{padding:20px; font-size:20px; line-height:1.5; color: #666;} #popLayer .slider .HKeditorContent img{width:auto;} #popLayer #moPopRoll.roll .slider{} #popLayer .layerPopClose{width:3rem; height:3rem; margin:0; padding:0; font-size:0; line-height:0; position: absolute; right:1.5rem; top:1.5rem; z-index:6; transform:rotate(45deg);} #popLayer .layerPopClose:before, #popLayer .layerPopClose:after{content: ""; background-color: #222; display: block; position:absolute; left: 50%; top:50%;} #popLayer .layerPopClose:before{width: 100%; height: 2px; margin:-1px 0 0 -1.5rem;} #popLayer .layerPopClose:after{width: 2px; height: 100%; margin:-1.5rem 0 0 -1px;} #popLayer .moPopClose{width:100%; border-radius:0 0 2rem 2rem; display: flex; justify-content: space-between; overflow:hidden;} #popLayer .moPopClose>*{flex:1 1 50%; height:6rem; font-size:1.6rem; line-height:1; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: center;} #popLayer .moPopClose button{background-color: #878896; border:none; color: #dcdeea; position: relative;} /*#popLayer .moPopClose button:before{content: "X"; width: 1.8rem; height: 1.8rem; background-color: rgba(255,255,255,0.3); border:1px solid #000; font-family: dotum; font-weight: bold; font-size:1.6rem; line-height:1.6rem; color: #000;display: inline-block; position:absolute; top:0; box-sizing: border-box;} #popLayer .moPopClose button.toDay_close{padding-left:2.5rem;} #popLayer .moPopClose button.toDay_close:before{left:0;}*/ #popLayer .moPopClose button.close{padding-right:2.5rem} #popLayer .moPopClose button.close:before{right:0;} #popLayer .moPopClose a{background-color: #3617cd; color:#fff} #popLayer .slick-dots{width:100%; padding:0; text-align: center; position: absolute; left:0; bottom:7rem; z-index:7;} #popLayer .slick-dots>li{margin:0 0.7rem; display:inline-block; vertical-align: top;} #popLayer .slick-dots>li+li{} #popLayer .slick-dots>li button{width:1.4rem; height:1.4rem; padding:0; background-color:#d4d7d9; border:none; font-size:0; line-height:0; position: relative; cursor: pointer; border-radius:999px; overflow:hidden; transition: all .3s ease-out;} #popLayer .slick-dots>li.slick-active button{width:30px; background-color: #333;} #popLayer #moPopArea #moPopRoll{opacity: 0; visibility: hidden; transition: opacity 1s ease;} #popLayer #moPopArea #moPopRoll.open, #popLayer #moPopArea #moPopRoll.slick-initialized{visibility: visible; opacity: 1;} /*[e] Main Popup Style */ /*[s] Main Style */ /* visual */ #main-visual, #main-visual .main-slider, #main-visual .main-slider .slick-slide, #main-visual .main-slider .slide-media, #main-visual .main-slider .mobile_in{height:760px !important;} #main-visual .main-slider .mobile_in{width: 242vw; position: relative; left:50%; transform: translateX(-50%);} #main-visual .main-slider .mobile_in video, #main-visual .main-slider .mobile_in iframe{width:100% !important; height:110% !important; position: absolute; left:0 !important; top:0 !important; transform: translate(0%, 0%);} #main-visual{width:100%; margin-bottom: 5rem; background:#36465d url('/theme/prix/img/loading.gif') no-repeat center center; background-size: contain; font-size:0; line-height:0; position: relative; overflow:hidden;} #main-visual .main-slider{width: 100%; background-color:#36465d; position: relative; opacity: 0; visibility: hidden; transition:all 3s ease;} #main-visual .main-slider.slick-initialized{opacity: 1; visibility: visible;} #main-visual .main-slider .slick-slide{position: relative; -webkit-backface-visibility: hidden; backface-visibility: hidden;} #main-visual .main-slider .slick-slide:before{content: ''; width: 100%; height: 100%; background-color: #000; position: absolute; top: 0; left: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; opacity: .3; z-index: 1;} #main-visual .main-slider video {width: auto; height: auto; min-width: 100%; min-height: 100%; display: block; position: absolute; left: 50%; top: 50%; transform:translate(-50%, -50%);} #main-visual .main-slider iframe {position: relative; pointer-events: none;} #main-visual .main-slider figure {height: 100%; margin:0; position: relative;} #main-visual .main-slider .slide-image {height: 100%; background-size: cover; background-position: center; opacity: 0; transition:all .8s ease;} #main-visual .main-slider .slide-image{opacity: 1;} #main-visual .main-slider .image-entity {width: 100%; opacity: 0; visibility: hidden;} #main-visual .main-slider .loading {width: 100%; position: absolute; left: 0; top: 44%;} #main-visual .main-slider .slide-media {background-repeat: no-repeat; background-position: center center; background-size: cover; animation:slideOut .4s cubic-bezier(0.4, 0.29, 0.01, 1);} #main-visual .main-slider .caption{position: absolute; left: 5%; top: 44%; text-align: center; padding: 20px; border: 3px solid; color: #fff; margin: 0; font-size: 40px; font-weight: bold; letter-spacing: .02em; opacity: 0; z-index: 1; transition:all .3s ease; transform:translateY(100px); -webkit-backface-visibility: hidden; backface-visibility: hidden;} #main-visual .main-slider .slick-active{z-index: 1;} #main-visual .main-slider .slick-active .slide-media{animation:slideIn 2.4s cubic-bezier(0.4, 0.29, 0.01, 1);} #main-visual .main-slider .slick-active .caption{opacity: 1; transform:translateY(0); transition:all .7s cubic-bezier(0.32, 0.34, 0, 1.62) .6s;} #main-visual .slick-arrow{width:47px; height:90px; background-color: transparent; background-repeat: no-repeat; background-position: center center; background-size: cover; border:none; font-size:0; line-height:0; position: absolute; top:50%; z-index:7; transform: translateY(-50%); cursor: pointer;} #main-visual .slick-prev{background-image: url("/images/main/btn_slick_prev.png"); left:100px;} #main-visual .slick-next{background-image: url("/images/main/btn_slick_next.png"); right:100px;} #main-visual .slick-arrow:hover{opacity:1;} #main-visual .controll{width:260px; padding-top:0; margin-left:-130px; position: absolute; left: 50%; bottom: 5rem; display: flex; flex-direction: row; align-items: center; justify-content: space-between;} #main-visual .controll .dot{display:inline-block; vertical-align: middle;} #main-visual .controll .auto{display:inline-block; vertical-align: middle;} #main-visual .controll .auto{padding-left:10px;} #main-visual .controll .auto button{width:27px; height:27px; background:transparent url("/images/btn_slick_pause.png") no-repeat left top; border:none;} #main-visual .controll .auto button.off{background-image:url("/images/btn_slick_play.png");} #main-visual .slick-dots{display:flex; flex-wrap: nowrap; justify-content: flex-start;} #main-visual .slick-dots>li{width:auto !important; padding:0 !important; display:inline-block; vertical-align: top;} #main-visual .slick-dots>li+li{margin-left:0;} #main-visual .dot_Line, #main-visual .dot_Line>dt, #main-visual .dot_Line>dd .line{transition: all .3s ease-out; transform-origin: 50% 50%;} #main-visual .dot_Line>dd .line>span{} #main-visual .vTxt.first .dot_Line>dd .line>span{} #main-visual .dot_Line{padding-right:10px; box-sizing: border-box; position: relative;} #main-visual .dot_Line>dt{font-weight: 500; font-size:15px; line-height:1; color: rgba(255,255,255,0.3); white-space: nowrap;} #main-visual .dot_Line>dd{position: absolute; left:27px; right:10px; top:50%;} #main-visual .dot_Line>dd .line{width:100%; height:2px; background-color: rgba(255,255,255,0.3); display:inline-block; vertical-align: middle; position: relative; overflow:hidden;} #main-visual .dot_Line>dd .line>span{width:100%; height:2px; background-color: rgba(255,255,255,1); display:inline-block; position: absolute; left:-100%; top:0;} #main-visual .slick-dots>li.slick-active .dot_Line{padding-right:120px;} #main-visual .slick-dots>li.slick-active .dot_Line>dt{color: rgba(255,255,255,1);} #main-visual .slick-dots>li.slick-active .dot_Line>dd .line{width:100%;} #main-visual .slick-dots>li.slick-active .dot_Line>dd .line>span{} @keyframes slideIn { from { filter:blur(15px); } to { filter:blur(0); } } @keyframes slideOut { from { filter:blur(0); } to { filter:blur(15px); } } /* visual */ #mVisual{width:100%; font-size:0; line-height:0; position: relative; overflow:hidden;} #mVisual .visualRoll{white-space: nowrap;} #mVisual .visualRoll .slider{width:100%; background-repeat: no-repeat; background-position: center center; background-size: cover; font-size:0; line-height:0; position: relative; overflow:hidden; display:inline-block; vertical-align: top;} #mVisual .visualRoll .slider img{width:100%; max-width:none; height:96rem; object-fit: cover;} #mVisual .visualRoll .slider video{width:100%; max-width:none; height:96rem; object-fit: cover;} #mVisual .slick-arrow{width:35px; height:63px; background-color: transparent; background-repeat: no-repeat; background-position: center center; background-size: cover; border:none; font-size:0; line-height:0; position: absolute; top:50%; z-index:7; transform: translateY(-50%); cursor: pointer; opacity:1;} #mVisual .slick-prev{background-image: url("/images/main/btn_slick_prev.png"); left:4.25%;} #mVisual .slick-next{background-image: url("/images/main/btn_slick_next.png"); right:4.25%;} #mVisual .slick-arrow:hover{opacity:1;} #mVisual .vTxtArea{width:100%; height:96rem; max-width:1560px; padding:0 3rem; text-align: left; position: absolute; left:50%; top:0; transform: translateX(-50%); z-index:5; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: flex-start;} #mVisual .vTxtArea .vTxt_in{width:100%; padding:9rem 0 34rem; position: relative;} #mVisual .vTxt{width:100%; position: absolute; left:0; top:-999px;} #mVisual .vTxt .ii{color: #fff; top:50px; display:block; opacity: 0; position: relative; word-break:keep-all; word-wrap:break-word;} #mVisual .vTxt .i01{-webkit-transition-delay: .4s; transition-delay: .4s;} #mVisual .vTxt .i02{-webkit-transition-delay: .45s; transition-delay: .45s;} #mVisual .vTxt .i03{-webkit-transition-delay: .5s; transition-delay: .5s;} #mVisual .vTxt .i04{-webkit-transition-delay: .55s; transition-delay: .55s;} #mVisual .vTxt .i05{-webkit-transition-delay: .6s; transition-delay: .6s;} #mVisual .vTxt .i06{-webkit-transition-delay: .65s; transition-delay: .65s;} #mVisual .vTxt .i07{-webkit-transition-delay: .7s; transition-delay: .7s;} #mVisual .vTxt .ii.tit{font-weight:900; font-size:1.8rem; line-height:1;} #mVisual .vTxt .ii.title{margin-top:2rem; font-weight: bold; font-size:5.5rem; line-height:6rem;} #mVisual .vTxt .ii.txt{margin-top:3rem; font-weight: 500; font-size:2.2rem; line-height:1.4;} #mVisual .vTxt .ii.controll{margin-top:5rem;} #mVisual .slick-dots{width:100%;} #mVisual .slick-dots>li{display:inline-block; vertical-align: top;} #mVisual .slick-dots>li+li{margin-left:1rem;} #mVisual .slick-dots>li button{width:1.1rem !important; height:1.1rem; margin:0; padding:0; background-color:#c7c8c6; border:none; font-size:0; line-height:0; cursor: pointer; border-radius:99px;} #mVisual .slick-dots>li.slick-active button{width:4.1rem !important; background-color:#0a60dd;} #mVisual .vTxt.active{position: static; top:0px;} #mVisual .vTxt.active .ii{top:0px; opacity:1;} /* visual */ #mainVisual{margin-top:2.5rem; width:100%; position: relative; overflow:hidden;} #mainVisual .visualRoll{white-space: nowrap;} #mainVisual .visualRoll .swiper-slide{width:100%; background-repeat: no-repeat; background-position: center center; background-size: cover; font-size:0; line-height:0; position: relative; overflow:hidden; display:inline-block; vertical-align: top;} #mainVisual .visualRoll .swiper-slide>img{width:100%; max-width:none; height:71rem; object-fit: cover; object-position: center center; /*filter:grayscale(80%) blur(5px);transform:scale(1.05); transition-delay: 1s;*/} #mainVisual .vTxtArea{width:100%; max-width:150rem; height:100%; padding:0 7rem 6.6rem; text-align: left; position: absolute; left:50%; top:0; z-index:5; transform:translateX(-50%); display: flex; align-items: flex-end; justify-content: center;} #mainVisual .vTxt{width:100%; position: relative;} #mainVisual .vTxt .ii{line-height:1; color: #fff; top:50px; display:block; opacity: 0; position: relative; word-break:keep-all; word-wrap:break-word; white-space: normal;} #mainVisual .vTxt .i01{transition-delay: 1.3s;} #mainVisual .vTxt .i02{transition-delay: 1.35s;} #mainVisual .vTxt .i03{transition-delay: 1.4s;} #mainVisual .vTxt .i04{transition-delay: 1.45s;} #mainVisual .vTxt .i05{transition-delay: 1.5s;} #mainVisual .vTxt .i06{transition-delay: 1.55s;} #mainVisual .vTxt .i07{transition-delay: 1.6s;} #mainVisual .vTxt .ii.title{font-weight: 400; font-size:5.4rem; line-height:1.2;} #mainVisual .vTxt .ii.text{margin-top:1.5rem; font-size:2.6rem; line-height:1.3; font-weight:400;} #mainVisual .vTxt .ii.btn{padding-bottom:7.5rem;} #mainVisual .vTxt .ii.btn .hex-g{padding:0 calc((4.7rem * 0.70710678) / 1.41421356237); position:absolute; right:0; bottom:0;} #mainVisual .vTxt .ii.btn .hex-g span{padding:0.7rem 0.4rem 1rem; font-size:2rem; color:#fff; font-weight:500; border-color:#fff; border-width:0.2rem;} #mainVisual .vTxt .ii.btn .hex_btn span{padding:0.7rem 0.4rem 0.9rem;} #mainVisual .vTxt .ii.btn .hex-g::before, #mainVisual .vTxt .ii.btn .hex-g::after{border-color:#fff; border-width:0.3rem; block-size:100%;} #mainVisual .vTxt .ii.btn .hex_btn .hex_off{width:2.3rem; height:4.7rem;} #mainVisual .swiper-option{width:120rem; margin:0 auto; position: relative; display:none;} #mainVisual .swiper-button{font-family:'SUIT Variable'; font-weight: 100; font-size:8rem; line-height:1; color: rgba(255,255,255,0.8); position: absolute; top:-39rem; display: inline-block; cursor: pointer; z-index:7;} #mainVisual .swiper-button-prev{left:0;} #mainVisual .swiper-button-next{right:0;} #mainVisual .swiper-button:hover{color: rgba(255,255,255,1);} #mainVisual .swiper-btn button{width:2.7rem; height:2.7rem; background:transparent url("/images/btn_slick_pause.png") no-repeat left top/cover; border:none;} #mainVisual .swiper-btn button.pause{background-image:url("/images/btn_slick_play.png");} #mainVisual .swiper-number{width:100%; max-width:156rem; margin-left:-78rem; padding:0 3rem; font-size:3.2rem; line-height:1; color: #fff; text-align: right; position: absolute; left:50%; bottom:6rem; z-index:6;} #mainVisual .swiper-number .n{top:-1.5rem; position: relative;} #mainVisual .swiper-number .l{top:-0.3rem; position: relative;} #mainVisual .swiper-number .t{} #mainVisual .swiper-slide-active .vTxt .ii{top:0px; opacity:1;} #mainVisual .visualRoll .swiper-slide.swiper-slide-active>img{filter:grayscale(0) blur(0px); transform:scale(1);} /* main_brand_story 메인 - 브랜드스토리 */ #main_brand_story{margin-top:16rem;} /* #main_brand_story .main_sect_int .hex-g{padding:0 calc((3.1rem * 0.70710678) / 1.41421356237)} #main_brand_story .main_sect_int .hex-g span{border:0; padding:0 0.3rem; font-size:2.8rem; line-height:1.2; color:#9FA0A0} */ #main_brand_story .main_sw_brand_st{margin-top:7rem; position:relative; overflow:hidden;} #main_brand_story .main_sw_brand_st .video #player{width:100%; aspect-ratio:16/9;} #main_brand_story .main_sw_brand_st .video iframe{width:100%; aspect-ratio:16/9;} #main_brand_story .main_sw_brand_st .swiper-wrapper{white-space:nowrap; height:auto; align-items:stretch;} #main_brand_story .main_sw_brand_st .swiper-slide{display:inline-block; height:71.2rem;} #main_brand_story .main_sw_brand_st .swiper-slide .img_box{width:100%; height:100%;} #main_brand_story .main_sw_brand_st .swiper-slide img{object-fit:cover; width:100%; height:100%;} #main_brand_story .main_sw_brand_st .swiper-slide.unusual_slide{background-color:#003668; text-align:center; display:flex; flex-direction:column;} #main_brand_story .main_sw_brand_st .swiper-slide.unusual_slide .txt_box{margin-bottom:5rem; padding-bottom:0; text-align:center; position:static} #main_brand_story .main_sw_brand_st .swiper-slide.unusual_slide .txt_box .tit{font-size:1.8rem; line-height:1.2; font-weight:700;} #main_brand_story .main_sw_brand_st .swiper-slide.unusual_slide .txt_box .txt{margin-top:1rem; font-size:3.6rem; line-height:1.3; font-weight:500;;} #main_brand_story .main_sw_brand_st .swiper-slide.unusual_slide .img_box{flex:1; width:100%; min-height:0; display:flex; justify-content:center; align-items:center;} #main_brand_story .main_sw_brand_st .swiper-slide.unusual_slide img{width:100%; height:auto; max-width:fit-content;} /* main_premium 메인 - 프리미엄 인테리어 */ #main_premium{margin-top:15rem; padding-bottom:16rem;} #main_premium .certify_li{margin-top:7rem; display:flex;} #main_premium .certify_li li{padding:0 1.5rem; width:20%; text-align:center;} #main_premium .certify_li li+li{border-left:1px solid #ccc} #main_premium .certify_li li img{height:14rem;} #main_premium .certify_li li em{display:block; margin-top:2rem; font-size:2.4rem; line-height:1.3; font-weight:700; color:#111;} #main_premium .certify_li li p{margin-top:1.5rem; font-size:1.8rem; line-height:1.3; font-weight:500; color:#9FA0A0;} /* main_construct_case 메인 - 시공사례 */ #main_construct_case{padding:16rem 0; background-color:#f7f7f7;} #main_construct_case .case_wrap{margin-top:7rem;} #main_construct_case .case_wrap .js-marquee-wrapper{display:inline-block} #main_construct_case .case_li + .case_li{margin-top:2.5rem;} #main_construct_case .case_li ul{display:flex; gap:2.5rem} #main_construct_case .case_box{padding:1.2rem; width:35rem; height:35rem; /*border:0.5rem solid var(--color_type);*/ position:relative; z-index:0;} #main_construct_case .case_box::before{content:""; display:block; width:100%; height:100%; padding:0.9rem; border:0.5rem solid var(--color_type); box-shadow:inset 0 0 0 0.7rem #f7f7f7, inset 0 0 0 0.9rem var(--color_type); position:absolute; left:0; top:0; z-index:-1; transition:all 0.3s ease-out;} #main_construct_case .case_link{display:flex; flex-direction:column; justify-content:space-between; padding:1.7rem; height:100%; color:var(--color_type); /*border:0.2rem solid var(--color_type);*/ transition:all 0.3s ease-out; cursor:default;} #main_construct_case .case_box .subject{font-size:3rem; line-height:1.2; font-family:var(--jjg); display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow:hidden;} #main_construct_case .case_box .copy_box{padding-right:4rem; position:relative;} #main_construct_case .case_box .copy_box .name{display:block; font-size:1.6rem; line-height:1.3; font-weight:600; font-family:var(--prtdd);} #main_construct_case .case_box .copy_box .type{display:block; font-size:1.5rem; line-height:1.3; font-family:var(--stevie);} #main_construct_case .case_box .copy_box .link_ico{width:2.5rem; height:2.5rem; border:1px solid var(--color_type); position:absolute; right:0; bottom:0; transform:rotate(45deg);} #main_construct_case .case_box .copy_box .link_ico::before, #main_construct_case .case_box .copy_box .link_ico::after{content:""; width:1.3rem; height:0.1rem; background-color:var(--color_type); position:absolute; left:50%; top:50%;} #main_construct_case .case_box .copy_box .link_ico::before{transform:translate(-50%, -50%) rotate(45deg);} #main_construct_case .case_box .copy_box .link_ico::after{transform:translate(-50%, -50%) rotate(-45deg);} /* #main_construct_case .case_box:hover::before{transform:scale(1.05);} */ /* main_consult 메인 - 컨설팅 예약 */ #main_consult .border_box{padding:16rem 0; border-bottom:0.2rem solid #D6D6D7} #main_consult .main_bann img{height:71.2rem; object-fit:cover;} #main_consult .btn{margin-top:3rem; width:100%; text-align:right;} #main_consult .btn .hex_btn .hex_off{width:2.3rem; height:4.7rem;} /* main_project 메인 - 11년간 프리미엄... */ #main_project{padding:16rem 0 16.7rem} #main_project .sw_project{margin-top:7rem;} #main_project .sw_contain .swiper-slide > a{cursor:auto;} #main_project .sw_contain .swiper-slide .thumb{width:100%; overflow:hidden;} #main_project .sw_contain .swiper-slide .thumb img{transition:all 0.3s ease-out;} #main_project .sw_contain .swiper-slide .cont_box{padding-top:1.5rem;} #main_project .sw_project .btn{margin-top:4rem; text-align:center;} #main_project .sw_project .btn a{padding:0 calc(((4.3rem + 2px) * 0.70710678) / 1.41421356237)} #main_project .sw_project .btn a::before, #main_project .sw_project .btn a::after{block-size:100%; border-color:#003668;} #main_project .sw_project .btn a span{padding:0 0.6rem; font-size:2rem; line-height:4.3rem; color:#003668; border-color:#003668;} #main_project .sw_contain .swiper-slide:hover .thumb img{transform:scale(1.03);} /* main_collect 메인 - 프리미엄 인테리어 서비스 콜렉션 */ #main_collect{padding:16.4rem 0 16rem} #main_collect .collect_li{margin-top:7rem; display:flex; text-align:center;} #main_collect .collect_li > li+li{border-left:1px solid #4F4A48} #main_collect .collect_li > li{padding:0 0.9rem 0.9rem; width:20%;} #main_collect .collect_li > li .ico_box img{width:17.5rem;} #main_collect .collect_li > li a{display:block; color:#333} #main_collect .collect_li > li a > em{margin-top:2rem; display:block; font-size:2.2rem; line-height:1.3; font-family:var(--stevie);} #main_collect .collect_li > li a > p{margin-top:0.8rem; font-size:1.6rem; line-height:1.3;} #main_collect .collect_li .pop_wrap{display:none; position:fixed; left:0; top:0; z-index:50; width:100%; height:100%; background-color:rgba(0,0,0,0.7);} #main_collect .collect_li .pop_wrap.open{display:block;} #main_collect .collect_li .pop_inner{padding:0 3rem 3rem; max-width:92.7rem; width:100%; max-height:80%; background-color:var(--color_type); color:#fff; text-align:left; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); overflow-y:auto;} #main_collect .collect_li .pop_hd{position:relative;} #main_collect .collect_li .pop_hd .pop_tit{font-size:12rem; line-height:1.3;font-weight:300; font-family:var(--stevie); position:relative; top:-1.8rem;} #main_collect .collect_li .pop_hd .btn_close{width:2.2rem; height:2.2rem; border:1px solid #fff; position:absolute; right:0; top:2rem;} #main_collect .collect_li .pop_hd .btn_close::before, #main_collect .collect_li .pop_hd .btn_close::after{content:""; margin:-0.5px 0 0 -0.5rem; width:1rem; height:1px; background-color:#fff; position:absolute; left:50%; top:50%;} #main_collect .collect_li .pop_hd .btn_close::before{transform:rotate(45deg);} #main_collect .collect_li .pop_hd .btn_close::after{transform:rotate(-45deg);} #main_collect .collect_li .pop_body{margin-top:2rem;} #main_collect .collect_li .pop_body .cont_box{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; font-size:2.2rem; line-height:1.3; font-weight:600;} #main_collect .collect_li .pop_body .box_dot_li{} #main_collect .collect_li .pop_body .box_dot_li li+li{margin-top:1rem;} #main_collect .collect_li .pop_body .box_dot_li li{padding-left:1.6rem; position:relative;} #main_collect .collect_li .pop_body .box_dot_li li::before{content:""; display:block; width:0.6rem; height:0.6rem; border:1px solid #fff; position:absolute; left:0; top:1.2rem;} #main_collect .collect_li .pop_body .pyeong_price{} #main_collect .collect_li .pop_body .img_box{margin-top:3rem;} #main_collect .consult_area{margin-top:16rem; padding:17.4rem 0 23.9rem; background:url("/images/border_diamond_4.svg") repeat-x center top/1.8rem, url("/images/border_diamond_4.svg") repeat-x center bottom/1.8rem;} #main_collect .consult_area .main_sect_tit{color:#99C1DA; line-height:1.32 ;} #main_collect .consult_area .btn{margin-top:3rem; text-align:center;} #main_collect .consult_area .btn a{padding:0 calc((4.6rem * 0.70710678) / 1.41421356237); overflow:hidden;} #main_collect .consult_area .btn a::before, #main_collect .consult_area .btn a::after{block-size:calc(100% + 0.2rem); border:0.3rem solid #99C1DA; background-color:#fff;} #main_collect .consult_area .btn a span{padding:0 0.6rem; font-size:2rem; line-height:4.1rem; color:#99C1DA; border-width:0.2rem ;border-color:#99C1DA; background-color:#fff;} /* main_patriot 메인 - 독립유공자 후손 주거 개선 프로젝트 */ #main_patriot{padding:16rem 0} #main_patriot .hashtag_tit{display:block; font-size:3rem; line-height:1.3; font-weight:700; color:#00215C; text-align:center;} #main_patriot .sw_patriot{margin-top:7rem;} #main_patriot .sw_contain .swiper-slide > a{cursor:auto;} #main_patriot .sw_contain .swiper-slide .thumb{width:100%; overflow:hidden;} #main_patriot .sw_contain .swiper-slide .thumb img{transition:all 0.3s ease-out;} #main_patriot .sw_contain .swiper-slide .cont_box .txt{margin-top:1.5rem; font-weight:600; text-overflow:ellipsis; white-space:nowrap;overflow:hidden;} #main_patriot .sw_patriot .btn{margin-top:2.6rem; text-align:center;} #main_patriot .sw_patriot .btn a{padding:0 calc(((4.3rem + 2px) * 0.70710678) / 1.41421356237); overflow:hidden;} #main_patriot .sw_patriot .btn a::before, #main_patriot .sw_patriot .btn a::after{block-size:100%; border-color:#003668;} #main_patriot .sw_patriot .btn a span{padding:0 0.6rem; font-size:2rem; line-height:4.3rem; color:#003668; border-color:#003668;} #main_patriot .sw_patriot .btn p{margin-top:1.5rem; font-size:2rem; line-height:1.3; color:#9FA0A0;} #main_patriot .sw_contain .swiper-slide:hover .thumb img{transform:scale(1.02);} /* main_safe_policy 메인 - 안심정책 [.safe_policy_sect는 인사이트와 공통]*/ #main_safe_policy{padding:16rem 0} .safe_policy_sect .cont_li{margin-top:7rem; display:flex; justify-content:space-between; gap:7rem 4rem; flex-wrap:wrap;} .safe_policy_sect .cont_li li{flex:1 0 63rem; color:#fff; text-align:center;} .safe_policy_sect .cont_li li dl{padding:12.3rem 12.4rem 12.4rem; box-shadow: inset 0 0 0 6px #fff, inset 0 0 0 15px #000, inset 0 0 0 20px #fff, inset 0 0 0 30px #000, inset 0 0 0 34px #fff, inset 0 0 0 45px #000, inset 0 0 0 48px #fff, inset 0 0 0 60px #000, inset 0 0 0 62px #fff, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } .safe_policy_sect .cont_li li dt{font-size:4.7rem; line-height:1.4; font-family:var(--jjg);} .safe_policy_sect .cont_li li dd{padding-top:7.5rem; background:url("/images/main/safe_policy_arrow_btm.svg") no-repeat center top 3rem / 3.1rem;} .safe_policy_sect .cont_li li dd em{display:block; font-size:2.6rem; line-height:1.3; font-weight:700;} .safe_policy_sect .cont_li li dd p{margin-top:1.5rem; font-size:2rem; font-weight:600;} .safe_policy_sect .cont_li li:hover dl{ animation: ringColorChange 0.9s ease-in-out forwards; } .safe_policy_sect .cont_li li:hover dl { animation: ringColorChange 0.9s linear forwards; } .safe_policy_sect .cont_li li:not(:hover) dl{ animation: ringColorReverse 0.9s linear forwards; } @keyframes ringColorChange { 0% { box-shadow: inset 0 0 0 6px #fff, inset 0 0 0 15px #000, inset 0 0 0 20px #fff, inset 0 0 0 30px #000, inset 0 0 0 34px #fff, inset 0 0 0 45px #000, inset 0 0 0 48px #fff, inset 0 0 0 60px #000, inset 0 0 0 62px #fff, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } 11.11% { box-shadow: inset 0 0 0 6px #003668, inset 0 0 0 15px #000, inset 0 0 0 20px #fff, inset 0 0 0 30px #000, inset 0 0 0 34px #fff, inset 0 0 0 45px #000, inset 0 0 0 48px #fff, inset 0 0 0 60px #000, inset 0 0 0 62px #fff, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } 22.22% { box-shadow: inset 0 0 0 6px #003668, inset 0 0 0 15px #000, inset 0 0 0 20px #003668, inset 0 0 0 30px #000, inset 0 0 0 34px #fff, inset 0 0 0 45px #000, inset 0 0 0 48px #fff, inset 0 0 0 60px #000, inset 0 0 0 62px #fff, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } 33.33% { box-shadow: inset 0 0 0 6px #003668, inset 0 0 0 15px #000, inset 0 0 0 20px #003668, inset 0 0 0 30px #000, inset 0 0 0 34px #003668, inset 0 0 0 45px #000, inset 0 0 0 48px #fff, inset 0 0 0 60px #000, inset 0 0 0 62px #fff, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } 44.44% { box-shadow: inset 0 0 0 6px #003668, inset 0 0 0 15px #000, inset 0 0 0 20px #003668, inset 0 0 0 30px #000, inset 0 0 0 34px #003668, inset 0 0 0 45px #000, inset 0 0 0 48px #003668, inset 0 0 0 60px #000, inset 0 0 0 62px #fff, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } 55.56% { box-shadow: inset 0 0 0 6px #003668, inset 0 0 0 15px #000, inset 0 0 0 20px #003668, inset 0 0 0 30px #000, inset 0 0 0 34px #003668, inset 0 0 0 45px #000, inset 0 0 0 48px #003668, inset 0 0 0 60px #000, inset 0 0 0 62px #003668, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } 66.67%, 100% { box-shadow: inset 0 0 0 6px #003668, inset 0 0 0 15px #000, inset 0 0 0 20px #003668, inset 0 0 0 30px #000, inset 0 0 0 34px #003668, inset 0 0 0 45px #000, inset 0 0 0 48px #003668, inset 0 0 0 60px #000, inset 0 0 0 62px #003668, inset 0 0 0 75px #000, inset 0 0 0 76px #003668; } } @keyframes ringColorReverse { 0% { box-shadow: inset 0 0 0 6px #003668, inset 0 0 0 15px #000, inset 0 0 0 20px #003668, inset 0 0 0 30px #000, inset 0 0 0 34px #003668, inset 0 0 0 45px #000, inset 0 0 0 48px #003668, inset 0 0 0 60px #000, inset 0 0 0 62px #003668, inset 0 0 0 75px #000, inset 0 0 0 76px #003668; } 11.11% { box-shadow: inset 0 0 0 6px #003668, inset 0 0 0 15px #000, inset 0 0 0 20px #003668, inset 0 0 0 30px #000, inset 0 0 0 34px #003668, inset 0 0 0 45px #000, inset 0 0 0 48px #003668, inset 0 0 0 60px #000, inset 0 0 0 62px #003668, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } 22.22% { box-shadow: inset 0 0 0 6px #003668, inset 0 0 0 15px #000, inset 0 0 0 20px #003668, inset 0 0 0 30px #000, inset 0 0 0 34px #003668, inset 0 0 0 45px #000, inset 0 0 0 48px #003668, inset 0 0 0 60px #000, inset 0 0 0 62px #fff, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } 33.33% { box-shadow: inset 0 0 0 6px #003668, inset 0 0 0 15px #000, inset 0 0 0 20px #003668, inset 0 0 0 30px #000, inset 0 0 0 34px #003668, inset 0 0 0 45px #000, inset 0 0 0 48px #fff, inset 0 0 0 60px #000, inset 0 0 0 62px #fff, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } 44.44% { box-shadow: inset 0 0 0 6px #003668, inset 0 0 0 15px #000, inset 0 0 0 20px #003668, inset 0 0 0 30px #000, inset 0 0 0 34px #fff, inset 0 0 0 45px #000, inset 0 0 0 48px #fff, inset 0 0 0 60px #000, inset 0 0 0 62px #fff, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } 55.56% { box-shadow: inset 0 0 0 6px #003668, inset 0 0 0 15px #000, inset 0 0 0 20px #fff, inset 0 0 0 30px #000, inset 0 0 0 34px #fff, inset 0 0 0 45px #000, inset 0 0 0 48px #fff, inset 0 0 0 60px #000, inset 0 0 0 62px #fff, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } 66.67%, 100% { box-shadow: inset 0 0 0 6px #fff, inset 0 0 0 15px #000, inset 0 0 0 20px #fff, inset 0 0 0 30px #000, inset 0 0 0 34px #fff, inset 0 0 0 45px #000, inset 0 0 0 48px #fff, inset 0 0 0 60px #000, inset 0 0 0 62px #fff, inset 0 0 0 75px #000, inset 0 0 0 76px #fff; } } /* main_column 메인 - 전문 칼럼 */ #main_column .border_box{padding:16rem 0 11rem; border-bottom:0.2rem solid #D6D6D7} #main_column .sw_column{margin-top:7rem;} #main_column .sw_column .sw_contain .swiper-slide .cont_box{padding-top:1.5rem;} #main_column .sw_column .sw_contain .swiper-slide .cont_box .tit{color:#000; font-weight:700;} /* main_exclusive 메인 - ZIBAN EXCLUSIVE */ #main_exclusive .border_box{padding:16rem 0 17.4rem; background:url("/images/border_diamond_2.svg") repeat-x center bottom/auto;} #main_exclusive .sw_exclusive{margin-top:7rem;} #main_exclusive .sw_exclusive .sw_contain .swiper-slide .thumb{width:100%; overflow:hidden;} #main_exclusive .sw_exclusive .sw_contain .swiper-slide .thumb > img{transition:all 0.3s ease-out;} /* #main_exclusive .sw_exclusive .sw_contain .swiper-slide .thumb::after{content:""; display:block; width:18.9rem; height:12.7rem; background:url("/images/main/exclusive_thumb_logo.svg") no-repeat center/contain; position:absolute; left:0; top:1rem;} */ #main_exclusive .sw_exclusive .sw_contain .swiper-slide .thumb .logo_box{display:block; width:fit-content; position:absolute; left:0; top:1rem; z-index:1;} #main_exclusive .sw_exclusive .sw_contain .swiper-slide .thumb .logo_box img{height:12.7rem; aspect-ratio:unset;} #main_exclusive .sw_exclusive .sw_contain .swiper-slide .cont_box .tit{font-size:2.8rem; color:#333; font-weight:700;} #main_exclusive .sw_exclusive .sw_contain .swiper-slide .cont_box .txt{display:-webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp:2;} #main_exclusive .sw_exclusive .sw_contain .swiper-slide .cont_box .txt.sub_tit{-webkit-line-clamp:1; color:#333} #main_exclusive .sw_exclusive .sw_contain .swiper-slide:hover .thumb > img{transform:scale(1.03);} /* main_service 메이 - 삶의 기준을 바꾸는 선택... */ #main_service{padding:16rem 0} #main_service .main_sect_tit{margin-top:1.5rem;} #main_service .main_sect_int{margin-top:0;} #main_service .cont_li{margin-top:7rem; display:flex;} #main_service .cont_li li{padding:5.3rem 0.4rem 7.6rem; width:25%; text-align:center; font-size:2rem; line-height:1.1; font-family:var(--stevie); position:relative;} #main_service .cont_li li+li::before{content:""; display:block; width:0.8rem; height:100%; background:url("/images/border_diamond_3.svg") repeat-y center/auto; position:absolute; left:-0.4rem; top:0;} #main_service .cont_li li .img_tit{margin:0 auto; width:fit-content; position:relative;} #main_service .cont_li li .img_tit img{width:29rem; transition:all 0.3s ease-out;} #main_service .cont_li li .img_tit img.img_after{opacity:0; position:absolute; left:0; top:0} #main_service .cont_li li em{display:block; margin-top:3.5rem; color:#333;} #main_service .cont_li li p{margin-top:1rem; color:#9FA0A0} #main_service .cont_li li:hover .img_tit img.img_before{opacity:0;} #main_service .cont_li li:hover .img_tit img.img_after{opacity:1;} /* main_end */ #main_end{padding:12rem 0; background-color:#00215C;} #main_end .main_sect_tit{margin-top:2rem; color:#fff} #main_end .main_sect_int{margin-top:2rem; color:#fff} #main_end .btn{margin-top:3rem; text-align:center;} #main_end .btn a{padding:0 calc(((4.3rem + 2px) * 0.70710678) / 1.41421356237); overflow:hidden;} #main_end .btn a::before, #main_end .btn a::after{block-size:100%; border-color:#fff;} #main_end .btn a span{padding:0 0.4rem; font-size:2rem; line-height:4.3rem; color:#111; font-weight:500; border-color:#fff;} /*[e] Main Style */ /*[s] Sub Style */ /* sub common */ .tit_area{text-align:center;} .tit_area .sect_tit{font-size:5rem; line-height:1.2; font-weight:700; color:#111;} .tit_area .sect_tit.en_tit{font-size:6rem; font-weight:500; font-family:var(--stevie);} .tit_area .sect_tit+p{margin-top:1rem; font-size:2.5rem; line-height:1.3;} .bgc_sect{background-color:#F7F7F7;} .sect_top{text-align:center;} .sect_top .sect_tit{color:#111; font-weight:700;} .sect_top .sect_tit.en_tit{font-weight:500; font-family:var(--stevie);} .sect_top .boundary{margin-top:2.2rem; padding-top:2.9rem; color:#9FA0A0; background:url("/images/boundary_line.svg") no-repeat center top/2.7rem;} .sect_top .boundary.color_w{color:#D6D6D7; background-image:url("/images/boundary_line_w.svg")} .sub_pg_tab{max-width:150rem; padding:0 3rem; margin:0 auto} .sub_pg_tab ul{display:flex; flex-wrap:wrap; gap:1rem 0; margin-bottom:2rem; padding-bottom:1.5rem; border-bottom:1px solid #D6D6D7;} .sub_pg_tab ul li{} .sub_pg_tab ul li a{padding:0 calc(((4rem + 2px) * 0.70710678) / 1.41421356237);} .sub_pg_tab ul li a::before, .sub_pg_tab ul li a::after{content:""; background-color:#fff; border:1px solid #9FA0A0; block-size:calc(100% - 1px);} .sub_pg_tab ul li a span{padding:0 0.2rem; height:calc(4rem + 2px); border-top:1px solid #9FA0A0; border-bottom:1px solid #9FA0A0; background-color: #fff; font-size:2.6rem; line-height:1.2; color: #9FA0A0;} .sub_pg_tab ul li a:is(:hover, .active)::before, .sub_pg_tab ul li a:is(:hover, .active)::after, .sub_pg_tab ul li a:is(:hover, .active) span{background-color:#003668; color:#fff} /* brand_str */ .brand_str{} .brand_str .sect_tit{font-size:7.2rem; line-height:1.3; font-weight:500; text-align:center; font-weight:500; font-family:var(--stevie); color:#111} .brand_str .bg_box{position:relative; color:#fff;} .brand_str .bg_box .img_box{height:71rem;} .brand_str .bg_box .img_box img{width:100%; height:100%; object-fit:cover;} .brand_str .philosophy_sect{padding-bottom:20.9rem; background:url("/images/border_diamond_2.svg") repeat-x center bottom/1rem;} .brand_str .philosophy_sect .sect_tit{margin-bottom:5rem;} .brand_str .philosophy_sect .bg_box .txt_box{padding:9rem 5rem; width:100%; font-size:4.8rem; line-height:1.4; font-weight:700; position:absolute; left:0; bottom:0;} .brand_str .story_sect{padding:20rem 0 10.9rem; background:url("/images/border_diamond_2.svg") repeat-x center bottom/1rem;} .brand_str .story_sect .sect_tit{margin-bottom:6rem;} .brand_str .story_sect .bg_box+.bg_box{margin-top:2rem;} .brand_str .story_sect .bg_box .txt_box{padding:8rem 4rem; width:100%; font-size:2.8rem; line-height:1.4; font-weight:700; position:absolute; left:0; bottom:0;} .brand_str .story_sect .bg_box .txt_box p+p{margin-top:6.2rem;} .brand_str .story_sect .bg_box .txt_box p span{display:block; margin-top:1rem;} .brand_str .story_sect .several_lay{display:flex; height:71rem;} .brand_str .story_sect .several_lay .img_box{height:auto; position:relative;} .brand_str .story_sect .several_lay .img_box p{padding:3rem; width:100%; font-size:1.4rem; line-height:1.2; color:#fff; position:absolute; left:0; top:0;} .brand_str .story_sect .several_lay > .img_box{width:66%;} .brand_str .story_sect .several_lay ul{width:44%; display:flex; flex-direction:column;} .brand_str .story_sect .several_lay ul .img_box{flex:1; min-height:0; overflow:hidden;} .brand_str .story_sect .several_lay ul .img_box img{object-fit:cover;} .brand_str .story_sect .btn{margin-top:10rem; text-align:center;} .brand_str .story_sect .btn a{padding:0 calc(((4.3rem + 2px) * 0.70710678) / 1.41421356237)} .brand_str .story_sect .btn a::before, .brand_str .story_sect .btn a::after{block-size:100%; border-color:#9FA0A0;} .brand_str .story_sect .btn a span{padding:0 0.6rem; font-size:2rem; line-height:4.3rem; color:#9FA0A0; border-color:#9FA0A0;} .brand_str .essence_sect{padding:15rem 0 20rem} .brand_str .essence_sect .sect_tit{margin-bottom:5rem;} .brand_str .essence_sect .bg_box .txt_box{text-align:center; display:flex; justify-content:center; align-items:center; flex-direction:column; position:absolute; inset:0 0 0 0;} .brand_str .essence_sect .bg_box .txt_box em{display:block; font-size:12rem; line-height:1.3; font-family:var(--stevie);} .brand_str .essence_sect .bg_box .txt_box p{margin-top:1rem; font-size:3.3rem; line-height:1.22; font-weight:700;} .brand_str .graph_sect{padding:17.3rem 0 20rem; background-color:#000;} .brand_str .graph_sect .inner{max-width:145.8rem; padding:0 1.5rem; margin:0 auto} .brand_str .graph_sect .sect_tit{color:#fff;} .brand_str .graph_sect .sect_tit+p{color:#fff} .brand_str .graph_sect .graph_img{margin-top:7rem;} .brand_str .graph_sect .graph_img img{width:100%;} /* company */ .company .img_box.double_line{padding:0.7rem; border:0.5rem solid #003668; box-shadow:inset 0 0 0 0.4rem #fff, inset 0 0 0 0.7rem #003668;} .company .info_sect{padding:11rem 0 15rem} .company .info_sect .sect_top h4{font-size:5rem; line-height:1.2;} .company .info_sect .sect_top p{margin-top:1rem; font-size:2.2rem; line-height:1.2; color:#9FA0A0;} .company .info_sect .sect_top .boundary{font-size:2rem; line-height:1.6; font-weight:500;} .company .info_sect .tab_area{margin-top:10rem;} .company .info_sect .tab_area .tab_btn{margin-bottom:7rem; display:flex; justify-content:center; justify-content:center; position:relative; z-index:1;} .company .info_sect .tab_area .tab_btn::after{content:""; display:block; width:100%; height:1px; background-color:#ddd; position:absolute; left:0; top:50%; z-index:-1; transform:translateY(-50%);} .company .info_sect .tab_area .tab_btn a{padding:0 calc(((3.3rem + 2px) * 0.70710678) / 1.41421356237)} .company .info_sect .tab_area .tab_btn a::before, .company .info_sect .tab_area .tab_btn a::after{block-size:calc(100% - 0px); border-color:#9FA0A0;} .company .info_sect .tab_area .tab_btn a span{padding:0 0.2rem; border-width:1px; font-size:2.3rem; line-height:3.3rem; font-weight:400; color:#9FA0A0; font-family:var(--stevie); border-color:#9FA0A0;} .company .info_sect .tab_area .tab_btn a:is(:hover, .active)::before, .company .info_sect .tab_area .tab_btn a:is(:hover, .active)::after, .company .info_sect .tab_area .tab_btn a:is(:hover, .active) span{background-color:#003668; border-color:#003668; color:#fff} /* .company .info_sect .tab_area .tab_btn a:hover::before, .company .info_sect .tab_area .tab_btn a.active::before{background-image:url("/images/hex_btn_left_navy.svg");} .company .info_sect .tab_area .tab_btn a:hover::after, .company .info_sect .tab_area .tab_btn a.active::after{background-image:url("/images/hex_btn_right_navy.svg");} .company .info_sect .tab_area .tab_btn a:hover span, .company .info_sect .tab_area .tab_btn a.active span{background-color:#003668; border-color:#003668; color:#fff} */ .company .info_sect .cont_area{display:flex; flex-wrap:wrap; gap:6rem 10rem} .company .info_sect .cont_area .img_box{width:50%;} .company .info_sect .cont_area .img_box img{width:100%;} .company .info_sect .cont_area .cont_box{flex:1;} .company .info_sect .cont_area .cont_box h5{font-size:3.2rem; line-height:1.3; font-weight:700; color:#111;} .company .info_sect .cont_area .cont_box .cont_int{font-size:2.2rem; line-height:1.3; color:#9FA0A0;} .company .info_sect .cont_area .cont_box > p{margin-top:1rem;} .company .info_sect .cont_area .cont_box ul{margin-top:3rem;} .company .info_sect .cont_area .cont_box ul.num_list li{padding-left:2.2rem; position:relative;} .company .info_sect .cont_area .cont_box ul.num_list li::before{content:counter(num_li)"."; font-size:2.2rem; line-height:1.3; font-weight:600; color:#111; position:absolute; left:0; top:0;} .company .info_sect .cont_area .cont_box ul li+li{margin-top:0.8rem;} .company .info_sect .cont_area .cont_box ul li em{display:block; font-size:2.2rem; line-height:1.3; font-weight:600; color:#111;} .company .info_sect .cont_area .cont_box ul li p{font-size:2rem;} .company .info_sect .cont_area .cont_box .cont_end{font-size:2.2rem; line-height:1.3; color:#000;} .company .premium_sect{padding:15rem 0 10.9rem; background:url("/images/border_diamond_2.svg") repeat-x center bottom/1rem;} .company .premium_sect .sect_tit{font-size:6rem; line-height:1.1;} .company .premium_sect .img_box{margin-top:6rem;} .company .premium_sect .btn{margin-top:10rem; text-align:center;} .company .premium_sect .btn a{padding:0 calc(((4.3rem + 2px) * 0.70710678) / 1.41421356237)} .company .premium_sect .btn a::before, .company .premium_sect .btn a::after{block-size:100%; border-color:#9FA0A0;} .company .premium_sect .btn a span{padding:0 0.6rem; font-size:2rem; line-height:4.3rem; color:#9FA0A0; border-color:#9FA0A0;} .company .exclusive_sect{padding:15rem 0 15.9rem; background:url("/images/border_diamond_2.svg") repeat-x center bottom/1rem;} .company .exclusive_sect .sect_top{margin-bottom:7.2rem;} .company .exclusive_sect .sect_top .sect_tit{font-size:6rem; line-height:1.2;} .company .exclusive_sect .sect_top p{margin-top:1.5rem; font-size:2.6rem; line-height:1.2; font-weight:500; color:#9FA0A0;} .company .exclusive_sect .cont_box+.cont_box{margin-top:5rem;} .company .exclusive_sect .cont_box dt{text-align:center; margin-bottom:-1.8rem;} .company .exclusive_sect .cont_box dt em{padding:0 calc(((3.3rem + 2px) * 0.70710678) / 1.41421356237)} .company .exclusive_sect .cont_box dt em span{padding:0 0.6rem; font-size:2.3rem; line-height:3.3rem; font-family:var(--stevie); color:#9FA0A0; border-color:#9FA0A0;} .company .exclusive_sect .cont_box dt em::before, .company .exclusive_sect .cont_box dt em::after{block-size:100%; border-color:#9FA0A0;} .company .exclusive_sect .cont_box dd{padding:5.7rem 3rem 4rem; text-align:center; border:1px solid #9FA0A0} .company .exclusive_sect .cont_box dd em{display:block; font-size:3.2rem; line-height:1.4; font-weight:600; color:#111;} .company .exclusive_sect .cont_box dd ul{margin-top:2.5rem;} .company .exclusive_sect .cont_box dd ul li{margin-top:0.5rem; font-size:1.8rem; line-height:1.3; color:#9FA0A0;} .company .project_sect{padding:15rem 0;} .company .project_sect .sect_top .sect_tit{font-size:5rem; line-height:1.2;} .company .project_sect .img_box{margin-top:6rem;} .company .project_sect .btn{margin-top:10rem; text-align:center;} .company .project_sect .btn a{padding:0 calc(((4.3rem + 2px) * 0.70710678) / 1.41421356237)} .company .project_sect .btn a::before, .company .project_sect .btn a::after{block-size:100%; border-color:#9FA0A0;} .company .project_sect .btn a span{padding:0 0.6rem; font-size:2rem; line-height:4.3rem; color:#9FA0A0; border-color:#9FA0A0;} /* portfolio */ .portfolio{} .portfolio .pofol_late{padding-bottom:15rem;} .portfolio .pofol_late .late_wr{border-top:1px solid #D6D6D7; position:relative;} .portfolio .pofol_late .late_wr+.late_wr{margin-top:10rem;} .portfolio .pofol_late .late_wr .late_tit{padding:1.9rem 10rem 3rem; font-size:2.6rem; line-height:1.2; font-weight:600; color:#777; text-align:center;} .portfolio .pofol_late .late_wr .late_ul{display:flex; gap:5rem 2rem; flex-wrap:wrap;} .portfolio .pofol_late .late_wr .late_ul li{width:calc((100% - 6rem)/4);} .portfolio .pofol_late .late_wr .late_ul .thumb{width:100%; aspect-ratio:335/245;} .portfolio .pofol_late .late_wr .late_ul .thumb img{width:100%; height:100%; object-fit:cover;} .portfolio .pofol_late .late_wr .late_ul .cont_area{padding-top:1.5rem;} .portfolio .pofol_late .late_wr .late_ul .cont_area .tit{font-size:2rem; line-height:1.3; font-weight:500; color:#787878; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .portfolio .pofol_late .late_wr .late_ul .cont_area .txt{margin-top:0.5rem; font-size:1.8rem; line-height:1.3; color:#9FA0A0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .portfolio .pofol_late .late_wr .btn{text-align:center;} .portfolio .pofol_late .late_wr .btn .hex_btn{padding-top:2rem; position:absolute; right:0; top:0;} .portfolio .pofol_late .late_wr .btn .hex_btn span{padding:0.3rem 0.4rem 0.2rem; font-size:1.8rem; line-height:1.3; color:#9FA0A0; border-color:#9FA0A0; border-width:1px;} .portfolio .pofol_late .late_wr .btn .hex_btn::before, .portfolio .pofol_late .late_wr .btn .hex_btn::after{width:1.6rem; height:3rem;} .portfolio .pofol_late .late_wr .btn .hex_btn::before{background-image:url("/images/hex_btn_left_late_more.svg");} .portfolio .pofol_late .late_wr .btn .hex_btn::after{background-image:url("/images/hex_btn_right_late_more.svg");} .portfolio .pofol_late .btn.reservation{margin-top:10rem; text-align:center;} .portfolio .pofol_late .btn.reservation a{padding:0 calc(((4.3rem + 2px) * 0.70710678) / 1.41421356237)} .portfolio .pofol_late .btn.reservation a::before, .portfolio .pofol_late .btn.reservation a::after{block-size:100%; border-color:#9FA0A0;} .portfolio .pofol_late .btn.reservation a span{padding:0 0.6rem; font-size:2rem; line-height:4.3rem; color:#9FA0A0; border-color:#9FA0A0;} .portfolio .review_sect{padding:15rem 0} .portfolio .review_sect .sect_top{margin-bottom:7rem;} .portfolio .review_sect .sect_top .sect_tit{font-size:6.6rem; line-height:1.3;} .portfolio .review_sect .sect_top p{margin-top:1.5rem; font-size:2.6rem; line-height:1.2; font-weight:500; color:#9FA0A0;} .portfolio .review_sect .late_ul li{padding:0.8rem; border:0.5rem solid #999a9a;} .portfolio .review_sect .late_ul li+li{margin-top:4rem;} .portfolio .review_sect .late_ul li a{display:flex; flex-wrap:wrap; border:0.3rem solid #999a9a;} .portfolio .review_sect .late_ul li .thumb{width:100%; max-width:35rem; aspect-ratio:347/258;} .portfolio .review_sect .late_ul li .thumb img{width:100%; height:100%; object-fit:cover;} .portfolio .review_sect .late_ul li .cont_area{width:100%; max-width:calc(100% - 35rem); padding:4.6rem 4rem 4.7rem; display:flex; align-items:flex-start; justify-content:flex-start; flex-direction:column; font-size:3rem; line-height:1.3;; text-align:left; font-family:var(--jjg); color:#9FA0A0} .portfolio .review_sect .late_ul li .cont_area .tit{width:fit-content; max-width:100%; padding:0 1.2rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; position:relative;} .portfolio .review_sect .late_ul li .cont_area .tit::before, .portfolio .review_sect .late_ul li .cont_area .tit::after{content:'"'; position:absolute; top:0;} .portfolio .review_sect .late_ul li .cont_area .tit::before{left:0;} .portfolio .review_sect .late_ul li .cont_area .tit::after{right:0;} .portfolio .review_sect .late_ul li .cont_area .txt{margin-top:1.5rem; width:100%; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; text-overflow:ellipsis; overflow:hidden;} .portfolio .review_sect .btn{margin-top:9rem; text-align:center;} .portfolio .review_sect .btn .hex_btn span{padding:0.7rem 0.7rem 0.8rem; font-size:1.8rem; border-color:#9FA0A0;} .portfolio .review_sect .btn .hex_btn::before, .portfolio .review_sect .btn .hex_btn::after{width:2.3rem; height:4.2rem;} .portfolio .review_sect .btn .hex_btn::before{background-image:url("/images/hex_btn_left_review_more.svg");} .portfolio .review_sect .btn .hex_btn::after{background-image:url("/images/hex_btn_right_review_more.svg");} /* consult */ .consult .hex_bar_tit{padding:0 2rem; text-align:center; position:relative;} .consult .hex_bar_tit::before{content:""; display:block; width:100%; height:1px; background-color:#9FA0A0; position:absolute; left:0; top:50%; z-index:0; transform:translateY(-50%);} .consult .hex_bar_tit .hex-g{padding:0 calc(((12.7rem + 2px) * 0.70710678) / 1.41421356237); position:relative; z-index:1;} .consult .hex_bar_tit .hex-g span{padding:1.1rem 2rem 1.2rem; min-width:65rem; height:calc(12.7rem + 2px); font-size:4rem; line-height:1.3; color:#111; font-weight:500;;} .consult .hex_bar_tit .hex-g::before, .consult .hex_bar_tit .hex-g::after{block-size:100%;} .consult .check_wr{padding:10rem 0} .consult .check_wr .check_box .chk_in+.chk_in{margin-top:2.5rem;} .consult .check_wr .check_box .chk_in label{display:block; padding-left:10.5rem; position:relative;} .consult .check_wr .check_box .chk_in input[type="radio"] + label p, .consult .check_wr .check_box .chk_in input[type="checkbox"] + label p{padding:2.4rem; font-size:3rem; line-height:1.2; text-align:center; color:#333; border:1px solid #A5A6A6; cursor:pointer; transition:all 0.3s ease-out;} .consult .check_wr .check_box .chk_in input[type="radio"] + label::before, .consult .check_wr .check_box .chk_in input[type="checkbox"] + label::before{content:""; display:block; aspect-ratio:1/1; border:1px solid #A5A6A6; background-color:#fff; cursor:pointer; position:absolute; left:0; top:50%; transform:translateY(-50%);} .consult .check_wr .check_box .chk_in input[type="radio"]:checked + label::before, .consult .check_wr .check_box .chk_in input[type="checkbox"]:checked + label::before{border:1px solid #003668; background-color:#003668;} .consult .check_wr .check_box .chk_in input[type="radio"]:checked + label p, .consult .check_wr .check_box .chk_in input[type="checkbox"]:checked + label p{border-color:#003668; color:#003668} .consult .check_wr .check_box .chk_in input[type="radio"] + label::before{width:8rem; border-radius:50%;} .consult .check_wr .check_box .chk_in input[type="checkbox"] + label::before{width:5.6rem; transform:translateY(-50%) rotate(45deg); top:50%; left:1.2rem} .consult .check_wr .btn{margin-top:12rem; display:flex; justify-content:center;} .consult .check_wr .btn button{padding:0 calc(((4.2rem + 2px) * 0.70710678) / 1.41421356237)} .consult .check_wr .btn button span{padding:0; width:12rem; font-size:2.6rem; line-height:4.3rem;} .consult .check_wr .btn button::before, .consult .check_wr .btn button::after{block-size:100%;} .consult .check_wr .page_nav{margin-top:10rem;position:relative; z-index:1;} .consult .check_wr .page_nav .inner{padding:0 1.5rem; margin:0 auto; width:fit-content; display:flex; justify-content:center; align-items:center; gap:0.5rem; background-color:#fff;} .consult .check_wr .page_nav::before{content:""; display:block; width:100%; height:1px; background-color:#BDBDBD; position:absolute; left:0; top:50%; z-index:-1; transform:translateY(-50%);} .consult .check_wr .page_nav li{width:1.6rem;} .consult .check_wr .page_nav li span{margin:auto; display:block; width:1.1rem; height:1.1rem; font-size:0; line-height:0; border:1px solid #9FA0A0; transform:rotate(45deg); transform-origin: center;} .consult .check_wr .page_nav li.active span{border-color:#003668; background-color:#003668;} .consult .counsel_kakao{padding:11rem 0; background:url("/images/border_diamond_2.svg") , url("/images/border_diamond_2.svg"); background-repeat:repeat-x; background-position:top center, bottom center; background-size:1rem;} .consult .counsel_kakao form{max-width:78.1rem; margin:0 auto;} .consult .counsel_kakao dl{text-align:center;} .consult .counsel_kakao dl dt{padding:1.7rem 2rem 1.8rem; font-size:2.8rem; line-height:1.3; color:#111; border:1px solid #9FA0A0; border-bottom:0;} .consult .counsel_kakao .summary_box{max-width:78.1rem; margin:0 auto 6.5rem;} .consult .counsel_kakao .summary_box dd{padding:2rem; color:#444; border:1px solid #9FA0A0} .consult .counsel_kakao .summary_box dd em{display:block; font-size:2rem; line-height:1.3; font-weight:500;} .consult .counsel_kakao .summary_box dd ul{margin-top:1.5rem;} .consult .counsel_kakao .summary_box dd ul li{padding:0.3rem 0} .consult .counsel_kakao .phone_num dd{display:flex; justify-content:center;} .consult .counsel_kakao .phone_num .num_box{display:flex;} .consult .counsel_kakao .phone_num .num_box + .num_box input:first-child, .consult .counsel_kakao .phone_num .num_box input + input{border-left:none} .consult .counsel_kakao .phone_num input{padding:0; width:7.1rem; height:7.1rem; font-size:5.6rem; line-height:6.9rem; font-weight:300; color:#111; text-align:center; font-family:var(--stevie); border:1px solid #9FA0A0;} .consult .counsel_kakao .phone_num input::placeholder{color:#D6D6D7} .consult .counsel_kakao .btn{margin-top:6.7rem;} .consult .counsel_kakao .btn button{padding:1.8rem 2rem 1.7rem; width:100%; font-size:2.8rem; line-height:1.3; color:#fff; text-align:center; border:1px solid #9FA0A0; background-color:#003668;} .consult .counsel_kakao .btn button:disabled{color:#9FA0A0; background-color:#fff; cursor:auto;} .consult .counsel_kakao .text_wrap{margin-top:6.7rem;} .consult .counsel_kakao .text_wrap textarea{padding:1rem; border:1px solid #9FA0A0; resize:none;} .consult .counsel_kakao .file_wrap input{width:100%; border:1px solid #9FA0A0} .consult .counsel_kakao .text_wrap + .file_wrap input{margin-top:-1px;} .consult .counsel_kakao .privacy{margin-top:8rem; text-align:center;} .consult .counsel_kakao .privacy_chk input[type=checkbox]{position:absolute; left:0; top:0;} .consult .counsel_kakao .privacy_chk input[type=checkbox]+label{padding-left:2.8rem; margin:0 auto; display:block; width:fit-content; font-size:2rem; line-height:1.3; font-weight:500; color:#111; position:relative; cursor:pointer;} .consult .counsel_kakao .privacy_chk input[type=checkbox]+label::before{content:""; display:block; width:2rem; height:2rem; border:1px solid #111; position:absolute; left:0; top:0.4rem;} .consult .counsel_kakao .privacy_chk input[type=checkbox]:checked+label::before{background-image:url("/img/icon_check.svg"); background-repeat:no-repeat; background-position:center; background-size:contain;} .consult .counsel_kakao .privacy .tit{margin-top:1.5rem; font-size:2rem; line-height:1.3; font-weight:500; color:#444;} .consult .counsel_kakao .privacy .privacy_open{margin-top:1.5rem; font-size:2rem; line-height:1.3; font-weight:500; color:#999;} .consult .counsel_kakao .privacy .pop_privacy{text-align:left;} .consult .counsel_kakao .privacy .pop_privacy .pop_inner{max-width:78.1rem; width:calc(100% - 4rem); display:flex; flex-direction:column;} .consult .counsel_kakao .privacy .pop_privacy .pop_hd{margin-bottom:2rem; text-align:right;} .consult .counsel_kakao .privacy .pop_privacy .pop_hd .btn_close{position:relative;} .consult .counsel_kakao .privacy .pop_privacy .clauseArea{padding:3rem; border:1px solid #9FA0A0; overflow:auto;} .consult .counsel_kakao .privacy .pop_privacy .clauseArea .scroll{padding:0; border:none; height:calc(100% - 2px); overflow:visible;} .consult .link_li{display:flex; gap:6rem; flex-wrap:wrap;} .consult .link_li li{flex:1 0 60rem; padding:1.3rem; text-align:center; border:0.5rem solid #003668; box-shadow:inset 0 0 0 0.4rem #fff, inset 0 0 0 0.7rem #003668; position:relative;} .consult .link_li li a{display:flex; align-items:center; justify-content:center; position:absolute; inset:0 0 0 0; z-index:1; opacity:0; transition:all 0.3s ease-out;} .consult .link_li li dl{padding:4.9rem 5rem; transition:all 0.3s ease-out;} .consult .link_li li dt{font-size:3.8rem; line-height:1.3; font-weight:700; color:#111;} .consult .link_li li dd{margin-top:2rem; font-size:2.6rem; line-height:1.3; font-weight:300; color:#9FA0A0; font-family:var(--stevie);} .consult .link_li li:hover a{opacity:1;} .consult .link_li li:hover dl{opacity:0;} /* premium */ .premium .sect_top .sect_tit{font-size:5rem; line-height:1.2;} .premium .sect_top p{margin-top:1rem; font-size:2.2rem; line-height:1.2; font-weight:500; color:#9FA0A0;} .premium .expertise_sect{padding:11rem 0 13.5rem} .premium .expertise_sect .sect_top .boundary{font-size:2rem; line-height:1.6; font-weight:500; color:#9FA0A0;} .premium .expertise_sect .cont_li{margin-top:10rem;} .premium .expertise_sect .cont_li > li{padding:3.5rem 0 6.5rem; display:flex; gap:1rem 8rem; position:relative; border-top:1px solid #9FA0A0} .premium .expertise_sect .cont_li .cont_num{display:flex; justify-content:center; align-items:center; width:4.5rem; height:4.5rem; font-size:2.2rem; line-height:1; font-weight:400; font-family:var(--stevie); color:#9FA0A0; position:absolute; right:0; top:3.5rem; z-index:1;} .premium .expertise_sect .cont_li .cont_num::before{content:""; width:3.2rem; height:3.2rem; border:1px solid #9FA0A0; transform:translate(-50%, -50%) rotate(45deg); transform-origin:center; position:absolute; left:50%; top:50%; z-index:0;} .premium .expertise_sect .cont_li .img_box img{width:30rem;} .premium .expertise_sect .cont_li dl{flex:1; padding-right:5rem;} .premium .expertise_sect .cont_li dt{font-size:4rem; line-height:1.3; font-weight:700; color:#111;} .premium .expertise_sect .cont_li dd{} .premium .expertise_sect .cont_li dd > p{font-size:2.8rem; line-height:1.3; font-weight:700; color:#111;} .premium .expertise_sect .cont_li dd > p.light_t{margin-top:1rem; font-size:2.2rem; line-height:1.3; font-weight:500; color:#9FA0A0;} .premium .expertise_sect .cont_li dd > ul{margin-top:1.5rem;} .premium .expertise_sect .cont_li dd > ul li{font-size:2.2rem; line-height:1.3; font-weight:500; color:#9FA0A0;} .premium .expertise_sect .cont_li dd > ul li+li{margin-top:0.3rem;} .premium .work_steps_sect{padding:20rem 0 0} .premium .work_steps_sect .step_li{margin-top:6rem; display:flex; gap:4rem; justify-content:space-between; flex-wrap:wrap;} .premium .work_steps_sect .step_li li{max-width:40rem; width:calc((100% - 8rem)/3);} .premium .work_steps_sect .step_li li .ico_box{max-height:40rem; width:100%; aspect-ratio:1/1; border:1px solid #D6D6D7; display:flex; justify-content:center; align-items:center;} .premium .work_steps_sect .step_li li .ico_box img{width:18rem;} .premium .work_steps_sect .step_li li dl{margin-top:1.5rem;} .premium .work_steps_sect .step_li li dt{font-size:2.2rem; line-height:1.2; font-weight:500; color:#111} .premium .work_steps_sect .step_li li dd{margin-top:1rem; padding-left:2.4rem;} .premium .work_steps_sect .step_li li dd p{font-size:1.8rem; line-height:1.3; color:#9FA0A0;} .premium .work_steps_sect .step_li li dd p+p{margin-top:0.3rem;} .premium .eco_principles_sect{padding:15rem 0 20rem;} .premium .eco_principles_sect .cont_li{margin-top:8rem; display:flex; gap:7rem; flex-wrap:wrap; justify-content:center;} .premium .eco_principles_sect .cont_li li{width:100%; max-width:42rem; padding:4.3rem 2.3rem 4.4rem; text-align:center; border:0.6rem solid #003668; box-shadow:inset 0 0 0 0.3rem #fff, inset 0 0 0 0.6rem #003668;} .premium .eco_principles_sect .cont_li li em{display:block; font-size:3.2rem; line-height:1.5; color:#003668; font-family:var(--jjg);} .premium .eco_principles_sect .cont_li li dl{margin-top:3rem; padding-top:4.1rem; background:url("/images/boundary_line.svg") no-repeat center top/3.7rem;} .premium .eco_principles_sect .cont_li li dt{font-size:2.2rem; line-height:1.2; font-weight:600; color:#111;} .premium .eco_principles_sect .cont_li li dd{margin-top:0.7rem;} .premium .eco_principles_sect .cont_li li dd p{font-size:1.6rem; line-height:1.3; font-weight:500; color:#9FA0A0;} .premium .eco_principles_sect .cont_li li dd p+p{margin-top:0.5rem;} .premium .exclusive_sect{padding:20.9rem 0 15rem; background:url("/images/border_diamond_2.svg") repeat-x center top/1rem;} .premium .exclusive_sect .sect_top .sect_tit{font-size:6rem;} .premium .exclusive_sect .cont_li{margin-top:8rem; display:flex; justify-content:center; gap:5rem 8.1rem; flex-wrap:wrap;} .premium .exclusive_sect .cont_li li{padding-top:1.7rem; width:calc((100% - 8.1rem)/2); text-align:center; position:relative;} .premium .exclusive_sect .cont_li li em{margin-bottom:-1.7rem; padding:0 calc(((3.3rem + 2px) * 0.70710678) / 1.41421356237); position:absolute; left:50%; top:0; transform:translateX(-50%);} .premium .exclusive_sect .cont_li li em::before, .premium .exclusive_sect .cont_li li em::after{block-size:calc(100% - 0px); border-color:#9FA0A0;} .premium .exclusive_sect .cont_li li em span{padding:0 0.2rem; font-size:2.2rem; line-height:3.3rem; border-color:#9FA0A0; white-space:nowrap;} .premium .exclusive_sect .cont_li li dl{padding:4.1rem 4rem 4rem; height:100%; border:1px solid #9FA0A0;} .premium .exclusive_sect .cont_li li dt span{display:block; font-size:3rem; line-height:1.3; font-weight:800; color:#111;} .premium .exclusive_sect .cont_li li dt p{margin-top:0.5rem; font-size:1.8rem; line-height:1.3; font-weight:700; color:#003668;} .premium .exclusive_sect .cont_li li dd{margin-top:3rem;} .premium .exclusive_sect .cont_li li dd p{font-size:1.6rem; line-height:1.3; color:#9FA0A0;} .premium .exclusive_sect .cont_li li dd p+p{margin-top:0.3rem;} .premium .ai_system_sect{padding:15rem 0 20rem; background-color:#003668;} .premium .ai_system_sect .sect_top .sect_tit{color:#fff} .premium .ai_system_sect .sect_top p{color:#D6D6D7} .premium .ai_system_sect .sect_top .boundary{font-size:2.2rem; line-height:1.7; font-weight:500;} .premium .ai_system_sect .cont_li{margin-top:10rem; overflow:hidden;} .premium .ai_system_sect .cont_li ul{display:flex; gap:3.8rem; flex-wrap:wrap; justify-content:center;} .premium .ai_system_sect .cont_li ul li{width:calc((100% - 15.2rem)/5); position:relative;} .premium .ai_system_sect .cont_li ul li:not(:last-child)::after{content:""; display:block; width:3.8rem; height:calc(100% - 1.7rem); background:url("/images/sub/premium_step_arrow.svg") no-repeat center/0.8rem; position:absolute; left:100%; bottom:0;} .premium .ai_system_sect .cont_li ul li .num{display:block; margin:0 auto -1.7rem; width:3.4rem; height:3.4rem; font-size:1.6rem; line-height:3.4rem; text-align:center; font-family:var(--stevie); position:relative; z-index:0;} .premium .ai_system_sect .cont_li ul li .num::before{content:""; display:block; width:2.4rem; height:2.4rem; border:1px solid #9FA0A0; background-color:#fff; position:absolute; left:50%; top:50%; z-index:-1; transform:translate(-50%, -50%) rotate(45deg);} .premium .ai_system_sect .cont_li ul li dl{height:100%; padding:3.9rem 2rem; text-align:center; background-color:#fff;} .premium .ai_system_sect .cont_li ul li dt{font-size:2.6rem; line-height:1.3; font-weight:700; color:#111;} .premium .ai_system_sect .cont_li ul li dd{margin-top:2.5rem;} .premium .ai_system_sect .cont_li ul li dd p{font-size:1.8rem; line-height:1.3; color:#9FA0A0;} .premium .ai_system_sect .cont_li ul li dd p+p{margin-top:0.7rem;} .premium .service_sect{padding:20rem 0 17rem;} /* .premium .service_sect .sect_top .sect_tit{color:#fff} */ .premium .service_sect .sect_top .boundary{font-size:2rem; line-height:1.6; font-weight:500; color:#9FA0A0} .premium .service_sect .collect_li{margin-top:7rem; display:flex; text-align:center;} .premium .service_sect .collect_li > li+li{border-left:1px solid #4F4A48} .premium .service_sect .collect_li > li{padding:0 0.9rem 0.9rem; width:20%;} .premium .service_sect .collect_li > li .ico_box img{width:17.5rem;} .premium .service_sect .collect_li > li em{margin-top:2rem; display:block; font-size:2.2rem; line-height:1.3; font-family:var(--stevie);} .premium .service_sect .collect_li > li p{margin-top:0.8rem; font-size:1.6rem; line-height:1.3;} .premium .service_sect .service_level{margin-top:10rem;} .premium .service_sect .service_level .level_area{display:flex; flex-wrap:wrap; gap:6rem 10rem; align-items:center;} .premium .service_sect .service_level .level_area + .level_area{margin-top:10rem; padding-top:10rem; border-top:1px solid #9FA0A0;} .premium .service_sect .service_level .level_area figure{padding:8.5rem; width:49.5rem; aspect-ratio:1/1; border:1px solid #9FA0A0; display:flex; align-items:center; justify-content:center;} .premium .service_sect .service_level .level_area figure img{width:32.2rem;} .premium .service_sect .service_level .collect_info{flex:1;} .premium .service_sect .service_level .collect_info dt{line-height:1.3; color:#111; font-family:var(--stevie);} .premium .service_sect .service_level .collect_info dt em{font-size:5rem; font-weight:500;} .premium .service_sect .service_level .collect_info dt p{margin-top:1rem; font-size:2.8rem;} .premium .service_sect .service_level .collect_info dd{margin-top:5rem;} .premium .service_sect .service_level .collect_info dd p{margin-top:1.5rem; font-size:2.2rem; font-weight:500; color:#666;} .premium .service_sect .service_level .detail_box{width:100%;} .premium .service_sect .service_level .detail_box + .detail_box{margin-top:1.9rem;} .premium .service_sect .service_level .detail_box .tit{font-size:3.2rem; line-height:1.3; font-weight:500; color:#333; font-family:var(--stevie);} .premium .service_sect .service_level .detail_box ul{margin-top:3rem;} .premium .service_sect .service_level .detail_box ul li{display:flex; gap:0 1rem; font-size:2.2rem; line-height:1.3; font-weight:500; color:#666;} .premium .service_sect .service_level .detail_box ul li+li{margin-top:1rem;} .premium .service_sect .service_level .detail_box ul li em{font-weight:700; color:#555} .premium .service_sect .service_level .detail_box ul li p{flex:1 ;} .premium .service_sect .service_level .detail_box.intro_type .tit{display:flex; align-items:center;} .premium .service_sect .service_level .detail_box.intro_type .tit p{margin-left:1.5rem; padding-left:1.6rem; font-size:2.4rem; font-weight:500; position:relative;} .premium .service_sect .service_level .detail_box.intro_type .tit p::before{content:""; display:block; width:0.2rem; height:2.5rem; background-color:#D6D6D7; position:absolute; left:0; top:0.3rem;} .premium .service_sect .service_level .detail_box.intro_type ul li em{min-width:11.5rem} .premium .service_sect .service_level .detail_box.intro_type .num_list p+p{margin-top:1.8rem;} .premium .service_sect .service_level .detail_box.intro_type .num_list p{padding-left:2rem; position:relative;} .premium .service_sect .service_level .detail_box.intro_type .num_list p::before{content:counter(num_li)"."; position:absolute; left:0; top:0;} .premium .service_sect .sect_bttm{margin-top:15rem;} .premium .service_sect .sect_bttm .sect_tit{color:#111; font-weight:700;} .premium .service_sect .sect_bttm .btn{margin-top:5rem; text-align:center;} .premium .service_sect .sect_bttm .btn a{padding:0 calc((4.6rem * 0.70710678) / 1.41421356237); overflow:hidden;} .premium .service_sect .sect_bttm .btn a::before, .premium .service_sect .sect_bttm .btn a::after{block-size:calc(100% + 1px); border:1px solid #9FA0A0; background-color:#fff;} .premium .service_sect .sect_bttm .btn a span{padding:0 0.6rem; font-size:2rem; line-height:4.1rem; color:#9FA0A0; border-width:1px ;border-color:#9FA0A0; background-color:#fff;} /* insights */ .insights .style_sect{padding:11rem 0 15rem} .insights .style_sect .sect_top .sect_tit{font-size:5rem; line-height:1.2; color:#111;} .insights .style_sect .cont_li{margin-top:7rem;} .insights .style_sect .cont_li > li{padding:3.5rem 0 6.5rem; display:flex; gap:6rem; flex-wrap:wrap; border-top:1px solid #9FA0A0} .insights .style_sect .cont_li .img_box img{width:35rem;} .insights .style_sect .cont_li dl{flex:1;} .insights .style_sect .cont_li dt{font-size:3.6rem; line-height:1.3; font-weight:700; color:#111;} .insights .style_sect .cont_li dd{margin-top:1.5rem;} .insights .style_sect .cont_li dd > p{font-size:2.2rem; line-height:1.6; font-weight:500; color:#9FA0A0;} .insights .cost_saving_sect{padding:20rem 0 15rem;} .insights .cost_saving_sect .sect_top .sect_tit{font-size:5rem; line-height:1.2; color:#111;} .insights .cost_saving_sect .cont_li{margin-top:7rem;} .insights .cost_saving_sect .cont_li > li{padding:3.5rem 0 6.5rem; display:flex; gap:6rem; border-top:1px solid #9FA0A0} .insights .cost_saving_sect .cont_li .img_box img{width:35rem;} .insights .cost_saving_sect .cont_li dl{flex:1;} .insights .cost_saving_sect .cont_li dt{font-size:4rem; line-height:1.3; color:#003668; font-family:var(--jjg);} .insights .cost_saving_sect .cont_li dd{margin-top:2rem;} .insights .cost_saving_sect .cont_li dd p{font-size:2.4rem; line-height:1.5; font-weight:500; color:#9FA0A0;} .insights .safe_policy_sect{padding:16rem 0; background-color:#000;} .insights .safe_policy_sect .sect_top .sect_tit{font-size:6.8rem; line-height:1.2; color:#fff ;} /* .insights .safe_policy_sect .cont_li{margin-top:7rem; display:flex; justify-content:space-between; gap:4rem; flex-wrap:wrap;} .insights .safe_policy_sect .cont_li li{width:calc(50% - 2rem); max-width:fit-content;} */ .insights .faq_late_sect{padding:15rem 0} .insights .faq_late_sect .sect_top .sect_tit{font-size:5rem; line-height:1.2;} .insights .faq_late_sect .sect_top p{margin-top:1.5rem; font-size:2.6rem; line-height:1.2;} .insights .faq_late_sect .faqArea{margin-top:10.5rem;} .insights .faq_late_sect .btn{margin-top:8rem; text-align:center;} .insights .faq_late_sect .btn a{padding:0 calc(((4.1rem + 2px) * 0.70710678) / 1.41421356237)} .insights .faq_late_sect .btn a span{padding:0; font-size:2.2rem; line-height:4.1rem; color:#9FA0A0; border-color: #9FA0A0;} .insights .faq_late_sect .btn a::before, .insights .faq_late_sect .btn a::after{border-color:#9FA0A0; block-size:calc(100% - 0px);} /* care */ .care .sect_top .sect_tit{font-size:6.6rem; line-height:1.3;} .care .service_sect{padding:10rem 0 20rem;} .care .service_sect .cont_li{margin-top:6rem; display:flex; gap:6rem 4rem; flex-wrap:wrap;} .care .service_sect .cont_li li{width:calc((100% - 8rem)/3); background-color:#fff;} .care .service_sect .cont_li li .img_box{width:100%; margin:0} .care .service_sect .cont_li li .img_box img{width:100%;} .care .service_sect .cont_li li dl{padding:2rem 2rem 2.7rem; text-align:center;} .care .service_sect .cont_li li dt{font-size:3rem; line-height:1.3; font-weight:800; color:#111;} .care .service_sect .cont_li li dd{margin-top:2rem; color:#9FA0A0;} .care .service_sect .cont_li li dd em{display:block; font-size:1.8rem; line-height:1.3; font-weight:600; text-decoration:underline; text-underline-offset:0.4rem} .care .service_sect .cont_li li dd p{margin-top:1.2rem;} .care .service_sect .info_box{margin-top:10rem; padding:4.2rem 3.6rem 4.6rem; text-align:center; border:0.5rem solid #003668; box-shadow:inset 0 0 0 0.5rem #fff, inset 0 0 0 0.7rem #003668;} .care .service_sect .info_box em{display:block; font-size:5rem; line-height:1.3; font-weight:700; color:#111;} .care .service_sect .info_box p{margin-top:2rem; font-size:2.4rem; line-height:1.3; font-weight:500; color:#9FA0A0;} .care .service_sect .info_box ul{margin-top:3.5rem; display:flex; gap:2rem; justify-content:center; align-items:center; flex-wrap:wrap;} .care .service_sect .info_box ul li:nth-child(1) img{width:3.7rem;} .care .service_sect .info_box ul li:nth-child(2) img{width:3rem;} .care .service_sect .info_box ul li:nth-child(3) img{width:3.5rem;} .care .service_sect .info_box ul li:nth-child(4) img{width:3.8rem;} .care .service_sect .info_box ul li:nth-child(5) img{width:2.8rem;} .care .process_sect{padding:15rem 0 14rem} .care .process_sect .sect_top p{margin-top:1.5rem; font-size:2.6rem; line-height:1.2; font-weight:500; color:#9FA0A0;} .care .process_sect .sect_top .boundary{font-size:2.6rem; line-height:1.5; font-weight:500; color:#9FA0A0;} .care .process_sect .cont_li{margin-top:8rem;} .care .process_sect .cont_li li{text-align:center;} .care .process_sect .cont_li li .num{display:inline-block; width:4.5rem; font-size:2.4rem; line-height:4.5rem; font-family:var(--stevie); color:#fff; position:relative; z-index:1;} .care .process_sect .cont_li li .num::before{content:""; display:block; width:3.2rem; aspect-ratio:1/1; background-color:#003668; transform:translate(-50%, -50%) rotate(45deg); position:absolute; left:50%; top:50%; z-index:-1;} .care .process_sect .cont_li li dl{padding:5.2rem 2rem 6rem; margin-top:-2.3rem; border-top:1px solid #D6D6D7;} .care .process_sect .cont_li li dt{font-size:4.6rem; line-height:1.4; color:#003668; font-family:var(--jjg);} .care .process_sect .cont_li li dd{margin-top:2.5rem;} .care .process_sect .cont_li li dd p{font-size:2.2rem; line-height:1.3; font-weight:500; color:#9FA0A0;} .care .process_sect .cont_li li dd p+p{margin-top:1rem;} .care .location_sect{padding:11rem 0 16rem} .care .location_sect .wideKakao{margin-top:6rem;} .care .location_sect .wideKakao>.root_daum_roughmap{height:87rem;} .care .location_sect .cont_area{margin-top:8rem;} .care .location_sect .cont_area h4{font-size:4rem; line-height:1.3; font-weight:500; color:#111; font-family:var(--stevie);} .care .location_sect .cont_area dl{font-size:2.6rem; color:#9FA0A0;} .care .location_sect .cont_area dt{line-height:1.3; font-weight:500; font-family:var(--stevie);} .care .location_sect .cont_area .addr{margin-top:1rem;} .care .location_sect .cont_area .addr dd p{font-weight:400;} .care .location_sect .cont_area .addr dd ul{margin-top:1rem; display:flex; gap:2.4rem; flex-wrap:wrap;} .care .location_sect .cont_area .addr dd ul>li{line-height:0;} .care .location_sect .cont_area .addr dd ul>li>a{padding:0 calc(((2.3rem + 2px) * 0.70710678) / 1.41421356237)} .care .location_sect .cont_area .addr dd ul>li>a::before, .care .location_sect .cont_area .addr dd ul>li>a::after{block-size:calc(100% - 0px); border-color:#9FA0A0;} .care .location_sect .cont_area .addr dd ul>li>a span{padding:0; font-size:1.2rem; line-height:2.3rem; border-color:#9FA0A0;} .care .location_sect .cont_area .contact{margin-top:4rem;} .care .location_sect .cont_area .contact dd{font-family:var(--stevie);} .care .location_sect .cont_area .contact dd+dt{margin-top:3rem;} .care .location_sect .branch_box{margin-top:8rem; display:flex; gap:6rem; flex-wrap:wrap;} .care .location_sect .branch_box li{padding:4.5rem; width:calc(50% - 3rem); border:0.5rem solid #003668; box-shadow:inset 0 0 0 0.4rem #fff, inset 0 0 0 0.7rem #003668; } .care .location_sect .branch_box dt{font-size:3.8rem; line-height:1.3; font-weight:700; color:#111;} .care .location_sect .branch_box dt span{font-size:1.8rem;} .care .location_sect .branch_box dd{margin-top:1rem; font-size:2.6rem; line-height:1.3; font-family:var(--stevie); color:#9FA0A0} .care .location_sect .branch_box dd em{display:block; font-weight:500;} .care .location_sect .branch_box dd p{} /* csr */ .csr .border_diamond_sect{background:url("/images/border_diamond_2.svg") repeat-x center top/1rem;} .csr .img_box.double_line{padding:0.7rem; border:0.5rem solid #003668; box-shadow:inset 0 0 0 0.4rem #fff, inset 0 0 0 0.7rem #003668;} .csr .img_box.double_line img{width:100%;} .csr .top_bann_sect{padding:8rem 0 7rem} .csr .hall_honor_sect{padding:16rem 0 20rem;} .csr .hall_honor_sect .sect_top .sect_tit{font-size:6.6rem; line-height:1.3;} .csr .hall_honor_sect .sect_top p{margin-top:1.5rem; font-size:2.6rem; line-height:1.2; font-weight:500; color:#9FA0A0;} .csr .hall_honor_sect .cont_li{margin-top:6rem; display:flex; gap:3rem 2.7rem; flex-wrap:wrap;} .csr .hall_honor_sect .cont_li li{width:calc((100% - 8.1rem)/4); aspect-ratio:330/250; position:relative; z-index:0;} .csr .hall_honor_sect .cont_li li img{width:100%; height:100%; object-fit:contain;} .csr .hall_honor_sect .cont_li li.logo_box::after{content:""; display:block; border:1px solid #D6D6D7; position:absolute; inset:0 0 0 0; z-index:1;} .csr .hall_honor_sect .cont_li li p{padding:0.7rem 0 0.8rem; font-size:2rem; line-height:1.3; text-align:center; color:#9FA0A0; font-weight:500; border-top:1px solid #D6D6D7;} .csr .collection_sect{padding:15rem 0; text-align:center;} .csr .collection_sect .sect_top .sect_tit{font-size:6.6rem; line-height:1.3;} .csr .collection_sect .sect_top p{margin-top:1rem; font-size:2.6rem; line-height:1.2; font-weight:500; color:#9FA0A0;} .csr .collection_sect .cont_wr{margin-top:7rem;} .csr .collection_sect .cont_wr .img_box img{width:53.9rem;} .csr .collection_sect .cont_wr p{margin-top:4.5rem; font-size:2rem; line-height:1.7; color:#111;} .csr .collection_sect .cont_wr .btn{margin-top:6rem;} .csr .collection_sect .cont_wr .btn a{padding:0 calc(((4rem + 2px) * 0.70710678) / 1.41421356237);} .csr .collection_sect .cont_wr .btn a::before, .csr .collection_sect .cont_wr .btn a::after{block-size:calc(100% - 0px); border-color:#9FA0A0;} .csr .collection_sect .cont_wr .btn a span{padding:0; font-size:2.2rem; line-height:4rem; font-weight:500; color:#9FA0A0; border-color:#9FA0A0;} .csr .respect_sect{padding:10rem 0; text-align:center;} .csr .respect_sect .sect_top .sect_tit{font-size:5rem; line-height:1.2;} .csr .respect_sect .sect_top p{margin-top:1rem; font-size:2.2rem; line-height:1.2; color:#9FA0A0} .csr .respect_sect .cont_li{margin-top:6rem; display:flex; gap:7rem; flex-wrap:wrap; justify-content:center;} .csr .respect_sect .cont_li li{padding:6.7rem 2.5rem; width:42rem; border:0.5rem solid #003668; box-shadow:inset 0 0 0 0.4rem #fff, inset 0 0 0 0.6rem #003668;} .csr .respect_sect .cont_li li::before{content:"0"counter(num_li); display:block; margin-bottom:0.5rem; font-size:1.6rem; font-weight:600; color:#9FA0A0;} .csr .respect_sect .cont_li li dt{font-size:4rem; line-height:1.4; font-weight:600; color:#003668;} .csr .respect_sect .cont_li li dd{margin-top:2rem; padding-top:2.7rem; font-size:2rem; line-height:1.5; font-weight:500; color:#9FA0A0; background:url("/images/boundary_line.svg") no-repeat center top/2.7rem;} .csr .respect_sect .cont_li + p{margin-top:6rem; font-size:2rem; line-height:1.7; font-weight:500; color:#9FA0A0;} .csr .transformation_sect{padding:17rem 0 15rem} .csr .transformation_sect .sect_top .sect_tit{font-size:6rem; line-height:1.2;} .csr .transformation_sect .sect_top p{margin-top:1.5rem; font-size:2.6rem; line-height:1.2; font-weight:500; color:#9FA0A0;} .csr .transformation_sect .cont_li{margin-top:8rem; display:flex; gap:6rem 2.7rem; flex-wrap:wrap;} .csr .transformation_sect .cont_li li{width:calc((100% - 8.1rem)/4);} .csr .transformation_sect .cont_li li .img_box{width:100%;} .csr .transformation_sect .cont_li li .img_box img{width:100%;} .csr .transformation_sect .cont_li li p{margin-top:2rem; font-size:1.8rem; line-height:1.5; font-weight:500; color:#9FA0A0;} .csr .prmu_voucher_sect{padding:0 0 15rem;} .csr .prmu_voucher_sect .sect_top .sect_tit{font-size:6.6rem; line-height:1.2;} .csr .prmu_voucher_sect .img_box{margin-top:6rem;} .csr .prmu_voucher_sect .img_box img{width:100%;} .csr .prmu_voucher_sect .video{margin-top:6rem;} .csr .prmu_voucher_sect .video #player{width:100%; aspect-ratio:16/9;} .csr .prmu_voucher_sect .btn{margin-top:6rem; text-align:center;} .csr .prmu_voucher_sect .btn a{padding:0 calc(((4rem + 2px) * 0.70710678) / 1.41421356237);} .csr .prmu_voucher_sect .btn a::before, .csr .prmu_voucher_sect .btn a::after{block-size:calc(100% - 0px); border-color:#9FA0A0;} .csr .prmu_voucher_sect .btn a span{padding:0; font-size:2.2rem; line-height:4rem; font-weight:500; color:#9FA0A0; border-color:#9FA0A0;} /* ideology */ .ideology-area{width:100%; max-width:1320px; margin:0 auto -2.5rem; text-align: center; display: flex; flex-flow: row wrap; gap:5rem 4rem;} .ideology-area>li{width:calc((100% - 4rem) / 2);} .ideology-area>li>p{aspect-ratio:640/340; overflow: hidden;} .ideology-area>li>p img{width:100%; height:100%; object-fit: cover; border-radius:0.8rem;} .ideology-area>li>dl{padding:2.5rem 0;} .ideology-area>li>dl>dt{font-weight: 600; font-size:3rem; line-height:1; color: #1b1b1b;} .ideology-area>li>dl>dd{margin-top:2.3rem; font-size:1.9rem; line-height:2.8rem; color: #1b1b1b;} /* history */ .history-visual{border-radius:1.5rem; overflow: hidden; position: relative;} .history-visual>p{width:100%; height:100%; font-weight: bold; font-size:3.6rem; line-height:1; color: rgba(255,255,255,0.9); position: absolute; left:0; top:0; display: flex; align-items: center; justify-content: center;} .history-title{margin:9rem 0 10rem; text-align: center;} .history-title>dt{} .history-title>dt img{height:5.5rem;} .history-title>dd{margin-top:2rem; font-weight: 500; font-size:2.4rem; line-height:1.3; color: #444;} .history-area{font-size:0; line-height:0; position: relative;} .history-area:before{content: ""; width: 0.6rem; margin-left:-0.3rem; background-color: rgba(221,221,221,0.8); display: inline-block; position:absolute; left: 50%; top:1.5rem; bottom:0;} .history-area #his_progress{content: ""; width: 0.6rem; margin-left:-0.3rem; background-color:var(--point); display: inline-block; position:absolute; left: 50%; top:1.5rem; border-radius: 0 0 9px 9px;} .history-area>li{text-align: right; display: flex; justify-content: space-between; position: relative; z-index:2;} .history-area>li+li{margin-top:10rem;} .history-area .history-in{width:50%; padding:0 0 0 12rem; text-align: left; display:inline-block; vertical-align: top; position: relative; cursor: default; order:2;} .history-area .history-in[href]{cursor: pointer !important;} .history-area .history-in:before{content: ""; width: 2.4rem; height:2.4rem; background-color:var(--btn_c); border:4px solid #fff; display: inline-block; position:absolute; left: -1.2rem; top:1rem; border-radius:999px; box-sizing: border-box;} .history-area .history-in>strong{font-weight: bold; font-size:4.2rem; line-height:1; color: var(--point); display:block;} .history-area .txt_wrap{margin-top:3rem; display: flex; justify-content: flex-start;} .history-area .txt_wrap p{font-size:1.8rem; line-height:1.45; color: #666; text-align: left; position: relative; display: flex; gap:0 3rem;} .history-area .txt_wrap p>strong{font-weight: 500; color: #333;} .history-area .txt_wrap p+p{margin-top:0.5rem;} /*.history-area .txt_wrap>p:before{content: "ㆍ"; position:absolute; left: -0.3rem; top:0px;}*/ .history-area .txt_wrap>p+p{margin-top:1rem;} /*.history-area .txt_wrap>ul>li:before{content: "-"; position:absolute; left: 0; top:0px;}*/ .history-area>li .thumb{width:50%; margin-top:0; padding:0 12rem 0 0; position: relative; order:1;} .history-area>li .thumb img{width:100%; max-height:35rem; object-fit:cover; object-position: center center;} .history-area>li:nth-child(even){text-align: left;} .history-area>li:nth-child(even) .history-in{padding:0 12rem 0 0; text-align: right; order:1;} .history-area>li:nth-child(even) .history-in:before{left:auto; right: -1.2rem;} .history-area>li:nth-child(even) .thumb{padding:0 0 0 12rem; order:2;} .history-area>li:nth-child(even) .thumb img{left:12rem; right:0;} .history-area>li:nth-child(even) .txt_wrap{justify-content: flex-end;} .history-area>li:nth-child(even) .txt_wrap p{justify-content: flex-end; text-align: right;} .history-area>li:nth-child(even) .txt_wrap p>strong{order:2;} /* Location */ .location-info{margin-top:7rem; text-align: center;} .location-info>p img{height:6.7rem;} .location-info>div{padding:3.5rem 0 5.5rem; border-bottom:1px solid var(--bor_c); font-weight: 500; font-size:2.2rem; line-height:1.4; color: #1b1b1b;} .location-info>ul{margin-top:4.5rem; display: flex; align-items: center; justify-content: center; gap: 0 5.5rem;} .location-info>ul>li{display: flex; align-items: center; gap:0 1.1rem;} .location-info>ul>li img[src="/images/sub/icon_tel.png"]{height:2.3rem;} .location-info>ul>li img[src="/images/sub/icon_fax.png"]{height:2.4rem;} .location-info>ul>li img[src="/images/sub/icon_mail.png"]{height:2.1rem;} .location-info>ul>li span{font-size:1.8rem; color: #333;} .location-info>ul>li span>strong{font-size:1.6rem;} /* warehouse */ .warehouse-why{width:100%; display: flex; flex-flow: row wrap; gap:0 2rem;} .warehouse-why>li{width:calc((100% - 6rem) / 4); height:15.5rem; background-color: #f8fbff; display: flex; align-items: center; justify-content: space-between; border-radius:0.5rem;} .warehouse-why>li>p{width:14rem; padding:0 1rem;text-align: center;} .warehouse-why>li>p img{height:9.4rem;} .warehouse-why>li>p img[src="/images/sub/icon_warehouse02.png"]{height:6rem;} .warehouse-why>li>p img[src="/images/sub/icon_warehouse03.png"]{height:6.1rem;} .warehouse-why>li>p img[src="/images/sub/icon_warehouse04.png"]{height:7.2rem;} .warehouse-why>li>dl{width:calc(100% - 14rem); padding:0 2rem 0 0.8rem; font-weight: 300; font-size:1.6rem; line-height:2.1rem; color: #111;} .warehouse-why>li>dl>dt{font-weight: 400; font-size:1.5rem; color: #999;} .warehouse-why>li>dl>dt>strong{font-weight: 600; font-size:2rem; color: #111; display:block;} .warehouse-why>li>dl>dd{margin-top:0.8rem;} .warehouse-area{width:100vw; margin:10rem 0 0 -50vw; padding:10rem 0; background-color: #fafafa; position: relative; left:50%;} .warehouse-area.last{margin-bottom:-14rem; padding-bottom:14rem; } .warehouse-service{width:100%; display: flex; flex-flow: row wrap; gap:8rem; counter-reset:item; } .warehouse-service>li{width:calc((100% - 24rem) / 4);} .warehouse-service>li>p{aspect-ratio:300/200; position: relative;} .warehouse-service>li>p:before{content: ""; width: 8rem; height: 100%; background:url('/images/sub/arr_warehouse.png') no-repeat center center/2.9rem; display: inline-block; position:absolute; right:-8rem; top:0px;} .warehouse-service>li>p>span{width:10rem; height:4rem; background-color: var(--point); font-weight: 600; font-size:1.6rem; line-height:1; color: #fff; display: flex; align-items: center; justify-content: center; position: absolute; left:0; top:0; z-index:2; border-radius:0.5rem 0 0 0;} .warehouse-service>li>p>span:before{counter-increment: item; content: "STEP 0"counter(item);} .warehouse-service>li>p>span:after{content: ""; width:0; height:0; border-top:2rem solid transparent; border-bottom:2rem solid transparent; border-left:2.2rem solid var(--point); border-right:0; position: absolute; left:100%; top:0;} .warehouse-service>li>p img{width:100%; height:100%; object-fit: cover; border-radius:0.5rem; } .warehouse-service>li>dl{padding-top:2rem; color: #111;} .warehouse-service>li>dl>dt{font-weight: 600; font-size:2rem; line-height:1;} .warehouse-service>li>dl>dd{margin-top:1.5rem; font-size:1.8rem; line-height:2.4rem;} .warehouse-service>li:last-child>p:before{display:none;} /* forwarding */ .forwarding-area{display: flex; justify-content: space-between; gap:4rem;} .forwarding-area .forwarding-re{width:calc((100% - 4rem) / 2);} .forwarding-area .forwarding-re>p{min-height:6rem; padding:1.9rem 0; background-color: #043f70; font-size:2rem; line-height:1; color: #fff; border-radius:0.5rem 0.5rem 0 0; display: flex; align-items: center; justify-content: center; gap:0.7rem;} .forwarding-area .forwarding-re>p>strong{font-weight: 600; font-size:2.4rem;} .forwarding-area .forwarding-re>dl{padding:0 4.8rem; border:1px solid #c8c8c8; border-top:none; text-align: center; border-radius: 0 0 0.5rem 0.5rem;} .forwarding-area .forwarding-re>dl>dt{padding:2.5rem 0; border-bottom:1px solid #ddd; font-size:2rem; line-height:1.3; color: #111;} .forwarding-area .forwarding-re>dl>dd{height:56rem; display: flex; align-items: center; justify-content: center;} .forwarding-area .forwarding-re>div{padding:2.5rem 4.8rem; background-color: #fff; border:1px solid #c8c8c8; border-top:none; font-size:2rem; line-height:1.3; color: #111; text-align: center; border-radius: 0 0 0.5rem 0.5rem;} .forwarding-area .forwarding-re.air>p{background-color: #052845;} /* transport */ .transport-area{display: flex; justify-content: space-between; gap:4rem;} .transport-area>li{width:calc((100% - 4rem) / 2); position: relative;} .transport-area>li>p{aspect-ratio:700/480;} .transport-area>li>p img{width:100%; height:100%; object-fit: cover; border-radius:1rem;} .transport-area>li>dl{color: #fff; position: absolute; left:4rem; right:4rem; bottom:3.5rem;} .transport-area>li>dl>dt{font-weight: 500; font-size:2.2rem; line-height:1; display: flex; align-items: center; gap:0.3rem 0.7rem;} .transport-area>li>dl>dt>strong{font-weight: 600; font-size:2.6rem;} .transport-area>li>dl>dd{margin-top:1.5rem; font-size:2rem; line-height:2.8rem;} .transport-area>li>dl>dt.subcontract{flex-wrap: wrap;} .transport-area>li>dl>dt.subcontract>strong{width:100%;} .transport-blue{padding:2.2rem; background-color: #b2cadd; font-size:2.2rem; line-height:3rem; color: #1b1b1b; text-align: center; border-radius:1rem;} .transport-blue>strong{font-weight: 600; display:block;} .transport-type{margin-top:1rem; display: flex; flex-flow: row wrap; justify-content: space-between; gap:1rem;} .transport-type>li{width:calc((100% - 2rem) / 3); height:18rem; background-color: #f3f3f3; text-align: center; border-radius:1rem; display: flex; align-items: center; justify-content: center;} .transport-type dl{} .transport-type dl dt img{height:4.9rem;} .transport-type dl dt img[src="/images/sub/icon_transport02.png"]{height:5.1rem;} .transport-type dl dt img[src="/images/sub/icon_transport03.png"]{height:5rem;} .transport-type dl>dd{margin-top:1.7rem; font-weight: 500; font-size:1.8rem; line-height:2.6rem; color: #666;} .transport-type dl>dd>p{font-weight: 600; color: #1b1b1b;} .transport-last{margin-top:2rem; text-align: center; position: relative;} .transport-last>dt>p{margin-top:1rem;} .transport-last>dd{margin-top:1rem; font-weight: 600; font-size:2.4rem; line-height:3.8rem; color: #1b1b1b;} .transport-last>dd>strong{font-weight: 600; font-size:2.8rem; color: var(--point); display:block;} /* recruit */ .recruit-tit{padding-left:1.7rem; font-weight: 500; font-size:2rem; line-height:3rem; color: #111;} .recruit-tit>dd{padding-left:1rem; position: relative;} .recruit-tit>dd:before{content: "·"; position:absolute; left: 0; top:0px;} .recruit-step{width:100%; display: flex; flex-flow: row wrap; gap:8rem; } .recruit-step>li{width:calc((100% - 24rem) / 4); height:25.5rem; background-color: #f8fbff; text-align: center; position: relative; display: flex; flex-flow: row wrap; align-content: center; justify-content: center;} .recruit-step>li:before{content: ""; width: 8rem; height: 100%; background:url('/images/sub/arr_warehouse.png') no-repeat center center/2.9rem; display: inline-block; position:absolute; right:-8rem; top:0px;} .recruit-step>li>p{width:100%; display: flex; align-items: flex-end; justify-content: center;} .recruit-step>li>p img{height:7.6rem;} .recruit-step>li>p img[src="/images/sub/icon_recruit02.png"]{height:7.1rem;} .recruit-step>li>p img[src="/images/sub/icon_recruit03.png"]{height:8rem;} .recruit-step>li>p img[src="/images/sub/icon_recruit04.png"]{height:7.3rem;} .recruit-step>li>dl{padding-top:2rem; color: #111;} .recruit-step>li>dl>dt{font-weight: 600; font-size:2rem; line-height:1;} .recruit-step>li>dl>dt>p{padding-bottom:0.5rem; font-weight: bold; font-size:1.5rem; line-height:1; color: #999;} .recruit-step>li>dl>dd{margin-top:1.5rem; font-size:1.6rem; line-height:2.1rem;} .recruit-step>li:last-child:before{display:none;} /* store */ .store-area{margin-bottom:4rem; display: flex; align-items: center; justify-content: space-between;} .store-area>*{width:50%;} .store-area>.store-map{padding:0 3rem; text-align: center; order:1;} .store-area>.store-map .thumb{display:inline-block; position: relative;} .store-area>.store-map .thumb .finding-map-link{width:76px; height:28px; background-color: #999; font-family:"Pretendard GOV"; font-weight: 600; font-size:14px; line-height:1; color: #fff; position: absolute; left:50%; top:50%; display: flex; align-items: center; justify-content: center; border-radius:99px;} .store-area>.store-map .thumb .finding-map-link:after{content: ""; width: 48px; height: 49px; margin-left:-24px; background: url('/images/sub/img_map_pin.png') no-repeat center top / cover; position:absolute; left: 50%; bottom:calc(100% + 9px); opacity: 0; display:none;} .store-area>.store-map .thumb .finding-map-link[data-val="10"]{margin:-55.4% 0 0 -16.2%;} /* 서울 */ .store-area>.store-map .thumb .finding-map-link[data-val="1"]{margin:-48.6% 0 0 -45.9%;} /* 인천 */ .store-area>.store-map .thumb .finding-map-link[data-val="2"]{margin:-62.7% 0 0 18.3%;} /* 강원 */ .store-area>.store-map .thumb .finding-map-link[data-val="9"]{margin:-39.7% 0 0 -8.6%;} /* 경기 */ .store-area>.store-map .thumb .finding-map-link[data-val="7"]{margin:22.9% 0 0 3.8%;} /* 경남 */ .store-area>.store-map .thumb .finding-map-link[data-val="4"]{margin:-15.7% 0 0 20.4%;} /* 경북 */ .store-area>.store-map .thumb .finding-map-link[data-val="6"]{margin:41.7% 0 0 -26.2%;} /* 전남 */ .store-area>.store-map .thumb .finding-map-link[data-val="5"]{margin:7.5% 0 0 -30.5%;} /* 전북 */ .store-area>.store-map .thumb .finding-map-link[data-val="8"]{margin:64.7% 0 0 -49.7%;} /* 제주 */ .store-area>.store-map .thumb .finding-map-link[data-val="3"]{margin:-19.2% 0 0 -34.3%;} /* 충남 */ .store-area>.store-map .thumb .finding-map-link[data-val="11"]{margin:-26.9% 0 0 -3.2%;} /* 충북 */ .store-area>.store-map .thumb .finding-map-link[data-val="16"]{margin:36.1% 0 0 26.8%;} /* 부산 */ .store-area>.store-map .thumb .finding-map-link[data-val="13"]{margin:5.1% 0 0 22.8%;} /* 대구 */ .store-area>.store-map .thumb .finding-map-link[data-val="14"]{margin:27.1% 0 0 -42.2%;} /* 광주 */ .store-area>.store-map .thumb .finding-map-link[data-val="12"]{margin:-11.9% 0 0 -9.2%;} /* 대전 */ .store-area>.store-map .thumb .finding-map-link[data-val="15"]{margin:22.1% 0 0 36.8%;} /* 울산 */ .store-area>.store-map .thumb .finding-map-link:is(:hover, .active){background-color: var(--point); z-index:2;} .store-area>.store-map .thumb .finding-map-link.active:after{height: 58px; opacity: 1;} .store-area>.store-inj{padding-right:3rem; order:2;} .store-area>.store-inj>dl{} .store-area>.store-inj>dl>dt{font-weight: bold; font-size:3.2rem; line-height:1; color:var(--point);} .store-area>.store-inj>dl>dd{margin-top:2rem; font-family:"Pretendard GOV"; font-weight: 500; font-size:2.1rem; line-height:1.2; color: #254737;} .store-area .store-inj-box{height:20.5rem; margin-top:2.5rem; padding:0 3rem; background-color: #f8fbfa; display: flex; align-items: center; justify-content: center; gap:2rem; border-radius:1rem;} .store-area .store-inj-box img{width:14rem; min-width:14rem;} .store-area .store-inj-box>dl{} .store-area .store-inj-box>dl>dt{font-family:"Pretendard GOV"; font-weight: bold; font-size:2.3rem; line-height:1; color:#1b1b1b;} .store-area .store-inj-box>dl>dd{margin-top:1rem; font-family:"Pretendard GOV"; font-weight: 500; font-size:1.8rem; line-height:1.4; color: #254737;} .store-area .store-inj-btn{margin-top:2.5rem; display: flex; justify-content: flex-end;} .store-area .store-inj-btn>a{font-weight: 700; font-size:1.6rem; line-height:1.2; color: #333; display: flex; align-items: center; gap:0.5rem;} .store-area .store-inj-btn>a img{height:0.8rem;} .store-table{width:100%; border-top:2px solid #666; overflow: hidden;} .store-table>table{width:100%; border-spacing:0;} .store-table>table th, .store-table>table td{height:7rem; padding:1.5rem 2rem; background-color: #fff; border-bottom:1px solid #ddd; font-size:1.6rem; line-height:1.6; color:#666; text-align:center; border-collapse:collapse; empty-cells:show; word-break:break-all;} .store-table>table th{background-color: #fdfdfe;} .store-table>table>thead>tr>th{font-weight: 700; font-size:1.7rem; color: #111;} .store-table>table .tit{font-weight: 700; color: #111;} .store-table>table .btn{width:9rem; height:3.7rem; margin:0 auto; background-color: #808080; border:1px solid #707070; font-weight: 700; font-size:1.5rem; line-height:1.2; color: #fff; display: flex; align-items: center; justify-content: center; border-radius:0.5rem;} .store-online-top{height:32rem; background: url('/images/sub/bg_store.jpg') no-repeat center center / cover; display: flex; align-items: center; justify-content: center;} .store-online-top>dl{width:100%; padding-left:10%;color: #fff;} .store-online-top>dl>dt{font-size:3.4rem; line-height:5.2rem;} .store-online-top>dl>dd{margin-top:3rem; font-size:2.2rem; line-height:1;} .store-online-btm{margin-top:5.5rem;} .store-online-btm .text{font-size:2.1rem; line-height:3.8rem; color: #333;} .store-online-btm .text>strong{font-weight: 700; color: var(--point);} /* etc */ .etc_clause{width:90%; margin:0 auto; font-size:0; line-height:0; text-align: center; box-sizing:border-box; position: relative; overflow: visible !important;} .etc_clause:before, .etc_clause:after{content:"";position:absolute;top:2%;bottom:0;left:10px;right:10px;-webkit-box-shadow:0 0 20px rgba(0,0,0,0.8); -moz-box-shadow:0 0 20px rgba(0,0,0,0.8); box-shadow:0 0 20px rgba(0,0,0,0.8);-moz-border-radius:100px / 10px; border-radius:0 7rem 0 7rem;} .etc_clause:after{right:10px;left:auto;-webkit-transform:skew(8deg) rotate(3deg);-moz-transform:skew(8deg) rotate(3deg);-ms-transform:skew(8deg) rotate(3deg);-o-transform:skew(8deg) rotate(3deg);transform:skew(8deg) rotate(3deg);} .etc_clause .etc_clause_in{padding:60px 80px 80px; background-color: #fdfdfd; border:1px solid #cecece; border-radius:0 7rem 0 7rem; position: relative; z-index:2;} .etc_clause .logo{margin:0;} .etc_clause .logo img{} .etc_clause .txt{padding:15px 0 55px; font-weight: 300; font-size:18px; line-height:1; color: #636363;} .etc_clause .txt>span{font-weight: 400; color: #1b1b1b;} .etc_clause .scroll{font-weight:300; font-size:16px; line-height:1.8; color: #626262; text-align: left;} .etc_select{width:90%; margin:0 auto 2rem; text-align: right;} .etc_select select.base{width:auto;} /* search */ .search-area{} .search-area .search-result{font-weight: bold; font-size:2.6rem; line-height:1.2; color: #111; text-align: center;} .search-area .search-result>strong{color: #cc0000;} .search-area .search-re{margin-top:5rem; border-top:2px solid #111;} .search-area .search-re+.search-re{margin-top:10rem;} .search-area .search-re .search-re-tit{padding:3rem 0 0 3rem; display: flex; align-items: center; gap:1rem;} .search-area .search-re .search-re-tit strong{font-weight: 600; font-size:3rem; line-height:1; color: #111;} .search-area .search-re .search-re-tit span{height:3rem; padding:0 1.5rem; background-color:var(--point); font-weight: 600; font-size:1.8rem; line-height:1; color: #fff; display: flex; align-items: center; justify-content: center; border-radius:99px;} .search-area .search-re-list{} .search-area .search-re-list>li{border-bottom:1px solid #ddd;} .search-area .search-link{padding:2.5rem 3rem; display:block;} .search-area .search-link .tit{font-weight: bold; font-size:2.2rem; line-height:1.3; color: #000;} .search-area .search-link .tit>strong{color: #cc0000;} .search-area .search-link .txt{margin-top:1rem; font-weight: 500; font-size:1.6rem; line-height:1.4; color: var(--point);} .search-area .search-re .search-more{margin-top:6rem; display: flex; justify-content: center;} .search-area .search-re .search-more>a{height:4.1rem; padding:0 2.7rem; border:1px solid #666; font-weight: bold; font-size:1.8rem; line-height:1; color: #555; display: flex; align-items: center; justify-content: center; border-radius:0.5rem;} .search-area .result-group{margin-top:5rem; border-top:2px solid #111;} .search-area .result-group dl{border-bottom:1px solid #ddd; display: flex; align-items: center;} .search-area .result-group dl dt{width:15rem; height:15rem; margin-right:2rem; border:1px solid #ddd; overflow:hidden; position:relative;} .search-area .result-group dl dt img{max-width:100%;position:absolute;width:auto; height:auto;margin:auto;top:0; bottom:0; left:0; right:0;} .search-area .result-group dl dd{width:calc(100% - 17rem);} .search-area .result-group dl dd div {} .search-area .result-group dl dd div.title{display: flex; align-items: center; gap:0 1rem;} .search-area .result-group dl dd div.title a{font-weight: bold; font-size:2.2rem; line-height:1.3; color: #000;} .search-area .result-group dl dd div.title a>h2 {} .search-area .result-group dl dd div.title a[target="_blank"]{height:3rem; padding:0 1.5rem; background-color:var(--point); font-weight: 400; font-size:1.6rem; line-height:1; color: #fff; display: flex; align-items: center; justify-content: center; border-radius:99px;} .search-area .result-group dl dd div.cont{max-height: 4.8rem; margin-top:1rem; font-weight: 400; font-size:1.8rem; line-height:2.4rem; color: #999; display: -webkit-box; text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical; overflow:hidden;} /* .search-area .result-group dl dd div.cont{ max-height: 72px; display: -webkit-box; text-overflow: ellipsis;-webkit-line-clamp: 3;-webkit-box-orient: vertical; overflow:hidden;} .search-area .result-group dl dd div.date {color:#999;} */ .search-area .result-group dl dd div.navi, .result-group dl dd div.navi a {margin-top:1.5rem; font-weight: 500; font-size:1.6rem; line-height:1.4; color: var(--point);} .result-group .more {text-align:right;} .result-group .more a {font-size:13px; color:#7d7d7d; text-decoration:underline;} /*[e] Sub Style */ /*[s] Plugin Style */ .layer-base.fancybox__content>.carousel__button.is-close{width:3.3rem; height:3.3rem; top:2.2rem !important; right:3rem; display:none !important;} .layer-base.fancybox__content>.carousel__button.is-close svg{width:100%; height:100%; stroke-width:1.5; filter:none; color: #666;} .layer-base{padding:0 !important; background-color: transparent !important; font-size:0; line-height:0; display:none;} .layer-base .layer-in{} /* .lay-table{width:100%; font-size:0; line-height:0;} .lay-table>table{width:100%; border-spacing:0; table-layout : fixed;} .lay-table>table th, .lay-table>table td{height:7rem; padding:1.5rem 0; background-color: #fff; border-top:1px solid #ebebeb; font-size:1.6rem; line-height:1.5; color:#666; text-align:left; vertical-align: middle; border-collapse:collapse; empty-cells:show; box-sizing: border-box; word-break:keep-all; word-wrap:break-word;} .lay-table>table th{} .lay-table>table>thead>tr>th{} .lay-table>table>tbody>tr>th{font-weight: 500; color: #222;} .lay-table>table .tel{padding-left:4rem; display:inline-block;} .lay-table>table .tel>strong{font-weight: 500; color: #ffde25;} .lay-table>table .btns{width:20rem; height:5rem; background-color: #fff; font-weight: 500; font-size:1.6rem; line-height:5rem; color: #222; text-align: center; display:inline-block; vertical-align: top; border-radius:0.5rem; box-shadow:0 0 2rem rgba(0,0,0,0.1);} .lay-table>table .btns>span{font-weight:bold; font-size:1.6rem;} .lay-table>table .btns+.btns{margin-left:1rem;} .lay-table>table .btns.kakao{background-color: #ffe618;} #layer-time, #layer-juso{width:100%; max-width:160rem;} .layer-base .title{padding-top:2.3rem; font-weight: bold; font-size:3rem; line-height:1; color: #222; position: relative;} .layer-base .title:before{content: ""; width: 4rem; height: 0.5rem; background-color: #222; font-size:0; line-height:0; display: inline-block; position:absolute; left: 0; top:0px;} .lay-time-area{margin-top:3rem; display: flex; justify-content: space-between;} .lay-time-area .lay-map{width:50%; border-radius:1rem; overflow:hidden; position: relative;} .lay-time-area .lay-map>img{width:100%; max-width:none;} .lay-time-area .lay-map .root_daum_roughmap{width:1400px; height:700px; position: absolute; left:50%; top:50%; transform: translate(-50%, -50%);} .lay-time-area .lay-map .wrap_map, .lay-time-area .lay-map .map{width:100%; height:100%;} .lay-time-area .lay-table{width:45.7142%;} #layer-schdule{width:100%; max-width:84rem;} #layer-schdule .layer-in{padding:8rem 4rem 5rem;} #layer-schdule .layer-schdule-area{} #layer-schdule .layer-schdule-text{margin-top:4rem; font-size:1.6rem; line-height:1.4; color: #666;} #layer-schdule .layer-schdule-text>dt{font-weight: 500; font-size:1.8rem; color: #222; } #layer-schdule .layer-schdule-text>dd{margin-top:1rem;} */ #insight-summary{width:100%; max-width:120rem; text-align: center;} #insight-summary .layer-in{padding:9rem 12rem; background-color: #fff; border-radius:1rem;} #insight-summary .character{} #insight-summary .character img{width:10rem;} #insight-summary .insight-summary-title{} #insight-summary .insight-summary-title>dt{font-weight: 600; font-size:3rem; line-height:1.2; color: var(--point);} #insight-summary .insight-summary-title>dd{font-size:2.6rem; line-height:3.4rem; color: #666;} .insight-summary-title{width:100%; margin-bottom:6rem; padding:4rem 3rem; background-color: #f0f0f0;} .insight-summary-title .cate{font-size:1.6rem; line-height:1.2; color: #666;} .insight-summary-title .title{margin-top:1rem; font-weight: 600; font-size:2.4rem; line-height:1.2; color: var(--point); display: block; overflow: hidden;} .insight-summary-title .day{margin-top:2rem; font-size:1.4rem; line-height:1.2; color: #999;} .insight-summary-list{width:100%; text-align: left;} .insight-summary-list>li+li{margin-top:5.5rem;} .insight-summary-list .cate{font-size:1.6rem; line-height:1.2; color: #666;} .insight-summary-list .title{margin-top:1.5rem; font-weight: 600; font-size:2rem; line-height:1.2; color: var(--point); display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .insight-summary-list .text{margin-top:1rem; font-size:1.6rem; line-height:2.6rem; color: #666; display: block; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;} .insight-summary-list .view{margin-top:1.5rem; font-size:1.4rem; line-height:1.2; color: #999; text-decoration: underline; text-underline-position:under; display:inline-block;} #insight-summary .insight-summary-list{margin-top:4rem;} /* Layer Style */ /*.layerArea .layerIn .layerBgIn{width:0px; height:0px; background-color: rgba(255,255,255,0.7); position:absolute; left:50%; top:50%; z-index:100; -webkit-transition: .5s; transition: .5s; transform-origin: 50% 50%;}*/ .layerCell{display:none;} .layerArea{width:0px; height:0px; background-color: rgba(0,0,0,0.7); position:fixed; left:50%; top:50%; z-index:99; overflow:hidden; overflow-y:auto; -webkit-transition: .5s; transition: .5s; transform-origin: 50% 50%;} .layerArea.one, .layerArea.two{width:100%; height:100%; left:0%; top:0%;} .layerArea.two .layerBgIn{width:100%; height:100%; left:0%; top:0%;} .layerArea .closeLy{width:1.7rem; height:1.7rem; display:inline-block; position: absolute; right:0; top:0;} .layerArea .closeLy:before, .layerArea .closeLy:after{content: ""; background-color: #080808; position: absolute; left:50%; top:50%;} .layerArea .closeLy:before{width: 100%; height: 2px; transform:translate(-50%, -50%) rotate(45deg);} .layerArea .closeLy:after{width: 2px; height: 100%; transform:translate(-50%, -50%) rotate(45deg);} .layerArea .closeLy.type02{width:2.3rem; height:2.3rem; right:3rem; top:3rem;} .layerArea .closeLy.type02:before, .layerArea .closeLy.type02:after{background-color: #676767;} .layerArea .layerIn{width:100%; height:100%; display: table; position:relative;} .layerArea .layerIn .layerCell{width:100%; height:100%; padding:70px 0; display: table-cell; vertical-align:middle; position:relative; box-sizing: border-box;} .layerArea .layerIn .layerBox{margin:0 auto; background-color: #fff; font-size:0; line-height:0; display:none; position: relative; box-sizing: border-box; z-index:99; border-radius:1rem;} /* .layerArea .layerIn .layerBox>.tit_lay{padding:25px 25px 15px;} .layerArea .layerIn .layerBox>.tit_lay>strong{font-size:16px; line-height:1; color:#00a9cc;} */ .layerArea .layerIn .layerBox .contLy{position: relative;} .downlay{width:100%; padding:10rem 0; border-radius:0 !important;} .downlay .closeLy{top:-5rem;} .downlay>.contLy{width:64.5rem; margin:0 auto; text-align: center;} .downlay .title{padding-bottom:5rem; font-weight: bold; font-size:3rem; line-height:1; color: #000;} .downlay .title>strong{color: #23abaf;} .downlay .utllBox{width:47.6rem; margin:0 auto; display:table; table-layout: fixed;} .downlay .utllBox>*{width:50%; display:table-cell; vertical-align: top; box-sizing: border-box;} .downlay .utllBox .tit{font-size:1.5rem; line-height:1; color: #666;} .downlay .utllBox .txt{margin-top:2.5rem; font-size:1.2rem; line-height:1; color: #888;} .downlay .utllBox .icon{height:15rem; margin-top:3rem; display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; justify-content: center;} .downlay .utllBox .icon>p+p{margin-top:2rem;} .downlay .utllBox>.qr{border-left:1px solid #dadada;} .downlay .utllBox>.store img{width:16.8rem;} .downlay .utllBox>.qr img{width:15rem;} .formLay{width:62rem; padding:7rem 5rem 6rem; border-radius:1rem;} .formLay input[type=text]{width:100%; height:5.4rem; padding:0; background-color:#fff; border-bottom:2px solid #e8e8e8; font-size:1.8rem; line-height:5.2rem; color:#666; box-sizing: border-box; vertical-align:middle; display:inline-block;} .formLay .title{padding-bottom:3.5rem; border-bottom:1px solid #333; font-weight: 500; font-size:2.6rem; line-height:1; color: #1b1b1b;} .formLay .textBox{width:62rem; margin:-1px 0 0 -5rem; padding:4rem 0; background-color: #f6f7fa; border-top:1px solid #ececec; border-bottom:1px solid #ececec; font-size:1.9rem; line-height:1; color: #1b1b1b; letter-spacing: -0.08em; text-align: center; position: relative; z-index:2;} .formLay .textBox>span{color: #149699;} .formLay .launchingForm{margin-top:1rem;} .formLay .launchingForm>li{padding-top:4rem;} .formLay .launchingForm>li>dl{} .formLay .launchingForm>li>dl>dt{font-weight: 500; font-size:1.9rem; line-height:1; color: #1b1b1b;} .formLay .launchingForm>li>dl>dd{height:6.4rem; padding-top:1rem; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: flex-start; box-sizing: border-box;} .formLay .launchingForm>li>dl>dd.two{flex-wrap: nowrap; justify-content: space-between; white-space: nowrap;} .formLay .launchingForm>li>dl .checkIn{} .formLay .launchingForm>li.two{display: flex; justify-content: space-between;} .formLay .launchingForm>li.two>dl{width:48%;} .formLay .launchingForm>li .clauseView{font-size:1.7rem; line-height:1; color: #989898;display:inline-block;} .formLay .launchingForm>li .clauseView>span{border-bottom:1px solid #999; padding:0.2rem 0 0.3rem; display:inline-block;} .formLay .btnArea{margin-top:6rem;} .privacylay{width:62rem; padding:7rem 5rem;} .privacylay .title{padding-bottom:3.5rem; font-weight: 500; font-size:2.8rem; line-height:1; color: #000; text-align: center;} .privacylay .clauseArea .scroll{padding:3.5rem 3.9rem; background-color: #f8f9fb; border:1px solid #eee; font-weight: 300; font-size:1.7rem; line-height:2.6rem; color: #666;} /* Img Over Bg Style */ #photo{width:960px;margin:0 auto; position:relative; overflow:hidden;} #photo>li{width:150px; height:150px; margin:5px; float:left; display:inline; overflow:hidden; } #photo>li>a{width:100%; height:100%; position: relative; display:block; overflow:hidden;} #photo>li>a>img{width:100%; height:100%; display:block; border-radius:5px;} #photo>li>a>.bg_l{width:100%; height:100%; background-color:red; position: absolute; left:0; top:0; display:none; opacity:0.3; border-radius:5px;} /* Notice One Line Style */ .mNoticeList{width:100%; height:60px; margin-top:25px; overflow:hidden; position: relative;} .mNoticeList>ul{width:100%; position: absolute; left:0; top:-60px;} .mNoticeList>ul>li{height:60px; position: relative;} .mNoticeList>ul>li>a{padding-left:73px; display:block; position: relative;} .mNoticeList .day{width:41px; padding-right:15px; border-right:1px solid #d5d1cc; font-weight: 600; font-size:12px; line-height:1; color: #b99764; text-align: center; position: absolute; left:0; top:0;} .mNoticeList .day>strong{font-weight: 700; font-size:32px; line-height:1; display:block;} .mNoticeList dl.list{font-size:16px; line-height:20px; color: #876e49; word-break:keep-all; word-wrap:break-word;} .mNoticeList dl.list>dt{padding-bottom:6px; font-weight: 600; font-size:12px; line-height:1; color: #b99764;} /*[e] Plugin Style */ @media only screen and (max-width : 1500px){ /*[s] Main Style */ #mainVisual .vTxtArea{max-width:none;} /*[e] Main Style */ /*[s] Sub Style */ /*[e] Sub Style */ } @media only screen and (max-width : 1450px){ /*[s] Sub Style */ /* premium */ .premium .work_steps_sect .step_li li{max-width:none; width:calc(50% - 2rem);} .premium .ai_system_sect .cont_li ul li{width:calc((100% - 7.6rem)/3); min-height:27rem;} .premium .service_sect .collect_li{flex-wrap:wrap; justify-content:center; gap:4rem 0} .premium .service_sect .collect_li > li{width:calc(100% / 3);} .premium .service_sect .collect_li > li:first-child{border-left:1px solid #4F4A48;} .premium .service_sect .collect_li > li:last-child, .premium .service_sect .collect_li > li:nth-child(3){border-right:1px solid #4F4A48;} /*[e] Sub Style */ } @media only screen and (max-width : 1340px){ /*[s] Main Style */ /* main_premium */ #main_premium .certify_li{flex-wrap:wrap; justify-content:center; gap:4rem 0} #main_premium .certify_li li{width:calc(100% / 3);} #main_premium .certify_li li:nth-child(4){border-color:transparent;} /*[e] Main Style */ } @media only screen and (max-width : 1300px){ .scroll_info{display:block;} .scrollTb{width:100%; padding-bottom:2rem; display:block; overflow:hidden; overflow-x:scroll;} .scrollTb>*{width:120rem !important;} /*[s] Main Style */ /* main_collect */ #main_collect .collect_li{flex-wrap:wrap; justify-content:center; gap:4rem 0} #main_collect .collect_li > li{width:calc(100% / 3);} #main_collect .collect_li > li:first-child{border-left:1px solid #4F4A48;} #main_collect .collect_li > li:last-child, #main_collect .collect_li > li:nth-child(3){border-right:1px solid #4F4A48;} /*[e] Main Style */ /*[s] Sub Style */ /* company */ .company .info_sect .cont_area{gap:6rem 4rem} /* warehouse */ .warehouse-why{gap:2rem;} .warehouse-why>li{width:calc((100% - 4rem) / 2);} .warehouse-service{gap:10rem 8rem;} .warehouse-service>li{width:calc((100% - 8rem) / 2);} .warehouse-service>li:nth-of-type(2)>p:before{width: 8rem;height: 8rem;margin-left:-4rem;right:auto;left: 50%;top:auto; bottom: -18rem;transform: rotate(90deg);} .warehouse-service>li:nth-of-type(3){order:4;} .warehouse-service>li:nth-of-type(3)>p:before{right:auto; left:-8rem; transform: rotateY(-180deg);} .warehouse-service>li:nth-of-type(4){order:3;} /* transport */ .transport-area>li>dl{left:3rem; right:3rem;} /*[e] Sub Style */ /*[s] Layer Style */ /*[e] Layer Style */ } @media only screen and (max-width : 1024px){ /*[s] All Style */ .wideFrame.h740{height: 0; padding-bottom: 56.25%;} .wideKakao>.root_daum_roughmap{height:auto; padding-bottom: 56.25%;} .main_bann .txt_box{padding:8.1rem 2.5rem} /*[e] All Style */ /*[s] Main Popup Style */ .hd_pops{position: absolute; left:2rem !important; top:2rem !important;} .hd_pops_con{width:auto !important;} /*[e] Main Popup Style */ /*[s] Main Style */ /* visual */ #mVisual .visualRoll .slider img{} #mVisual .slick-arrow{display:none !important;} #mVisual .slick-dots{display:block !important;} #mainVisual .vTxtArea{padding:4.9rem 2.5rem;} #mainVisual .vTxt .ii.btn .hex-g{right:auto; left:50%; transform:translateX(-50%);} /* main_premium */ #main_premium .certify_li li{width:50%;} #main_premium .certify_li li:nth-child(1){border-left:1px solid #ccc;} #main_premium .certify_li li:nth-child(2), #main_premium .certify_li li:nth-child(4), #main_premium .certify_li li:nth-child(5){border-right:1px solid #ccc;} #main_premium .certify_li li:nth-child(4){border-color:#ccc} /* main_consult */ /* #main_consult .btn{text-align:center;} */ /* main_service */ #main_service .cont_li{flex-wrap:wrap; gap:4rem 0} #main_service .cont_li li{width:50%; padding:5.3rem 2.5rem 7.6rem} #main_service .cont_li li:nth-child(3)::before{opacity:0;} /*[e] Main Style */ /*[s] Sub Style */ /* company */ .company .info_sect .cont_area .img_box{width:100%;} .company .info_sect .cont_area .cont_box{flex:none; width:100%;} /* portfolio */ .portfolio .pofol_late .late_wr .late_ul li{width:calc(50% - 1rem);} .portfolio .review_sect .late_ul li .cont_area{font-size:2.6rem;} /* premium */ .premium .exclusive_sect .cont_li li{width:100%;} .premium .service_sect .service_level .level_area figure{width:100%; max-height:49.5rem;} .premium .service_sect .service_level .collect_info{flex:none; width:100%;} /* csr */ .csr .transformation_sect .cont_li{gap:6rem 2rem} .csr .transformation_sect .cont_li li{width:calc(50% - 1rem);} /* ideology */ .ideology-area{gap:5rem 2rem;} .ideology-area>li{width:calc((100% - 2rem) / 2);} /* history */ .history-area .history-in{padding:0 0 0 4rem;} .history-area>li .thumb{padding:0 4rem 0 0;} .history-area>li .thumb img{} .history-area>li:nth-child(even) .history-in{padding:0 4rem 0 0;} .history-area>li:nth-child(even) .thumb{padding:0 0 0 4rem;} /* forwarding */ .forwarding-area{flex-wrap: wrap; gap:4rem;} .forwarding-area .forwarding-re{width:100%;} /* transport */ .transport-area{flex-wrap: wrap; gap:4rem;} .transport-area>li{width:100%;} /* recruit */ .recruit-step{} .recruit-step>li{width:calc((100% - 8rem) / 2); height:25.5rem;} .recruit-step>li:nth-of-type(2):before{width: 8rem;height: 8rem;margin-left:-4rem;right:auto;left: 50%;top:auto; bottom: -8rem;transform: rotate(90deg);} .recruit-step>li:nth-of-type(3){order:4;} .recruit-step>li:nth-of-type(3):before{right:auto; left:-8rem; transform: rotateY(-180deg);} .recruit-step>li:nth-of-type(4){order:3;} /* store */ .store-area{display: block;} .store-area>*{width:100%;} .store-area>.store-inj{padding:0 0 7rem 0 ;} .store-table{} .store-table>table{} .store-table>table, .store-table>table tbody, .store-table>table tr, .store-table>table td, .store-table>table th{height:auto; padding:0; background-color: #fff; border:none; display:block;} .store-table>table>thead{display:none;} .store-table>table tr{padding:3rem 0; border-bottom:1px solid #ddd;} .store-table>table th, .store-table>table td{margin-bottom:1rem; text-align: left; position: relative; display: flex; align-items: center; justify-content: flex-start;} .store-table>table .bo_tit{justify-content: flex-start;} .store-table>table th:before, .store-table>table td:before{width:14rem; min-width:14rem; content: attr(data-title); padding-right:2rem; font-weight: 700; color: #222; text-align: justify;} .store-table>table th:after, .store-table>table td:after{content:""; width:1px; height:1.6rem; background-color: #ccc; font-size:0; position: absolute; left:11.5rem; top:50%; transform: translateY(-50%);} .store-table>table .btn{margin:0;} /* search */ .search-area .result-group dl dd div.title a[target="_blank"]{display:none;} /*[e] Sub Style */ /*[s] Plugin Style */ .fancybox__slide{padding:48px 3rem 8px !important;} #insight-summary .layer-in{padding:9rem 6rem;} /*[e] Plugin Style */ } @media only screen and (max-width : 840px){ /*[s] All Style */ .depth-three>a{height:7.5rem; font-size:2.4rem;} .scroll_info{padding:2rem 0 5rem;} .scroll_info:before{font-size:2.4rem; top:0;} h4.bul{font-size:3rem;} .hex_btn span{padding:0.9rem 0 1rem} .main_sect_tit{font-size:5rem;} .main_sect_int{margin-top:1rem; font-size:2.6rem;} .sw_common .swiper-pagination.swiper-pagination-bullets{top:2.5rem; right:2.5rem;} .sw_common .swiper-pagination-bullet{width:1.3rem; height:1.3rem;} .main_bann .txt_box .tit{font-size:3.8rem; line-height:4.47rem;} .main_bann .txt_box .tit + .txt{margin-top:1rem;} .main_bann .txt_box .txt{font-size:2.2rem; font-weight:500;} .angle_t::before{width:2.4rem; height:4.2rem;} .angle_t::after{width:2.4rem; height:4.2rem;} .sw_box03 .sw_contain .swiper-slide{width:38rem;} .sw_box03 .sw_contain .swiper-slide .cont_box{padding-top:2rem;} .sw_box03 .sw_contain .swiper-slide .cont_box .tit{font-size:2.6rem;} .sw_box03 .sw_contain .swiper-slide .cont_box .txt{margin-top:1.2rem; font-size:2.2rem;} .sw_box03 .sw_contain .control_box{margin-top:4rem;} .sw_box03 .sw_contain .swiper-button{width:2.8rem; height:2.8rem;} .sw_box03.sw_project .sw_contain .swiper-slide .cont_box .txt{margin-top:1rem;} .hex_tit span{padding:1.2rem 0.6rem 1.3rem} .hex_tit::before, .hex_tit::after{width:2.9rem; height:5.7rem;} /*[e] All Style */ /*[s] Main Popup Style */ .hd_pops{left:2rem !important; right:2rem !important;} .hd_pops_con{} #popLayer{} #popLayer #moPopArea{} #popLayer #moPopArea .moPop{max-width:90%;} #popLayer #moPopArea #moPopRoll{} #popLayer .slider{} #popLayer .slider img{} /* #popLayer .slider#HKeditorContent{padding:20px; font-size:20px; line-height:1.5; color: #666;} #popLayer .slider#HKeditorContent img{width:auto;} #popLayer #moPopRoll.roll .slider{} */ #popLayer .layerPopClose{width:4rem; height:4rem; right:2rem; top:2rem;} #popLayer .layerPopClose:before{margin:-1px 0 0 -2rem;} #popLayer .layerPopClose:after{margin:-2rem 0 0 -1px;} #popLayer .moPopClose{} #popLayer .moPopClose>*{height:8rem; font-size:2rem;} /* #popLayer .moPopClose button{font-size:1.8rem; line-height:2.4rem;} #popLayer .moPopClose button:before{width: 2.4rem; height: 2.4rem; font-size:1.8rem; line-height:2.6rem;} #popLayer .moPopClose button.toDay_close{padding-left:3.2rem;} #popLayer .moPopClose button.close{padding-right:3.2rem} */ #popLayer .slick-dots{bottom:10rem;} #popLayer .slick-dots>li{} #popLayer .slick-dots>li+li{} #popLayer .slick-dots>li button{width:1.8rem; height:1.8rem;} #popLayer .slick-dots>li.slick-active button{} /*[e] Main Popup Style */ /*[s] Main Style */ /* visual */ #main-visual, #main-visual .main-slider, #main-visual .main-slider .slick-slide, #main-visual .main-slider .slide-media, #main-visual .main-slider .mobile_in{height:70vh !important;} #main-visual .main-slider .mobile_in{width: 242vw;} #main-visual .main-slider .mobile_in video, #main-visual .main-slider .mobile_in iframe{height:100% !important;} /* visual */ #mVisual .visualRoll .slider img{height:115rem;} #mVisual .vTxtArea{height:115rem; align-items: flex-start;} #mVisual .vTxtArea .vTxt_in{padding:24.5rem 0 0;} #mVisual .vTxt .ii.tit{font-size:2.2rem;} #mVisual .vTxt .ii.title{font-size:5.5rem; line-height:6.5rem;} #mVisual .vTxt .ii.txt{font-size:2.6rem; line-height:1.3;} #mVisual .vTxt .ii.controll{margin-top:11rem;} #mVisual .slick-dots>li+li{margin-left:1.5rem;} #mVisual .slick-dots>li button{width:1.6rem !important; height:1.6rem;} #mVisual .slick-dots>li.slick-active button{width:6.1rem !important;} /* visual */ #mainVisual{margin-top:3rem;} #mainVisual .visualRoll .swiper-slide>img{} /* #mainVisual .vTxtArea{padding:10rem 3rem;} */ #mainVisual .vTxt .ii.title{font-size:3.8rem;} #mainVisual .vTxt .ii.text{margin-top:1rem; font-size:2.2rem; font-weight:500;} #mainVisual .vTxt .ii.btn{padding-bottom:9.5rem;} #mainVisual .swiper-pagination-bullet>em{font-size:2rem;} /* main_brand_story */ #main_brand_story{margin-top:15rem;} #main_brand_story .main_sw_brand_st .swiper-slide.unusual_slide img{height:100%; max-width:none; object-fit:contain;} /* main_premium */ #main_premium{padding-bottom:15rem;} #main_premium .certify_li li em{font-size:2.2rem;} /* main_construct_case */ #main_construct_case{padding:15rem 0} #main_construct_case .case_li + .case_li{margin-top:2rem;} #main_construct_case .case_li ul{gap:2rem} #main_construct_case .case_link{padding:1rem} #main_construct_case .case_box{padding:1rem; width:25rem; height:25rem;} #main_construct_case .case_box .subject{font-size:2.6rem;} #main_construct_case .case_box .copy_box .name{font-size:1.3rem;} #main_construct_case .case_box .copy_box .type{font-size:1.2rem;} #main_construct_case .case_box .copy_box .link_ico{width:2rem; height:2rem;} #main_construct_case .case_box .copy_box .link_ico::before, #main_construct_case .case_box .copy_box .link_ico::after{width:0.94rem;} /* main_consult */ #main_consult .border_box{padding:15rem 0} #main_consult .btn{margin-top:5rem;} /* main_project */ #main_project{padding:15rem 0} #main_project .sw_project .btn{margin-top:3rem;} /* main_collect */ #main_collect .collect_li > li{width:50%;} #main_collect .collect_li > li:nth-child(even){border-right:1px solid #4F4A48;} #main_collect .collect_li > li:nth-child(3){border-right:none;} #main_collect .collect_li > li a > em{font-size:2.4rem;} #main_collect .collect_li > li a > p{font-size:2rem;} #main_collect .collect_li .pop_inner{padding:0 1.5rem 1.5rem} #main_collect .collect_li .pop_hd .pop_tit{font-size:6.8rem; top:-0.5rem;} #main_collect .collect_li .pop_hd .btn_close{top:1.5rem} #main_collect .collect_li .pop_body{margin-top:1.5rem;} #main_collect .collect_li .pop_body .cont_box{font-size:1.8rem;} #main_collect .collect_li .pop_body .img_box{margin-top:2rem;} #main_collect .consult_area{margin-top:15rem; padding:16.4rem 0;} /* main_patriot */ #main_patriot{padding:15rem 0} #main_patriot .hashtag_tit{font-size:2.8rem;} #main_patriot .sw_patriot .btn{margin-top:3rem;} /* main_safe_policy */ #main_safe_policy{padding:15rem 0} .safe_policy_sect .cont_li{flex-direction:column; align-items:center;} .safe_policy_sect .cont_li li{width:100%;} .safe_policy_sect .cont_li li dl{padding:16.3rem 12.4rem 16.4rem;} .safe_policy_sect .cont_li li dt{font-size:3.6rem;} /* main_column */ #main_column .border_box{padding:15rem 0} /* main_exclusive */ #main_exclusive .border_box{padding:15rem 0 16.4rem} /* main_service */ #main_service{padding:15rem 0} /* main_end */ #main_end{padding:12rem 0} #main_end .main_sect_int{font-size:2.4rem; line-height:1.3;} #main_end .btn{margin-top:4rem;} /*[e] Main Style */ /*[s] Sub Style */ /* sub common */ .tit_area .sect_tit{font-size:4rem;} .tit_area .sect_tit+p{margin-top:2rem; font-size:2rem;} .sub_pg_tab ul li a::before, .sub_pg_tab ul li a::after{block-size:calc(100% - 0px);} /* brand_str */ .brand_str .sect_tit{font-size:5rem;} .brand_str .bg_box .img_box{height:31rem;} .brand_str .philosophy_sect{padding-bottom:9.9rem;} .brand_str .philosophy_sect .sect_tit{margin-bottom:4rem;} .brand_str .philosophy_sect .bg_box .txt_box{padding:4rem 2rem; font-size:3rem;} .brand_str .story_sect{padding:9rem 0} .brand_str .story_sect .sect_tit{margin-bottom:4rem;} .brand_str .story_sect .bg_box .txt_box{padding:4rem 2rem; font-size:2rem;} .brand_str .story_sect .several_lay{height:31rem;} .brand_str .story_sect .several_lay .img_box p{padding:1.3rem; font-size:0.8rem;} .brand_str .story_sect .btn{margin-top:6rem;} .brand_str .essence_sect{padding:10rem 0 9rem} .brand_str .essence_sect .sect_tit{margin-bottom:5rem;} .brand_str .essence_sect .bg_box .txt_box em{font-size:6.2rem;} .brand_str .essence_sect .bg_box .txt_box p{font-size:2.2rem;} .brand_str .graph_sect{padding:9rem 0} .brand_str .graph_sect .graph_img{margin-top:5.7rem;} /* company */ .company .info_sect{padding:11rem 0} .company .info_sect .sect_top h4{font-size:4rem;} .company .info_sect .sect_top p{font-size:2.6rem;} .company .info_sect .sect_top .boundary{font-size:2.2rem;} .company .info_sect .tab_area .tab_btn{flex-direction:column; gap:1.5rem; align-items:center;} .company .info_sect .tab_area .tab_btn li{width:70%; max-width:600px;} .company .info_sect .tab_area .tab_btn li a{width:100%;} .company .info_sect .tab_area .tab_btn a span{width:100%; text-align:center;} .company .info_sect .tab_area .tab_btn::after{top:auto; bottom:1.8rem; transform:none;} /* .company .info_sect .tab_area .tab_btn a::before, .company .info_sect .tab_area .tab_btn a::after{width:2.4rem; height:3.9rem;} */ .company .premium_sect{padding:11rem 0} .company .premium_sect .sect_tit{font-size:5rem;} .company .premium_sect .btn{margin-top:6rem;} .company .exclusive_sect .sect_top p{font-size:2.1rem;} /* .company .exclusive_sect .cont_box dt{margin-bottom:-2.9rem;} */ /* .company .exclusive_sect .cont_box dd em{font-size:2.8rem;} */ .company .exclusive_sect .cont_box dd ul li{font-size:2.2rem;} .company .project_sect .btn{margin-top:6rem;} /* portfolio */ /* .portfolio .pofol_late .late_wr .late_tit{font-size:2.2rem;} */ .portfolio .pofol_late .late_wr .late_ul .cont_area .tit{font-size:2.4rem;} .portfolio .pofol_late .late_wr .late_ul .cont_area .txt{font-size:2.2rem;} .portfolio .pofol_late .late_wr .btn .hex_btn{padding-top:4rem; position:static;} .portfolio .pofol_late .late_wr .btn .hex_btn span{padding:0.9rem 0.7rem 1rem; font-size:2rem;} .portfolio .pofol_late .late_wr .btn .hex_btn::before, .portfolio .pofol_late .late_wr .btn .hex_btn::after{width:2.6rem; height:4.8rem;} .portfolio .review_sect .late_ul li .thumb{max-width:none;} .portfolio .review_sect .late_ul li .cont_area{max-width:none;} .portfolio .review_sect .btn .hex_btn span{padding:0.9rem 0.7rem 1rem; font-size:2rem;} .portfolio .review_sect .btn .hex_btn::before, .portfolio .review_sect .btn .hex_btn::after{width:2.6rem; height:4.8rem;} /* consult */ .consult .hex_bar_tit .hex-g{padding:0 calc(((17.9rem + 2px) * 0.70710678) / 1.41421356237);} .consult .hex_bar_tit .hex-g span{min-width:auto; height:calc(17.9rem + 2px); font-size:3rem;} .consult .check_wr .check_box .chk_in label{padding-left:8.5rem;} .consult .check_wr .check_box .chk_in input[type="radio"] + label::before{width:6rem;} .consult .check_wr .check_box .chk_in input[type="checkbox"] + label::before{width:4.2rem;} .consult .counsel_kakao dl dt{border-bottom:1px solid #9FA0A0;} .consult .counsel_kakao .summary_box dd{margin-top:-1px; text-align:left;} .consult .counsel_kakao .summary_box dd em{font-size:2.2rem;} .consult .counsel_kakao .summary_box dd ul{font-size:2rem;} .consult .counsel_kakao .phone_num dd{margin-top:3rem; flex-direction:column; gap:2rem 0; align-items:center;} .consult .counsel_kakao .phone_num .num_box+.num_box input:first-child{border-left:1px solid #9FA0A0;} .consult .counsel_kakao .privacy_chk input[type=checkbox]+label{font-size:2rem;} .consult .counsel_kakao .privacy .tit{font-size:2rem;} .consult .counsel_kakao .privacy .privacy_open{font-size:2rem;} .consult .link_li li{flex:none; width:100%;} .consult .link_li li a{padding:3rem 0 } .consult .link_li li a img{height:100%; max-height:19rem;} /* premium */ .premium .sect_top .sect_tit{font-size:4rem} .premium .sect_top p{font-size:2.6rem;} .premium .expertise_sect .sect_top .boundary{font-size:2.2rem;} .premium .expertise_sect .cont_li > li{flex-wrap:wrap;} .premium .expertise_sect .cont_li .cont_num{top:0; left:0; right:0;} .premium .expertise_sect .cont_li .img_box{width:100%;} .premium .expertise_sect .cont_li .img_box img{width:100%;} .premium .expertise_sect .cont_li dl{width:100%; position:relative; padding:5rem 0 0 0} .premium .expertise_sect .cont_li dt{font-size:3.5rem;} .premium .expertise_sect .cont_li dd{margin-top:0.5rem;} .premium .expertise_sect .cont_li dd > p{font-size:2.6rem;} .premium .work_steps_sect .step_li li{width:100%; gap:8rem} .premium .work_steps_sect .step_li li .ico_box img{width:16rem;} .premium .work_steps_sect .step_li li dl{margin-top:2.5rem;} .premium .work_steps_sect .step_li li dt{font-size:2.6rem;} .premium .work_steps_sect .step_li li dd p{font-size:2.2rem;} .premium .eco_principles_sect .cont_li li{max-width:none;} .premium .eco_principles_sect .cont_li li dt{font-size:2.6rem;} .premium .eco_principles_sect .cont_li li dd p{font-size:2rem;} .premium .exclusive_sect .sect_top .sect_tit{font-size:5rem;} .premium .exclusive_sect .cont_li li dt p{font-size:2.2rem;} .premium .exclusive_sect .cont_li li dd p{font-size:2rem;} .premium .ai_system_sect .cont_li ul{gap:6rem} .premium .ai_system_sect .cont_li ul li{width:100%; min-height:auto;} .premium .ai_system_sect .cont_li ul li:not(:last-child)::after{display:none;} .premium .ai_system_sect .cont_li ul li .num{margin-bottom:-2.2rem; width:4.4rem; height:4.4rem; font-size:1.8rem; line-height:4.4rem;} .premium .ai_system_sect .cont_li ul li .num::before{width:2.8rem; height:2.8rem;} .premium .ai_system_sect .cont_li ul li dd p{font-size:2rem;} .premium .service_sect .collect_li > li{width:50%;} .premium .service_sect .collect_li > li:nth-child(even){border-right:1px solid #4F4A48;} .premium .service_sect .collect_li > li:nth-child(3){border-right:none;} .premium .service_sect .collect_li > li em{font-size:2.4rem;} .premium .service_sect .collect_li > li p{font-size:2rem;} /* insights */ .insights .style_sect .sect_top .sect_tit{font-size:4rem;} .insights .style_sect .cont_li > li .img_box{width:100%;} .insights .style_sect .cont_li > li .img_box img{width:100%;} .insights .style_sect .cont_li dt{font-size:3rem;} .insights .cost_saving_sect .sect_top .sect_tit{font-size:4rem;} .insights .cost_saving_sect .cont_li > li{flex-direction:column-reverse;} .insights .cost_saving_sect .cont_li > li .img_box{width:100%;} .insights .cost_saving_sect .cont_li > li .img_box img{width:100%;} .insights .cost_saving_sect .cont_li dt{font-size:3.5rem;} .insights .cost_saving_sect .cont_li dd p{font-size:2.2rem;} .insights .safe_policy_sect .sect_top .sect_tit{font-size:5rem;} /* .insights .safe_policy_sect .cont_li{flex-direction:column; align-items:center;} .insights .safe_policy_sect .cont_li li{width:100%;} */ .insights .faq_late_sect .sect_top .sect_tit{font-size:4rem;} /* care */ .care .sect_top .sect_tit{font-size:5rem;} .care .service_sect .cont_li li{width:100%;} .care .service_sect .cont_li li dd em{font-size:2.2rem;} .care .service_sect .cont_li li dd p{font-size:2rem;} .care .service_sect .info_box em{font-size:4rem;} .care .process_sect .sect_top .boundary{font-size:2.2rem;} .care .process_sect .cont_li li dt{font-size:3.6rem;} .care .location_sect .wideKakao>.root_daum_roughmap{height:50rem;} .care .location_sect .cont_area .addr dd ul>li>a{padding:0 calc(((3rem + 2px) * 0.70710678) / 1.41421356237);} .care .location_sect .cont_area .addr dd ul>li>a span{font-size:1.8rem; line-height:3rem;} .care .location_sect .branch_box li{width:100%;} .care .location_sect .branch_box dt{display:flex; flex-wrap:wrap; align-items:flex-end; gap:0.5rem;} .care .location_sect .branch_box dt span{font-size:2rem; line-height:3rem;} /* csr */ .csr .hall_honor_sect .sect_top .sect_tit{font-size:5rem;} .csr .hall_honor_sect .sect_top p{font-size:2.2rem;} .csr .hall_honor_sect .cont_li{gap:3rem} .csr .hall_honor_sect .cont_li li{width:calc(50% - 1.5rem);} .csr .collection_sect .sect_top .sect_tit{font-size:5.5rem;} .csr .collection_sect .sect_top p{font-size:2.2rem;} .csr .collection_sect .cont_wr p{font-size:2.4rem;} .csr .respect_sect .cont_li li{width:100%;} .csr .respect_sect .cont_li li::before{font-size:1.8rem;} .csr .respect_sect .cont_li li dt{font-size:3.5rem;} .csr .respect_sect .cont_li li dd{font-size:2.4rem;} .csr .respect_sect .cont_li + p{font-size:2.2rem;} .csr .transformation_sect .sect_top .sect_tit{font-size:5rem;} .csr .transformation_sect .cont_li li p{font-size:2.2rem;} .csr .prmu_voucher_sect .sect_top .sect_tit{font-size:5rem;} /* ideology */ .ideology-area>li>dl>dt{font-size:3.2rem;} .ideology-area>li>dl>dd{font-size:2.2rem; line-height:3rem;} /* history */ .history-visual>img{height:36rem; object-fit: cover;} .history-area{} .history-area:before{margin-left:0; left: 0%;} .history-area #his_progress{margin-left:0; left: 0%;} .history-area>li{text-align: left !important; display: block;} .history-area .history-in{width:100%; padding:0 0 0 4rem !important; text-align: left !important;} .history-area .history-in:before{width: 3rem; height:3rem; left: -1.2rem; top:0.5rem;} .history-area .history-in>strong{font-size:4rem;} .history-area .txt_wrap{justify-content: flex-start !important; } .history-area>li .txt_wrap p{padding:0 0 0 0; font-size:2.4rem; justify-content: flex-start !important; text-align: left !important;} /*.history-area .txt_wrap p:before{content: "ㆍ"; position:absolute; left: -0.3rem; top:0px; display:none;}*/ .history-area>li .txt_wrap p+p{margin-top:1rem;} .history-area>li .thumb{width:100%; margin-top:3rem; padding:0 0 0 4rem !important; position: relative;} .history-area>li .thumb img{width:100%; height:auto; position: static; } .history-area>li:nth-child(even) .history-in:before{left:-1.2rem; right:auto;} .history-area>li:nth-child(even) .txt_wrap{justify-content: flex-start;} .history-area>li:nth-child(even) .txt_wrap p>strong{order:0;} /* Location */ .location-info{text-align:left;} .location-info>div{font-size:2.6rem; line-height:1.3;} .location-info>div>span{display:none;} .location-info>ul{flex-wrap: wrap; gap: 1.5rem;} .location-info>ul>li{width:100%; gap:0 1.5rem;} .location-info>ul>li span{font-size:2.2rem;} .location-info>ul>li span>strong{font-size:2rem;} /* warehouse */ .warehouse-why>li{height:20rem;} .warehouse-why>li>p{width:18rem;} .warehouse-why>li>dl{width:calc(100% - 18rem); font-size:2.2rem; line-height:2.8rem;} .warehouse-why>li>dl>dt{font-size:2rem;} .warehouse-why>li>dl>dt>strong{font-size:2.4rem;} .warehouse-service>li>p>span{width:14rem; height:5rem; font-size:2rem;} .warehouse-service>li>p>span:after{border-top-width:2.5rem ; border-bottom-width:2.5rem ;} .warehouse-service>li>dl{} .warehouse-service>li>dl>dt{font-size:2.4rem;} .warehouse-service>li>dl>dd{font-size:2rem; line-height:2.6rem;} /* forwarding */ .forwarding-area .forwarding-re>p{font-size:2.2rem;} .forwarding-area .forwarding-re>p>strong{font-size:2.8rem;} .forwarding-area .forwarding-re>dl>dt{font-size:2.2rem;} .forwarding-area .forwarding-re>dl>dd img{height:44.4rem;} .forwarding-area .forwarding-re>div{font-size:2.2rem;} /* transport */ .transport-area>li>dl>dt{font-size:2.4rem;} .transport-area>li>dl>dt>strong{font-size:2.8rem;} .transport-area>li>dl>dd{font-size:2.2rem; line-height:3rem;} .transport-type dl>dd{font-size:2rem; line-height:3rem;} /* recruit */ .recruit-tit{font-size:2.2rem; line-height:3.2rem;} .recruit-step>li>dl{} .recruit-step>li>dl>dt{font-size:2.6rem;} .recruit-step>li>dl>dt>p{font-size:2rem;} .recruit-step>li>dl>dd{font-size:2.2rem; line-height:2.8rem;} /* store */ .store-area>.store-inj{} .store-area>.store-inj>dl{} .store-area>.store-inj>dl>dt{} .store-area>.store-inj>dl>dd{font-size:2.3rem;} .store-area .store-inj-box{height:23.5rem;} .store-area .store-inj-box img{width:14rem; min-width:14rem;} .store-area .store-inj-box>dl{} .store-area .store-inj-box>dl>dt{font-size:2.4rem; } .store-area .store-inj-box>dl>dd{font-size:2.2rem;} .store-area .store-inj-btn{} .store-area .store-inj-btn>a{font-size:2rem;} .store-table{} .store-table>table{} .store-table>table th, .store-table>table td{font-size:2rem; line-height:1.5;} .store-table>table th{} .store-table>table th:before, .store-table>table td:before{font-size:2.2rem;} .store-table>table .btn{width:12rem; height:4rem; margin:0; font-size:1.8rem;} /* etc */ .etc_clause{width:100%; margin:0 auto;} .etc_clause .etc_clause_in{padding:5rem 3rem; border-radius:1rem;} .etc_clause .logo{margin:0;} .etc_clause .txt{padding:2rem 0 6rem; font-size:2.2rem;} .etc_clause .scroll{font-size:2rem;} .etc_select{width:100%;} .etc_select select.base{width:22rem;} /* search */ .search-area{} .search-area .search-re .search-re-tit span{height:4rem; padding:0 2rem; font-size:2rem;} .search-area .search-re .search-re-list .search-link .tit{font-size:2.4rem;} .search-area .search-re .search-re-list .search-link .txt{font-size:2rem;} .search-area .search-re .search-more>a{height:5.1rem; padding:0 3.7rem; font-weight: 600; font-size:2rem;} .search-area .result-group{} .search-area .result-group dl{} .search-area .result-group dl dt{display:none;} .search-area .result-group dl dd{width:100%;} .search-area .result-group dl dd div {} .search-area .result-group dl dd div.title{} .search-area .result-group dl dd div.title a{font-size:2.4rem;} .search-area .result-group dl dd div.title a>h2 {} .search-area .result-group dl dd div.cont{max-height: 5.6rem; margin-top:1rem; font-weight: 400; font-size:2rem; line-height:2.8rem;} .search-area .result-group dl dd div.navi, .result-group dl dd div.navi a{font-size:2rem;} /*[e] Sub Style */ /*[s] Plugin Style */ /*[e] Plugin Style */ } @media only screen and (max-width : 640px){ .depth-three>a{width:100%;} /* ideology */ .ideology-area{gap:5rem 0;} .ideology-area>li{width:100%;} /* warehouse */ .warehouse-why{gap:2rem;} .warehouse-why>li{width:100%;} .warehouse-service{gap:5rem;} .warehouse-service>li{width:100%;} .warehouse-service>li>p{aspect-ratio:300/130;} .warehouse-service>li:nth-of-type(3){order:3;} .warehouse-service>li:nth-of-type(4){order:4;} .warehouse-service>li>p:before{display:none !important;} /* transport */ .transport-type{} .transport-type>li{width:100%; height:20rem;} .transport-last>dt img{height:12.2rem;} .transport-last>dt img[src="/images/sub/icon_transport.png"]{height:9.3rem;} .transport-last>dd{margin-top:2rem; font-size:2.2rem; line-height:3.6rem;} /* recruit */ .recruit-step{gap:3rem;} .recruit-step>li{width:100%; height:28rem;} .recruit-step>li:nth-of-type(3){order:3;} .recruit-step>li:nth-of-type(4){order:4;} .recruit-step>li:before{display:none !important;} } /* transform: scale(1.1) 부분을 transform: scale(1.1) rotate(.001deg); 로 변경하면 부드럽게 처리되네요 display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; justify-content: center; -ms-flex-align:center; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: center; -ms-flex-align:center; display: flex; align-items: center; justify-content: center; display: flex; align-items: center; justify-content: space-between; display: flex; flex-flow: column wrap; justify-content: space-between; display: flex; flex-flow: column wrap; justify-content: center; display: flex; flex-flow: row wrap; justify-content: center; display: flex; flex-flow: row wrap; justify-content: space-between; display: flex; justify-content: space-between; // 양쪽 끝 정렬 맨 앞에 정렬 justify-content: flex-start; ​ 맨 끝에 정렬 justify-content: flex-end; 가운데 정렬 justify-content: center; 서로 같은 간격으로 박스들이 조정됨. justify-content: space-between;​ 컨텐츠 뿐만 아니라 그 주변도 같은 간격으로 조정됨. justify-content: space-around; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%); filter:grayscale(100%); -webkit-filter:grayscale(100%); backdrop-filter: blur(50px); -webkit-backdrop-filter: blur(50px); transition: all .5s linear; transition: all .5s ease-out; transform:rotate(180deg); -webkit-transition-timing-function:ease-in linear; transition-timing-function:ease-in linear; -webkit-transition-delay: .8s; transition-delay: .8s; :before{content: ""; width: 24px; height: 24px; background-color: #fff; border:1px solid #666; display: inline-block; position:absolute; left: 0; top:0px; box-sizing: border-box;} display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; //한줄 감추기 display: block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; //두줄 감추기 active :first-child :nth-child(1) :nth-of-type(1) box-sizing:border-box; word-break:keep-all; word-wrap:break-word; border-radius:2px; width:calc(100% / 6); box-shadow:0 0 1rem rgba(0,0,0,0.2); */