/*---common css---*/ /*text-center*/ .texc { text-align: center; } /*text-transform*/ .upper { text-transform: uppercase; } /*padding*/ .pt_0 { padding-top: 0 !important; } .pb_0 { padding-bottom: 0 !important; } .pt_100 { padding-top: 100px; } .pb_40 { padding-bottom: 40px; } .main_section { padding: 50px 0; line-height:1.2;} /*첫번째 섹션은 헤더와 배너로 인해 페딩값이 다름*/ .main_section.sec01 {padding:100px 0 50px 0;} .main_section.sec04 {padding:100px 0 50px 0;} @media screen and (max-width: 1480px){ .main_section { padding: 50px 0; } } @media screen and (max-width: 1080px){ .main_section { padding: 35px 0; } } @media screen and (max-width: 575px){ .main_section { padding: 40px 0 20px 0; } .pb_0 { padding-bottom: 20px !important; } .main_section.sec01 {padding:50px 0;} .main_section.sec04 {padding:50px 0;} } /*motion*/ .j_motion.common_motion { transform: translateY(25px); opacity: 0; transition: transform 0.8s ease, opacity 0.4s; } .j_motion.common_motion.on { transform: translateY(0); opacity: 1; } .k_delay_01 { transition-delay: 0.2s !important; } .k_delay_02 { transition-delay: 0.4s !important; } .k_delay_03 { transition-delay: 0.6s !important; } .k_delay_04 { transition-delay: 0.8s !important; } .k_delay_05 { transition-delay: 1s !important; } .k_delay_06 { transition-delay: 1.2s !important; } .k_delay_07 { transition-delay: 1.4s !important; } .k_delay_08 { transition-delay: 1.6s !important; } .k_delay_09 { transition-delay: 1.8s !important; } .k_delay_10 { transition-delay: 2s !important; } .k_delay_11 { transition-delay: 2.2s !important; } /*banner*/ .j_banner { width: 100%; height: 50px; background: #fff9e2; position: relative; } .j_banner.close { display: none; } .j_banner p { letter-spacing: -0.01em; line-height: 50px; } .j_banner p i { display: inline-block; vertical-align: middle; margin-right: 6px; } .j_banner p b { font-weight: 700; } .banner_close_btn { position: absolute; top: 50%; right: 0; width: 11px; height: 11px; transform: translateY(-50%); } .banner_close_btn span { width: 100%; height: 2px; display: block; position: relative; } .banner_close_btn span:after, .banner_close_btn span:before { position: absolute; content: ""; height: 2px; width: 100%; background-color: #2e2d26; left: 0; } .banner_close_btn span:after { transform: rotate(45deg); } .banner_close_btn span:before { transform: rotate(-45deg); } @media screen and (max-width: 720px){ .j_banner p {font-size:15px;} .j_banner p i { margin-right: 0; } .j_banner p i img { width: 70%; } } /*---header---*/ /*----------------------------------------hd_top-------------------------------------*/ #j_header { width: 100%; height: 160px; border-bottom: 1px solid #f0f0f0; position: fixed;top: 0;z-index:99; background:#fff; transition: all .45s ease; top:50px;} #j_header.up.active {position:fixed; top:-92px;} #j_header.active {position:fixed; top:-92px;} #j_header.active .hd_bottom {height:70px;} #j_header.active .hd_bottom .left_box > .hd_nav > ul > li > a {line-height:70px;} #j_header.active .all_menu {top:calc(88% - 0px);} #j_header:after { content: ""; width: 100%; height: 1px; top: 57%; background: #f0f0f0; position: absolute; } #j_header.up {top:0;} #j_header .hd_top { position: relative; display: flex; align-items: center; height: 90px; } #j_header .hd_top .left_box { display: flex; align-items: center; width: 100%; height: 100%; } #j_header .hd_top .left_box .hd_logo > a { display: block; height: 100%; text-align:center;} #j_header .hd_top .left_box .hd_logo > a img {display:block;} #j_header .hd_top .left_box .search { position: relative; width: 350px; height: 50px; margin-left: 47px; } @media screen and (max-width: 1080px){ #j_header .hd_top .left_box .search { width: 250px; } } @media screen and (max-width: 786px){ #j_header .hd_top .left_box .search { width: 230px; } } #j_header .hd_top .left_box .search i { position: absolute; right: 22px; top: 50%; transform: translateY(-50%); } #j_header .hd_top .left_box .search input { width: 100%; height: 100%; border-radius: 25px; border: 1px solid #1b88fd; padding-left: 25px; } #j_header .hd_top .left_box .search input::placeholder { font-size: 14px; color: #a5a5a5; letter-spacing: -0.01em; font-weight: 400; } #j_header .hd_top .left_box .detail_btn { width: 127px; height: 45px; text-align: center; line-height: 45px; color: #878787; border-radius: 22.5px; border: 1px solid #c1c1c1; display: block; margin-left: 9px; letter-spacing: -0.01em; } #j_header .hd_top .left_box .reco_text { margin-left: 33px; } #j_header .hd_top .left_box .reco_text .rec_tit { color: #007bff; letter-spacing: -0.01em; } #j_header .hd_top .left_box .reco_text .rec_txt { color: #868686; letter-spacing: -0.01em; margin-top: 8px; } #j_header .hd_top .left_box .reco_text .rec_txt a { border-bottom: 1px solid #868686; margin:0 5px; } #j_header .hd_top .left_box .reco_text .rec_txt a:first-child {margin-left:0;} #j_header .hd_top .left_box .reco_text .rec_txt a:last-child {margin-right:0;} #j_header .hd_top .right_box { position: absolute; right: 0; top: 50%; transform: translateY(-50%); } #j_header .hd_top .right_box .hd_link { display: flex; } #j_header .hd_top .right_box .hd_link a { display: block; color: #7f7f7f; position: relative; padding:0 20px;} #j_header .hd_top .right_box .hd_link a:first-child {padding-left:0;} #j_header .hd_top .right_box .hd_link a:last-child {padding-right:0;} /* #j_header .hd_top .right_box .hd_link a:nth-child(5):after { display: none; } */ #j_header .hd_top .right_box .hd_link a:last-child:after { display: none; } #j_header .hd_top .right_box .hd_link a:after { position: absolute; content: ""; width: 1px; height: 16px; background: rgba(127, 127, 127, 0.5); right: 0; top: 50%; transform: translateY(-50%); } @media screen and (max-width: 1080px){ #j_header .hd_top .right_box .hd_link a { padding:0 10px;} } /*---------------------mobile------------------------------*/ #j_header .mo_search_btn { display: none; } #j_header .mo_nav_btn { width: 35px; height: 21px; position: relative; display: none; } #j_header .mo_nav_btn span { display: block; width: 100%; height: 2px; background: #2f2f2f; position: absolute; } #j_header .mo_nav_btn span:nth-of-type(1) { top: 0; } #j_header .mo_nav_btn span:nth-of-type(3) { bottom: 0; } .search_input {display:none; background:#fff;} .search_input input {position: absolute; left: 0; bottom: -47px; width: 100%; padding: 16px; border:1px solid #dedede; border-top:none; font-size:12px; font-weight:500; color:#333;} .search_input input::placeholder {font-weight:700;} @media screen and (max-width: 1480px){ #j_header .hd_top .left_box .reco_text { display: none; } #j_header .hd_top .left_box .reco_text { display: none; } } @media screen and (max-width: 1180px){ #j_header .hd_top .left_box .detail_btn { display: none; } } @media screen and (max-width: 1080px){ #j_header .hd_top .left_box .search { margin-left: 20px; } #j_header { height: 160px; } #j_header .hd_top .left_box .hd_logo > a img{width:100%; margin-top:0px;max-width:90px;} } @media screen and (max-width: 720px){ #j_header:after { display:none;} #j_header { height: 65px; } #j_header.active {top:0;top:-65px;} #j_header .hd_top { height: 65px; } #j_header .mo_nav_btn { display: block; width: 30px; height: 100%; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } #j_header .mo_nav_btn span:nth-of-type(1) { top: 25px; } #j_header .mo_nav_btn span:nth-of-type(3) { bottom: 23px; } #j_header .hd_top .left_box {justify-content: center;} #j_header .hd_top .left_box .hd_logo > a {text-align:center;width: 100%;} #j_header .hd_top .left_box .hd_logo > a img{width:100%; margin-top:0px;max-width:100px;} #j_header .hd_top .left_box .search { display: none; } #j_header .hd_top .right_box { display: none; } #j_header .mo_search_btn { display: block;position: absolute; left: 0; top: 50%; transform: translateY(-50%); } #j_header .mo_search_btn i img { width: 60%; vertical-align: middle; margin-right: 12px; } #j_header.up.active {top:0; position:fixed;top:-65px;} } /*------------------------------------hd_bot-----------------------------------------*/ #j_header .hd_bottom { position: relative; height: 70px; align-items: center; display: flex; transition:.25s; } #j_header .hd_bottom .left_box { display: flex; align-items: center; width: 100%; height: 100%; } #j_header .hd_bottom .nav_btn { width: 30px; height: 21px; position: relative;} #j_header .hd_bottom .nav_btn span { display: block; width: 100%; height: 2px; background: #2f2f2f; position: absolute; transition:.3s;} #j_header .hd_bottom .nav_btn span:nth-of-type(1) { transform: translateY(8px);} #j_header .hd_bottom .nav_btn span:nth-of-type(2) { transform: translateY(0px);} #j_header .hd_bottom .nav_btn span:nth-of-type(3) { transform: translateY(-8px);} #j_header .hd_bottom .nav_btn:nth-of-type(1):hover span {transform: translateY(0);} #j_header .hd_bottom .nav_btn:nth-of-type(3):hover span {transform: translateY(0);} #j_header .hd_bottom .nav_btn.often span:nth-of-type(1) {transform: rotate(45deg); top:auto;} #j_header .hd_bottom .nav_btn.often span:nth-of-type(2) {display:none;} #j_header .hd_bottom .nav_btn.often span:nth-of-type(3) {transform: rotate(-45deg);bottom:auto;} @media screen and (max-width: 1080px){ #j_header .hd_bottom .nav_btn {display: none;} } #j_header .hd_bottom .left_box > .hd_nav { height: 100%; } #j_header .hd_bottom .left_box > .hd_nav > ul { display: flex; height: 100%; } #j_header .hd_bottom .left_box > .hd_nav > ul > li { margin-left: 20px; font-size: 1.13rem; font-weight: 700; color: #2f2f2f; position: relative; height: 100%; transition:0.25s; } #j_header .hd_bottom .left_box > .hd_nav > ul > li > a { line-height: 70px; display: block; padding: 0 20px; height: 100%; } #j_header .hd_bottom .left_box > .hd_nav > ul > li > a i {position:relative; z-index:100;} #j_header .hd_bottom .left_box > .hd_nav > ul > li > a i img {vertical-align:middle; margin-right:5px;} #j_header .hd_bottom .left_box > .hd_nav > ul > li > a i:before {content:''; width:0; height:3px; background:#007bff; position:absolute; bottom:-3px; left:0; transition:.3s;} #j_header .hd_bottom .left_box > .hd_nav > ul > li > a:hover i:before {width:100%;} #j_header .hd_bottom .left_box > .hd_nav > ul > li > ul.depth02 { position: absolute; z-index: 2; text-align: center; padding-top: 20px; width: 100%; } #j_header .hd_bottom .left_box > .hd_nav > ul > li > ul.depth02 > li > a { width: 100%; display: block; } /* #j_header .hd_bottom .left_box:hover .all_menu {display:block !important;} */ #j_header .hd_bottom .right_box { position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: flex; } #j_header .hd_bottom .right_box .service_box { position: relative; } #j_header .hd_bottom .right_box .serv_02 { margin-left: 9px; } #j_header .hd_bottom .right_box .serv_02 .service_btn {background:#fff; color:#007bff; border:1px solid #007bff;} #j_header .hd_bottom .right_box .service_btn {background:#007bff; color:#fff; width: 158px; height: 40px; text-align: center; line-height: 40px; display: flex; align-items: center; overflow: hidden; border-radius: 20px; border: 1px solid #007bff; justify-content: space-between; padding: 0 17px; } #j_header .hd_bottom .right_box .service_box .service_list {box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.15); background:# border-radius: 10px; background: #fff; position: absolute; width: 158px; z-index: 1; overflow: hidden; box-sizing: border-box; text-align: center; transition: 0.25s; } #j_header .hd_bottom .right_box .service_box .service_list > li { display: none; } #j_header .hd_bottom .right_box .service_box .service_list > li > a { width: 100%; padding: 10px 20px; display: block; } #j_header .hd_bottom .right_box .service_btn i img {vertical-align:middle;} @media screen and (max-width: 1280px){ #j_header .hd_bottom .right_box .service_btn { width: 158px; padding: 0 12px; } #j_header .hd_bottom .left_box > .hd_nav > ul > li > a { padding: 0 13px; } } @media screen and (max-width: 1080px){ #j_header .hd_bottom .right_box {display:none;} #j_header .hd_bottom .left_box > .hd_nav > ul > li {margin-left:10px;} } @media screen and (max-width: 786px){ #j_header .hd_bottom .left_box > .hd_nav > ul > li > a {padding:0 5px;} } @media screen and (max-width: 720px){ #j_header .hd_bottom { display: none; } } /*------------------------------------nav-----------------------------------------*/ hd.nav>ul>li>ul {position:absolute; z-index:2;} /*------------------------------------hd_gnb_bg-----------------------------------------*/ .hd_gnb_bg {width:100%; position: absolute; height: 224px; background: #fff; top: calc(100% - 0px); left: 0; width: 100%; z-index: 1;} /*all_menu*/ #j_header .all_menu { position: absolute; width: 100%; height: 280px; background: #fff; top: calc(100% - 0px); left: 0; z-index: 1; display:none; border-radius: 0 0 20px 20px; box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.25); background:#007bff; padding:20px; } #j_header .all_menu:before {width:100%; position:absolute; left:-99%; height:100%; background:#007bff; top:0; content:''; box-shadow: -5px 4px 5px 0px rgba(0, 0, 0, 0.25);} #j_header .all_menu:after {width:100%; position:absolute; right:-99%; height:100%; background:#007bff; top:0; content:''; box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.25);} #j_header .all_menu > ul { display: flex; justify-content: center; align-items: center; height: 100%; background:#fff; border-radius:10px; } #j_header .all_menu > ul > li { width: 320px; height: 100%; padding: 30px 15px; position: relative; } #j_header .all_menu > ul > li:hover h3 {color:#007bff;} #j_header .all_menu > ul > li:last-child:after { display: none; } #j_header .all_menu > ul > li:after { content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 160px; background: #f0f0f0; } #j_header .all_menu > ul > li > h3 { font-size: 1.13rem; font-weight: 700; color: #2f2f2f; transition:0.25s; } #j_header .all_menu > ul > li > ul { border-top: 1px solid #666; margin-top: 15px; padding-top: 15px; } #j_header .all_menu > ul > li > ul > li { padding:3px 0px; } #j_header .all_menu > ul > li > ul > li>a{ padding:0px 15px; transition:.2s;} #j_header .all_menu > ul > li > ul > li>a:hover {color:#1b88fd;} @media screen and (min-width: 1200px) { #j_header .all_menu { display: none; } } /*mo_all_menu*/ .mo_all_menu {z-index: 99; position: absolute; background: #fff; height: 110vh; width: 100%; left: 0; top:50px; display:none;} .mo_all_menu>ul {display:flex; flex-wrap:wrap; flex-direction: column;} .mo_all_menu>ul>li>h3 {font-size:15px; padding: 20px 10px; font-weight:bold;} .mo_all_menu>ul>li>ul>li>a {font-size:13px; display:block; padding:10px; color:#898989; transition:.3s;} .mo_all_menu>ul>li>ul {display:flex;} .mo_all_menu>ul>li + li {margin-top:20px; border-top:1px solid #f0f0f0;} .mo_all_menu>ul>li:hover h3 {color:#1b88fd;} .mo_all_menu>ul>li>ul>li>a:hover {color:#1b88fd;} @media screen and (max-width: 720px) { } /*--------------------------------------------------------section01-------------------------------------------------------------------------*/ .sec01 { background: #fbfbfb; padding: 40px 0; line-height:1.2} .sec01 .sec01_j_image {background:url('/images/section/blue/sec01_bg_img01.jpg') no-repeat center / cover; border-radius:15px; overflow:hidden; padding:50px;} .sec01 .sec01_j_image >ul>li h1 strong {box-shadow: inset 0 -30px 0 rgba(180, 136, 205, 0.25);} .sec01 .sec01_j_image ul li:nth-of-type(2) p strong {box-shadow: inset 0 -15px 0 rgba(91, 1, 127, 0.25);} .sec01 .sec01_j_image img { width: 100%; } .sec01 .sec01_j_image img.m_ban { display: none; } .sec01 .sec01_j_image ul {display:flex;} .sec01 .sec01_j_image ul li:nth-of-type(1) {width:69.45%;line-height: 3.25em;} .sec01 .sec01_j_image ul li:nth-of-type(2) {width:30.55%; text-align:center; } .mo_sec01_j_image {background:url('/images/section/blue/mo_sec01_bg_img01.jpg') no-repeat center / cover; border-radius:15px; overflow:hidden; padding: 50px 0px 30px; display:none;} .mo_sec_banner_box {text-align:center; } .mo_sec_banner_box .mo_sec01_j_image ul li h1 strong {box-shadow: inset 0 -20px 0 rgba(234, 0, 255, 0.25);} .mo_sec_banner_box .mo_sec01_j_image ul li:nth-of-type(1) { line-height: 2.65em;} .mo_sec_banner_box .mo_sec01_j_image ul li:nth-of-type(2) {display:flex; justify-content: space-around; margin-top: 73px; } .mo_sec_banner_box .mo_sec01_j_image ul li:nth-of-type(2) p strong {box-shadow: inset 0 -8px 0 rgba(234, 0, 255, 0.25);} .anno_box { display: flex; } .anno_box > li { position: relative; margin-right: 20px; padding: 30px 25px; box-sizing: border-box; border: 1px solid #eef4f7; border-radius: 15px; background: #fff; } .anno_box > li { width: calc((100% - 40px * 3) / 2); } .anno_box > li:last-child { margin-right: 0; } .anno_box .tabs { display: flex; align-items: center; } .anno_box .plus_box { position: absolute; top: 30px; right: 26px; } .anno_box .tabs > li { margin-left: 19px; } .anno_box .tabs > li:first-child { margin-left: 0; } .anno_box .tabs > li > a { color: #a6a6a6; font-weight: 500; letter-spacing: -0.01em; } .anno_box .tabs > li.current > a { color: #232323; font-weight: 700; } .anno_box .tab-content { margin-top: 30px; display: none; background: #fff; } .anno_box .tab-content.current { display: inherit; } .anno_box .tab-content > ul { border-top: 1px solid #f0f0f0; padding-top: 30px; } .anno_box .tab-content > ul > li { position: relative; display: flex; align-items: center; margin-top: 22px; } .anno_box .tab-content > ul > li:first-child { margin-top: 0; } .anno_box .tab-content > ul > li .anno_tit { margin-right: 13px; } .anno_box .tab-content > ul > li .news_txt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; max-width: 340px; width: 100%; } .anno_box .tab-content > ul > li .j_date { position: absolute; top: 0; right: 0; } .ca_box .cont_box > ul { border-top: 1px solid #f0f0f0; padding-top: 30px; margin-top: 30px; } .ca_box .cont_box > ul > li { text-align: center; } .ca_box .cont_box > ul > li + li { margin-top: 13px; } .ca_box .cont_box > ul > li button { margin-right: 12px; } .ca_box .cont_box > ul > li button:last-child { margin-right: 0; } .ca_box .cont_box > ul > li button a i {margin-right:3px;} .ca_box .cont_box > ul > li button.on a { border-color: #1b88fd; color: #1b88fd; font-weight: 700; } .ca_box .cont_box > ul > li button.on a i .img_o { display: inline-block; transition: 0.5s; } .ca_box .cont_box > ul > li button.on a i .img_b { display: none; } .ca_box .cont_box > ul > li a { border: 1px solid #666666; height: 40px; line-height: 40px; border-radius: 20px; text-align: center; display: inline-block; color: #666; font-weight: 400; font-size: 1rem; transition: 0.2s; } .ca_box .cont_box > ul > li a:hover { color: #007bff; font-weight: 500; } .ca_box .cont_box > ul > li a i .img_o { display: none; } .ca_box .cont_box > ul > li a.w_83 { width: 83px; } .ca_box .cont_box > ul > li a.w_105 { width: 105px; } .ca_box .cont_box > ul > li a.w_110 { width: 110px; } .ca_box .cont_box > ul > li a.w_120 { width: 120px; } .ca_box .cont_box > ul > li a.w_130 { width: 130px; } .ca_box .cont_box > ul > li a.w_152 { width: 152px; } .area_box .cont_box > ul { text-align: center; border-top: 1px solid #f0f0f0; padding-top: 30px; margin-top: 30px; } .area_box .cont_box > ul > li { display: flex; justify-content: center; } .area_box .cont_box > ul > li + li { margin-top: 35px; } .area_box .cont_box > ul > li > a { display: block; padding: 0 20px; font-size: 1.13rem; font-weight: 400; color: #666666; padding-top: 0; transition: 0.2s; } .area_box .cont_box > ul > li > a.on { color: #1b88fd; font-weight: 500; } .area_box .cont_box > ul > li > a:hover { color: #007bff; font-weight: 500; } /*--------------------------------------------------------mobile_section01-------------------------------------------------------------------------*/ .mo_anno_box { display: none; margin-top: 10px; } .mo_anno_box > ul { font-size:0; box-sizing:border-box; background: #fff; border-radius: 7px; border: 1px solid #f7fafb; padding: 16px 0; } .mo_anno_box > ul > li { width: 16.66%; display:inline-block; } .mo_anno_box > ul > li.on a i { font-weight: 700; color: #1b88fd; } .mo_anno_box > ul > li.on a img.area_off {display:none;} .mo_anno_box > ul > li.on a img.area_on {display:block;} .mo_anno_box > ul > li > a { display: flex; align-items: center; flex-direction: column; min-height:49px; } .mo_anno_box > ul > li > a img { width:60%; } .mo_anno_box > ul > li > a img.area_on{display:none;} .mo_anno_box > ul > li > a i { font-size: 14.37px; font-weight: 400; color: #666; margin-top: 5px; } .mo_anno_box > ul > li:nth-of-type(n + 7) { margin-top: 16px; } /*--------------------------------------------------------------------------------------------------------------------------------------------------*/ @media screen and (max-width: 1624px){ .area_box .cont_box > ul > li > a { padding: 0 15px; } } @media screen and (max-width: 1480px){ } @media screen and (max-width: 1080px){ .anno_box { flex-wrap: wrap; } .anno_box > li { width: 100%; margin-right: 0; } .anno_box > li + li { margin-top: 20px; } .sec01 { padding: 20px 0; } .mo_sec01_j_image {display:block;} } @media screen and (max-width: 720px){ .mo_anno_box { display: block; } .mo_anno_box > ul > li:nth-of-type(n + 7) { margin-top: 10px; } .sec01 { padding-top: 10px; padding-bottom: 14px; } .sec01 .sec01_j_image {display:none;} .anno_box { display: none; } } /*--------------------------------------------------------section02 프리미엄계열-------------------------------------------------------------------------*/ .main_section .sec_tit { display: flex; justify-content: space-between; align-items: center; } .main_section .sec_tit button i { margin-right: 5px; vertical-align: middle;} .main_section .sec_tit span img { } .sec02_swip .swiper-wrapper {padding-bottom:0px;} .loop_wrap {position: absolute;top: 45px;right: 0;z-index: 20;padding: 16px 20px 23px;max-width: 420px; width:100%; border: 1px solid #000;box-sizing: border-box;font-size: 16px;letter-spacing: -1px;line-height: 18px;background: #fff; display:none;} .loop_wrap.view {display:block;} .loop_tit {display: block;color: #222;font-weight: normal; line-height: 27px;} .loop_line {border-top:1px solid #222; margin-top:12px;} .loop_price {margin-top:12px;color: #222;line-height: 23px;letter-spacing: -1px;font-weight: bold;} .cont_price {display: block;color: #ff0000;line-height: 22px;font-weight: bold; letter-spacing: -0.5px; position:relative;} .loop_close_btn {position: absolute;top: 0;right: 0;width: 52px;height: 53px;} .price_link {position: absolute;top: -7px;right: 0;} .loop_product {float: left;margin-left: 5px; padding: 4px 0;width: 66px;border: 1px solid #1b88fd;box-sizing: border-box;color: #fff;font-size: 14px;text-align: center; background: #1b88fd;} .unit_p {display: inline-block;width:50px; text-align:right; margin-right: 15px;color: #757575; font-size: 16px;font-weight: normal;letter-spacing: -1px;line-height: 22px;} .num_p {display: inline-block;width:100px;text-align:right;} .best_chk {background:#fffff0; border:2px solid #007bff;} .sec02_bg_01 {background:url('/images/section/sec02_img01.jpg') no-repeat center / cover; height:178.48px;} .non_img .sec02_bg_01 {background:url('/images/section/sec03_img02.jpg') no-repeat center / cover; height:178.48px;} .sec02_cont .sec02_img_box img { width: 100%; } .sec02_cont .sec02_img_box img.mo_sec02_img01 { display: none; } .sec02_cont .sec02_cag {background:#007bff; color:#fff; height:30px; text-align:center; padding:5px 10px 0px 10px;display:inline-block;margin-top:0px} .sec02_cont > ul { display: flex; flex-wrap: wrap; } .sec02_cont > ul > li { width: calc((100% - 8px * 3) / 4); margin-right: 8px; border-radius: 10px; overflow: hidden; border: 2px solid #f4f4f4 ; transition: 0.5s; box-shadow: 0px 12px 21px 0px rgba(0, 0, 0, 0.04); cursor: pointer; } .sec02_cont > ul > li.non_premi {display:flex; display: flex; justify-content: center;align-items: center; flex-direction: column; background:#fcfcfc; border: 1px solid #eee;} .sec02_cont > ul > li.non_premi h2 {color:#bababa;} .sec02_cont > ul > li.non_premi p a {color:#bababa;} /*.sec02_cont > ul > li:hover { border: 2px solid #007bff; } */ .sec02_cont > ul > li:nth-of-type(4n) { margin-right: 0; } .sec02_cont > ul > li:nth-of-type(n + 5) { margin-top: 10px; } .bot_box { padding: 20px 20px 20px 20px; position:relative;} .bot_box .s_tit { display: flex; align-items: center; } .bot_box .s_tit > span { display: block; margin-right: 12px; } .bot_box .s_tit > span > i { vertical-align: middle; margin-right: 5px; } .bot_box .b_tit { display: flex; align-items: center; margin-top: 17px; margin-bottom: 14px; line-height: 23px;} .bot_box .b_tit .hurry { display: inline-block; padding:0px 6px 0 7px;background: #ff2424; height: 23px; border-radius: 18px; text-align: center; line-height: 23px; margin-right: 7px; } @media screen and (max-width: 1080px){ .bot_box .b_tit .hurry { padding:1px 7px 0 7px;} } .bot_box .sec02_desc { border-top: 1px solid; border-color: rgba(241, 241, 241); } .bot_box .sec02_desc > li { position: relative; } .bot_box .sec02_desc > li.mt_15 {margin-top:5px;} .bot_box .sec02_desc > li a {position:absolute; right:0; display:block; top:0; font-size:13px; color:#181818; font-weight:500;} .bot_box .sec02_desc > li a i {margin-right:5px;} .bot_box .sec02_desc > li a i img{width:9%;} .bot_box .sec02_desc > li > dl { display: flex;} .bot_box .sec02_desc > li > dl dt { width: 170px; } .bot_box .sec02_desc > li > dl dd { width: calc(100% - 170px); } .bot_box .desc_c { position: absolute; top: 53.2%; left: 37%; display: flex; } .bot_box .desc_c span { width: 48px; height: 20px; text-align: center; line-height: 20px; display: block; border-radius: 10px; border: 1px solid #007bff; } .swip_oran {bottom: -35px !important; } .swip_oran .swiper-pagination-bullet-active { background: #007bff; } @media screen and (max-width: 1080px){ .sec02_cont > ul > li { width: calc((100% - 8px) / 2); } .sec02_cont > ul > li:nth-of-type(2n) { margin-right: 0; } .sec02_cont > ul > li {margin-top:10px;} } @media screen and (max-width: 720px){ .sec02_bg_01 {height:150px;} .sec02_cont > ul > li { width: 100%; margin-right: 0; } .sec02_cont > ul > li + li { margin-top: 10px; } .sec02_cont .sec02_img_box img.pc_sec02_img01 { display: none; } .sec02_cont .sec02_img_box img.mo_sec02_img01 { display: block; height: 70px; } .bot_box { padding: 0px 10px; } .bot_box .sec02_desc > li:nth-of-type(2) { display: none; } .bot_box .b_tit { margin-top: 5px; margin-bottom: 5px; } .bot_box .sec02_desc { border: none; } .bot_box .sec02_desc > li > dl dt { margin-right:7px; } .bot_box .desc_c {right:10px; top:10px; left:auto;} .bot_box .desc_c span { width: 36px; height: 17px; line-height: 16px; } .sec02_cont > ul > li.non_premi {height:195px;} /* .sec02_cont > ul { display: flex; flex-wrap: wrap; display: none; } */ .mySwiper { width: 100%; height: 835px; display: block; } .swiper-wrapper {height:116%;} .mySwiper .swip_img_box img { width: 100%; } .mySwiper .swiper-slide { height: 180px; border: 2px solid transparent; transition: 0.2s; border-radius: 10px; box-shadow: 0px 12px 21px 0px rgba(0, 0, 0, 0.04); overflow:hidden; } .mySwiper .swiper-slide:hover { border: 2px solid #007bff; } .bot_box .s_tit > span {margin:15px 20px 5px 0px;} .bot_box .s_tit > span i { display:inline-block;} .bot_box .s_tit > span i img {width:80%;} .bot_box .sec02_desc > li > .desc_c {right:-40px; top:45%; left:auto;} .bot_box .sec02_desc > li > dl dd i { margin:0 5px; vertical-align: middle;} .bot_box .sec02_desc > li > dl dd i img {width:4%;} .non_img .sec02_bg_01 {height:100px;} } /*--------------------------------------------------------section03 우대계열-------------------------------------------------------------------------*/ .sec03 .sec03_cont > ul > li.non_img .sec03_bg_01 {background: url('/images/section/sec03_img02.jpg') no-repeat center / cover; height:84px; overflow: hidden;} .sec03_bg_01 {background: url('/images/section/sec03_img01.jpg') no-repeat center / cover; height:84px; overflow: hidden;} .sec03_img_box {position:relative;} .sec03_cag {background:#007bff; color:#fff; width:93px; height:23px; text-align:center; transform: rotate(-45deg); display:block; position: absolute; top: 12px;left: -23px; line-height: 23px;} .sec03 .sec03_cont > ul { display: flex; flex-wrap: wrap; } .sec03 .sec03_cont > ul > li { width: calc((100% - 10px * 4) / 5); margin-right: 10px; border: 2px solid #f4f4f4; border-radius: 10px; overflow: hidden; transition: 0.2s; box-shadow: 0px 12px 21px 0px rgba(0, 0, 0, 0.04); } .sec03 .sec03_cont > ul > li:hover { border-color: #0179fa; } .sec03 .sec03_cont > ul > li:nth-of-type(n + 6) { margin-top: 10px; } .sec03 .sec03_cont > ul > li .sec03_img_box img { width: 100%; } .sec03 .sec03_cont > ul > li .sec03_bot_box { text-align: center; padding: 10px 10px; } .sec03 .sec03_cont > ul > li .b_tit p { letter-spacing: -0.025em; } .sec03_desc { border-top: 1px solid #f1f1f1; border-bottom: 1px solid #f1f1f1; padding: 15px 0; margin-top: 15px; } .sec03_desc dl { display: flex; justify-content: center; align-items: center; } .sec03_desc dl + dl { margin-top: 5px; } .sec03_desc dl dt { margin-right: 14px; } .sec03_cate { display: flex; align-items: center; justify-content: space-between; } .sec03_cate p i { margin-right: 4px; vertical-align: middle; } @media (min-width: 1080px) { /* 모바일화면 이상 */ .sec03 .sec03_cont > ul > li:nth-of-type(5n) {margin-right:0;} } @media screen and (max-width: 1080px){ .sec03 .sec03_cont > ul > li { width: calc((100% - 10px) / 2); margin-right: 10px;} .sec03 .sec03_cont > ul > li:nth-of-type(2n) { margin-right: 0; } .sec03 .sec03_cont > ul > li:nth-of-type(5) {margin-right:10px;} .sec03 .sec03_cont > ul > li:nth-of-type(n + 3) { margin-top: 10px;} } @media screen and (max-width: 720px) { .sec03_bg_01 {height:100px;} .sec03_desc {padding: 5px 0; margin-top: 5px;} .sec03_desc dl dt {margin-right:5px;} /*.sec03_cag {width:52px; height:13px; line-height:13px; top: 9px; left: -11px; font-size:10px;}*/ .sec03_cag {width:83px; height:23px; top: 10px;left: -21px; line-height: 23px;} } /*--------------------------------------------------------section04-------------------------------------------------------------------------*/ .sec04_cont_wrap { display: flex; } .sec04_left { width: 30.4%; padding-right: 98px; position: relative; } .sec04_left .sec_tit { border-bottom: 2px solid #232323; padding-bottom: 20px; } .sec04_left .j_cate_list > li h2 { position: relative; } .sec04_left .j_cate_list > li h2 i{ position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: block; cursor: pointer; } .sec04_left .j_cate_list > li h2 i img.down_ar { position: absolute; right: 0; top: 50%; transform: translateY(-50%); cursor: pointer; } .sec04_left .j_cate_list > li h2 i img.up_ar {display:none;} .sec04_left .j_cate_list > li h2.up_arrow i img.up_ar { display: block; } .sec04_left .j_cate_list > li h2.up_arrow i img.down_ar {display:none;} .sec04_left .j_cate_list > li h2 a { display: block; padding: 25px 0; border-bottom: 1px solid #e6e6e6; } .sec04_left .j_cate_list > li > .cate_depth02 { background: #fafafa; padding: 20px; display: none; } .sec04_left .j_cate_list > li > .cate_depth02 > li + li { margin-top: 12px; } .sec04_left .j_cate_list > li > .cate_depth02 > li > a { height: 100%; font-size: 1.13rem; color: #4f4f4f; font-weight: 500; padding-right:10px } .sec04_right { width: 69.6%; } .sec04_right .sec_tit { padding-bottom: 20px; } .sec_04_btn { display: flex; } .sec_04_act_btn { position: relative; } .sec_04_act_btn > .update_btn { display: block; width: 122px; height: 40px; text-align: center; line-height: 40px; border-radius: 20px; border: 1px solid #e1e1e1; } .sec_04_act_btn .update_list { background: #fbfbfb; position: absolute; width: 100%; z-index: 2; } .sec_04_act_btn .update_list > li { display: none; } .sec_04_act_btn .update_list > li > a { display: block; padding: 10px; text-align: center; } .sec_04_act_btn i img {vertical-align:middle;} .sec_04_act_btn2 { position: relative; } .sec_04_act_btn2 > .update_btn { display: block; background: #007bff; color: #fff; width: 142px; height: 40px; text-align: center; line-height: 40px; border-radius: 20px; border: 1px solid #007bff; } .sec_04_act_btn2 .update_list { background: #fbfbfb; position: absolute; width: 100%; z-index: 2; } .sec_04_act_btn2 .update_list > li { display: none; } .sec_04_act_btn2 .update_list > li > a { display: block; padding: 10px; text-align: center; } .sec_04_act_btn2 i img {vertical-align:middle;} .j_star_btn > button a { display: block; width: 122px; height: 40px; text-align: center; line-height: 40px; border-radius: 20px; border: 1px solid #e1e1e1; } .j_star_btn > button a .on_click { display: none; } .j_star_btn > button.on .on_click { display: inline-block; } .j_star_btn > button.on .off_click { display: none; } .sec04_right .j_info > li { position: relative; border: 2px solid #eef4f7; border-radius: 15px; transition: 0.2s; box-shadow: 0px 12px 21px 0px rgba(0, 0, 0, 0.04); box-sizing:border-box; overflow:hidden; } .sec04_right .j_info > li + li { margin-top: 10px; } .sec04_right .j_info > li a > .up_load_tm { position: absolute; right: 30px; top: 20px; } .sec04_right .j_info > li:hover { border-color: #0179fa; } .sec04_right .j_info > li a > .right_con01 { display: flex; align-items: center; } .sec04_right .j_info > li a > .right_con01 .sec_04_img_box { overflow: hidden; width: 22%;} .sec04_right .j_info > li a > .right_con01 .sec_04_img_box .j_img_box {position:relative; padding:21.6% 0; overflow:hidden;margin:0} .sec04_right .j_info > li a > .right_con01 .sec_04_img_box img { border-radius: 2%; position:absolute; top:0; left:0; right:0; bottom:0; max-width:100%; max-height:100%; width:100%; } .sec04_right .j_info > li a > .right_con01 .sec_con_desc { padding: 17px 30px 17px 30px; } .sec04_right .j_info > li a > .right_con01 .sec_con_desc .sec_04_txt p {white-space: nowrap; overflow: hidden; } .sec_04_cs_box { position: relative;} .sec_04_cs_box.cs_box02 {z-index:1; background:#f7f7f7; border-radius:8px; padding:30px;} .sec_04_cs_box { background:#f7f7f7; border-radius:8px; padding:30px;} .sec_04_cs_box .sec_con_desc .sec_04_txt p + p { margin-top: 15px; } .sec_04_cs_date > ul > li dl { display: flex; } .sec_04_cs_date > ul > li dl dt { width: 65px; font-size: 0.9375rem; font-weight: 500; color: #8f8f8f; } .sec_04_cs_date > ul > li dl dd { width: calc(100% - 65px); font-size: 1rem; font-weight: 500; color: 333333; } .sec_04_cs_rank p a i { width: 20px; height: 20px; display: inline-block; text-align: center; line-height: 20px; border: 1px solid #8f8f8f; margin-right: 8px; color: #8f8f8f; } .sec_04_email_iq p i { display: inline-block; width: 2px; height: 13px; background: #333333; margin: 0 9px; } .j_more_btn { text-align: center; } .j_more_btn button { width: 150px; height: 50px; border-radius: 25px; border: 1px solid #007bff; } .j_more_btn button i { margin-left: 18px; } .mo_sec_04_img01 { display: none; } @media screen and (max-width: 1280px){ .sec04_left {display:none;} .sec04_right {width:100%;} } @media screen and (max-width: 1080px){ /* .sec04_left {padding-right:40px;} */ .sec04_left {display:none;} .sec04_right {width:100%;} .sec_04_cs_box.cs_box02 {padding:20px;} .sec_04_cs_box {padding:20px;} /* .sec04_right .j_info > li > .up_load_tm {display:none;} */ } @media screen and (max-width: 767px){ .sec_04_cs_box.cs_box02 {padding:10px;} .sec_04_cs_box {padding:20px 10px 10px 10px;} } @media screen and (max-width: 575px){ .sec04_right .j_info > li a > .up_load_tm { position: absolute; right: 15px; top: 20px; } } @media screen and (max-width: 720px){ .sec04_right .j_info > li a > .right_con01 .sec_con_desc { padding: 17px 10px;} /* .j_info .up_load_tm { display: none; } */ .sec04_left {display:none;} .sec04_right {width:100%;} /* .pc_sec_04_img01 { display: none; } */ .mo_sec_04_img01 { display: block; } .sec04_right .j_info > li a > .right_con01 .sec_04_img_box img {width:auto; border-radius: 5%;} .sec04_right .j_info > li a > .right_con01 .sec_04_img_box { overflow: hidden; width: 20%;margin-left:10px;} .sec04_right .j_info > li a > .right_con01 .sec_04_img_box .j_img_box { padding:27.6% 0;} .j_more_btn button { width: 94px; height: 33px; } .sec_04_act_btn > .update_btn { width: 90px; height: 24px; line-height: 24px; } .sec_04_act_btn > .update_btn b {font-size:12px;} .sec_04_act_btn2 > .update_btn { width: 90px; height: 24px; line-height: 24px; } .sec_04_act_btn2 > .update_btn b {font-size:12px;} .j_star_btn > button a { width: 73px; height: 24px; line-height: 24px; font-size:12px;} .j_more_btn button i img { width: 10%; } .j_star_btn button i img { width: 10%; } .sec04_right .sec_tit { padding-bottom: 20px; } } /*----------------------------------------------foot-----------------------------------------------*/ footer{ border-top :1px solid #ebebeb; position:relative;} footer:after {content:'';position:absolute; width:100%; height:1px; left:0; top:90px; background:#ebebeb;} footer:before {content:'';position:absolute; width:100%; height:1px; left:0; top:194px; background:#ebebeb; display:none;} footer .foot_top {height:90px; line-height:90px;} footer ul.foot_link_line {display:flex; align-items:center; justify-content: space-between; height:100%; } footer ul.foot_link_line .left_foot_link {display:flex;} footer ul.foot_link_line .left_foot_link>a {display:block; height:100%; transition:.2s;} footer ul.foot_link_line .left_foot_link>a:hover {font-weight:700; } footer ul.foot_link_line .left_foot_link>a + a {margin-left:46px;} footer ul.foot_link_line .right_foot_link {display:flex;} footer ul.foot_link_line .right_foot_link>a {display:block; width:110px; height:40px; line-height:40px; border:1px solid #e9e9e9; border-radius:20px; text-align:center;} footer ul.foot_link_line .right_foot_link>a+a {margin-left:11px;} .foot_bott {padding:68px 0;} .foot_bott>ul {display:flex; justify-content: space-between;} .foot_bott>ul>li {position:relative;} .ft_account_info dl {display:flex;} .ft_account_info dl dt {width:73px} .ft_account_info dl dd {width:calc(100% - 73px);} .ft_cs_info p i {vertical-align:middle;} .ft_cs_info p i img {margin-right:8px;} .ft_cs_info dl {display:flex;} .ft_cs_info dl dt {width:73px} .ft_cs_info dl dd {width:calc(100% - 73px);} .ft_address_bx>p{line-height: 1.48em;} .ft_address_bx .f_copy {margin-top:30px;} .ft_navi_mo {display:none; position:relative;} .ft_navi_mo a {display:block; padding:5px; } /* .ft_navi_mo:after {content:''; width:1px; height:10px; background:#666; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);} */ /*mobile*/ .mo_right_foot_link {display:none} /*mobile foot*/ .foot_bott.mo_foot {display:none;} .foot_bott.mo_foot .ft_account_info {text-align:center; border-right: 1px solid #ebebeb;} .foot_bott.mo_foot .ft_cs_info {text-align:center;} @media screen and (max-width: 1280px){ footer ul.foot_link_line .left_foot_link>a + a {margin-left:18px;} footer ul.foot_link_line .right_foot_link>a {width:90px;} } @media screen and (max-width: 1080px){ .foot_bott.pc_foot {display:none;} .foot_bott.mo_foot {display:block;} footer:after {display:none;} footer .foot_top {display:none;} footer ul.foot_link_line .left_foot_link>a + a {margin-left:23px;} .foot_bott {padding:1px;} .foot_bott>ul {flex-wrap: wrap;} .foot_bott>ul>li:nth-of-type(3) {width:100%;} .foot_bott>ul>li:nth-of-type(4) {width:100%;} .foot_bott>ul>li:nth-of-type(n+3) {margin-top:10px;} .j_ft_logo {margin:5px 0; text-align:center; } .j_ft_logo img {width:16.7%} .ft_address_bx {text-align:center;} .ft_address_bx p {line-height: 1.38em;} .ft_address_bx .f_copy {margin-top:0px;} .ft_account_info dl {justify-content: center;} .ft_account_info dl dt {width:70px;} .ft_account_info dl dd {width: calc(100% - 20px);} .mo_right_foot_link {display:flex; justify-content:center;margin-top:10px;} .mo_right_foot_link a {font-size:11px; display:block; width:70px; height:30px; line-height:30px; border:1px solid #e9e9e9; border-radius:20px; text-align:center; margin-right:5px;} .ft_cs_info dl dd {width:calc(100% - 20px);} .ft_cs_info p i img {width:7%; margin-right:5px;} .ft_navi_mo {display:flex; justify-content: space-around;align-items: center; margin-top:10px;} } @media screen and (max-width: 720px){ /* footer:before {display:block;top:194px;} 라인제거 */ } /*20231025 추가 수정*/ #j_header .hd_bottom .left_box > .hd_nav > ul > li > a.nav_cs {position:relative;} /* #j_header .hd_bottom .left_box > .hd_nav > ul > li > a.nav_cs:before{content:'';position:absolute; width:20px; height:20px; left:-5px; top:50%; transform:translateY(-50%); background:url('/img/icon/cs_icon.png') no-repeat center center /cover;} */ #j_header .hd_bottom .left_box > .hd_nav > ul > li > a {position:relative;} #j_header .hd_bottom .left_box > .hd_nav > ul > li > a .nav_emp_num{position:absolute; width:35px; height:20px; right:0px; top:3px; border-radius:5px; background:#007bff; z-index:20;text-align:center; display:block; color:#fff; line-height:17px; letter-spacing: 0.06em; font-size:10px;} #j_header .hd_bottom .left_box > .hd_nav > ul > li > a .nav_emp_num:after {content:''; position:absolute; left:4px; top:16.8px; border-left:5px solid transparent; border-right:6px solid transparent; border-top: 7px solid #007bff;} #j_header .hd_bottom .left_box > .hd_nav > ul > li > a .add_head_icon {width:80px; display:block; background:#fd2929; color:#fff; position:absolute; left: calc( 100% - 63px ); top:3px; text-align:center; height:20px; line-height:20px; z-index:20; padding:0 5px; font-size:12px; background:#ff0000; letter-spacing:0.04em; border-radius:5px;} #j_header .hd_bottom .left_box > .hd_nav > ul > li > a .add_head_icon:after {content:''; position:absolute; left:7px; top:18px; border-left:5px solid transparent; border-right:6px solid transparent; border-top: 7px solid #ff0000;} .kb_icon img{display:block; width:100%; max-width:199px;} .emp_banner_box { width:100%;} .emp_banner_box ul li figure a img {width:100%; border-radius:8px; overflow:hidden;} .add_plus {margin-left:10px;} @media (min-width: 769px) and (max-width: 1080px) { /* PC와 모바일화면 사이 */ #j_header .hd_bottom .left_box > .hd_nav > ul > li > a .nav_emp_num{line-height:20px;} } .add_sec03_cont01 {display:flex; flex-wrap:wrap;} .add_sec03_cont01 li {width:calc((100% - 10px*3)/4); margin-right:10px; display:flex; border:1px solid #eee; box-sizing:border-box; padding:15px 15px 15px 15px; cursor: pointer; transition:.25s; border-radius:10px;} .add_sec03_cont01 li:hover {border-color:#0179fa;} .add_sec03_cont01 li:nth-of-type(n + 5) {margin-top:18px;} .add_sec03_cont01 li .ad_left_box {width:90px; text-align:center;} .add_sec03_cont01 li .ad_right_box {width:calc(100% - 90px);padding-left:10px} .add_sec03_cont01 li .ad_left_box figure { border-radius:50%; overflow:hidden;} /*.add_sec03_cont01 li .ad_left_box figure img {border-radius:50%; width:60px; height:60px;}*/ .add_sec03_cont01 li .ad_right_box h2 { -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow:hidden; text-overflow: ellipsis; display: -webkit-box;} .add_sec03_cont01 li .ad_right_box p { overflow: hidden;white-space: nowrap;text-overflow: ellipsis; word-break: break-all;} .add_sec03_cont01 li:nth-of-type(4n) {margin-right:0;} .add_sec03_cont01 li.non_ad_pro {flex-direction: column; justify-content: center; align-items: center; background:#fcfcfc; border:1px solid #eee;} .add_sec03_cont01 li.non_ad_pro h2 a {color:#bababa;} .non_pro_btn {width:120px; height:30px; line-height:30px; text-align:center; display:block; border:1px solid #bababa; border-radius:5px; color:#bababa;} @media screen and (max-width: 1080px){ /**/ .add_sec03_cont01 li {width:calc((100% - 20px)/2); margin-right:20px;} .add_sec03_cont01 li:nth-of-type(2n) {margin-right:0;} .add_sec03_cont01 li:nth-of-type(n + 3) {margin-top:18px;} } @media screen and (max-width: 720px){ .add_sec03_cont01 li .ad_right_box {width:calc(100% - 90px);padding-left:0px;} } .add_detail_tab_con {display:flex; justify-content: center;width: 100%; max-width: 100%; margin: 0 auto; align-items:center; } .add_detail_tab_img_box {margin-right:43px; min-width: 250px; text-align:center} .add_detail_tab_desc {width:calc(100% - 74px);} .add_detail_tab_desc dl {display:flex; width:100%;} .add_detail_tab_desc dl dt {width:67px;} .add_detail_tab_desc dl dd {width:calc(100% - 67px);} .add_detail_tab_desc02 {display:flex; margin-top:10px;} .add_detail_tab_desc02 dl + dl {margin-left:80px;} .gen_c {color:#ff0000;} @media screen and (max-width: 900px){ .add_detail_tab_desc02 dl + dl {margin-left:40px;} .add_detail_tab_img_box {margin-right:20px;} } @media screen and (max-width: 790px){ .add_detail_tab_desc02 {flex-wrap:wrap;} .add_detail_tab_desc02 dl + dl {margin-left:0px; margin-top:10px;} .add_detail_tab_img_box {margin-right:0px; text-align: center;} .add_detail_tab_con {flex-wrap:wrap;} .add_detail_tab_desc {margin-top:15px;} } @media screen and (max-width: 767px){ } @media screen and (max-width: 720px){ .add_sec03_cont01 li {padding:10px; flex-wrap:wrap;} .add_sec03_cont01 li .ad_right_box h2{font-size:14px;} .add_sec03_cont01 li .ad_left_box {width:100%; display:flex; align-items:center;} .add_sec03_cont01 li .ad_left_box figure {margin-right:15px;} .add_sec03_cont01 li .ad_left_box figure img {width:45px; height:45px;margin-top:5px;} .sec03_pro_info {text-align:left;} .add_sec03_cont01 li .ad_right_box {width:100%; } } .sec03 .sec03_cont > ul > li.non_prefer {background:#fcfcfc; border:1px solid #eee;} .non_prefer a {display:flex; display: flex;flex-direction: column; align-items: center; justify-content: center;height: 100%;} .non_prefer a h2 {color:#bababa;} /*sec04 추가 수정*/ .add_sec04_cate .sec04_cate_list {display:flex; margin-bottom:20px; flex-wrap: wrap; gap: 1px;} .sec04_cate_list li.on a {border-color:#007bff; background:#007bff; color:#fff;} .sec04_cate_list li {margin-right:5px;margin-bottom:5px;} .sec04_cate_list li a {display:block; padding:10px; border-radius:10px; border: 1px solid #eee; font-weight:500;} .set04_cag {position:absolute; left:10px; top:0;} .set04_cag span {display:inline-block; } .set04_cag span.sec04_pre img{position:static !important;} .set04_cag span.sec04_prefer img {position:static !important;} @media screen and (max-width: 720px){ .set04_cag {top:-2px;} .set04_cag span img {display:inline-block; width:40px; } .set04_cag span.sec04_pre img{position:static !important;} .set04_cag span.sec04_prefer img {position:static !important;} } /*emp 서브 비주얼*/ .employ .sub_visual > ul {display:flex;} .employ .sub_visual > ul > li {width:calc((100% - 10px)/2); margin-right:10px;} .employ .sub_visual > ul > li:nth-of-type(2) {margin-right:0;} .emp_sub_left img {width:100%;height:120px} .emp_sub_right ul {display:flex; height:100%; } .emp_sub_right ul li {width:calc((100% - 10px)/2); margin-right:10px; text-align:center; border-radius:8px; background:#fff9e2; height:100%; padding:15px 0;} .emp_sub_right ul li a {display: flex; width:188px; height:31px; text-align:center; border-radius:30px; background:#007bff; color:#fff; justify-content: center;align-items: center;margin: 0 auto;} /*수정*/ .emp_sub_right ul li a i {margin-left:15px;} .emp_sub_right ul li a i img {display:inline-block; vertical-align:middle;} .emp_sub_right ul li p {margin-top:10px;} .emp_sub_right ul li:nth-of-type(2) {margin-right:0;} @media screen and (max-width: 1280px){ } @media screen and (max-width: 1080px){ .employ .sub_visual > ul > li {width:calc((100% - 10px)/2); margin-right:0px;} .employ .sub_visual > ul {flex-wrap:wrap;} .employ .sub_visual > ul > li {width:100%;} .emp_sub_left img {height:auto;} .emp_sub_right ul {display:none;} } @media screen and (max-width: 720px){ .emp_sub_right ul {display:none;} /* .emp_sub_right ul {height:85%;} .emp_sub_right ul li a {width:140px;} .emp_sub_right ul li a i {margin-left:10px;} */ } .hurry { display: inline-block; padding:0 7px 0 7px;background: #ff2424; height: 25px; border-radius: 18px; text-align: center; line-height: 25px; margin-right: 7px; } @media screen and (max-width: 1080px){ .hurry { display: inline-block; padding:1px 7px 0 7px;background: #ff2424; height: 25px; border-radius: 18px; text-align: center; line-height: 25px; margin-right: 7px; } }