@charset "UTF-8"; *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; } /* reset default text opacity of input placeholder */ ::placeholder { color: unset; } /* remove default dot (•) sign */ ::marker { content: initial; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element */ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; } @font-face { font-family: "Pretendard"; font-weight: 900; src: url("/common/fonts/Pretendard-Black.ttf") format("truetype"); } @font-face { font-family: "Pretendard"; font-weight: 800; src: url("/common/fonts/Pretendard-ExtraBold.ttf") format("truetype"); } @font-face { font-family: "Pretendard"; font-weight: 700; src: url("/common/fonts/Pretendard-Bold.ttf") format("truetype"); } @font-face { font-family: "Pretendard"; font-weight: 600; src: url("/common/fonts/Pretendard-SemiBold.ttf") format("truetype"); } @font-face { font-family: "Pretendard"; font-weight: 500; src: url("/common/fonts/Pretendard-Medium.ttf") format("truetype"); } @font-face { font-family: "Pretendard"; font-weight: 400; src: url("/common/fonts/Pretendard-Regular.ttf") format("truetype"); } @font-face { font-family: "Pretendard"; font-weight: 300; src: url("/common/fonts/Pretendard-Light.ttf") format("truetype"); } @font-face { font-family: "Pretendard"; font-weight: 200; src: url("/common/fonts/Pretendard-ExtraLight.ttf") format("truetype"); } @font-face { font-family: "Pretendard"; font-weight: 100; src: url("/common/fonts/Pretendard-Thin.ttf") format("truetype"); } .table { color: #000; font-size: 15px; background-color: #fff; } .table > li { display: flex; flex-direction: row; align-items: flex-start; justify-content: center; } .table_th, .table_td { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; } .table_th { width: 148px; } .table_td { flex: 1; } .table_td .valid { display: block; width: 100%; margin-top: 7px; color: #F25555; font-size: 13px; text-align: left; } .table label { color: rgba(0, 0, 0, 0.87); font-size: 15px; } .input_search { width: 100%; height: 48px; padding: 0 64px 0 0; color: #fff; font-size: 18px; border-bottom: 1px solid rgba(255, 255, 255, 0.7); } .input_search::placeholder { color: rgba(255, 255, 255, 0.8); font-size: 18px; } .input_search:hover, .input_search:focus { border-bottom: 1px solid rgb(255, 255, 255); } .input_search.warning { border: 1px solid #F25555; } .input_radio { position: relative; appearance: none; width: 18px; height: 18px; margin: 0; border: 1px solid #D9DCE0; border-radius: 50%; cursor: pointer; } .input_radio:checked::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: 10px; height: 10px; background-color: #027AFF; border-radius: 50%; } .input_radio:hover { box-shadow: 0 0 0 1px #027AFF; } .input_radio:disabled { box-shadow: none; cursor: not-allowed; } .input_check { position: relative; appearance: none; width: 18px; height: 18px; margin: 0; border-radius: 6px; cursor: pointer; } .input_check::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: 18px; height: 18px; background-image: url("/common/img/icon_check_before.png"); background-repeat: no-repeat; background-position: center; background-size: cover; } .input_check:checked::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: 18px; height: 18px; background-image: url("/common/img/icon_check_after.png"); background-repeat: no-repeat; background-position: center; background-size: cover; } .input_check:hover { box-shadow: 0 0 0 1px #027AFF; } .input_check:disabled { box-shadow: none; cursor: not-allowed; } .input_switch { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; } .input_switch input[type=checkbox] { width: 0; height: 0; display: none; } .input_switch input[type=checkbox]:checked + label { background-color: blue; border: 1px solid blue; } .input_switch input[type=checkbox]:checked + label::after { left: calc(100% - 2.4px); width: 14px; height: 14px; background-color: #fff; transform: translateX(-100%); } .input_switch label { position: relative; display: block; width: 40px; height: 20px; background-color: #fff; border: 1px solid #777777; border-radius: 100px; cursor: pointer; text-indent: -9999px; } .input_switch label::after { position: absolute; top: 2.4px; left: 2.4px; content: ""; width: 14px; height: 14px; background-color: #dddddd; border-radius: 90px; transition: 0.05s; } .input_switch label:active::after { width: 28px; } .input_textarea { width: 100%; min-height: 100px; padding: 15px; border: 1px solid #D9DCE0; color: rgba(0, 0, 0, 0.87); font-size: 16px; resize: none; border-radius: 8px; /* custom scrollbar */ } .input_textarea:hover, .input_textarea:focus { border: 1px solid #027AFF; } .input_textarea::placeholder { color: rgba(0, 0, 0, 0.26); font-size: 16px; } .input_textarea::-webkit-scrollbar { width: 15px; } .input_textarea::-webkit-scrollbar-track { background-color: transparent; } .input_textarea::-webkit-scrollbar-thumb { background-color: #D9D9D9; border-radius: 20px; border: 5px solid transparent; background-clip: content-box; } @media screen and (max-width: 768px) { .input_text { height: 48px; padding: 0 10px; font-size: 14px; } .input_text::placeholder { font-size: 12px; } .input_textarea { min-height: 100px; padding: 10px; font-size: 14px; } .input_textarea::placeholder { font-size: 12px; } } .subpage #header .utile_menu_user .user_join { background-color: rgba(0, 0, 0, 0.3); } .subpage #header .utile_menu_user .user_login { background-color: rgba(0, 0, 0, 0.3); } .subpage .sub_container { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; } .subpage .sub_container .contents_title { position: relative; z-index: 1; } .subpage .sub_container .contents_title_01 { margin-bottom: 25px; color: #00bcd5; font-size: 32px; font-weight: 700; } .subpage .sub_container .contents_title_02 { margin-bottom: 12px; color: #202020; font-size: 56px; font-weight: 700; } .subpage .sub_container .contents_title_03 { margin-bottom: 17px; line-height: 1.4; color: #969696; font-size: 23px; font-weight: 600; } .subpage .sub_container .contents_title_04 { position: relative; margin-bottom: 27px; padding-left: 19px; color: #00bcd5; font-size: 23px; font-weight: 600; } .subpage .sub_container .contents_title_04::before { position: absolute; top: 50%; left: 0; transform: translate(0, -50%); content: ""; width: 11px; height: 12px; background-image: url("/common/img/main/con4_tab_base_arrow.png"); background-repeat: no-repeat; background-position: center; background-size: contain; opacity: 1; } .subpage .sub_container .contents_title_05 { display: inline-block; padding: 12px 40px; color: #fff; font-size: 24px; font-weight: 600; background-color: #00bcd5; border-radius: 40px; } .subpage .container_01 .inner { max-width: 100%; } .subpage .container_01 .con1_title { top: 55%; } .subpage .container_01 .con1_title h3 { margin-bottom: 30px; font-size: 78px; } .subpage .container_01 .con1_title h3 span { margin-left: 7px; font-size: 30px; font-weight: 500; } .subpage .container_01 .con1_title p { margin-bottom: 0; line-height: 1.4; font-size: 32px; } .subpage .container_01 .con1_swiper { height: 546px; } .subpage .container_01 .con1_swiper .swiper-slide::before { height: 100%; } .subpage .container_01 .con1_swiper .swiper-slide > img { object-position: 50% 0%; } .subpage_01 .sub_container_01 { padding: 220px 0; background-color: #fff; } .subpage_01 .sub_container_01 .inner { display: flex; flex-direction: row; align-items: flex-start; justify-content: center; gap: 106px; } .subpage_01 .sub_container_01 .information_wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; } .subpage_01 .sub_container_01 .information_wrap .info { display: flex; flex-direction: row; align-items: center; justify-content: center; } .subpage_01 .sub_container_01 .information_wrap .info_icon { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 205px; height: 205px; background-color: #fff; border: 2px solid #ededed; border-radius: 50%; overflow: hidden; z-index: 1; } .subpage_01 .sub_container_01 .information_wrap .info_icon > img { margin-top: -10px; } .subpage_01 .sub_container_01 .information_wrap .info_icon span { margin-top: -3px; color: #818181; font-size: 24px; font-weight: 600; } .subpage_01 .sub_container_01 .information_wrap .info_desc { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 10px; width: 475px; height: 147px; margin-left: -30px; padding-left: 60px; background-color: #f5f5f5; border-radius: 0 100px 100px 0; } .subpage_01 .sub_container_01 .information_wrap .info_desc h6 { color: #303030; font-size: 36px; font-weight: 600; } .subpage_01 .sub_container_01 .information_wrap .info_desc p { color: #a5a5a5; font-size: 22px; font-weight: 600; } .subpage_01 .sub_container_01 .information_wrap .info_desc p span { color: #00bcd5; } .subpage_01 .sub_container_01 .contents_title { margin-top: 60px; } .subpage_01 .sub_container_02 { position: relative; padding: 120px 0 220px 0; overflow: hidden; } .subpage_01 .sub_container_02::before { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 650px; background-color: #00b5cd; z-index: 0; } .subpage_01 .sub_container_02 .inner { position: relative; max-width: 1550px; z-index: 2; } .subpage_01 .sub_container_02 .contents_title { align-items: center; margin-bottom: 134px; } .subpage_01 .sub_container_02 .contents_title_01 { margin-bottom: 15px; color: #fff; font-weight: 600; text-align: center; } .subpage_01 .sub_container_02 .contents_title_02 { margin-bottom: 22px; color: #fff; font-size: 64px; text-align: center; } .subpage_01 .sub_container_02 .contents_title_03 { margin-bottom: 0; color: #ffffff; font-size: 24px; font-weight: 500; text-align: center; } .subpage_01 .sub_container_02 .tab_base { display: flex; flex-direction: row; align-items: center; align-items: flex-start; justify-content: center; gap: 20px; height: 550px; } .subpage_01 .sub_container_02 .tab_base li { list-style: none; } .subpage_01 .sub_container_02 .tab_base li a { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 165px; padding: 145px 7px 172px 7px; background-color: #fff; border-radius: 100px 100px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.08); transition: all 0.5s; z-index: 1; } .subpage_01 .sub_container_02 .tab_base li a .icon { position: absolute; top: 7px; left: 50%; transform: translate(-50%, 0); width: 134px; height: 134px; background-repeat: no-repeat; background-position: center; background-size: 134px; border-radius: 50%; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .icon_01 { background-image: url("/common/img/main/con3_icon1.png"); } .subpage_01 .sub_container_02 .tab_base li a .icon_02 { background-image: url("/common/img/main/con3_icon2.png"); } .subpage_01 .sub_container_02 .tab_base li a .icon_03 { background-image: url("/common/img/main/con3_icon3.png"); } .subpage_01 .sub_container_02 .tab_base li a .icon_04 { background-image: url("/common/img/main/con3_icon4.png"); } .subpage_01 .sub_container_02 .tab_base li a .icon_05 { background-image: url("/common/img/main/con3_icon5.png"); } .subpage_01 .sub_container_02 .tab_base li a .icon::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: calc(100% + 4px); height: calc(100% + 4px); border: 2px solid #f0f0f0; border-radius: 50%; transition: all 0.1s; } .subpage_01 .sub_container_02 .tab_base li a .icon::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: calc(100% + 22px); height: calc(100% + 22px); border: 11px solid #f0f0f0; border-radius: 50%; transition: all 0.1s; opacity: 0; } .subpage_01 .sub_container_02 .tab_base li a .inner_box { margin-top: 25px; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title h6 { min-height: 59px; color: #a0a0a0; font-size: 24px; font-weight: 700; text-align: center; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title p { color: #00bcd5; font-size: 0; font-weight: 700; text-align: center; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box .desc_box { position: absolute; left: 50%; bottom: 123px; transform: translate(-50%, 0); display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px; height: 0; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box .desc_box li { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; height: 36px; padding-right: 30px; color: #00bcd5; font-size: 0; white-space: nowrap; font-weight: 600; background-color: transparent; border-radius: 40px; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box .desc_box li span { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 89px; height: 100%; margin-right: 17px; color: #fff; background-color: transparent; border-radius: 40px; } .subpage_01 .sub_container_02 .tab_base li a .icon_arrow { position: absolute; left: 50%; bottom: 7px; transform: translate(-50%, 0); width: 134px; height: 134px; margin-top: 25px; background-image: url("/common/img/sub/sub1_con2_arrow_gray.png"); background-repeat: no-repeat; background-position: center; background-size: contain; border-radius: 50%; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .icon_arrow::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: 100%; height: 100%; background-image: url("/common/img/sub/sub1_con2_arrow_mint.png"); background-repeat: no-repeat; background-position: center; background-size: contain; border-radius: 50%; transition: all 0.5s; opacity: 0; } .subpage_01 .sub_container_02 .tab_base li a::before { position: absolute; left: 200px; bottom: -137px; content: "컨텐츠 바로가기!"; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 220px; height: 52px; color: #fff; font-size: 26px; font-weight: 600; text-align: center; background-color: #00bcd5; border-radius: 40px; transition: all 0.5s; opacity: 0; } .subpage_01 .sub_container_02 .tab_base li a::after { position: absolute; left: 233px; bottom: -85px; content: ""; width: 19px; height: 15px; background-image: url("/common/img/sub/sub1_con2_deco.png"); background-repeat: no-repeat; background-position: center; background-size: contain; transition: all 0.5s; opacity: 0; } .subpage_01 .sub_container_02 .tab_base li a:hover { width: 367px; padding: 77px 7px 238px 7px; border-radius: 35px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon { top: -78px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon::after { opacity: 1; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title h6 { color: #6a6a6a; font-size: 32px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title p { font-size: 24px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box .desc_box { width: inherit; height: 87px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box .desc_box li { font-size: 22px; background-color: #f0f0f0; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box .desc_box li span { background-color: #00bcd5; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon_arrow { bottom: -68px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon_arrow::before { opacity: 1; } .subpage_01 .sub_container_02 .tab_base li a:hover::before, .subpage_01 .sub_container_02 .tab_base li a:hover::after { opacity: 1; } .subpage_01 .sub_container_02 .panel_base { padding-top: 50px; } .subpage_01 .sub_container_02 .panel_base > li { display: none; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title { display: flex; flex-direction: row; align-items: center; align-items: flex-end; justify-content: flex-start; gap: 13px; margin-left: 100px; margin-bottom: 45px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title h6 { position: relative; padding-left: 25px; color: #202020; font-size: 56px; font-weight: 700; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title h6::before { position: absolute; top: 50%; left: 0; transform: translate(0, -50%); content: ""; width: 8px; height: 46px; background-color: #00bcd5; border-radius: 10px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title span { color: #00b5cd; font-size: 26px; font-weight: 600; } .subpage_01 .sub_container_02 .panel_base_inner .doctor { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 45px; margin-bottom: 30px; padding: 40px; background-color: #fff; border-radius: 200px 20px 20px 200px; border: 5px solid #fdfdfd; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_img { position: relative; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_img > img { width: 334px; height: 334px; object-fit: cover; border: 2px solid #ddd; border-radius: 50%; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_img a { position: absolute; right: -15px; bottom: 0; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; height: 50px; padding: 0 30px; color: #fff; font-size: 26px; font-weight: 600; background-color: #00bcd5; border-radius: 40px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner { flex: 1; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title { display: flex; flex-direction: row; align-items: center; align-items: flex-end; justify-content: flex-start; gap: 10px; margin-bottom: 30px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title h6 { color: #414141; font-size: 46px; font-weight: 700; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title span { color: #00b5cd; font-size: 24px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap { width: 100%; border-top: 1px solid #00b6d2; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table { width: 100%; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td { padding: 14px 0; font-size: 18px; text-align: center; vertical-align: middle; border: 1px solid #ebebeb; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table thead th { color: #05bdd6; background-color: #f9f9f9; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table tbody th { color: #616161; background-color: #f9f9f9; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table tbody td { color: #c8c8c8; } .subpage_01 .sub_container_02 .panel_base_inner .doctor:last-of-type { margin-bottom: 0; } .subpage_01 .sub_container_03 { position: relative; padding: 140px 0 280px 0; background-color: #051227; background-image: url("/common/img/main/con8_bg_new.jpg"); background-repeat: no-repeat; background-position: 50% 0; background-size: contain; border-radius: 30px 30px 0 0; } .subpage_01 .sub_container_03 .inner { max-width: initial; } .subpage_01 .sub_container_03 .contents_title { align-items: center; margin-bottom: 75px; z-index: 1; } .subpage_01 .sub_container_03 .contents_title_01 { margin-bottom: 20px; color: #fff; font-weight: 600; text-align: center; text-transform: uppercase; } .subpage_01 .sub_container_03 .contents_title_02 { margin-bottom: 10px; color: #fff; font-size: 60px; text-align: center; } .subpage_01 .sub_container_03 .contents_title_03 { margin-bottom: 0; color: #ffffff; font-size: 24px; font-weight: 500; text-align: center; opacity: 0.5; } .subpage_01 .sub_container_03 .tab_base { position: relative; width: 477px; margin-left: 60%; z-index: 1; } .subpage_01 .sub_container_03 .tab_base li { width: 100%; border-top: 2px solid rgba(255, 255, 255, 0.3); } .subpage_01 .sub_container_03 .tab_base li a { position: relative; display: flex; flex-direction: row; align-items: center; align-items: flex-start; justify-content: flex-start; width: 100%; height: 100%; padding: 20px 0 25px 0; } .subpage_01 .sub_container_03 .tab_base li a::before { position: absolute; top: 44px; left: -24px; content: ""; width: 9px; height: 9px; background-color: #fff; border-radius: 50%; } .subpage_01 .sub_container_03 .tab_base li a h6 { width: 97px; margin-right: 20px; color: #fff; font-size: 46px; font-weight: 600; text-align: center; } .subpage_01 .sub_container_03 .tab_base li a .floor_info { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 7px 0; flex: 1; margin-top: 5px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info span { position: relative; padding: 0 15px; color: #fff; font-size: 24px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info span::before { position: absolute; top: 50%; right: 0; transform: translate(0, -50%); content: ""; width: 2px; height: 13px; background-color: rgba(255, 255, 255, 0.6); } .subpage_01 .sub_container_03 .tab_base li a .floor_info span.end::before, .subpage_01 .sub_container_03 .tab_base li a .floor_info span:last-of-type::before { display: none; } .subpage_01 .sub_container_03 .tab_base li.on a { background-color: #202c3f; } .subpage_01 .sub_container_03 .tab_base li:hover { background-color: rgba(255, 255, 255, 0.05); } .subpage_01 .sub_container_03 .tab_base li:last-of-type { border-bottom: 2px solid rgba(255, 255, 255, 0.1); } .subpage_01 .sub_container_03 .tab_base .noti { position: relative; margin-top: 35px; margin-left: 27px; padding-left: 43px; line-height: 1.4; color: rgba(255, 255, 255, 0.7); font-size: 22px; font-weight: 300; } .subpage_01 .sub_container_03 .tab_base .noti::before { position: absolute; top: 0; left: 0; content: ""; width: 33px; height: 32px; background-image: url("/common/img/sub/sub1_con3_arrow.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .subpage_01 .sub_container_03 .panel_base > li { display: none; } .subpage_01 .sub_container_03 .panel_base_inner { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 0 auto; margin-top: 300px; overflow: hidden; z-index: 2; } .subpage_01 .sub_container_03 .panel_base_inner .title { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; margin-bottom: 75px; } .subpage_01 .sub_container_03 .panel_base_inner .title > span { margin-bottom: 7px; color: #fff; font-size: 30px; font-weight: 500; } .subpage_01 .sub_container_03 .panel_base_inner .title h4 { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 100%; } .subpage_01 .sub_container_03 .panel_base_inner .title h4 .line { display: block; flex: 1; height: 1px; background-color: rgba(255, 255, 255, 0.3); } .subpage_01 .sub_container_03 .panel_base_inner .title h4 .text { margin: 0 50px; color: #fff; font-size: 60px; font-weight: 600; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; align-items: flex-start; flex-wrap: wrap; gap: 95px 30px; max-width: 1920px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: center; gap: 20px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box > img { width: 520px; height: 520px; object-fit: cover; border-radius: 20px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: center; gap: 10px; padding-left: 15px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc h6 { color: #fff; font-size: 50px; font-weight: 600; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc p { line-height: 1.4; color: #fff; font-size: 26px; font-weight: 300; opacity: 0.6; } .subpage_01 .sub_container_04 { margin-top: 100px; padding: 100px 0 365px 0; background-color: #fff; } .subpage_01 .sub_container_04 .contents_title { align-items: center; margin-bottom: 75px; z-index: 1; } .subpage_01 .sub_container_04 .contents_title_01 { margin-bottom: 20px; color: #00b5cd; font-weight: 700; text-align: center; text-transform: uppercase; } .subpage_01 .sub_container_04 .contents_title_02 { margin-bottom: 10px; color: #202020; font-size: 60px; text-align: center; } .subpage_01 .sub_container_04 .contents_title_03 { margin-bottom: 30px; color: #9b9b9b; font-size: 24px; font-weight: 600; text-align: center; } .subpage_01 .sub_container_04 .contents_title_arrow { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; } .subpage_01 .sub_container_04 .map { width: 100%; } .subpage_01 .sub_container_04 .map > img { width: 100%; object-fit: cover; z-index: 1; } .subpage_01 .sub_container_04 .map .map_api { width: 70%; height: 500px; margin: 0 auto; } .subpage_01 .sub_container_04 .map_contents { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 1280px; margin: 0 auto; margin-top: -132px; padding: 50px 0 53px 0; background-color: #00bcd5; box-shadow: 0 0 20px rgba(255, 255, 255, 0.08); border-radius: 25px; z-index: 2; } .subpage_01 .sub_container_04 .map_contents .address_box { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px; margin-bottom: 37px; } .subpage_01 .sub_container_04 .map_contents .address_box h6 { color: #fff; font-size: 24px; font-weight: 600; } .subpage_01 .sub_container_04 .map_contents .address_box p { color: #fff; font-size: 22px; font-weight: 500; } .subpage_01 .sub_container_04 .map_contents .address_box p span { color: #00ffc3; font-weight: 600; } .subpage_01 .sub_container_04 .map_contents ul { position: relative; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 13px; } .subpage_01 .sub_container_04 .map_contents ul li { height: 52px; border: 1px solid #99e4ee; border-radius: 40px; } .subpage_01 .sub_container_04 .map_contents ul li a { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; width: 100%; height: 100%; padding-left: 63px; padding-right: 22px; color: #fff; font-size: 20px; font-weight: 600; } .subpage_01 .sub_container_04 .map_contents ul li a > img { position: absolute; top: 4px; left: 4px; } .subpage_01 .sub_container_04 .map_contents ul .bubble { position: absolute; left: 324px; bottom: -117px; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 330px; height: 90px; padding: 0 25px; line-height: 1.4; color: #fff; font-size: 25px; font-weight: 600; text-align: left; background-color: #007fda; border-radius: 30px; } .subpage_01 .sub_container_04 .map_contents ul .bubble::before { position: absolute; top: -15px; left: 34px; content: ""; width: 19px; height: 15px; background-image: url("/common/img/sub/sub1_con4_deco.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .subpage_02 .follow_ul { position: absolute; top: 110px; left: 0; display: inline-flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 20px; width: initial; padding: 0 0 0 39px; opacity: 0; z-index: 20; background-color: transparent; border-radius: 0 20px 20px 0; } .subpage_02 .follow_ul .tab_base { display: inline-flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 20px; } .subpage_02 .follow_ul .bubble { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; margin-bottom: 32px; padding: 12px 28px; color: #fff; font-size: 25px; font-weight: 600; white-space: nowrap; background-color: #007fda; border-radius: 10px; transition: all 0.5s; } .subpage_02 .follow_ul .bubble::after { position: absolute; left: 34px; bottom: -15px; content: ""; width: 19px; height: 15px; background-image: url("/common/img/sub/sub2_tab_base_deco.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .subpage_02 .follow_ul li { width: 97px; height: 97px; padding: 10px; background-color: #fff; border: 2px solid #dcdcdc; border-radius: 50px; transition: all 0.3s; } .subpage_02 .follow_ul li a { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: flex-start; width: 100%; height: 100%; color: #c5c5c5; font-size: 17px; font-weight: 500; } .subpage_02 .follow_ul li a > img { width: 74px; height: 74px; margin-right: 29px; border-radius: 50%; } .subpage_02 .follow_ul li a p { display: none; } .subpage_02 .follow_ul li.on { width: 295px; } .subpage_02 .follow_ul li.on a { position: relative; padding-right: 22px; } .subpage_02 .follow_ul li.on a p { display: inline-block; color: #00b5cd; font-size: 18px; font-weight: 700; } .subpage_02 .follow_ul li.on a::before { position: absolute; top: 50%; right: -2px; transform: translate(0, -50%); content: ""; width: 76px; height: 76px; background-image: url("/common/img/sub/sub2_icon_arrow.png"); background-repeat: no-repeat; background-position: center; background-size: contain; border-radius: 50%; opacity: 1; } .subpage_02 .follow_ul li:nth-of-type(3).on { width: 340px; } .subpage_02 .follow_ul li:nth-of-type(4).on { width: 300px; } .subpage_02 .follow_ul li:nth-of-type(5).on { width: 300px; } .subpage_02 .container_01 .inner { max-width: 100%; } .subpage_02 .container_01 .con1_title { top: 55%; } .subpage_02 .container_01 .con1_title h3 { margin-bottom: 30px; font-size: 78px; } .subpage_02 .container_01 .con1_title h3 span { margin-left: 7px; font-size: 30px; font-weight: 500; } .subpage_02 .container_01 .con1_title p { margin-bottom: 0; font-size: 32px; } .subpage_02 .container_01 .con1_swiper { height: 546px; } .subpage_02 .container_01 .con1_swiper .swiper-slide::before { height: 100%; } .subpage_02 .container_01 .con1_swiper .swiper-slide > img { object-position: 50% 0%; } .subpage_02 .sub_container_title { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; } .subpage_02 .sub_container_title h6 { color: #00bcd5; font-size: 32px; font-weight: 700; text-transform: uppercase; } .subpage_02 .sub_container_title h4 { margin: 15px 0 30px 0; line-height: 1.4; color: #2f2f2f; font-size: 56px; font-weight: 700; } .subpage_02 .sub_container_title h4 span { color: #00bcd5; } .subpage_02 .sub_container_title p { line-height: 1.4; color: #969696; font-size: 23px; font-weight: 600; } .subpage_02 .sub_container_title p span { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; margin-top: 25px; color: #a9a9a9; font-weight: 500; } .subpage_02 .sub_container_title p span > img { margin-right: 7px; } .subpage_02 .sub_container_02 { padding: 200px 0 250px 0; background-color: #fff; } .subpage_02 .sub_container_02 .inner { max-width: 1556px; } .subpage_02 .sub_container_02 .sub_container_title { margin-bottom: 100px; padding-left: 200px; } .subpage_02 .sub_container_02 .con2_slider { width: 100%; overflow: hidden; } .subpage_02 .sub_container_02 .con2_slider .slick-list { width: 100%; max-width: 1556px; overflow: initial; } .subpage_02 .sub_container_02 .con2_slider .item { width: 360px; margin-right: 40px; border: 1px solid #e0e0e0; border-radius: 10px; overflow: hidden; } .subpage_02 .sub_container_02 .con2_slider .item .wrap > div { position: relative; } .subpage_02 .sub_container_02 .con2_slider .item .wrap > div p { position: absolute; top: 0; right: 0; padding: 10px 20px; color: #fff; font-size: 24px; font-weight: 600; background-color: #00bcd5; } .subpage_02 .sub_container_02 .con2_slider .item .wrap > div > img { width: 100%; height: 395px; object-fit: cover; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 35px 0; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul li:nth-of-type(1) { color: #00bcd5; font-size: 22px; font-weight: 700; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul li:nth-of-type(2) { margin: 10px 0; color: #5e5e5e; font-size: 42px; font-weight: 600; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul li:nth-of-type(3) { color: #a8a8a8; font-size: 22px; font-weight: 600; } .subpage_02 .panel_base > li { display: none; } .subpage_02 .panel_base_inner .title { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; padding: 115px 0 100px 0; background-color: #00bcd5; } .subpage_02 .panel_base_inner .title .icon { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 137px; height: 137px; margin-bottom: 50px; background-color: #fff; border-radius: 50%; } .subpage_02 .panel_base_inner .title h6 { margin-bottom: 7px; color: #fff; font-size: 64px; font-weight: 700; } .subpage_02 .panel_base_inner .title p { color: rgba(255, 255, 255, 0.8); font-size: 32px; font-weight: 500; text-transform: uppercase; } .subpage_02 .panel_base_inner .contents { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; gap: 240px; max-width: 1556px; margin: 0 auto; padding: 200px 0 300px 0; } .subpage_02 .panel_base_inner .contents .doctor { display: flex; flex-direction: row; align-items: center; align-items: flex-start; justify-content: flex-start; width: 100%; } .subpage_02 .panel_base_inner .contents .portrait { width: 680px; border-radius: 10px; overflow: hidden; } .subpage_02 .panel_base_inner .contents .portrait > div { height: 752px; } .subpage_02 .panel_base_inner .contents .portrait > div > img { width: 100%; height: 100%; object-fit: cover; } .subpage_02 .panel_base_inner .contents .portrait ul { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; gap: 10px; margin-top: -10px; padding: 45px 65px; background-color: #00bcd5; } .subpage_02 .panel_base_inner .contents .portrait ul li:nth-of-type(1) { color: rgba(255, 255, 255, 0.8); font-size: 28px; font-weight: 500; } .subpage_02 .panel_base_inner .contents .portrait ul li:nth-of-type(2) { color: rgb(255, 255, 255); font-size: 56px; font-weight: 500; } .subpage_02 .panel_base_inner .contents_inner { flex: 1; margin-top: 25px; margin-left: 80px; } .subpage_02 .panel_base_inner .contents_inner_title { position: relative; margin-bottom: 40px; padding-left: 30px; color: #646464; font-size: 50px; font-weight: 600; } .subpage_02 .panel_base_inner .contents_inner_title::before { position: absolute; top: 50%; left: 0; transform: translate(0, -50%); content: ""; width: 6px; height: 61px; background-color: #00bcd5; border-radius: 10px; } .subpage_02 .panel_base_inner .contents_inner_desc { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; gap: 13px; margin-bottom: 75px; } .subpage_02 .panel_base_inner .contents_inner_desc p { position: relative; padding-left: 20px; color: #848484; font-size: 26px; font-weight: 500; } .subpage_02 .panel_base_inner .contents_inner_desc p::before { position: absolute; top: 0; left: 0; content: "-"; } .subpage_02 .panel_base_inner .contents_inner_table { width: 100%; border-top: 1px solid #00b6d2; } .subpage_02 .panel_base_inner .contents_inner_table table { width: 100%; } .subpage_02 .panel_base_inner .contents_inner_table table th, .subpage_02 .panel_base_inner .contents_inner_table table td { padding: 14px 0; font-size: 18px; text-align: center; vertical-align: middle; border: 1px solid #ebebeb; } .subpage_02 .panel_base_inner .contents_inner_table table thead th { color: #05bdd6; background-color: #f9f9f9; } .subpage_02 .panel_base_inner .contents_inner_table table tbody th { color: #616161; background-color: #f9f9f9; } .subpage_02 .panel_base_inner .contents_inner_table table tbody td { color: #c8c8c8; } .subpage_03 .container_01 { position: relative; } .subpage_03 .container_01::before { position: absolute; left: 50%; bottom: -230px; transform: translate(-50%, 0); content: ""; width: 2px; height: 460px; background: linear-gradient(to bottom, #fff 50%, #00bcd5 50%); z-index: 2; } .subpage_03 .container_01 .inner { max-width: 100%; } .subpage_03 .container_01 .con1_title { top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; } .subpage_03 .container_01 .con1_title h3 { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 12px; margin-bottom: 40px; } .subpage_03 .container_01 .con1_title h3 span { margin-left: 0; } .subpage_03 .container_01 .con1_title p { margin-bottom: 0; line-height: 1.4; color: #f5f5f5; text-align: center; } .subpage_03 .container_01 .con1_swiper { height: 942px; } .subpage_03 .container_01 .con1_swiper .swiper-slide > img { height: 100%; object-position: center; } .subpage_03 .sub_container_01 { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 265px 0 200px 0; } .subpage_03 .sub_container_01 .main_title { margin-bottom: 200px; } .subpage_03 .sub_container_01 .main_title h3 { position: relative; margin-bottom: 58px; padding-bottom: 48px; line-height: 1.5; color: #00bcd5; font-size: 72px; font-weight: 600; text-align: center; } .subpage_03 .sub_container_01 .main_title h3 b { font-weight: 800; } .subpage_03 .sub_container_01 .main_title h3::before { position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 0); content: ""; width: 68px; height: 6px; background-color: #00bcd5; border-radius: 10px; } .subpage_03 .sub_container_01 .main_title p { line-height: 1.4; color: #7e7e7e; font-size: 30px; font-weight: 600; text-align: center; } .subpage_03 .sub_container_01 .box_wrap { display: flex; flex-direction: row; align-items: flex-start; justify-content: center; width: 100%; margin-bottom: 140px; } .subpage_03 .sub_container_01 .box_wrap:last-of-type { margin-bottom: 0; } .subpage_03 .sub_container_01 .box_wrap .box_bg { width: 695px; height: 450px; border-radius: 20px; overflow: hidden; } .subpage_03 .sub_container_01 .box_wrap .box_bg > img { width: 100%; height: 100%; object-fit: cover; } .subpage_03 .sub_container_01 .box_wrap .box { display: flex; flex-direction: row; align-items: flex-start; justify-content: center; width: calc(100% - 695px + 205px + 205px); margin-top: 105px; margin-left: -205px; } .subpage_03 .sub_container_01 .box_wrap .box_img { width: 412px; height: 524px; margin-right: -205px; overflow: hidden; z-index: 2; } .subpage_03 .sub_container_01 .box_wrap .box_img > img { width: 100%; height: 100%; object-fit: cover; border-radius: 20px 0 70px 20px; } .subpage_03 .sub_container_01 .box_wrap .box_text { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; flex: 1; padding: 100px 20px 140px 325px; background-color: #f6f6f6; border-radius: 0 0 0 20px; z-index: 1; } .subpage_03 .sub_container_01 .box_wrap .box_text h6 { position: relative; margin-bottom: 58px; padding-bottom: 48px; line-height: 1.4; color: #00bcd5; font-size: 64px; font-weight: 700; } .subpage_03 .sub_container_01 .box_wrap .box_text h6::before { position: absolute; left: 0; bottom: 0; content: ""; width: 60px; height: 6px; background-color: #00bcd5; border-radius: 10px; } .subpage_03 .sub_container_01 .box_wrap .box_text p { line-height: 1.4; color: #787878; font-size: 27px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) { flex-direction: row-reverse; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box { flex-direction: row-reverse; width: calc(100% - 695px + 210px + 210px); margin-top: 144px; margin-left: 0; margin-right: -210px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_img { margin-left: -210px; margin-right: 0; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_img > img { border-radius: 0 20px 20px 70px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_text { padding: 140px 266px 200px 190px; border-radius: 0 0 20px 0; } .subpage_03 .sub_container_02 { position: relative; padding: 510px 0 309px 0; background-image: url("/common/img/sub/sub3_con1_img1.jpg"); background-repeat: no-repeat; background-position: center; background-size: cover; overflow: hidden; } .subpage_03 .sub_container_02::before { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); } .subpage_03 .sub_container_02 h5 { position: relative; margin-bottom: 75px; line-height: 1.4; color: #fff; font-size: 60px; font-weight: 500; text-align: center; z-index: 1; } .subpage_03 .sub_container_02 h5::before { position: absolute; top: calc(-100vh - 65px); left: 50%; transform: translate(-50%, 0); content: ""; width: 2px; height: 100vh; background-color: #fff; z-index: 2; } .subpage_03 .sub_container_02 h6 { position: relative; margin-bottom: 70px; color: #fff; font-size: 70px; font-weight: 600; text-align: center; z-index: 1; } .subpage_03 .sub_container_02 p { position: relative; color: #fff; font-size: 40px; font-weight: 500; text-align: center; z-index: 1; opacity: 0.6; } .subpage_04 .container_01 .inner { max-width: 100%; } .subpage_04 .container_01 .con1_title { top: 55%; } .subpage_04 .container_01 .con1_title h3 { margin-bottom: 30px; font-size: 78px; } .subpage_04 .container_01 .con1_title h3 span { margin-left: 7px; font-size: 30px; font-weight: 500; } .subpage_04 .container_01 .con1_title p { margin-bottom: 0; font-size: 32px; } .subpage_04 .container_01 .con1_swiper { height: 546px; } .subpage_04 .container_01 .con1_swiper .swiper-slide::before { height: 100%; } .subpage_04 .container_01 .con1_swiper .swiper-slide > img { object-position: 50% 0%; } .subpage_04 .sub_container_01 { padding: 184px 0 170px 0; background-color: #fff; } .subpage_04 .sub_container_01 .inner { max-width: 1500px; } .subpage_04 .sub_container_01 .search_wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-bottom: 189px; } .subpage_04 .sub_container_01 .search_wrap .top_bar { position: relative; margin-bottom: 55px; padding-left: 257px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown_wrap { position: absolute; top: 0; left: 0; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el { position: relative; top: 0; display: inline-block; width: 245px; min-height: 92px; max-height: 92px; color: #fff; font-size: 26px; font-weight: 600; text-align: left; white-space: nowrap; overflow: hidden; cursor: pointer; outline: none; border-radius: 50px; background-color: #00bcd5; z-index: 2; transition: 0.3s all ease-in-out; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el input:focus + label { background-color: #8d8d8d; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el input { width: 1px; height: 1px; display: inline-block; position: absolute; opacity: 0.01; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el label { position: relative; display: block; height: 92px; line-height: 92px; padding-left: 42px; padding-right: 70px; cursor: pointer; transition: 0.3s color ease-in-out; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el label:nth-child(2) { margin-top: 92px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el input:checked + label { position: absolute; top: 0; display: block; width: 100%; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el input:checked + label:nth-child(2) { position: relative; margin-top: 0; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el::after { position: absolute; top: 38px; right: 43px; content: ""; width: 22px; height: 14px; background-image: url("/common/img/sub/sub4_con1_arrow_white.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el.expanded { background-color: #8d8d8d; border-radius: 50px; padding: 0; max-height: initial; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el.expanded label { color: rgba(255, 255, 255, 0.5); } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el.expanded label:hover { color: #fff; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el.expanded input:checked + label { color: #fff; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el.expanded::after { width: 19px; background-image: url("/common/img/sub/sub4_con1_check.png"); } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap { position: relative; width: 522px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search { width: 100%; height: 92px; padding: 0 64px 0 53px; color: #9d9d9d; font-size: 26px; font-weight: 600; background-color: #f2f2f2; border-bottom: 0; border-radius: 50px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search::placeholder { color: #9d9d9d; font-size: 26px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search:hover, .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search:focus { border-bottom: 0; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search_btn { position: absolute; top: 50%; right: 43px; transform: translate(0, -50%); display: inline-block; width: 32px; height: 32px; background-image: url("/common/img/sub/sub4_con1_search_btn.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .subpage_04 .sub_container_01 .search_wrap .category_wrap { position: relative; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; max-width: 760px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap li { display: inline-block; padding: 7px 25px; color: #bdbdbd; font-size: 24px; font-weight: 600; border: 2px solid #dcdcdc; border-radius: 40px; cursor: pointer; } .subpage_04 .sub_container_01 .search_wrap .category_wrap li.on { position: relative; padding-left: 50px; color: #fff; background-color: #00bcd5; border: 2px solid #00bcd5; } .subpage_04 .sub_container_01 .search_wrap .category_wrap li.on::before { position: absolute; top: 50%; left: 22px; transform: translate(0, -50%); content: ""; width: 19px; height: 14px; background-image: url("/common/img/sub/sub4_con1_check.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .subpage_04 .sub_container_01 .search_wrap .category_wrap .bubble { position: absolute; left: 50%; bottom: -96px; padding: 15px 27px; color: #fff; font-size: 25px; font-weight: 600; background-color: #00bcd5; border-radius: 20px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap .bubble::before { position: absolute; top: -15px; left: 25px; content: ""; width: 19px; height: 15px; background-image: url("/common/img/sub/sub1_con2_deco.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .subpage_04 .sub_container_01 .contents_wrap > ul { display: flex; flex-direction: row; align-items: center; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap; margin-bottom: 135px; gap: 40px; } .subpage_04 .sub_container_01 .contents_wrap > ul li { width: calc(25% - 30px); } .subpage_04 .sub_container_01 .contents_wrap > ul li a { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; width: 100%; } .subpage_04 .sub_container_01 .contents_wrap > ul li a > img { width: 100%; height: calc(25vw - 135px); max-height: 345px; object-fit: cover; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 10px; margin-top: 14px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_title { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 14px; color: #bfbfbf; font-size: 22px; font-weight: 600; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_title span { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; height: 38px; padding: 0 23px; color: #fff; font-size: 24px; font-weight: 500; background-color: #00bcd5; border-radius: 40px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_desc p { line-height: 1.4; color: #545454; font-size: 24px; font-weight: 600; } .subpage_04 .sub_container_01 .contents_wrap .pagination { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 20px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 10px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group:first-of-type, .subpage_04 .sub_container_01 .contents_wrap .pagination_group:last-of-type { gap: 5px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li { cursor: pointer; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li:not(.unit) { min-width: 40px; height: 40px; line-height: 36px; padding: 0 10px; color: #c9c9c9; font-size: 26px; font-weight: 400; text-align: center; background-color: #fff; border: 2px solid #e3e3e3; border-radius: 50px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li.on { color: #fff; font-weight: 500; background-color: #00bcd5; border: 2px solid #00bcd5; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li.unit { width: 40px; height: 40px; background-repeat: no-repeat; background-position: center; background-size: contain; border-radius: 50%; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li.first { background-image: url("/common/img/sub/sub4_con1_pagination_first.png"); } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li.prev { background-image: url("/common/img/sub/sub4_con1_pagination_prev.png"); } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li.next { background-image: url("/common/img/sub/sub4_con1_pagination_next.png"); } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li.end { background-image: url("/common/img/sub/sub4_con1_pagination_end.png"); } .subpage_05 .container_01 .inner { max-width: 100%; } .subpage_05 .container_01 .con1_title { top: 55%; } .subpage_05 .container_01 .con1_title h3 { margin-bottom: 30px; font-size: 78px; } .subpage_05 .container_01 .con1_title h3 span { margin-left: 7px; font-size: 30px; font-weight: 500; } .subpage_05 .container_01 .con1_title p { margin-bottom: 0; font-size: 32px; } .subpage_05 .container_01 .con1_swiper { height: 546px; } .subpage_05 .container_01 .con1_swiper .swiper-slide::before { height: 100%; } .subpage_05 .container_01 .con1_swiper .swiper-slide > img { object-position: 50% 0%; } .subpage_05 .sub_container_01 { padding: 160px 0; overflow: hidden; } .subpage_05 .sub_container_01 .contents { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; } .subpage_05 .sub_container_01 .contents .swiper { position: relative; overflow: hidden; width: 100%; max-width: 1350px; } .subpage_05 .sub_container_01 .contents .swiper .swiper-wrapper { display: flex; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 { position: relative; width: 1350px; padding-bottom: 55px; margin-bottom: 117px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box { display: flex; flex-direction: row; align-items: flex-start; justify-content: center; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_img { width: 656px; height: 840px; border-radius: 25px; overflow: hidden; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_img > img { width: 100%; height: 100%; object-fit: cover; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc { flex: 1; margin-top: 80px; margin-left: 100px; max-width: 590px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6 { position: relative; display: flex; flex-direction: row; align-items: flex-end; justify-content: flex-start; margin-bottom: 32px; gap: 10px; color: #202020; font-size: 56px; font-weight: 700; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6::before { position: absolute; top: 9px; left: -25px; content: ""; width: 8px; height: 46px; background-color: #00bcd5; border-radius: 10px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6 span { display: inline-block; margin-bottom: 12px; color: #00b5cd; font-size: 22px; font-weight: 600; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > p { margin-bottom: 48px; line-height: 1.4; color: #6c6c6c; font-size: 26px; font-weight: 600; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li { display: flex; flex-direction: row; align-items: flex-start; justify-content: flex-start; gap: 24px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li span { display: flex; flex-direction: row; align-items: center; justify-content: center; width: 137px; height: 47px; color: #fff; font-size: 26px; font-weight: 500; background-color: #00bcd5; border-radius: 40px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li p { flex: 1; margin-top: 7px; line-height: 1.4; color: #939393; font-size: 26px; font-weight: 500; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option { position: absolute; left: 750px; bottom: 0; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 0 17px; z-index: 3; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev, .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next { position: relative; left: initial; right: initial; width: 47px; height: 47px; margin-top: initial; background-image: none; border: 2px solid #00bcd5; border-radius: 50%; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev::before, .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next::before { position: absolute; top: 50%; transform: translate(-50%, -50%); content: ""; width: 13px; height: 24px; background-repeat: no-repeat; background-position: center; background-size: contain; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev.swiper-button-disabled, .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next.swiper-button-disabled { opacity: 1; border: 2px solid #cccccc; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev::before { left: 46%; background-image: url("/common/img/sub/sub5_arrow_prev_mint.png"); } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev.swiper-button-disabled::before { background-image: url("/common/img/sub/sub5_arrow_prev_gray.png"); } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next::before { left: 54%; background-image: url("/common/img/sub/sub5_arrow_next_mint.png"); } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next.swiper-button-disabled::before { background-image: url("/common/img/sub/sub5_arrow_next_gray.png"); } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .count { position: initial; width: 70px; color: #afafaf; font-size: 24px; letter-spacing: 1px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .count span { font-weight: 500; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .count span:first-of-type { font-weight: 600; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .guide_text { position: relative; width: 100%; margin-top: 55px; padding-left: 42px; line-height: 1.4; color: #a1a1a1; font-size: 22px; font-weight: 400; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .guide_text::before { position: absolute; top: -4px; left: 0; content: ""; width: 35px; height: 34px; background-image: url("/common/img/sub/sub5_icon_check.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper { width: calc(100% - 40px); max-width: calc(100% - 40px); margin-left: 40px; padding-bottom: 57px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-slide { width: 303px; height: 460px; padding-top: 25px; cursor: pointer; opacity: 0.5; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-slide-thumb-active { position: relative; opacity: 1; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-slide-thumb-active::before { position: absolute; top: 0; left: 50%; transform: translate(-50%, 0); content: "선택됨"; width: 150px; height: 50px; line-height: 50px; padding-left: 55px; color: #fff; font-size: 26px; font-weight: 600; background-color: #00bcd5; background-image: url("/common/img/sub/sub4_con1_check.png"); background-repeat: no-repeat; background-position: 23px 50%; background-size: 19px; border-radius: 40px; z-index: 2; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box { width: 100%; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img { position: relative; width: 100%; height: 435px; border-radius: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img > img { width: 100%; height: 100%; object-fit: cover; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text { position: absolute; left: 30px; bottom: 30px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; gap: 7px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text h6 { color: #fff; font-size: 30px; font-weight: 600; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text p { color: #fff; font-size: 18px; font-weight: 400; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-pagination { position: absolute; left: 70px; bottom: 0; width: calc(100% - 150px); height: 3px; margin-top: 0; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-pagination-progressbar { background: #e7e7e7; opacity: 1; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-pagination-progressbar-fill { background: #afafaf; } .subpage_policy .container_01 .inner { max-width: 100%; } .subpage_policy .container_01 .con1_title { top: 55%; } .subpage_policy .container_01 .con1_title h3 { margin-bottom: 30px; font-size: 78px; } .subpage_policy .container_01 .con1_title h3 span { margin-left: 7px; font-size: 30px; font-weight: 500; } .subpage_policy .container_01 .con1_title p { margin-bottom: 0; font-size: 32px; } .subpage_policy .container_01 .con1_swiper { height: 546px; } .subpage_policy .container_01 .con1_swiper .swiper-slide::before { height: 100%; } .subpage_policy .container_01 .con1_swiper .swiper-slide > img { object-position: 50% 0%; } .subpage_policy .sub_container_01 { padding: 160px 0; } .subpage_policy .sub_container_01 .inner { max-width: 1450px; } .subpage_policy .sub_container_01 h6 { position: relative; margin-bottom: 40px; padding-left: 25px; color: #202020; font-size: 56px; font-weight: 700; } .subpage_policy .sub_container_01 h6::before { position: absolute; top: 50%; left: 0; transform: translate(0, -50%); content: ""; width: 8px; height: 46px; background-color: #00bcd5; border-radius: 10px; } .subpage_policy .sub_container_01 p { line-height: 1.4; color: #6c6c6c; font-size: 26px; white-space: pre-line; } .subpage_login #header { background-color: #00bcd5; border-bottom: 1px solid #00bcd5; } .subpage_login #header.hov, .subpage_login #header.active, .subpage_login #header.on, .subpage_login #header:hover { background: #00bcd5; border-bottom: 1px solid #00bcd5; } .subpage_login #header .utile_menu_user .user_join { background-color: rgba(0, 0, 0, 0.2); } .subpage_login #header .utile_menu_user .user_login { background-color: rgba(0, 0, 0, 0.2); } .subpage_login #header #gnb > ul > li.depth1 > a:after { background: #fff; } .subpage_login #header #gnb > ul > li.depth1 > a.active { color: #fff; } .subpage_login .container_01 { min-height: calc(100vh - 326px); padding-top: 89px; } .subpage_login .container_01 .login_wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; padding: 170px 0; } .subpage_login .container_01 .login_wrap .login { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; max-width: 524px; } .subpage_login .container_01 .login_wrap .login h3 { margin-bottom: 45px; color: #202020; font-size: 60px; text-align: center; } .subpage_login .container_01 .login_wrap .login ul { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 36px; width: 100%; } .subpage_login .container_01 .login_wrap .login ul li { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: center; gap: 15px; width: 100%; } .subpage_login .container_01 .login_wrap .login ul li h6 { color: #6c6c6c; font-size: 26px; font-weight: 600; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap { position: relative; width: 100%; height: 92px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .input_text { width: 100%; height: 100%; padding: 0 20px; background-color: #f2f2f2; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .btn_show_pw { position: absolute; top: 50%; right: 38px; transform: translate(0, -50%); cursor: pointer; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap.for_checkbox { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: auto; height: 34px; gap: 11px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .input_checkbox { display: inline-block; width: 34px; height: 34px; background-image: url("/common/img/sub/login_icon_check_gray.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .input_checkbox:checked { background-image: url("/common/img/sub/login_icon_check_mint.png"); } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .input_checkbox:checked + label { color: #00bcd5; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .input_checkbox + label { height: 34px; line-height: 34px; color: #6c6c6c; font-size: 26px; font-weight: 500; cursor: pointer; } .subpage_login .container_01 .login_wrap .login ul li .find_password { position: relative; padding-right: 28px; color: #6c6c6c; font-size: 26px; font-weight: 500; cursor: pointer; } .subpage_login .container_01 .login_wrap .login ul li .find_password::before { position: absolute; top: 50%; right: 0; transform: translate(0, -50%); content: ""; width: 13px; height: 22px; background-image: url("/common/img/sub/sub_find_password_arrow.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .subpage_login .container_01 .login_wrap .login ul li .login_btn { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 92px; color: #fff; font-size: 26px; font-weight: 600; background-color: #00bcd5; } .subpage_login .container_01 .login_wrap .login ul li.bottom { flex-direction: row; align-items: center; justify-content: space-between; } .subpage_login .container_01 .login_wrap .login ul li.sns_link { align-items: center; gap: 30px; padding-top: 30px; } .subpage_login .container_01 .login_wrap .login ul li.sns_link p { color: #6c6c6c; font-size: 26px; font-weight: 500; } .subpage_login .container_01 .login_wrap .login ul li.sns_link .link_wrap { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 25px; } .subpage_join #header { background-color: #00bcd5; border-bottom: 1px solid #00bcd5; } .subpage_join #header.hov, .subpage_join #header.active, .subpage_join #header.on, .subpage_join #header:hover { background: #00bcd5; border-bottom: 1px solid #00bcd5; } .subpage_join #header .utile_menu_user .user_join { background-color: rgba(0, 0, 0, 0.2); } .subpage_join #header .utile_menu_user .user_login { background-color: rgba(0, 0, 0, 0.2); } .subpage_join #header #gnb > ul > li.depth1 > a:after { background: #fff; } .subpage_join #header #gnb > ul > li.depth1 > a.active { color: #fff; } .subpage_join .container_01 { min-height: calc(100vh - 326px); padding-top: 89px; } .subpage_join .container_01 .join_wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; padding: 170px 0; } .subpage_join .container_01 .join_wrap .join h3 { margin-bottom: 45px; color: #202020; font-size: 60px; text-align: center; } .subpage_join .container_01 .join_wrap .join .step_img { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-bottom: 80px; } .subpage_join .container_01 .join_wrap .join .step_img p { margin-top: 25px; color: #ef5353; font-size: 20px; font-weight: 500; text-align: center; } .subpage_join .container_01 .join_wrap .join ul { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 36px; width: 100%; max-width: 1170px; } .subpage_join .container_01 .join_wrap .join ul li { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: center; gap: 30px; width: 100%; } .subpage_join .container_01 .join_wrap .join ul li h6 { color: #202020; font-size: 30px; font-weight: 600; } .subpage_join .container_01 .join_wrap .join ul li .text_wrap { width: 100%; height: 335px; background-color: #f7f7f7; border: 1px solid #d7d7d7; overflow: auto; } .subpage_join .container_01 .join_wrap .join ul li .text_wrap .text { width: 100%; height: 100%; padding: 30px; color: #202020; font-size: 22px; font-weight: 400; white-space: pre-line; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap { position: relative; display: flex; flex-direction: row-reverse; align-items: center; justify-content: flex-start; width: 100%; height: 28px; gap: 12px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap .input_checkbox { display: inline-block; width: 34px; height: 34px; background-image: url("/common/img/sub/join_icon_check_gray.png"); background-repeat: no-repeat; background-position: center; background-size: contain; cursor: pointer; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap .input_checkbox:checked { background-image: url("/common/img/sub/join_icon_check_mint.png"); } .subpage_join .container_01 .join_wrap .join ul li .input_wrap .input_checkbox:checked + label { color: #00bcd5; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap .input_checkbox + label { height: 28px; line-height: 28px; color: #6c6c6c; font-size: 20px; font-weight: 400; cursor: pointer; } .subpage_join .container_01 .join_wrap .join ul li .join_btn { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 522px; height: 92px; margin: 0 auto; margin-top: 54px; color: #fff; font-size: 26px; font-weight: 600; background-color: #00bcd5; } .subpage_join .container_01 .join_wrap .join_congratulate { display: flex; flex-direction: column; justify-content: center; align-items: center; } .subpage_join .container_01 .join_wrap .join_congratulate p { margin: 40px 0 80px 0; line-height: 1.4; color: #6c6c6c; font-size: 26px; font-weight: 600; text-align: center; } .subpage_join .container_01 .join_wrap .join_congratulate a { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 523px; height: 92px; color: #fff; font-size: 26px; font-weight: 600; background-color: #00bcd5; } .subpage_join_info #header { background-color: #00bcd5; border-bottom: 1px solid #00bcd5; } .subpage_join_info #header.hov, .subpage_join_info #header.active, .subpage_join_info #header.on, .subpage_join_info #header:hover { background: #00bcd5; border-bottom: 1px solid #00bcd5; } .subpage_join_info #header .utile_menu_user .user_join { background-color: rgba(0, 0, 0, 0.2); } .subpage_join_info #header .utile_menu_user .user_login { background-color: rgba(0, 0, 0, 0.2); } .subpage_join_info #header #gnb > ul > li.depth1 > a:after { background: #fff; } .subpage_join_info #header #gnb > ul > li.depth1 > a.active { color: #fff; } .subpage_join_info .container_01 { min-height: calc(100vh - 326px); padding-top: 89px; } .subpage_join_info .container_01 .join_info_wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; padding: 170px 0; } .subpage_join_info .container_01 .join_info_wrap .join_info { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; max-width: 800px; } .subpage_join_info .container_01 .join_info_wrap .join_info h3 { margin-bottom: 45px; padding-left: 120px; color: #202020; font-size: 60px; text-align: center; } .subpage_join_info .container_01 .join_info_wrap .join_info .step_img { display: flex; flex-direction: column; justify-content: center; align-items: center; padding-left: 60px; margin-bottom: 50px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 36px; width: 100%; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li { display: flex; flex-direction: row; align-items: center; align-items: flex-start; justify-content: flex-start; gap: 15px; width: 100%; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li h6 { display: flex; flex-direction: column; justify-content: center; align-items: flex-end; justify-content: center; width: 185px; height: 92px; padding-right: 20px; color: #6c6c6c; font-size: 26px; font-weight: 600; text-align: right; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li.custom h6 { height: 38px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li.custom .input_wrap { min-height: 38px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: center; gap: 10px; flex: 1; min-height: 92px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .input_text { width: 100%; height: 100%; min-height: 92px; padding: 0 20px; background-color: #f2f2f2; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap p { color: #6c6c6c; font-size: 26px; font-weight: 500; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap p.guide_text { font-size: 22px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap.for_checkbox { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: flex-start; flex-wrap: wrap; width: auto; min-height: 38px; gap: 11px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap.for_checkbox p { width: 100%; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .input_checkbox { display: inline-block; width: 38px; height: 38px; background-image: url("/common/img/sub/join_icon_check_gray.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .input_checkbox:checked { background-image: url("/common/img/sub/join_icon_check_mint.png"); } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .input_checkbox:checked + label { color: #00bcd5; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .input_checkbox + label { height: 34px; line-height: 34px; color: #6c6c6c; font-size: 26px; font-weight: 500; cursor: pointer; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .box { width: 198px; height: 96px; border: 1px solid #6c6c6c; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .login_btn { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 92px; color: #fff; font-size: 26px; font-weight: 600; background-color: #00bcd5; } .subpage_join_info .container_01 .join_info_wrap .join_info .btn_wrap { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 1070px; gap: 25px; margin-top: 100px; } .subpage_join_info .container_01 .join_info_wrap .join_info .btn_wrap .btn { display: flex; flex-direction: column; justify-content: center; align-items: center; flex: 1; height: 92px; font-size: 26px; font-weight: 600; } .subpage_join_info .container_01 .join_info_wrap .join_info .btn_wrap .btn_join { color: #fff; background-color: #00bcd5; } .subpage_join_info .container_01 .join_info_wrap .join_info .btn_wrap .btn_cancel { color: #6c6c6c; border: 1px solid #6c6c6c; } .subpage_06 .follow_ul .tab_base { display: inline-flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 20px; } .subpage_06 .follow_ul li a { justify-content: flex-start; } .subpage_06 .follow_ul.custom_follow_ul { width: 375px; } .subpage_06 .container_01 .inner { max-width: 100%; } .subpage_06 .container_01 .con1_title { top: 55%; } .subpage_06 .container_01 .con1_title h3 { margin-bottom: 30px; font-size: 78px; } .subpage_06 .container_01 .con1_title h3 span { margin-left: 7px; font-size: 30px; font-weight: 500; } .subpage_06 .container_01 .con1_title p { margin-bottom: 0; font-size: 32px; } .subpage_06 .container_01 .con1_swiper { height: 546px; } .subpage_06 .container_01 .con1_swiper .swiper-slide::before { height: 100%; } .subpage_06 .container_01 .con1_swiper .swiper-slide > img { object-position: 50% 0%; } .subpage_06 .sub_container_01 { padding: 97px 0 0 0; } .subpage_06 .sub_container_01 .inner { max-width: 1395px; } .subpage_06 .sub_container_01 .tab_base { display: flex; flex-direction: row; align-items: center; justify-content: center; width: 100%; margin-bottom: 183px; } .subpage_06 .sub_container_01 .tab_base li { flex: 1; height: 90px; list-style: none; color: #C5C5C5; font-size: 27px; border: 1px solid #CACACA; border-right: 0; } .subpage_06 .sub_container_01 .tab_base li a { display: flex; flex-direction: row; align-items: center; justify-content: center; width: 100%; height: 100%; } .subpage_06 .sub_container_01 .tab_base li.on { color: #fff; border: 1px solid #00BCD5; background-color: #00BCD5; } .subpage_06 .sub_container_01 .tab_base li:last-of-type { border-right: 1px solid #CACACA; } .subpage_06 .panel_base { padding-top: 0; } .subpage_06 .panel_base > li { display: none; } .subpage_06 .panel_base_inner { max-width: 1395px; margin: 0 auto; padding-bottom: 250px; } .subpage_06 .panel_base_inner .inner_title { position: relative; margin-bottom: 60px; padding-top: 45px; } .subpage_06 .panel_base_inner .inner_title.mgb200 { margin-bottom: 200px; } .subpage_06 .panel_base_inner .inner_title:last-of-type { margin-bottom: 0; } .subpage_06 .panel_base_inner .inner_title::before { position: absolute; top: 0; left: 0; content: ""; width: 60px; height: 5px; border-radius: 13px; background-color: #00C3DD; } .subpage_06 .panel_base_inner .inner_title h6 { margin-bottom: 40px; line-height: 1.2; color: #00BCD5; font-size: 56px; font-weight: 700; } .subpage_06 .panel_base_inner .inner_title h6.sub_title { font-size: 36px; } .subpage_06 .panel_base_inner .inner_title p { line-height: 1.4; color: #969696; font-size: 23px; font-weight: 600; } .subpage_06 .panel_base_inner .inner_title p b { display: inline-block; margin-bottom: 40px; color: #000000; font-size: 26px; font-weight: 700; } .subpage_06 .panel_base_inner .inner_title .desc_text { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 30px; } .subpage_06 .panel_base_inner .inner_title .desc_text span { line-height: 1.4; color: #969696; font-size: 23px; font-weight: 600; } .subpage_06 .panel_base_inner .contents_list { margin-bottom: 200px; } .subpage_06 .panel_base_inner .contents_list li { margin-bottom: 20px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type { margin-bottom: 32px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type b { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 6px; color: #00BCD5; font-size: 36px; font-weight: bold; } .subpage_06 .panel_base_inner .contents_list li:last-of-type { margin-bottom: 0; } .subpage_06 .panel_base_inner .contents_list li h6 { display: inline-flex; flex-direction: row; align-items: center; justify-content: center; height: 48px; margin-bottom: 8px; padding: 0 20px; color: #fff; font-size: 24px; font-weight: 600; background-color: #636464; border-radius: 40px; } .subpage_06 .panel_base_inner .contents_list li p { color: #969696; font-size: 23px; font-weight: 600; } .subpage_06 .panel_base_inner .swiper_wrap { position: relative; margin-bottom: 200px; } .subpage_06 .panel_base_inner .swiper_wrap:last-of-type { margin-bottom: 0; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 15px; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-prev, .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-next { position: absolute; top: 30%; display: flex; align-items: center; justify-content: center; width: initial; height: initial; margin-top: initial; background-image: initial; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-prev { left: -40px; right: initial; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-next { left: initial; right: -40px; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-pagination { position: initial; width: 100%; height: 3px; margin-top: 43px; border-radius: 10px; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-pagination-progressbar { background: #AFAFAF; opacity: 1; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-pagination-progressbar-fill { background: #E7E7E7; } .subpage_06 .panel_base_inner .sub_swiper { position: relative; width: 100%; padding-bottom: 40px; overflow: hidden; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide { width: 520px; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 20px; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box_img { width: 100%; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box_img img { width: 100%; height: 100%; object-fit: cover; border-radius: 20px; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box_desc p { font-size: 23px; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box_desc p b { color: #00BCD5; font-weight: 600; } .subpage_06 .panel_base_inner .over_container { position: relative; width: 100%; height: 500px; margin-bottom: 200px; } .subpage_06 .panel_base_inner .over_container .over_swiper_wrap { position: absolute; top: 0; left: 50%; transform: translate(-50%, 0); width: 96vw; } .subpage_06 .panel_base_inner .over_container .over_swiper_wrap .swiper-pagination { width: 88vw; margin: 0 auto; margin-top: 54px; } .subpage_06 .panel_base_inner .over_container .sub_swiper { padding-bottom: 0; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide { width: 300px; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide .box { position: relative; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide .box_desc { position: absolute; left: 30px; bottom: 30px; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide .box_desc h6 { color: #fff; font-size: 30px; font-weight: 600; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide .box_desc p { color: #fff; font-size: 18px; } .subpage_06 .panel_base_inner .inner_contents_01 { display: flex; flex-direction: column; align-items: center; justify-content: center; margin-bottom: 200px; padding: 100px 0; background-color: #F5F5F5; border-radius: 20px; } .subpage_06 .panel_base_inner .inner_contents_01 > h6 { margin-bottom: 40px; font-size: 26px; font-weight: 700; } .subpage_06 .panel_base_inner .inner_contents_01 > h3 { margin-bottom: 60px; color: #00C3DD; font-size: 56px; font-weight: 700; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 13px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 30px; width: 340px; height: 340px; border: 1px solid #00C3DD; border-radius: 50%; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle h6 { font-size: 23px; font-weight: 500; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle h5 { font-size: 32px; font-weight: 700; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle p { line-height: 1.2; min-height: 104px; font-size: 20px; font-weight: 500; text-align: center; } .subpage_06 .panel_base_inner .inner_contents_02 { margin-bottom: 200px; } .subpage_06 .panel_base_inner .inner_contents_02 > img { width: 100%; height: 100%; object-fit: cover; } .subpage_06 .panel_base_inner .inner_contents_03 { margin-bottom: 200px; padding: 80px 265px 112px 265px; background-image: url("/common/img/sub/sub6_contents_bg.png"); background-repeat: no-repeat; background-position: center; background-size: cover; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title { margin-bottom: 0; padding-top: 45px; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title p { margin-bottom: 100px; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title p.mgb40 { margin-bottom: 40px; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title p b { margin-bottom: 0; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title p:last-of-type { margin-bottom: 0; } @media screen and (max-width: 1600px) { .subpage_01 .sub_container_01 .inner { flex-direction: column-reverse; align-items: center; justify-content: center; gap: 50px; } .subpage_02 .panel_base_inner .contents { width: 80%; } .subpage_02 .panel_base_inner .contents .portrait { width: 500px; } .subpage_02 .panel_base_inner .contents .portrait > div { height: 553px; } .subpage_02 .panel_base_inner .contents_inner { margin-top: 25px; margin-left: 30px; } .subpage_02 .panel_base_inner .contents_inner_desc { gap: 13px; margin-bottom: 75px; } .subpage_02 .panel_base_inner .contents_inner_desc p { padding-left: 20px; font-size: 22px; } .subpage_03 .sub_container_01 .box_wrap .box_bg { width: 500px; height: 350px; } .subpage_03 .sub_container_01 .box_wrap .box { width: calc(100% - 500px + 205px + 205px); } .subpage_03 .sub_container_01 .box_wrap .box_text { padding: 100px 20px 140px 280px; } .subpage_03 .sub_container_01 .box_wrap .box_text h6 { margin-bottom: 58px; padding-bottom: 48px; font-size: 40px; } .subpage_03 .sub_container_01 .box_wrap .box_text h6::before { width: 55px; height: 5px; } .subpage_03 .sub_container_01 .box_wrap .box_text p { font-size: 20px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box { width: calc(100% - 500px + 210px + 210px); } .subpage_04 .sub_container_01 .inner { max-width: calc(100% - 20px); } .subpage_04 .sub_container_01 .contents_wrap > ul { margin-bottom: 135px; gap: 30px 10px; } .subpage_04 .sub_container_01 .contents_wrap > ul li { width: calc(25% - 7.5px); } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info { gap: 10px; margin-top: 14px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_title { gap: 14px; font-size: 20px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_title span { height: 35px; padding: 0 20px; font-size: 20px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_desc p { font-size: 16px; } .subpage_04 .sub_container_01 .contents_wrap .pagination { gap: 20px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group { gap: 10px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group:first-of-type, .subpage_04 .sub_container_01 .contents_wrap .pagination_group:last-of-type { gap: 5px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li:not(.unit) { min-width: 40px; height: 40px; line-height: 36px; padding: 0 10px; font-size: 20px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li.unit { width: 40px; height: 40px; } .subpage_05 .sub_container_01 .contents .swiper { max-width: 100%; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 { width: 90%; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_img { width: 470px; height: 780px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option { left: 567px; } .subpage_policy .sub_container_01 { padding: 160px 0; } .subpage_policy .sub_container_01 .inner { max-width: 96%; } .subpage_policy .sub_container_01 h6 { font-size: 46px; } .subpage_policy .sub_container_01 p { font-size: 22px; } .subpage_06 .follow_ul { display: none; } .subpage_06 .sub_container_01 { padding: 60px 50px 0 50px; } .subpage_06 .sub_container_01 .inner { width: 100%; max-width: 1395px; margin: 0 auto; } .subpage_06 .sub_container_01 .tab_base { width: 100%; margin-bottom: 10vw; } .subpage_06 .sub_container_01 .tab_base li { height: 90px; font-size: 27px; } .subpage_06 .panel_base_inner { padding: 0 50px 15vw 50px; } } @media screen and (max-width: 1400px) { .subpage_01 .sub_container_01 .information_wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; } .subpage_01 .sub_container_01 .information_wrap .info { display: flex; flex-direction: row; align-items: center; justify-content: center; } .subpage_01 .sub_container_01 .information_wrap .info_icon { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 205px; height: 205px; background-color: #fff; border: 2px solid #ededed; border-radius: 50%; overflow: hidden; z-index: 1; } .subpage_01 .sub_container_01 .information_wrap .info_icon > img { margin-top: -10px; } .subpage_01 .sub_container_01 .information_wrap .info_icon span { margin-top: -3px; color: #818181; font-size: 24px; font-weight: 600; } .subpage_01 .sub_container_01 .information_wrap .info_desc { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 10px; width: 475px; height: 147px; margin-left: -30px; padding-left: 60px; background-color: #f5f5f5; border-radius: 0 100px 100px 0; } .subpage_01 .sub_container_01 .information_wrap .info_desc h6 { color: #303030; font-size: 36px; font-weight: 600; } .subpage_01 .sub_container_01 .information_wrap .info_desc p { color: #a5a5a5; font-size: 22px; font-weight: 600; } .subpage_01 .sub_container_01 .information_wrap .info_desc p span { color: #00bcd5; } .subpage_01 .sub_container_01 .contents_title { margin-top: 60px; } .subpage_01 .sub_container_02 { padding: 120px 30px 120px 30px; } .subpage_01 .sub_container_02::before { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 650px; background-color: #00b5cd; z-index: 0; } .subpage_01 .sub_container_02 .inner { position: relative; max-width: 1550px; z-index: 2; } .subpage_01 .sub_container_02 .contents_title { align-items: center; margin-bottom: 134px; } .subpage_01 .sub_container_02 .contents_title_01 { margin-bottom: 15px; } .subpage_01 .sub_container_02 .contents_title_02 { margin-bottom: 22px; font-size: 64px; } .subpage_01 .sub_container_02 .contents_title_03 { font-size: 24px; } .subpage_01 .sub_container_02 .tab_base { gap: 20px; height: 550px; } .subpage_01 .sub_container_02 .tab_base li { list-style: none; } .subpage_01 .sub_container_02 .tab_base li a { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 153px; padding: 145px 7px 172px 7px; background-color: #fff; border-radius: 100px 100px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.08); transition: all 0.5s; z-index: 1; } .subpage_01 .sub_container_02 .tab_base li a .icon { position: absolute; top: 7px; left: 50%; transform: translate(-50%, 0); width: 134px; height: 134px; background-repeat: no-repeat; background-position: center; background-size: 134px; border-radius: 50%; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .icon_01 { background-image: url("/common/img/main/con3_icon1.png"); } .subpage_01 .sub_container_02 .tab_base li a .icon_02 { background-image: url("/common/img/main/con3_icon2.png"); } .subpage_01 .sub_container_02 .tab_base li a .icon_03 { background-image: url("/common/img/main/con3_icon3.png"); } .subpage_01 .sub_container_02 .tab_base li a .icon_04 { background-image: url("/common/img/main/con3_icon4.png"); } .subpage_01 .sub_container_02 .tab_base li a .icon_05 { background-image: url("/common/img/main/con3_icon5.png"); } .subpage_01 .sub_container_02 .tab_base li a .icon::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: calc(100% + 4px); height: calc(100% + 4px); border: 2px solid #f0f0f0; border-radius: 50%; transition: all 0.1s; } .subpage_01 .sub_container_02 .tab_base li a .icon::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: calc(100% + 22px); height: calc(100% + 22px); border: 11px solid #f0f0f0; border-radius: 50%; transition: all 0.1s; opacity: 0; } .subpage_01 .sub_container_02 .tab_base li a .inner_box { margin-top: 25px; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title h6 { min-height: 59px; color: #a0a0a0; font-size: 24px; font-weight: 700; text-align: center; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title p { color: #00bcd5; font-size: 0; font-weight: 700; text-align: center; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box .desc_box { position: absolute; left: 50%; bottom: 123px; transform: translate(-50%, 0); display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px; height: 0; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box .desc_box li { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; height: 36px; padding-right: 30px; color: #00bcd5; font-size: 0; white-space: nowrap; font-weight: 600; background-color: transparent; border-radius: 40px; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box .desc_box li span { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 89px; height: 100%; margin-right: 17px; color: #fff; background-color: transparent; border-radius: 40px; } .subpage_01 .sub_container_02 .tab_base li a .icon_arrow { position: absolute; left: 50%; bottom: 7px; transform: translate(-50%, 0); width: 134px; height: 134px; margin-top: 25px; background-image: url("/common/img/sub/sub1_con2_arrow_gray.png"); background-repeat: no-repeat; background-position: center; background-size: contain; border-radius: 50%; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .icon_arrow::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: 100%; height: 100%; background-image: url("/common/img/sub/sub1_con2_arrow_mint.png"); background-repeat: no-repeat; background-position: center; background-size: contain; border-radius: 50%; transition: all 0.5s; opacity: 0; } .subpage_01 .sub_container_02 .tab_base li a::before { position: absolute; left: 200px; bottom: -137px; content: "컨텐츠 바로가기!"; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 220px; height: 52px; color: #fff; font-size: 26px; font-weight: 600; text-align: center; background-color: #00bcd5; border-radius: 40px; transition: all 0.5s; opacity: 0; } .subpage_01 .sub_container_02 .tab_base li a::after { position: absolute; left: 233px; bottom: -85px; content: ""; width: 19px; height: 15px; background-image: url("/common/img/sub/sub1_con2_deco.png"); background-repeat: no-repeat; background-position: center; background-size: contain; transition: all 0.5s; opacity: 0; } .subpage_01 .sub_container_02 .tab_base li a:hover { width: 367px; padding: 77px 7px 238px 7px; border-radius: 35px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon { top: -78px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon::after { opacity: 1; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title h6 { color: #6a6a6a; font-size: 32px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title p { font-size: 24px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box .desc_box { width: inherit; height: 87px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box .desc_box li { font-size: 22px; background-color: #f0f0f0; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box .desc_box li span { background-color: #00bcd5; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon_arrow { bottom: -68px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon_arrow::before { opacity: 1; } .subpage_01 .sub_container_02 .tab_base li a:hover::before, .subpage_01 .sub_container_02 .tab_base li a:hover::after { opacity: 1; } .subpage_01 .sub_container_02 .panel_base { padding-top: 0; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title { gap: 13px; margin-left: 100px; margin-bottom: 45px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title h6 { padding-left: 25px; font-size: 56px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title h6::before { top: 50%; left: 0; transform: translate(0, -50%); width: 8px; height: 46px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title span { font-size: 26px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 45px; margin-bottom: 30px; padding: 40px; background-color: #fff; border-radius: 200px 20px 20px 200px; border: 5px solid #fdfdfd; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_img a { right: -15px; bottom: 0; height: 50px; padding: 0 30px; font-size: 26px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title { gap: 10px; margin-bottom: 30px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title h6 { font-size: 46px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title span { font-size: 24px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap { width: 100%; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table { width: 100%; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td { padding: 14px 0; font-size: 16px; } .subpage_01 .sub_container_03 { padding: 140px 0 280px 0; background-position: -100px 0; } .subpage_01 .sub_container_03 .contents_title { margin-bottom: 75px; } .subpage_01 .sub_container_03 .contents_title_01 { margin-bottom: 20px; } .subpage_01 .sub_container_03 .contents_title_02 { margin-bottom: 10px; font-size: 60px; } .subpage_01 .sub_container_03 .contents_title_03 { margin-bottom: 0; font-size: 24px; } .subpage_01 .sub_container_03 .tab_base { width: 40%; margin-left: 50%; } .subpage_01 .sub_container_03 .tab_base li a { padding: 20px 0 25px 0; } .subpage_01 .sub_container_03 .tab_base li a::before { top: 38px; left: -24px; width: 6px; height: 6px; } .subpage_01 .sub_container_03 .tab_base li a h6 { width: 97px; margin-right: 20px; font-size: 36px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info { gap: 7px 0; flex: 1; margin-top: 5px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info span { padding: 0 15px; font-size: 20px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info span::before { width: 2px; height: 13px; } .subpage_01 .sub_container_03 .tab_base .noti { margin-top: 35px; margin-left: 20px; padding-left: 43px; font-size: 18px; } .subpage_01 .sub_container_03 .tab_base .noti::before { width: 30px; height: 30px; } .subpage_01 .sub_container_03 .panel_base_inner { margin-top: 100px; } .subpage_01 .sub_container_03 .panel_base_inner .title { margin-bottom: 75px; } .subpage_01 .sub_container_03 .panel_base_inner .title > span { margin-bottom: 7px; font-size: 24px; } .subpage_01 .sub_container_03 .panel_base_inner .title h4 .text { margin: 0 50px; font-size: 50px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap { gap: 95px 30px; width: calc(100% - 60px); margin: 0 30px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box { gap: 20px; width: calc(33.33% - 20px); } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box > img { width: calc(33.33vw - 40px); height: calc(33.33vw - 40px); } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc { gap: 10px; padding-left: 15px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc h6 { font-size: 30px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc p { font-size: 20px; } .subpage_01 .sub_container_04 { margin-top: 100px; padding: 100px 0 200px 0; } .subpage_01 .sub_container_04 .contents_title { align-items: center; margin-bottom: 75px; z-index: 1; } .subpage_01 .sub_container_04 .contents_title_01 { margin-bottom: 20px; color: #00b5cd; font-weight: 700; text-align: center; text-transform: uppercase; } .subpage_01 .sub_container_04 .contents_title_02 { margin-bottom: 10px; color: #202020; font-size: 60px; text-align: center; } .subpage_01 .sub_container_04 .contents_title_03 { margin-bottom: 30px; color: #9b9b9b; font-size: 24px; font-weight: 600; text-align: center; } .subpage_01 .sub_container_04 .contents_title_arrow { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; } .subpage_01 .sub_container_04 .map_contents { width: 80%; margin-top: -100px; padding: 50px 0 50px 0; } .subpage_01 .sub_container_04 .map_contents .address_box { gap: 10px; margin-bottom: 20px; } .subpage_01 .sub_container_04 .map_contents .address_box h6 { font-size: 24px; } .subpage_01 .sub_container_04 .map_contents .address_box p { font-size: 20px; } .subpage_01 .sub_container_04 .map_contents ul { gap: 10px; } .subpage_01 .sub_container_04 .map_contents ul li { height: 52px; } .subpage_01 .sub_container_04 .map_contents ul li a { padding-left: 63px; padding-right: 22px; font-size: 18px; } .subpage_01 .sub_container_04 .map_contents ul li a > img { top: 4px; left: 4px; } .subpage_01 .sub_container_04 .map_contents ul .bubble { left: 324px; bottom: -117px; width: 300px; height: 90px; padding: 0 20px; font-size: 18px; } .subpage_01 .sub_container_04 .map_contents ul .bubble::before { top: -15px; left: 34px; width: 19px; height: 15px; } .subpage_01 .sub_container_04 .map .map_api { width: 100%; } .subpage_02 .sub_container_02 { padding: 15vw 0; } .subpage_02 .sub_container_02 .sub_container_title { margin-bottom: 10vw; padding-left: 5%; } .subpage_02 .panel_base_inner .title { padding: 10vw 0; } .subpage_02 .panel_base_inner .title .icon { margin-bottom: 30px; } .subpage_02 .panel_base_inner .contents { width: 75%; max-width: calc(100% - 20px); margin: 0 auto; padding: 15vw 0; } .subpage_02 .panel_base_inner .contents .portrait { width: 320px; } .subpage_02 .panel_base_inner .contents .portrait > div { height: 354px; } .subpage_02 .panel_base_inner .contents .portrait ul { padding: 40px 20px; } .subpage_02 .panel_base_inner .contents .portrait ul li:nth-of-type(1) { font-size: 22px; } .subpage_02 .panel_base_inner .contents .portrait ul li:nth-of-type(2) { font-size: 35px; } .subpage_02 .panel_base_inner .contents_inner { flex: initial; width: calc(100% - 350px); margin-top: 25px; margin-left: 30px; } .subpage_02 .panel_base_inner .contents_inner_title { font-size: 40px; } .subpage_02 .panel_base_inner .contents_inner_title::before { height: 80%; } .subpage_02 .panel_base_inner .contents_inner_desc { gap: 13px; margin-bottom: 5vw; } .subpage_02 .panel_base_inner .contents_inner_desc p { padding-left: 18px; font-size: 20px; } .subpage_03 .container_01::before { bottom: -150px; height: 300px; } .subpage_03 .container_01 .con1_title h3 { gap: 10px; margin-bottom: 30px; } .subpage_03 .container_01 .con1_title p { font-size: 20px; } .subpage_03 .container_01 .con1_swiper { height: 600px; } .subpage_03 .sub_container_01 { padding: 15vw 0 15vw 0; } .subpage_03 .sub_container_01 .main_title { margin-bottom: 20vw; } .subpage_03 .sub_container_01 .main_title h3 { margin-bottom: 58px; padding-bottom: 48px; font-size: 50px; } .subpage_03 .sub_container_01 .main_title h3::before { width: 55px; height: 5px; } .subpage_03 .sub_container_01 .main_title p { font-size: 20px; } .subpage_03 .sub_container_01 .box_wrap { margin-bottom: 15vw; } .subpage_03 .sub_container_01 .box_wrap:last-of-type { margin-bottom: 0; } .subpage_03 .sub_container_01 .box_wrap .box_bg { width: 400px; height: 300px; } .subpage_03 .sub_container_01 .box_wrap .box { width: calc(100% - 400px + 205px + 205px); margin-top: 140px; margin-left: -205px; } .subpage_03 .sub_container_01 .box_wrap .box_img { width: 336px; height: 453px; margin-right: -205px; } .subpage_03 .sub_container_01 .box_wrap .box_text { padding: 100px 20px 140px 280px; } .subpage_03 .sub_container_01 .box_wrap .box_text h6 { margin-bottom: 58px; padding-bottom: 48px; font-size: 40px; } .subpage_03 .sub_container_01 .box_wrap .box_text h6::before { width: 55px; height: 5px; } .subpage_03 .sub_container_01 .box_wrap .box_text p { font-size: 20px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box { width: calc(100% - 400px + 210px + 210px); margin-top: 144px; margin-left: 0; margin-right: -210px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_img { margin-left: -210px; margin-right: 0; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_text { padding: 140px 266px 200px 80px; } .subpage_03 .sub_container_02 { padding: 20vw 0 20vw 0; } .subpage_03 .sub_container_02 h5 { margin-bottom: 30px; font-size: 40px; } .subpage_03 .sub_container_02 h5::before { top: calc(-100vh - 30px); } .subpage_03 .sub_container_02 h6 { margin-bottom: 30px; font-size: 50px; } .subpage_03 .sub_container_02 p { font-size: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option { top: 75%; } .subpage_06 .follow_ul .tab_base { gap: 15px; } .subpage_06 .container_01::before { bottom: -150px; height: 300px; } .subpage_06 .container_01 .con1_title h3 { gap: 10px; margin-bottom: 30px; } .subpage_06 .container_01 .con1_title p { font-size: 20px; } .subpage_06 .container_01 .con1_swiper { height: 600px; } .subpage_06 .sub_container_01 { padding: 50px 30px 0 30px; } .subpage_06 .sub_container_01 .tab_base { width: 100%; margin-bottom: 10vw; } .subpage_06 .sub_container_01 .tab_base li { height: 90px; font-size: 27px; } .subpage_06 .panel_base_inner { padding: 0 30px 15vw 30px; max-width: 100%; margin: 0 auto; padding-bottom: 15vw; } .subpage_06 .panel_base_inner .inner_title { margin-bottom: 60px; padding-top: 45px; } .subpage_06 .panel_base_inner .inner_title::before { width: 60px; height: 5px; } .subpage_06 .panel_base_inner .inner_title.mgb200 { margin-bottom: 15vw; } .subpage_06 .panel_base_inner .inner_title h6 { margin-bottom: 40px; font-size: 56px; } .subpage_06 .panel_base_inner .inner_title p { font-size: 23px; } .subpage_06 .panel_base_inner .inner_title p b { margin-bottom: 40px; font-size: 26px; } .subpage_06 .panel_base_inner .inner_title .desc_text { gap: 30px; } .subpage_06 .panel_base_inner .inner_title .desc_text span { font-size: 23px; } .subpage_06 .panel_base_inner .contents_list { margin-bottom: 15vw; } .subpage_06 .panel_base_inner .contents_list li { margin-bottom: 20px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type { margin-bottom: 32px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type b { gap: 6px; font-size: 36px; } .subpage_06 .panel_base_inner .contents_list li h6 { height: 48px; margin-bottom: 8px; padding: 0 20px; font-size: 24px; } .subpage_06 .panel_base_inner .contents_list li p { font-size: 23px; } .subpage_06 .panel_base_inner .swiper_wrap { margin-bottom: 15vw; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-prev, .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-next { top: 30%; width: 40px; height: 40px; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-prev { left: -20px; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-next { right: -20px; } .subpage_06 .panel_base_inner .sub_swiper { padding-bottom: 0; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide { width: 36vw; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box { gap: 20px; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box_desc p { font-size: 23px; } .subpage_06 .panel_base_inner .inner_contents_01 { margin-bottom: 15vw; padding: 7vw 0; } .subpage_06 .panel_base_inner .inner_contents_01 > h6 { margin-bottom: 40px; font-size: 26px; } .subpage_06 .panel_base_inner .inner_contents_01 > h3 { margin-bottom: 60px; font-size: 56px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap { gap: 10px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle { gap: 20px; width: 320px; height: 320px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle h6 { font-size: 23px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle h5 { font-size: 32px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle p { min-height: 80px; font-size: 16px; } .subpage_06 .panel_base_inner .inner_contents_02 { margin-bottom: 15vw; } .subpage_06 .panel_base_inner .inner_contents_03 { margin-bottom: 15vw; padding: 15vw 10vw 15vw 10vw; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title { margin-bottom: 0; padding-top: 45px; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title p { margin-bottom: 7vw; } } @media screen and (max-width: 1200px) { .subpage .container_01 .con1_title { top: 55%; } .subpage .container_01 .con1_title h3 { margin-bottom: 20px; font-size: 60px; } .subpage .container_01 .con1_title h3 span { margin-left: 7px; font-size: 20px; } .subpage .container_01 .con1_title p { line-height: 1.4; font-size: 22px; } .subpage .container_01 .con1_swiper { height: 50vh; min-height: 500px; } .subpage_01 .sub_container_01 { padding: 15vw 0; } .subpage_01 .sub_container_02 { padding: 15vw 30px 15vw 30px; } .subpage_01 .sub_container_02::before { height: 650px; } .subpage_01 .sub_container_02 .inner { max-width: 100%; } .subpage_01 .sub_container_02 .contents_title { margin-bottom: 10vw; } .subpage_01 .sub_container_02 .contents_title_01 { margin-bottom: 15px; } .subpage_01 .sub_container_02 .contents_title_02 { margin-bottom: 22px; font-size: 64px; } .subpage_01 .sub_container_02 .contents_title_03 { font-size: 20px; } .subpage_01 .sub_container_02 .tab_base { gap: 20px; height: 550px; } .subpage_01 .sub_container_02 .tab_base li a { width: 153px; padding: 145px 7px 172px 7px; border-radius: 100px 100px; } .subpage_01 .sub_container_02 .tab_base li a .icon { top: 7px; left: 50%; transform: translate(-50%, 0); width: 134px; height: 134px; background-size: 134px; } .subpage_01 .sub_container_02 .tab_base li a .icon::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: calc(100% + 4px); height: calc(100% + 4px); border: 2px solid #f0f0f0; border-radius: 50%; transition: all 0.1s; } .subpage_01 .sub_container_02 .tab_base li a .icon::after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: calc(100% + 22px); height: calc(100% + 22px); border: 11px solid #f0f0f0; } .subpage_01 .sub_container_02 .tab_base li a .inner_box { margin-top: 25px; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title h6 { min-height: 59px; color: #a0a0a0; font-size: 24px; font-weight: 700; text-align: center; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title p { color: #00bcd5; font-size: 0; font-weight: 700; text-align: center; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box .desc_box { position: absolute; left: 50%; bottom: 123px; transform: translate(-50%, 0); display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px; height: 0; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box .desc_box li { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; height: 36px; padding-right: 30px; color: #00bcd5; font-size: 0; white-space: nowrap; font-weight: 600; background-color: transparent; border-radius: 40px; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box .desc_box li span { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 89px; height: 100%; margin-right: 17px; color: #fff; background-color: transparent; border-radius: 40px; } .subpage_01 .sub_container_02 .tab_base li a .icon_arrow { position: absolute; left: 50%; bottom: 7px; transform: translate(-50%, 0); width: 134px; height: 134px; margin-top: 25px; background-image: url("/common/img/sub/sub1_con2_arrow_gray.png"); background-repeat: no-repeat; background-position: center; background-size: contain; border-radius: 50%; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .icon_arrow::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: 100%; height: 100%; background-image: url("/common/img/sub/sub1_con2_arrow_mint.png"); background-repeat: no-repeat; background-position: center; background-size: contain; border-radius: 50%; transition: all 0.5s; opacity: 0; } .subpage_01 .sub_container_02 .tab_base li a::before { position: absolute; left: 200px; bottom: -137px; content: "컨텐츠 바로가기!"; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 220px; height: 52px; color: #fff; font-size: 26px; font-weight: 600; text-align: center; background-color: #00bcd5; border-radius: 40px; transition: all 0.5s; opacity: 0; } .subpage_01 .sub_container_02 .tab_base li a::after { position: absolute; left: 233px; bottom: -85px; content: ""; width: 19px; height: 15px; background-image: url("/common/img/sub/sub1_con2_deco.png"); background-repeat: no-repeat; background-position: center; background-size: contain; transition: all 0.5s; opacity: 0; } .subpage_01 .sub_container_02 .tab_base li a:hover { width: 367px; padding: 77px 7px 238px 7px; border-radius: 35px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon { top: -78px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon::after { opacity: 1; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title h6 { color: #6a6a6a; font-size: 32px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title p { font-size: 24px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box .desc_box { width: inherit; height: 87px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box .desc_box li { font-size: 22px; background-color: #f0f0f0; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box .desc_box li span { background-color: #00bcd5; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon_arrow { bottom: -68px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon_arrow::before { opacity: 1; } .subpage_01 .sub_container_02 .tab_base li a:hover::before, .subpage_01 .sub_container_02 .tab_base li a:hover::after { opacity: 1; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title { gap: 13px; margin-left: 100px; margin-bottom: 45px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title h6 { padding-left: 25px; font-size: 56px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title h6::before { top: 50%; left: 0; transform: translate(0, -50%); width: 8px; height: 46px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title span { font-size: 26px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor { gap: 45px; margin-bottom: 30px; padding: 40px; border-radius: 200px 20px 20px 200px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_img a { right: -15px; bottom: 0; height: 50px; padding: 0 30px; font-size: 26px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title { gap: 10px; margin-bottom: 30px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title h6 { font-size: 46px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title span { margin-bottom: 4px; font-size: 20px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap { width: 100%; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table { width: 100%; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td { padding: 14px 0; font-size: 16px; vertical-align: middle; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th > img, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td > img { width: 30px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th:last-of-type > img, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td:last-of-type > img { width: 20px; } .subpage_01 .sub_container_03 { padding: 15vw 0 15vw 0; background-position: -100px 0; } .subpage_01 .sub_container_03 .contents_title { margin-bottom: 75px; } .subpage_01 .sub_container_03 .contents_title_01 { margin-bottom: 20px; } .subpage_01 .sub_container_03 .contents_title_02 { margin-bottom: 10px; font-size: 60px; } .subpage_01 .sub_container_03 .contents_title_03 { margin-bottom: 0; font-size: 24px; } .subpage_01 .sub_container_03 .tab_base { width: 45%; margin-left: 50%; } .subpage_01 .sub_container_03 .tab_base li a { padding: 20px 0 25px 0; } .subpage_01 .sub_container_03 .tab_base li a::before { top: 38px; left: -24px; width: 6px; height: 6px; } .subpage_01 .sub_container_03 .tab_base li a h6 { width: 97px; margin-right: 20px; font-size: 36px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info { gap: 7px 0; flex: 1; margin-top: 5px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info span { padding: 0 15px; font-size: 20px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info span::before { width: 2px; height: 13px; } .subpage_01 .sub_container_03 .tab_base .noti { margin-top: 35px; margin-left: 20px; padding-left: 43px; font-size: 18px; } .subpage_01 .sub_container_03 .tab_base .noti::before { width: 30px; height: 30px; } .subpage_01 .sub_container_03 .panel_base_inner { margin-top: 100px; } .subpage_01 .sub_container_03 .panel_base_inner .title { margin-bottom: 75px; } .subpage_01 .sub_container_03 .panel_base_inner .title > span { margin-bottom: 7px; font-size: 24px; } .subpage_01 .sub_container_03 .panel_base_inner .title h4 .text { margin: 0 50px; font-size: 50px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap { gap: 60px 10px; width: calc(100% - 60px); margin: 0 30px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box { gap: 20px; width: calc(33.33% - 7px); } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box > img { width: calc(33.33vw - 27px); height: calc(33.33vw - 27px); } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc { gap: 10px; padding-left: 15px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc h6 { font-size: 30px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc p { font-size: 16px; } .subpage_01 .sub_container_04 { margin-top: 0; padding: 15vw 0 calc(15vw + 20px) 0; } .subpage_01 .sub_container_04 .contents_title { align-items: center; margin-bottom: 75px; z-index: 1; } .subpage_01 .sub_container_04 .contents_title_01 { margin-bottom: 20px; color: #00b5cd; font-weight: 700; text-align: center; text-transform: uppercase; } .subpage_01 .sub_container_04 .contents_title_02 { margin-bottom: 10px; color: #202020; font-size: 60px; text-align: center; } .subpage_01 .sub_container_04 .contents_title_03 { margin-bottom: 30px; color: #9b9b9b; font-size: 24px; font-weight: 600; text-align: center; } .subpage_01 .sub_container_04 .contents_title_arrow { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; } .subpage_01 .sub_container_04 .map_contents { width: 80%; margin-top: -100px; padding: 50px 0 50px 0; } .subpage_01 .sub_container_04 .map_contents .address_box { gap: 10px; margin-bottom: 20px; } .subpage_01 .sub_container_04 .map_contents .address_box h6 { font-size: 24px; } .subpage_01 .sub_container_04 .map_contents .address_box p { font-size: 20px; } .subpage_01 .sub_container_04 .map_contents ul { gap: 10px; } .subpage_01 .sub_container_04 .map_contents ul li { height: 52px; } .subpage_01 .sub_container_04 .map_contents ul li a { padding-left: 63px; padding-right: 22px; font-size: 18px; } .subpage_01 .sub_container_04 .map_contents ul li a > img { top: 4px; left: 4px; } .subpage_01 .sub_container_04 .map_contents ul .bubble { left: 324px; bottom: -117px; width: 300px; height: 90px; padding: 0 20px; font-size: 18px; } .subpage_01 .sub_container_04 .map_contents ul .bubble::before { top: -15px; left: 34px; width: 19px; height: 15px; } .subpage_02 .follow_ul { top: 110px; gap: 20px; padding: 0 0 0 39px; } .subpage_02 .follow_ul .tab_base { gap: 20px; } .subpage_02 .follow_ul .bubble { height: 60px; margin-bottom: 20px; padding: 8px 20px; font-size: 18px; } .subpage_02 .follow_ul .bubble::after { left: 34px; bottom: -13px; width: 19px; height: 13px; } .subpage_02 .follow_ul li { width: 70px; height: 70px; padding: 10px; } .subpage_02 .follow_ul li a { font-size: 14px; } .subpage_02 .follow_ul li a > img { width: 50px; height: 50px; margin-right: 29px; } .subpage_02 .follow_ul li.on { width: 250px; } .subpage_02 .follow_ul li.on a { padding-right: 22px; } .subpage_02 .follow_ul li.on a p { font-size: 18px; } .subpage_02 .follow_ul li.on a::before { right: -2px; width: 50px; height: 50px; } .subpage_02 .follow_ul li:nth-of-type(3).on { width: 300px; } .subpage_02 .follow_ul li:nth-of-type(4).on { width: 260px; } .subpage_02 .follow_ul li:nth-of-type(5).on { width: 260px; } .subpage_02 .sub_container_02 .sub_container_title h4 { font-size: 50px; } .subpage_02 .sub_container_02 .sub_container_title p { font-size: 20px; } .subpage_02 .sub_container_02 .con2_slider .slick-list { max-width: 100%; } .subpage_02 .sub_container_02 .con2_slider .item { margin-right: 20px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap > div p { padding: 10px 20px; font-size: 20px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul { padding: 25px 0; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul li:nth-of-type(1) { font-size: 18px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul li:nth-of-type(2) { margin: 10px 0; font-size: 30px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul li:nth-of-type(3) { font-size: 18px; } .subpage_02 .panel_base_inner .title { padding: 7vw 0; } .subpage_02 .panel_base_inner .title .icon { margin-bottom: 30px; } .subpage_02 .panel_base_inner .title h6 { font-size: 50px; } .subpage_02 .panel_base_inner .title p { font-size: 24px; } .subpage_02 .panel_base_inner .contents { gap: 10vw; width: calc(100% - 60px); max-width: 600px; margin: 0 auto; padding: 15vw 0; } .subpage_02 .panel_base_inner .contents .doctor { flex-direction: column; align-items: center; justify-content: center; gap: 30px; } .subpage_02 .panel_base_inner .contents .portrait { width: 320px; } .subpage_02 .panel_base_inner .contents .portrait > div { height: 354px; } .subpage_02 .panel_base_inner .contents .portrait ul { padding: 40px 20px; } .subpage_02 .panel_base_inner .contents .portrait ul li:nth-of-type(1) { font-size: 20px; } .subpage_02 .panel_base_inner .contents .portrait ul li:nth-of-type(2) { font-size: 32px; } .subpage_02 .panel_base_inner .contents_inner { flex: initial; width: auto; margin-top: 25px; margin-left: 30px; } .subpage_02 .panel_base_inner .contents_inner_title { padding-left: 20px; font-size: 30px; } .subpage_02 .panel_base_inner .contents_inner_title::before { height: 80%; } .subpage_02 .panel_base_inner .contents_inner_desc { gap: 13px; margin-bottom: 5vw; } .subpage_02 .panel_base_inner .contents_inner_desc p { padding-left: 18px; font-size: 16px; } .subpage_02 .panel_base_inner .contents_inner_table table th, .subpage_02 .panel_base_inner .contents_inner_table table td { padding: 12px 0; font-size: 14px; } .subpage_02 .panel_base_inner .contents_inner_table table th > img, .subpage_02 .panel_base_inner .contents_inner_table table td > img { width: 30px; } .subpage_02 .panel_base_inner .contents_inner_table table th:last-of-type > img, .subpage_02 .panel_base_inner .contents_inner_table table td:last-of-type > img { width: 20px; } .subpage_03 .container_01::before { bottom: -150px; height: 300px; } .subpage_03 .container_01 .con1_title h3 { gap: 10px; margin-bottom: 30px; } .subpage_03 .container_01 .con1_title p { font-size: 20px; } .subpage_03 .container_01 .con1_swiper { height: 600px; } .subpage_03 .sub_container_01 { padding: 15vw 0 15vw 0; } .subpage_03 .sub_container_01 .main_title { margin-bottom: 20vw; } .subpage_03 .sub_container_01 .main_title h3 { margin-bottom: 58px; padding-bottom: 48px; font-size: 50px; } .subpage_03 .sub_container_01 .main_title h3::before { width: 55px; height: 5px; } .subpage_03 .sub_container_01 .main_title p { font-size: 20px; } .subpage_03 .sub_container_01 .box_wrap { margin-bottom: 15vw; } .subpage_03 .sub_container_01 .box_wrap:last-of-type { margin-bottom: 0; } .subpage_03 .sub_container_01 .box_wrap .box_bg { width: 400px; } .subpage_03 .sub_container_01 .box_wrap .box { width: calc(100% - 400px + 205px + 205px); margin-top: 140px; margin-left: -205px; } .subpage_03 .sub_container_01 .box_wrap .box_img { width: 300px; height: 390px; margin-right: -205px; } .subpage_03 .sub_container_01 .box_wrap .box_text { padding: 10vw 20px 10vw calc(205px + 5vw); } .subpage_03 .sub_container_01 .box_wrap .box_text h6 { margin-bottom: 58px; padding-bottom: 48px; font-size: 30px; } .subpage_03 .sub_container_01 .box_wrap .box_text h6::before { width: 40px; height: 4px; } .subpage_03 .sub_container_01 .box_wrap .box_text p { font-size: 14px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box { width: calc(100% - 400px + 210px + 210px); margin-top: 144px; margin-left: 0; margin-right: -210px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_img { margin-left: -210px; margin-right: 0; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_text { padding: 10vw 266px 10vw 5vw; } .subpage_03 .sub_container_02 h5 { margin-bottom: 30px; font-size: 30px; } .subpage_03 .sub_container_02 h5::before { top: calc(-100vh - 30px); } .subpage_03 .sub_container_02 h6 { margin-bottom: 30px; font-size: 40px; } .subpage_03 .sub_container_02 p { font-size: 20px; } .subpage_04 .sub_container_01 { padding: 15vw 0; } .subpage_04 .sub_container_01 .inner { max-width: calc(100% - 20px); } .subpage_04 .sub_container_01 .search_wrap { margin-bottom: 100px; } .subpage_04 .sub_container_01 .search_wrap .top_bar { margin-bottom: 55px; padding-left: 257px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el { width: 245px; min-height: 60px; max-height: 60px; font-size: 16px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el label { height: 60px; line-height: 60px; padding-left: 30px; padding-right: 70px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el label:nth-child(2) { margin-top: 60px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el::after { top: 24px; right: 20px; width: 18px; height: 14px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el.expanded { border-radius: 30px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el.expanded::after { width: 19px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap { width: 300px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search { height: 60px; padding: 0 60px 0 20px; font-size: 16px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search::placeholder { font-size: 16px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search_btn { right: 20px; width: 28px; height: 28px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap { gap: 10px; max-width: 760px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap li { padding: 7px 25px; font-size: 16px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap li.on { padding-left: 50px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap li.on::before { left: 22px; width: 19px; height: 14px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap .bubble { bottom: -70px; padding: 15px 27px; font-size: 13px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap .bubble::before { top: -10px; left: 25px; width: 19px; height: 10px; } .subpage_04 .sub_container_01 .contents_wrap > ul { margin-bottom: 10vw; gap: 30px 10px; } .subpage_04 .sub_container_01 .contents_wrap > ul li { width: calc(33.33% - 6.7px); } .subpage_04 .sub_container_01 .contents_wrap > ul li a > img { height: calc(33.33vw - 13px); max-height: 387px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info { gap: 10px; margin-top: 14px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_title { gap: 14px; font-size: 16px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_title span { height: 30px; padding: 0 20px; font-size: 15px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_desc p { font-size: 16px; } .subpage_04 .sub_container_01 .contents_wrap .pagination { gap: 20px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group { gap: 10px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group:first-of-type, .subpage_04 .sub_container_01 .contents_wrap .pagination_group:last-of-type { gap: 5px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li:not(.unit) { min-width: 40px; height: 40px; line-height: 36px; padding: 0 10px; font-size: 16px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li.unit { width: 40px; height: 40px; } .subpage_05 .sub_container_01 { padding: 15vw 0; } .subpage_05 .sub_container_01 .contents .swiper { max-width: 100%; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 { width: calc(100% - 60px); margin: 0 auto; margin-bottom: 5vw; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box { padding-bottom: 10vw; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_img { width: 360px; height: 50vw; min-height: 400px; max-height: 512px; border-radius: 25px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc { margin-top: 50px; margin-left: 60px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6 { margin-bottom: 20px; gap: 10px; font-size: 36px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6::before { top: 6px; left: -20px; width: 6px; height: 30px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6 span { margin-bottom: 7px; font-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > p { margin-bottom: 48px; font-size: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec { gap: 10px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li { gap: 15px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li span { width: 120px; height: 40px; font-size: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li p { margin-top: 6px; font-size: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option { top: 70%; left: 420px; gap: 0 7px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev, .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next { width: 35px; height: 35px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev::before, .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next::before { width: 9px; height: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .count { width: 70px; font-size: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .guide_text { margin-top: 20px; padding-left: 42px; font-size: 18px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .guide_text::before { top: -2px; width: 30px; height: 30px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper { width: calc(100% - 30px); max-width: calc(100% - 30px); height: 20%; margin-left: 30px; padding-bottom: 30px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-slide { width: 30vw; height: 46vw; padding-top: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-slide-thumb-active::before { width: 130px; height: 40px; line-height: 40px; padding-left: 55px; font-size: 18px; background-position: 23px 50%; background-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text { left: 30px; bottom: 30px; gap: 5px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text h6 { font-size: 24px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text p { font-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-pagination { left: 45px; width: calc(100% - 120px); height: 3px; } .subpage_policy .sub_container_01 { padding: 15vw 0; } .subpage_policy .sub_container_01 h6 { margin-bottom: 30px; padding-left: 25px; font-size: 40px; } .subpage_policy .sub_container_01 h6::before { width: 6px; height: 40px; } .subpage_policy .sub_container_01 p { font-size: 18px; } .subpage_join .container_01 { min-height: calc(100vh - 326px); padding-top: 89px; } .subpage_join .container_01 .join_wrap { padding: 15vw 0; } .subpage_join .container_01 .join_wrap .join h3 { margin-bottom: 45px; font-size: 60px; } .subpage_join .container_01 .join_wrap .join .step_img { margin-bottom: 80px; } .subpage_join .container_01 .join_wrap .join .step_img p { margin-top: 25px; font-size: 20px; } .subpage_join .container_01 .join_wrap .join ul { max-width: 96%; } .subpage_join .container_01 .join_wrap .join ul li { gap: 30px; } .subpage_join .container_01 .join_wrap .join ul li h6 { font-size: 30px; } .subpage_join .container_01 .join_wrap .join ul li .text_wrap { height: 335px; } .subpage_join .container_01 .join_wrap .join ul li .text_wrap .text { padding: 30px; font-size: 22px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap { height: 28px; gap: 12px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap .input_checkbox { width: 34px; height: 34px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap .input_checkbox + label { height: 28px; line-height: 28px; font-size: 20px; } .subpage_join .container_01 .join_wrap .join ul li .join_btn { width: 522px; height: 92px; margin-top: 54px; font-size: 26px; } .subpage_join .container_01 .join_wrap .join_congratulate p { margin: 40px 0 80px 0; font-size: 26px; } .subpage_join .container_01 .join_wrap .join_congratulate a { width: 523px; height: 92px; font-size: 26px; } .subpage_06 .follow_ul .tab_base { gap: 15px; } .subpage_06 .container_01::before { bottom: -150px; height: 300px; } .subpage_06 .container_01 .con1_title h3 { gap: 10px; margin-bottom: 30px; } .subpage_06 .container_01 .con1_title p { font-size: 20px; } .subpage_06 .container_01 .con1_swiper { height: 600px; } .subpage_06 .sub_container_01 { padding: 50px 30px 0 30px; } .subpage_06 .sub_container_01 .tab_base { width: 100%; margin-bottom: 10vw; } .subpage_06 .sub_container_01 .tab_base li { height: 90px; font-size: 27px; } .subpage_06 .panel_base_inner { padding: 0 30px 15vw 30px; max-width: 100%; margin: 0 auto; padding-bottom: 15vw; } .subpage_06 .panel_base_inner .inner_title { margin-bottom: 60px; padding-top: 45px; } .subpage_06 .panel_base_inner .inner_title::before { width: 60px; height: 5px; } .subpage_06 .panel_base_inner .inner_title.mgb200 { margin-bottom: 15vw; } .subpage_06 .panel_base_inner .inner_title h6 { margin-bottom: 40px; font-size: 46px; } .subpage_06 .panel_base_inner .inner_title p { font-size: 20px; } .subpage_06 .panel_base_inner .inner_title p b { margin-bottom: 40px; font-size: 20px; } .subpage_06 .panel_base_inner .inner_title .desc_text { gap: 15px; } .subpage_06 .panel_base_inner .inner_title .desc_text span { font-size: 20px; } .subpage_06 .panel_base_inner .contents_list { margin-bottom: 15vw; } .subpage_06 .panel_base_inner .contents_list li { margin-bottom: 20px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type { margin-bottom: 32px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type b { gap: 6px; font-size: 28px; } .subpage_06 .panel_base_inner .contents_list li h6 { height: 48px; margin-bottom: 8px; padding: 0 20px; font-size: 20px; } .subpage_06 .panel_base_inner .contents_list li p { font-size: 20px; } .subpage_06 .panel_base_inner .swiper_wrap { margin-bottom: 15vw; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-prev, .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-next { top: 30%; width: 40px; height: 40px; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-prev { left: -20px; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-next { right: -20px; } .subpage_06 .panel_base_inner .sub_swiper { padding-bottom: 0; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide { width: 36vw; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box { gap: 20px; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box_desc p { font-size: 18px; } .subpage_06 .panel_base_inner .over_container { height: 42vw; margin-bottom: 15vw; } .subpage_06 .panel_base_inner .over_container .over_swiper_wrap .swiper-pagination { margin-top: 30px; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide { width: 25vw; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide .box_desc { left: 25px; bottom: 25px; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide .box_desc h6 { font-size: 25px; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide .box_desc p { font-size: 16px; } .subpage_06 .panel_base_inner .inner_contents_01 { margin-bottom: 15vw; padding: 7vw 0; } .subpage_06 .panel_base_inner .inner_contents_01 > h6 { margin-bottom: 40px; font-size: 20px; } .subpage_06 .panel_base_inner .inner_contents_01 > h3 { margin-bottom: 60px; font-size: 46px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap { gap: 10px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle { gap: 15px; width: 26vw; height: 26vw; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle h6 { font-size: 20px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle h5 { font-size: 28px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle p { min-height: 80px; font-size: 16px; } .subpage_06 .panel_base_inner .inner_contents_02 { margin-bottom: 15vw; } .subpage_06 .panel_base_inner .inner_contents_03 { margin-bottom: 15vw; padding: 10vw 6vw 10vw 6vw; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title { margin-bottom: 0; padding-top: 45px; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title p { margin-bottom: 7vw; } } @media screen and (max-width: 992px) { .subpage .sub_container .contents_title_01 { margin-bottom: 10px; font-size: 26px; } .subpage .sub_container .contents_title_02 { margin-bottom: 12px; font-size: 45px; } .subpage .sub_container .contents_title_03 { margin-bottom: 17px; font-size: 20px; } .subpage .sub_container .contents_title_04 { margin-bottom: 27px; padding-left: 19px; font-size: 20px; } .subpage .sub_container .contents_title_05 { padding: 12px 40px; font-size: 20px; } .subpage_01 .sub_container_01 .inner { gap: 40px; } .subpage_01 .sub_container_01 .information_wrap { gap: 20px; } .subpage_01 .sub_container_01 .information_wrap .info_icon { width: 180px; height: 180px; } .subpage_01 .sub_container_01 .information_wrap .info_icon > img { margin-top: -10px; } .subpage_01 .sub_container_01 .information_wrap .info_icon span { margin-top: -3px; font-size: 20px; } .subpage_01 .sub_container_01 .information_wrap .info_desc { gap: 10px; width: 475px; height: 130px; margin-left: -50px; padding-left: 70px; border-radius: 0 100px 100px 0; } .subpage_01 .sub_container_01 .information_wrap .info_desc h6 { font-size: 30px; } .subpage_01 .sub_container_01 .information_wrap .info_desc p { font-size: 20px; } .subpage_01 .sub_container_01 .contents_title { margin-top: 60px; } .subpage_01 .sub_container_02 { padding: 15vw 15px 15vw 15px; } .subpage_01 .sub_container_02::before { height: 650px; } .subpage_01 .sub_container_02 .contents_title { margin-bottom: 15vw; } .subpage_01 .sub_container_02 .contents_title_01 { margin-bottom: 15px; } .subpage_01 .sub_container_02 .contents_title_02 { margin-bottom: 22px; font-size: 45px; } .subpage_01 .sub_container_02 .contents_title_03 { font-size: 20px; } .subpage_01 .sub_container_02 .tab_base { align-items: center; gap: 10px; height: auto; margin-bottom: 30px; padding-bottom: 10vw; } .subpage_01 .sub_container_02 .tab_base li a { width: 14vw; padding: calc(14vw + 10px) 7px calc(14vw + 2px) 7px; border-radius: 100px 100px; } .subpage_01 .sub_container_02 .tab_base li a .icon { top: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); background-size: calc(14vw - 22px); } .subpage_01 .sub_container_02 .tab_base li a .icon::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% + 4px); height: calc(100% + 4px); } .subpage_01 .sub_container_02 .tab_base li a .icon::after { width: calc(100% + 22px); height: calc(100% + 22px); } .subpage_01 .sub_container_02 .tab_base li a .inner_box { margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title h6 { min-height: 47px; font-size: 20px; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title p { font-size: 0; } .subpage_01 .sub_container_02 .tab_base li a .inner_box .desc_box { position: absolute; left: 50%; bottom: 123px; transform: translate(-50%, 0); display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px; height: 0; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box .desc_box li { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; height: 36px; padding-right: 30px; color: #00bcd5; font-size: 0; white-space: nowrap; font-weight: 600; background-color: transparent; border-radius: 40px; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a .inner_box .desc_box li span { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 89px; height: 100%; margin-right: 17px; color: #fff; background-color: transparent; border-radius: 40px; } .subpage_01 .sub_container_02 .tab_base li a .icon_arrow { bottom: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li a:hover { width: 14vw; padding: calc(14vw + 10px) 7px calc(14vw + 2px) 7px; border-radius: 100px 100px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon { top: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); background-size: calc(14vw - 22px); } .subpage_01 .sub_container_02 .tab_base li a:hover .icon::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% + 4px); height: calc(100% + 4px); } .subpage_01 .sub_container_02 .tab_base li a:hover .icon::after { width: calc(100% + 22px); height: calc(100% + 22px); } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box { margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title h6 { min-height: 47px; font-size: 20px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title p { font-size: 0; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box .desc_box { position: absolute; left: 50%; bottom: 123px; transform: translate(-50%, 0); display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px; height: 0; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box .desc_box li { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; height: 36px; padding-right: 30px; color: #00bcd5; font-size: 0; white-space: nowrap; font-weight: 600; background-color: transparent; border-radius: 40px; transition: all 0.5s; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box .desc_box li span { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 89px; height: 100%; margin-right: 17px; color: #fff; background-color: transparent; border-radius: 40px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon_arrow { bottom: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li a:hover::before, .subpage_01 .sub_container_02 .tab_base li a:hover::after { display: none; } .subpage_01 .sub_container_02 .tab_base li.on a { width: 30vw; padding: calc(10vw + 30px) 7px calc(5vw + 120px) 7px; border-radius: 35px; } .subpage_01 .sub_container_02 .tab_base li.on a .icon { top: calc(-10vw + 11px); width: calc(20vw - 22px); height: calc(20vw - 22px); background-size: calc(20vw - 22px); } .subpage_01 .sub_container_02 .tab_base li.on a .icon::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% + 4px); height: calc(100% + 4px); } .subpage_01 .sub_container_02 .tab_base li.on a .icon::after { width: calc(100% + 22px); height: calc(100% + 22px); opacity: 1; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box { margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box_title h6 { min-height: 59px; font-size: 28px; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box_title p { font-size: 20px; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box .desc_box { bottom: calc(5vw + 10px); gap: 10px; height: 70px; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box .desc_box li { height: 30px; padding-right: 30px; font-size: 16px; background-color: #f0f0f0; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box .desc_box li span { width: 80px; height: 100%; margin-right: 17px; background-color: #00bcd5; } .subpage_01 .sub_container_02 .tab_base li.on a .icon_arrow { bottom: calc(-5vw + 11px); width: calc(10vw - 22px); height: calc(10vw - 22px); margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li.on a .icon_arrow::before { opacity: 1; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title { flex-direction: column; align-items: center; justify-content: center; gap: 10px; margin-left: initial; margin-bottom: 45px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title h6 { padding-left: 25px; font-size: 40px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title h6::before { width: 7px; height: 40px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title span { font-size: 20px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor { flex-direction: column; gap: 20px; margin-top: 220px; margin-bottom: 30px; padding: 40px; border-radius: 30px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_img { width: 250px; height: 250px; margin-top: -230px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_img a { right: -15px; bottom: 0; height: 40px; padding: 0 20px; font-size: 18px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner { flex: initial; width: 100%; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title { gap: 10px; margin-bottom: 10px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title h6 { font-size: 30px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title span { margin-bottom: 2px; font-size: 18px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td { padding: 14px 0; font-size: 16px; vertical-align: middle; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th > img, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td > img { width: 30px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th:last-of-type > img, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td:last-of-type > img { width: 20px; } .subpage_01 .sub_container_03 .contents_title { margin-bottom: 75px; } .subpage_01 .sub_container_03 .contents_title_01 { margin-bottom: 15px; } .subpage_01 .sub_container_03 .contents_title_02 { margin-bottom: 10px; font-size: 45px; } .subpage_01 .sub_container_03 .contents_title_03 { font-size: 20px; } .subpage_01 .sub_container_03 .tab_base { width: 500px; margin-left: initial; margin: 0 auto; } .subpage_01 .sub_container_03 .tab_base li a { padding: 20px 0 25px 0; } .subpage_01 .sub_container_03 .tab_base li a::before { top: 38px; left: -24px; width: 6px; height: 6px; } .subpage_01 .sub_container_03 .tab_base li a h6 { width: 97px; margin-right: 20px; font-size: 36px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info { gap: 7px 0; margin-top: 5px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info span { padding: 0 15px; font-size: 18px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info span::before { width: 2px; height: 12px; } .subpage_01 .sub_container_03 .tab_base .noti { margin-top: 20px; margin-left: initial; padding-left: 33px; font-size: 16px; } .subpage_01 .sub_container_03 .tab_base .noti::before { top: -3px; width: 25px; height: 25px; } .subpage_01 .sub_container_03 .panel_base_inner { margin-top: 100px; } .subpage_01 .sub_container_03 .panel_base_inner .title { margin-bottom: 75px; } .subpage_01 .sub_container_03 .panel_base_inner .title > span { margin-bottom: 7px; font-size: 20px; } .subpage_01 .sub_container_03 .panel_base_inner .title h4 .text { margin: 0 30px; font-size: 40px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap { gap: 60px 10px; width: calc(100% - 60px); margin: 0 30px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box { gap: 20px; width: calc(33.33% - 7px); } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc { gap: 10px; padding-left: 10px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc h6 { font-size: 24px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc p { font-size: 14px; } .subpage_01 .sub_container_04 .contents_title { margin-bottom: 35px; } .subpage_01 .sub_container_04 .contents_title_01 { margin-bottom: 10px; } .subpage_01 .sub_container_04 .contents_title_02 { margin-bottom: 10px; font-size: 45px; } .subpage_01 .sub_container_04 .contents_title_03 { margin-bottom: 30px; font-size: 20px; } .subpage_01 .sub_container_04 .map .map_api { height: 40vh; } .subpage_01 .sub_container_04 .map_contents { width: 85%; margin-top: -80px; padding: 50px 0 50px 0; } .subpage_01 .sub_container_04 .map_contents .address_box { gap: 10px; margin-bottom: 20px; } .subpage_01 .sub_container_04 .map_contents .address_box h6 { font-size: 20px; } .subpage_01 .sub_container_04 .map_contents .address_box p { font-size: 16px; } .subpage_01 .sub_container_04 .map_contents ul { gap: 10px; } .subpage_01 .sub_container_04 .map_contents ul li { height: 52px; } .subpage_01 .sub_container_04 .map_contents ul li a { padding-left: 63px; padding-right: 22px; font-size: 18px; } .subpage_01 .sub_container_04 .map_contents ul li a > img { top: 4px; left: 4px; } .subpage_01 .sub_container_04 .map_contents ul .bubble { left: 324px; bottom: -117px; width: 300px; height: 90px; padding: 0 20px; font-size: 18px; } .subpage_01 .sub_container_04 .map_contents ul .bubble::before { top: -15px; left: 34px; width: 19px; height: 15px; } .subpage_02 .follow_ul { top: 110px; gap: 20px; padding: 0 0 0 39px; } .subpage_02 .follow_ul .tab_base { gap: 20px; } .subpage_02 .follow_ul .bubble { height: 60px; margin-bottom: 20px; padding: 8px 20px; font-size: 18px; } .subpage_02 .follow_ul .bubble::after { left: 34px; bottom: -13px; width: 19px; height: 13px; } .subpage_02 .follow_ul li { width: 70px; height: 70px; padding: 10px; } .subpage_02 .follow_ul li a { font-size: 14px; } .subpage_02 .follow_ul li a > img { width: 50px; height: 50px; margin-right: 29px; } .subpage_02 .follow_ul li.on { width: 250px; } .subpage_02 .follow_ul li.on a { padding-right: 22px; } .subpage_02 .follow_ul li.on a p { font-size: 18px; } .subpage_02 .follow_ul li.on a::before { right: -2px; width: 50px; height: 50px; } .subpage_02 .follow_ul li:nth-of-type(3).on { width: 300px; } .subpage_02 .follow_ul li:nth-of-type(4).on { width: 260px; } .subpage_02 .follow_ul li:nth-of-type(5).on { width: 260px; } .subpage_02 .sub_container_02 .sub_container_title h4 { font-size: 40px; } .subpage_02 .sub_container_02 .sub_container_title p { font-size: 16px; } .subpage_03 .container_01::before { bottom: -100px; height: 200px; } .subpage_03 .container_01 .con1_title h3 { gap: 10px; margin-bottom: 30px; } .subpage_03 .container_01 .con1_title p { font-size: 20px; } .subpage_03 .container_01 .con1_swiper { height: 600px; } .subpage_03 .sub_container_01 .main_title { margin-bottom: 20vw; } .subpage_03 .sub_container_01 .main_title h3 { margin-bottom: 58px; padding-bottom: 48px; font-size: 40px; } .subpage_03 .sub_container_01 .main_title h3::before { width: 40px; height: 4px; } .subpage_03 .sub_container_01 .main_title p { font-size: 16px; } .subpage_03 .sub_container_01 .box_wrap { margin-bottom: 10vw; } .subpage_03 .sub_container_01 .box_wrap .box { width: calc(100% - 400px + 250px + 250px); margin-top: 150px; margin-left: -250px; } .subpage_03 .sub_container_01 .box_wrap .box_img { width: 300px; margin-right: -250px; } .subpage_03 .sub_container_01 .box_wrap .box_text { padding: 10vw 20px 10vw calc(250px + 5vw); } .subpage_03 .sub_container_01 .box_wrap .box_text h6 { margin-bottom: 58px; padding-bottom: 48px; font-size: 26px; } .subpage_03 .sub_container_01 .box_wrap .box_text h6::before { width: 40px; height: 4px; } .subpage_03 .sub_container_01 .box_wrap .box_text p { font-size: 13px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box { width: calc(100% - 400px + 260px + 260px); margin-top: 144px; margin-left: 0; margin-right: -260px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_img { margin-left: -260px; margin-right: 0; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_text { padding: 10vw 266px 10vw 5vw; } .subpage_03 .sub_container_02 h5 { margin-bottom: 30px; font-size: 20px; } .subpage_03 .sub_container_02 h5::before { top: calc(-100vh - 30px); } .subpage_03 .sub_container_02 h6 { margin-bottom: 30px; font-size: 30px; } .subpage_03 .sub_container_02 p { font-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box { padding-bottom: 145px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_img { width: 300px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc { width: calc(100% - 350px); margin-top: 40px; margin-left: 50px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6 { margin-bottom: 10px; gap: 10px; font-size: 30px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6::before { top: 6px; left: -15px; width: 5px; height: 25px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6 span { margin-bottom: 6px; font-size: 13px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > p { margin-bottom: 20px; font-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec { gap: 10px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li { gap: 15px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li span { width: 100px; height: 30px; font-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li p { margin-top: 6px; font-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option { top: initial; left: 50%; bottom: 0; transform: translate(-50%, 0); justify-content: center; gap: 0 7px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev, .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next { width: 35px; height: 35px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev::before, .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next::before { width: 9px; height: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .count { width: 70px; font-size: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .guide_text { margin-top: 20px; padding-left: 32px; font-size: 18px; text-align: center; white-space: nowrap; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .guide_text::before { top: -2px; width: 30px; height: 30px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper { width: calc(100% - 30px); max-width: calc(100% - 30px); height: 20%; margin-left: 30px; padding-bottom: 30px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-slide { width: 30vw; height: 46vw; padding-top: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-slide-thumb-active::before { width: 130px; height: 40px; line-height: 40px; padding-left: 55px; font-size: 18px; background-position: 23px 50%; background-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img { height: 46vh; min-height: 333px; max-height: 430px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text { left: 20px; bottom: 30px; gap: 5px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text h6 { font-size: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text p { font-size: 13px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-pagination { left: 45px; width: calc(100% - 120px); height: 3px; } .subpage_join .container_01 .join_wrap .join h3 { margin-bottom: 45px; font-size: 50px; } .subpage_join .container_01 .join_wrap .join .step_img { margin-bottom: 80px; } .subpage_join .container_01 .join_wrap .join .step_img p { margin-top: 25px; font-size: 20px; } .subpage_join .container_01 .join_wrap .join ul { max-width: 100%; padding: 0 30px; } .subpage_join .container_01 .join_wrap .join ul li { gap: 30px; } .subpage_join .container_01 .join_wrap .join ul li h6 { font-size: 30px; } .subpage_join .container_01 .join_wrap .join ul li .text_wrap { height: 300px; } .subpage_join .container_01 .join_wrap .join ul li .text_wrap .text { padding: 30px; font-size: 16px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap { height: 28px; gap: 12px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap .input_checkbox { width: 24px; height: 24px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap .input_checkbox + label { height: 28px; line-height: 28px; font-size: 20px; } .subpage_join .container_01 .join_wrap .join ul li .join_btn { width: 500px; height: 65px; margin-top: 54px; font-size: 20px; } .subpage_join .container_01 .join_wrap .join_congratulate p { margin: 40px 0 80px 0; font-size: 20px; } .subpage_join .container_01 .join_wrap .join_congratulate a { width: 500px; height: 65px; font-size: 20px; } .subpage_join_info .container_01 { padding-top: 89px; } .subpage_join_info .container_01 .join_info_wrap { padding: 15vw 0; } .subpage_join_info .container_01 .join_info_wrap .join_info { max-width: 96%; } .subpage_join_info .container_01 .join_info_wrap .join_info h3 { margin-bottom: 20px; padding-left: initial; font-size: 50px; } .subpage_join_info .container_01 .join_info_wrap .join_info .step_img { padding-left: initial; margin-bottom: 50px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul { max-width: 500px; gap: 25px; margin: 0 auto; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; gap: 10px; width: 100%; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li h6 { align-items: flex-start; width: auto; height: initial; padding-right: initial; font-size: 20px; text-align: left; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li.custom h6 { height: 38px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li.custom .input_wrap { min-height: 38px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap { flex: initial; width: 100%; min-height: 60px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .input_text { min-height: 60px; padding: 0 15px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap p { font-size: 16px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap p.guide_text { font-size: 16px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap.for_checkbox { min-height: 38px; gap: 10px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .input_checkbox { width: 26px; height: 26px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .input_checkbox + label { height: 26px; line-height: 26px; font-size: 16px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .box { width: 198px; height: 65px; } .subpage_join_info .container_01 .join_info_wrap .join_info .btn_wrap { width: 100%; gap: 10px; margin-top: 80px; } .subpage_join_info .container_01 .join_info_wrap .join_info .btn_wrap .btn { height: 65px; font-size: 16px; } .subpage_06 .sub_container_01 .tab_base li { height: 60px; font-size: 22px; } .subpage_06 .panel_base_inner .inner_title { margin-bottom: 50px; padding-top: 25px; } .subpage_06 .panel_base_inner .inner_title::before { width: 50px; height: 4px; } .subpage_06 .panel_base_inner .inner_title h6 { margin-bottom: 25px; font-size: 36px; } .subpage_06 .panel_base_inner .inner_title h6.sub_title { font-size: 30px; } .subpage_06 .panel_base_inner .inner_title p { font-size: 16px; } .subpage_06 .panel_base_inner .inner_title p b { margin-bottom: 40px; font-size: 16px; } .subpage_06 .panel_base_inner .inner_title .desc_text { gap: 15px; } .subpage_06 .panel_base_inner .inner_title .desc_text span { font-size: 16px; } .subpage_06 .panel_base_inner .contents_list li { margin-bottom: 20px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type { margin-bottom: 20px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type b { font-size: 26px; } .subpage_06 .panel_base_inner .contents_list li h6 { height: 48px; margin-bottom: 8px; padding: 0 20px; font-size: 16px; } .subpage_06 .panel_base_inner .contents_list li p { font-size: 16px; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box { gap: 15px; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box_desc p { font-size: 14px; } .subpage_06 .panel_base_inner .inner_contents_01 { margin-bottom: 15vw; padding: 7vw 0; } .subpage_06 .panel_base_inner .inner_contents_01 > h6 { line-height: 1.4; margin-bottom: 40px; font-size: 20px; text-align: center; } .subpage_06 .panel_base_inner .inner_contents_01 > h3 { margin-bottom: 40px; font-size: 46px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap { flex-direction: column; gap: 20px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap > img { transform: rotate(90deg); } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle { gap: 15px; width: 35vw; height: 35vw; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle h6 { font-size: 20px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle h5 { font-size: 28px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle p { min-height: 80px; font-size: 16px; } .subpage_06 .panel_base_inner .inner_contents_02 { margin-bottom: 15vw; } .subpage_06 .panel_base_inner .inner_contents_03 { margin-bottom: 15vw; padding: 10vw 6vw 10vw 6vw; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title { margin-bottom: 0; padding-top: 45px; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title p { margin-bottom: 7vw; } } @media screen and (max-width: 768px) { .subpage .sub_container .contents_title_01 { margin-bottom: 10px; font-size: 16px; } .subpage .sub_container .contents_title_02 { margin-bottom: 12px; font-size: 35px; } .subpage .sub_container .contents_title_03 { margin-bottom: 17px; font-size: 16px; } .subpage .sub_container .contents_title_04 { margin-bottom: 27px; padding-left: 19px; font-size: 16px; } .subpage .sub_container .contents_title_05 { padding: 12px 40px; font-size: 16px; } .subpage .container_01 .con1_title { top: 55%; } .subpage .container_01 .con1_title h3 { margin-bottom: 20px; font-size: 40px; } .subpage .container_01 .con1_title h3 span { margin-left: 3px; font-size: 16px; } .subpage .container_01 .con1_title p { font-size: 16px; } .subpage .container_01 .con1_swiper { height: 60vh; min-height: 380px; } .subpage .container_01 .con1_swiper .swiper-slide > img { height: 60vh; } .subpage_01 .sub_container_01 .inner { gap: 40px; } .subpage_01 .sub_container_01 .information_wrap { gap: 20px; width: 100%; } .subpage_01 .sub_container_01 .information_wrap .info { width: 100%; } .subpage_01 .sub_container_01 .information_wrap .info_icon { width: 180px; height: 180px; } .subpage_01 .sub_container_01 .information_wrap .info_icon > img { margin-top: -10px; } .subpage_01 .sub_container_01 .information_wrap .info_icon span { margin-top: -3px; font-size: 20px; } .subpage_01 .sub_container_01 .information_wrap .info_desc { gap: 10px; width: calc(100% - 180px); height: 130px; margin-left: -50px; padding-left: 70px; border-radius: 0 100px 100px 0; } .subpage_01 .sub_container_01 .information_wrap .info_desc h6 { font-size: 24px; } .subpage_01 .sub_container_01 .information_wrap .info_desc p { font-size: 16px; } .subpage_01 .sub_container_01 .contents_title { margin-top: 60px; } .subpage_01 .sub_container_02::before { height: 450px; } .subpage_01 .sub_container_02 .contents_title { margin-bottom: 15vw; } .subpage_01 .sub_container_02 .contents_title_01 { margin-bottom: 15px; } .subpage_01 .sub_container_02 .contents_title_02 { margin-bottom: 22px; font-size: 45px; } .subpage_01 .sub_container_02 .contents_title_03 { font-size: 20px; } .subpage_01 .sub_container_02 .tab_base { align-items: center; gap: 10px; height: auto; margin-bottom: 30px; padding-bottom: 10vw; } .subpage_01 .sub_container_02 .tab_base li a { width: 14vw; padding: calc(14vw + 10px) 7px calc(14vw + 2px) 7px; } .subpage_01 .sub_container_02 .tab_base li a .icon { top: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); background-size: calc(14vw - 22px); } .subpage_01 .sub_container_02 .tab_base li a .icon::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% + 4px); height: calc(100% + 4px); } .subpage_01 .sub_container_02 .tab_base li a .icon::after { width: calc(100% + 22px); height: calc(100% + 22px); } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title h6 { min-height: 35px; font-size: 16px; } .subpage_01 .sub_container_02 .tab_base li a .icon_arrow { bottom: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li a:hover { width: 14vw; padding: calc(14vw + 10px) 7px calc(14vw + 2px) 7px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon { top: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); background-size: calc(14vw - 22px); } .subpage_01 .sub_container_02 .tab_base li a:hover .icon::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% + 4px); height: calc(100% + 4px); } .subpage_01 .sub_container_02 .tab_base li a:hover .icon::after { width: calc(100% + 22px); height: calc(100% + 22px); } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title h6 { min-height: 35px; font-size: 16px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon_arrow { bottom: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li a:hover::before, .subpage_01 .sub_container_02 .tab_base li a:hover::after { display: none; } .subpage_01 .sub_container_02 .tab_base li.on a { width: 30vw; padding: calc(10vw + 30px) 7px calc(5vw + 120px) 7px; border-radius: 35px; } .subpage_01 .sub_container_02 .tab_base li.on a .icon { top: calc(-10vw + 11px); width: calc(20vw - 22px); height: calc(20vw - 22px); background-size: calc(20vw - 22px); } .subpage_01 .sub_container_02 .tab_base li.on a .icon::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% + 4px); height: calc(100% + 4px); } .subpage_01 .sub_container_02 .tab_base li.on a .icon::after { width: calc(100% + 22px); height: calc(100% + 22px); opacity: 1; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box { margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box_title h6 { min-height: 59px; font-size: 28px; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box_title p { font-size: 20px; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box .desc_box { bottom: calc(5vw + 10px); gap: 10px; height: 70px; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box .desc_box li { height: 30px; padding-right: 20px; font-size: 13px; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box .desc_box li span { width: 70px; margin-right: 12px; } .subpage_01 .sub_container_02 .tab_base li.on a .icon_arrow { bottom: calc(-5vw + 11px); width: calc(10vw - 22px); height: calc(10vw - 22px); margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li.on a .icon_arrow::before { opacity: 1; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title { flex-direction: column; align-items: center; justify-content: center; gap: 10px; margin-left: initial; margin-bottom: 45px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title h6 { padding-left: 25px; font-size: 40px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title h6::before { width: 7px; height: 40px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title span { font-size: 20px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor { flex-direction: column; gap: 20px; margin-top: 220px; margin-bottom: 30px; padding: 40px; border-radius: 30px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_img { width: 250px; height: 250px; margin-top: -230px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_img a { right: -15px; bottom: 0; height: 40px; padding: 0 20px; font-size: 18px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner { flex: initial; width: 100%; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title { gap: 10px; margin-bottom: 10px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title h6 { font-size: 30px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title span { margin-bottom: 2px; font-size: 18px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td { padding: 14px 0; font-size: 16px; vertical-align: middle; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th > img, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td > img { width: 30px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th:last-of-type > img, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td:last-of-type > img { width: 20px; } .subpage_01 .sub_container_03 .contents_title { margin-bottom: 75px; } .subpage_01 .sub_container_03 .contents_title_01 { margin-bottom: 15px; } .subpage_01 .sub_container_03 .contents_title_02 { margin-bottom: 10px; font-size: 45px; } .subpage_01 .sub_container_03 .contents_title_03 { font-size: 20px; } .subpage_01 .sub_container_03 .tab_base { width: 500px; margin-left: initial; margin: 0 auto; } .subpage_01 .sub_container_03 .tab_base li a { padding: 20px 0 25px 0; } .subpage_01 .sub_container_03 .tab_base li a::before { top: 38px; left: -24px; width: 6px; height: 6px; } .subpage_01 .sub_container_03 .tab_base li a h6 { width: 97px; margin-right: 20px; font-size: 36px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info { gap: 7px 0; margin-top: 5px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info span { padding: 0 15px; font-size: 18px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info span::before { width: 2px; height: 12px; } .subpage_01 .sub_container_03 .tab_base .noti { margin-top: 20px; margin-left: initial; padding-left: 33px; font-size: 16px; } .subpage_01 .sub_container_03 .tab_base .noti::before { top: -3px; width: 25px; height: 25px; } .subpage_01 .sub_container_03 .panel_base_inner { margin-top: 100px; } .subpage_01 .sub_container_03 .panel_base_inner .title { margin-bottom: 10vw; } .subpage_01 .sub_container_03 .panel_base_inner .title > span { margin-bottom: 7px; font-size: 16px; } .subpage_01 .sub_container_03 .panel_base_inner .title h4 .text { margin: 0 30px; font-size: 30px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap { gap: 40px 10px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box { gap: 10px; width: calc(50% - 5px); } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box > img { width: calc(50vw - 25px); height: calc(50vw - 25px); } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc { gap: 10px; padding-left: 10px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc h6 { font-size: 20px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc p { font-size: 14px; } .subpage_01 .sub_container_04 .contents_title { margin-bottom: 35px; } .subpage_01 .sub_container_04 .contents_title_01 { margin-bottom: 10px; } .subpage_01 .sub_container_04 .contents_title_02 { margin-bottom: 10px; font-size: 35px; } .subpage_01 .sub_container_04 .contents_title_03 { margin-bottom: 30px; font-size: 16px; } .subpage_01 .sub_container_04 .map .map_api { height: 40vh; } .subpage_01 .sub_container_04 .map_contents { width: 85%; margin-top: -80px; padding: 50px 0 50px 0; } .subpage_01 .sub_container_04 .map_contents .address_box { gap: 10px; margin-bottom: 20px; } .subpage_01 .sub_container_04 .map_contents .address_box h6 { font-size: 20px; text-align: center; } .subpage_01 .sub_container_04 .map_contents .address_box p { font-size: 16px; } .subpage_01 .sub_container_04 .map_contents ul { gap: 5px; } .subpage_01 .sub_container_04 .map_contents ul li { height: 45px; } .subpage_01 .sub_container_04 .map_contents ul li a { padding-left: 50px; padding-right: 22px; font-size: 16px; } .subpage_01 .sub_container_04 .map_contents ul li a > img { top: 50%; left: 4px; transform: translate(0, -50%); width: 35px; height: 35px; } .subpage_01 .sub_container_04 .map_contents ul .bubble { left: 50%; bottom: -100px; transform: translate(-50%, 0); width: 250px; height: 70px; padding: 0 20px; font-size: 14px; } .subpage_01 .sub_container_04 .map_contents ul .bubble::before { top: -14px; left: 50%; transform: translate(-50%, 0); width: 19px; height: 15px; } .subpage_02 .follow_ul { top: 110px; gap: 10px; padding: 0 0 0 10px; } .subpage_02 .follow_ul .tab_base { gap: 10px; } .subpage_02 .follow_ul .bubble { display: none; } .subpage_02 .follow_ul li { width: 70px; height: 70px; padding: 10px; } .subpage_02 .follow_ul li a { font-size: 14px; } .subpage_02 .follow_ul li a > img { width: 50px; height: 50px; margin-right: 29px; } .subpage_02 .follow_ul li.on { width: 70px; border: 2px solid #00bcd5; } .subpage_02 .follow_ul li.on a { padding-right: initial; } .subpage_02 .follow_ul li.on a p { display: none; } .subpage_02 .follow_ul li.on a::before { display: none; } .subpage_02 .follow_ul li:nth-of-type(3).on { width: 70px; } .subpage_02 .follow_ul li:nth-of-type(4).on { width: 70px; } .subpage_02 .follow_ul li:nth-of-type(5).on { width: 70px; } .subpage_02 .sub_container_02 .sub_container_title h6 { font-size: 20px; } .subpage_02 .sub_container_02 .sub_container_title h4 { font-size: 30px; } .subpage_02 .sub_container_02 .sub_container_title p { font-size: 13px; } .subpage_02 .sub_container_02 .con2_slider .slick-list { max-width: 100%; } .subpage_02 .sub_container_02 .con2_slider .item { margin-right: 10px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap > div p { padding: 7px 15px; font-size: 13px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap > div > img { height: 380px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul { padding: 20px 0; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul li:nth-of-type(1) { font-size: 13px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul li:nth-of-type(2) { margin: 10px 0; font-size: 20px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul li:nth-of-type(3) { font-size: 13px; } .subpage_02 .panel_base_inner .title { padding: 7vw 0; } .subpage_02 .panel_base_inner .title .icon { width: 100px; height: 100px; margin-bottom: 20px; } .subpage_02 .panel_base_inner .title .icon > img { width: 50px; } .subpage_02 .panel_base_inner .title h6 { font-size: 40px; } .subpage_02 .panel_base_inner .title p { font-size: 20px; } .subpage_02 .panel_base_inner .contents .portrait { width: 320px; } .subpage_02 .panel_base_inner .contents .portrait > div { height: 354px; } .subpage_02 .panel_base_inner .contents .portrait ul { padding: 40px 20px; } .subpage_02 .panel_base_inner .contents .portrait ul li:nth-of-type(1) { font-size: 14px; } .subpage_02 .panel_base_inner .contents .portrait ul li:nth-of-type(2) { font-size: 26px; } .subpage_02 .panel_base_inner .contents_inner { margin-top: 25px; margin-left: 30px; } .subpage_02 .panel_base_inner .contents_inner_title { margin-bottom: 20px; padding-left: 20px; font-size: 26px; } .subpage_02 .panel_base_inner .contents_inner_title::before { width: 4px; } .subpage_02 .panel_base_inner .contents_inner_desc { gap: 13px; margin-bottom: 5vw; } .subpage_02 .panel_base_inner .contents_inner_desc p { padding-left: 18px; font-size: 14px; } .subpage_02 .panel_base_inner .contents_inner_table table th, .subpage_02 .panel_base_inner .contents_inner_table table td { padding: 12px 0; font-size: 14px; } .subpage_02 .panel_base_inner .contents_inner_table table th > img, .subpage_02 .panel_base_inner .contents_inner_table table td > img { width: 30px; } .subpage_02 .panel_base_inner .contents_inner_table table th:last-of-type > img, .subpage_02 .panel_base_inner .contents_inner_table table td:last-of-type > img { width: 20px; } .subpage_03 .container_01::before { bottom: -70px; height: 140px; } .subpage_03 .container_01 .con1_title h3 { gap: 10px; margin-bottom: 30px; } .subpage_03 .container_01 .con1_title p { font-size: 16px; } .subpage_03 .container_01 .con1_swiper { height: 500px; } .subpage_03 .sub_container_01 .main_title { margin-bottom: 10vw; } .subpage_03 .sub_container_01 .main_title h3 { margin-bottom: 40px; padding-bottom: 30px; font-size: 30px; } .subpage_03 .sub_container_01 .main_title h3::before { width: 40px; height: 4px; } .subpage_03 .sub_container_01 .main_title p { font-size: 13px; } .subpage_03 .sub_container_01 .box_wrap { margin-bottom: 10vw; } .subpage_03 .sub_container_01 .box_wrap .box { width: calc(100% - 400px + 250px + 250px); margin-top: 150px; margin-left: -250px; } .subpage_03 .sub_container_01 .box_wrap .box_img { display: none; } .subpage_03 .sub_container_01 .box_wrap .box_text { align-items: center; padding: 10vw 20px 10vw 20px; border-radius: 20px 0 0 20px; } .subpage_03 .sub_container_01 .box_wrap .box_text h6 { margin-bottom: 58px; padding-bottom: 48px; font-size: 26px; } .subpage_03 .sub_container_01 .box_wrap .box_text h6::before { left: 50%; transform: translate(-50%, 0); width: 40px; height: 4px; } .subpage_03 .sub_container_01 .box_wrap .box_text p { font-size: 13px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box { width: calc(100% - 400px + 260px + 260px); margin-top: 144px; margin-left: 0; margin-right: -260px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_img { margin-left: -260px; margin-right: 0; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_text { align-items: center; padding: 10vw 5vw 10vw 5vw; border-radius: 0 20px 20px 0; } .subpage_03 .sub_container_02 h5 { margin-bottom: 30px; font-size: 20px; } .subpage_03 .sub_container_02 h5::before { top: calc(-100vh - 30px); } .subpage_03 .sub_container_02 h6 { margin-bottom: 30px; font-size: 30px; } .subpage_03 .sub_container_02 p { font-size: 16px; } .subpage_04 .sub_container_01 { padding: 15vw 0; } .subpage_04 .sub_container_01 .inner { max-width: calc(100% - 20px); } .subpage_04 .sub_container_01 .search_wrap { margin-bottom: 100px; } .subpage_04 .sub_container_01 .search_wrap .top_bar { margin-bottom: 20px; padding-left: 210px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el { width: 200px; min-height: 60px; max-height: 60px; font-size: 16px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el label { height: 60px; line-height: 60px; padding-left: 40px; padding-right: 70px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el label:nth-child(2) { margin-top: 60px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el::after { top: 24px; right: 20px; width: 18px; height: 14px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el.expanded::after { width: 19px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap { width: 300px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search { height: 60px; padding: 0 60px 0 20px; font-size: 16px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search::placeholder { font-size: 16px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search_btn { right: 20px; width: 28px; height: 28px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap { gap: 5px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap li { padding: 7px 25px; font-size: 13px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap li.on { padding-left: 50px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap li.on::before { left: 22px; width: 13px; height: 14px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap .bubble { bottom: -70px; padding: 15px 27px; font-size: 13px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap .bubble::before { top: -10px; left: 25px; width: 19px; height: 10px; } .subpage_04 .sub_container_01 .contents_wrap > ul { margin-bottom: 10vw; gap: 30px 10px; } .subpage_04 .sub_container_01 .contents_wrap > ul li { width: calc(33.33% - 6.7px); } .subpage_04 .sub_container_01 .contents_wrap > ul li a > img { height: calc(33.33vw - 13px); max-height: 387px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info { gap: 7px; margin-top: 10px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_title { gap: 14px; font-size: 13px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_title span { height: 28px; padding: 0 15px; font-size: 13px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_desc p { font-size: 13px; } .subpage_04 .sub_container_01 .contents_wrap .pagination { gap: 20px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group { gap: 5px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group:first-of-type, .subpage_04 .sub_container_01 .contents_wrap .pagination_group:last-of-type { gap: 5px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li:not(.unit) { min-width: 30px; height: 30px; line-height: 27px; padding: 0 10px; font-size: 13px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li.unit { width: 30px; height: 30px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box { flex-direction: column; align-items: center; justify-content: center; padding-bottom: 145px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_img { width: 50%; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc { width: calc(100% - 100px); margin-top: 40px; margin-left: 50px; margin-right: 50px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6 { margin-bottom: 10px; padding-left: 15px; gap: 10px; font-size: 30px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6::before { top: 6px; left: 0; width: 5px; height: 25px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6 span { margin-bottom: 6px; font-size: 13px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > p { margin-bottom: 20px; font-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec { gap: 10px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li { gap: 15px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li span { width: 100px; height: 30px; font-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li p { margin-top: 6px; font-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option { gap: 0 7px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev, .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next { width: 30px; height: 30px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev::before, .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next::before { width: 9px; height: 12px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .count { width: 50px; font-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .guide_text { margin-top: 20px; padding-left: 15px; font-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .guide_text::before { top: -1px; width: 20px; height: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper { width: calc(100% - 30px); max-width: calc(100% - 30px); height: 20%; margin-left: 30px; padding-bottom: 30px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-slide { width: 30vw; height: 46vw; padding-top: 15px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-slide-thumb-active::before { width: 100px; height: 30px; line-height: 30px; padding-left: 40px; font-size: 14px; background-position: 18px 50%; background-size: 13px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img { height: 42vw; min-height: initial; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text { left: 20px; bottom: 30px; gap: 5px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text h6 { font-size: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text p { font-size: 13px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-pagination { left: 45px; width: calc(100% - 120px); height: 3px; } .subpage_login .container_01 { padding-top: 69px; } .subpage_login .container_01 .login_wrap { padding: 15vw 0; } .subpage_login .container_01 .login_wrap .login { max-width: 400px; } .subpage_login .container_01 .login_wrap .login h3 { margin-bottom: 15px; font-size: 30px; } .subpage_login .container_01 .login_wrap .login ul { gap: 20px; } .subpage_login .container_01 .login_wrap .login ul li { gap: 10px; } .subpage_login .container_01 .login_wrap .login ul li h6 { font-size: 20px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap { height: 60px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .input_text { padding: 0 15px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .btn_show_pw { right: 20px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap.for_checkbox { height: 30px; gap: 10px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .input_checkbox { width: 30px; height: 30px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .input_checkbox + label { height: 30px; line-height: 30px; font-size: 18px; } .subpage_login .container_01 .login_wrap .login ul li .find_password { padding-right: 25px; font-size: 18px; } .subpage_login .container_01 .login_wrap .login ul li .find_password::before { width: 13px; height: 18px; } .subpage_login .container_01 .login_wrap .login ul li .login_btn { height: 60px; font-size: 22px; } .subpage_login .container_01 .login_wrap .login ul li.sns_link { gap: 20px; padding-top: 30px; } .subpage_login .container_01 .login_wrap .login ul li.sns_link p { font-size: 20px; } .subpage_login .container_01 .login_wrap .login ul li.sns_link .link_wrap { gap: 20px; } .subpage_join .container_01 { padding-top: 69px; } .subpage_join .container_01 .join_wrap .join h3 { margin-bottom: 45px; font-size: 40px; } .subpage_join .container_01 .join_wrap .join .step_img { margin-bottom: 80px; } .subpage_join .container_01 .join_wrap .join .step_img p { margin-top: 25px; font-size: 16px; } .subpage_join .container_01 .join_wrap .join ul { max-width: 100%; padding: 0 30px; } .subpage_join .container_01 .join_wrap .join ul li { gap: 20px; } .subpage_join .container_01 .join_wrap .join ul li h6 { font-size: 24px; } .subpage_join .container_01 .join_wrap .join ul li .text_wrap { height: 200px; } .subpage_join .container_01 .join_wrap .join ul li .text_wrap .text { padding: 30px; font-size: 16px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap { height: 28px; gap: 12px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap .input_checkbox { width: 24px; height: 24px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap .input_checkbox + label { height: 28px; line-height: 28px; font-size: 16px; } .subpage_join .container_01 .join_wrap .join ul li .join_btn { width: 500px; height: 65px; margin-top: 30px; font-size: 20px; } .subpage_join .container_01 .join_wrap .join_congratulate > img { width: 120px; } .subpage_join .container_01 .join_wrap .join_congratulate p { margin: 30px 0 30px 0; font-size: 14px; } .subpage_join .container_01 .join_wrap .join_congratulate a { width: 500px; height: 65px; font-size: 16px; } .subpage_06 .sub_container_01 .tab_base li { height: 55px; font-size: 18px; } .subpage_06 .panel_base_inner .inner_title { margin-bottom: 50px; padding-top: 25px; } .subpage_06 .panel_base_inner .inner_title::before { width: 50px; height: 4px; } .subpage_06 .panel_base_inner .inner_title h6 { margin-bottom: 25px; font-size: 30px; } .subpage_06 .panel_base_inner .inner_title h6.sub_title { font-size: 26px; } .subpage_06 .panel_base_inner .inner_title p { font-size: 16px; } .subpage_06 .panel_base_inner .inner_title p b { margin-bottom: 25px; font-size: 16px; } .subpage_06 .panel_base_inner .inner_title .desc_text { gap: 15px; } .subpage_06 .panel_base_inner .inner_title .desc_text span { font-size: 16px; } .subpage_06 .panel_base_inner .contents_list li { margin-bottom: 20px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type { margin-bottom: 20px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type b { font-size: 22px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type b > img { width: 20px; } .subpage_06 .panel_base_inner .contents_list li h6 { height: 40px; margin-bottom: 8px; padding: 0 20px; font-size: 16px; } .subpage_06 .panel_base_inner .contents_list li p { font-size: 16px; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box { gap: 15px; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box_desc p { font-size: 14px; } .subpage_06 .panel_base_inner .over_container { height: 57vw; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide { width: 35vw; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide .box_desc { left: 20px; bottom: 20px; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide .box_desc h6 { font-size: 22px; } .subpage_06 .panel_base_inner .over_container .sub_swiper .swiper-wrapper .swiper-slide .box_desc p { font-size: 12px; } .subpage_06 .panel_base_inner .inner_contents_01 > h6 { font-size: 16px; } .subpage_06 .panel_base_inner .inner_contents_01 > h3 { font-size: 36px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle { gap: 15px; width: 260px; height: 260px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle h6 { font-size: 20px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle h5 { font-size: 28px; } .subpage_06 .panel_base_inner .inner_contents_01 .circle_wrap .circle p { min-height: 80px; font-size: 16px; } .subpage_06 .panel_base_inner .inner_contents_02 { margin-bottom: 15vw; } .subpage_06 .panel_base_inner .inner_contents_03 { margin-bottom: 15vw; padding: 10vw 6vw 10vw 6vw; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title { margin-bottom: 0; padding-top: 45px; } .subpage_06 .panel_base_inner .inner_contents_03 .inner_title p { margin-bottom: 7vw; } } @media screen and (max-width: 576px) { .subpage .sub_container .contents_title_01 { margin-bottom: 10px; font-size: 14px; } .subpage .sub_container .contents_title_02 { margin-bottom: 12px; font-size: 35px; } .subpage .sub_container .contents_title_03 { margin-bottom: 17px; font-size: 14px; } .subpage .sub_container .contents_title_04 { margin-bottom: 27px; padding-left: 19px; font-size: 14px; } .subpage .sub_container .contents_title_05 { padding: 12px 40px; font-size: 14px; } .subpage .container_01 .con1_title { top: 55%; width: 91%; } .subpage .container_01 .con1_title h3 { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; margin-bottom: 20px; font-size: 40px; } .subpage .container_01 .con1_title h3 span { margin-left: 3px; font-size: 16px; } .subpage .container_01 .con1_title p { font-size: 14px; } .subpage .container_01 .con1_swiper { height: 60vh; min-height: 385px; } .subpage .container_01 .con1_swiper .swiper-slide > img { height: 60vh; } .subpage_01 .sub_container_01 { padding: 15vw 15px; } .subpage_01 .sub_container_01 .inner { gap: 40px; } .subpage_01 .sub_container_01 .information_wrap { gap: 20px; } .subpage_01 .sub_container_01 .information_wrap .info_icon { width: 100px; height: 100px; } .subpage_01 .sub_container_01 .information_wrap .info_icon > img { width: 50px; margin-top: -10px; } .subpage_01 .sub_container_01 .information_wrap .info_icon span { margin-top: -3px; font-size: 14px; } .subpage_01 .sub_container_01 .information_wrap .info_desc { gap: 5px; width: calc(100% - 50px); height: 72px; margin-left: -50px; padding-left: 60px; border-radius: 0 100px 100px 0; } .subpage_01 .sub_container_01 .information_wrap .info_desc h6 { font-size: 18px; } .subpage_01 .sub_container_01 .information_wrap .info_desc p { font-size: 13px; } .subpage_01 .sub_container_01 .contents_title { margin-top: 60px; } .subpage_01 .sub_container_02::before { height: 350px; } .subpage_01 .sub_container_02 .contents_title { margin-bottom: 20vw; } .subpage_01 .sub_container_02 .contents_title_01 { margin-bottom: 15px; } .subpage_01 .sub_container_02 .contents_title_02 { margin-bottom: 22px; font-size: 35px; } .subpage_01 .sub_container_02 .contents_title_03 { font-size: 14px; } .subpage_01 .sub_container_02 .tab_base { gap: 5px; margin-bottom: 30px; padding-bottom: 10vw; } .subpage_01 .sub_container_02 .tab_base li a { width: 18vw; padding: calc(14vw + 10px) 7px calc(14vw + 2px) 7px; } .subpage_01 .sub_container_02 .tab_base li a .icon { top: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); background-size: calc(14vw - 22px); } .subpage_01 .sub_container_02 .tab_base li a .icon::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% + 4px); height: calc(100% + 4px); } .subpage_01 .sub_container_02 .tab_base li a .icon::after { width: calc(100% + 22px); height: calc(100% + 22px); } .subpage_01 .sub_container_02 .tab_base li a .inner_box_title h6 { min-height: 32px; font-size: 14px; } .subpage_01 .sub_container_02 .tab_base li a .icon_arrow { bottom: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li a:hover { width: 18vw; padding: calc(14vw + 10px) 7px calc(14vw + 2px) 7px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon { top: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); background-size: calc(14vw - 22px); } .subpage_01 .sub_container_02 .tab_base li a:hover .icon::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% + 4px); height: calc(100% + 4px); } .subpage_01 .sub_container_02 .tab_base li a:hover .icon::after { width: calc(100% + 22px); height: calc(100% + 22px); } .subpage_01 .sub_container_02 .tab_base li a:hover .inner_box_title h6 { min-height: 32px; font-size: 14px; } .subpage_01 .sub_container_02 .tab_base li a:hover .icon_arrow { bottom: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li.on a { width: 18vw; padding: calc(10vw + 10px) 7px calc(14vw + 10px) 7px; border-radius: 35px; } .subpage_01 .sub_container_02 .tab_base li.on a .icon { top: calc(-10vw + 11px); width: calc(20vw - 22px); height: calc(20vw - 22px); background-size: calc(20vw - 22px); } .subpage_01 .sub_container_02 .tab_base li.on a .icon::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% + 4px); height: calc(100% + 4px); } .subpage_01 .sub_container_02 .tab_base li.on a .icon::after { width: calc(100% + 22px); height: calc(100% + 22px); opacity: 0; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box { margin-top: 0; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box_title { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 7px; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box_title h6 { min-height: 32px; font-size: 14px; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box_title p { font-size: 12px; } .subpage_01 .sub_container_02 .tab_base li.on a .inner_box .desc_box { display: none; } .subpage_01 .sub_container_02 .tab_base li.on a .icon_arrow { bottom: 11px; width: calc(14vw - 22px); height: calc(14vw - 22px); } .subpage_01 .sub_container_02 .panel_base_inner .con3_title { flex-direction: column; align-items: center; justify-content: center; gap: 10px; margin-left: initial; margin-bottom: 45px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title h6 { padding-left: 25px; font-size: 30px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title h6::before { width: 6px; height: 30px; } .subpage_01 .sub_container_02 .panel_base_inner .con3_title span { font-size: 14px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor { flex-direction: column; gap: 20px; margin-top: 180px; margin-bottom: 30px; padding: 10px; border-radius: 10px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_img { width: 200px; height: 200px; margin-top: -180px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_img a { right: -15px; bottom: 0; height: 35px; padding: 0 15px; font-size: 14px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner { flex: initial; width: 100%; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title { flex-direction: column; align-items: center; justify-content: center; gap: 5px; margin-bottom: 20px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title h6 { font-size: 26px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner_title span { margin-bottom: 2px; font-size: 13px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td { padding: 12px 0; font-size: 13px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th > img, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td > img { width: 17px; } .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table th:last-of-type > img, .subpage_01 .sub_container_02 .panel_base_inner .doctor_inner .table_wrap table td:last-of-type > img { width: 12px; } .subpage_01 .sub_container_03 .contents_title { margin-bottom: 30px; } .subpage_01 .sub_container_03 .contents_title_01 { margin-bottom: 10px; } .subpage_01 .sub_container_03 .contents_title_02 { margin-bottom: 10px; font-size: 35px; } .subpage_01 .sub_container_03 .contents_title_03 { font-size: 14px; } .subpage_01 .sub_container_03 .tab_base { width: 290px; } .subpage_01 .sub_container_03 .tab_base li a { padding: 15px 0 15px 0; } .subpage_01 .sub_container_03 .tab_base li a::before { top: 32px; left: -15px; width: 5px; height: 5px; } .subpage_01 .sub_container_03 .tab_base li a h6 { width: 45px; margin-right: 10px; font-size: 26px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info { gap: 7px 0; margin-top: 5px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info span { padding: 0 10px; font-size: 14px; } .subpage_01 .sub_container_03 .tab_base li a .floor_info span::before { width: 2px; height: 12px; } .subpage_01 .sub_container_03 .tab_base .noti { margin-top: 20px; margin-left: initial; padding-left: 33px; font-size: 13px; } .subpage_01 .sub_container_03 .tab_base .noti::before { top: -3px; width: 25px; height: 25px; } .subpage_01 .sub_container_03 .panel_base_inner { margin-top: 60px; } .subpage_01 .sub_container_03 .panel_base_inner .title { margin-bottom: 10vw; } .subpage_01 .sub_container_03 .panel_base_inner .title > span { margin-bottom: 7px; font-size: 16px; } .subpage_01 .sub_container_03 .panel_base_inner .title h4 .text { margin: 0 30px; font-size: 30px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap { gap: 40px 10px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box { gap: 10px; width: calc(50% - 5px); } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc { gap: 10px; padding-left: 10px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc h6 { font-size: 20px; } .subpage_01 .sub_container_03 .panel_base_inner .box_wrap .box_desc p { font-size: 12px; } .subpage_01 .sub_container_04 .contents_title { margin-bottom: 35px; } .subpage_01 .sub_container_04 .contents_title_02 { font-size: 30px; } .subpage_01 .sub_container_04 .contents_title_03 { margin-bottom: 10px; font-size: 13px; } .subpage_01 .sub_container_04 .map_contents { width: 90%; margin-top: -40px; padding: 40px 0 40px 0; } .subpage_01 .sub_container_04 .map_contents .address_box { gap: 10px; margin-bottom: 20px; } .subpage_01 .sub_container_04 .map_contents .address_box h6 { font-size: 16px; text-align: center; } .subpage_01 .sub_container_04 .map_contents .address_box p { font-size: 14px; } .subpage_01 .sub_container_04 .map_contents ul { flex-direction: column; gap: 5px; } .subpage_01 .sub_container_04 .map_contents ul li { width: 250px; height: 45px; } .subpage_01 .sub_container_04 .map_contents ul li a { justify-content: center; padding-left: 10px; padding-right: 0; font-size: 16px; text-align: center; } .subpage_01 .sub_container_04 .map_contents ul li a > img { top: 50%; left: 4px; transform: translate(0, -50%); width: 35px; height: 35px; } .subpage_01 .sub_container_04 .map_contents ul .bubble { bottom: -80px; width: 200px; height: 60px; padding: 0 20px; font-size: 12px; } .subpage_01 .sub_container_04 .map_contents ul .bubble::before { top: -12px; width: 12px; height: 15px; } .subpage_02 .follow_ul li { width: 50px; height: 50px; padding: 10px; } .subpage_02 .follow_ul li a { font-size: 14px; } .subpage_02 .follow_ul li a > img { width: 30px; height: 30px; margin-right: initial; } .subpage_02 .follow_ul li.on { width: 50px; } .subpage_02 .follow_ul li:nth-of-type(3).on { width: 50px; } .subpage_02 .follow_ul li:nth-of-type(4).on { width: 50px; } .subpage_02 .follow_ul li:nth-of-type(5).on { width: 50px; } .subpage_02 .sub_container_02 .sub_container_title h6 { font-size: 14px; } .subpage_02 .sub_container_02 .sub_container_title h4 { font-size: 24px; } .subpage_02 .sub_container_02 .sub_container_title p { font-size: 12px; } .subpage_02 .sub_container_02 .sub_container_title p span > img { width: 15px; } .subpage_02 .sub_container_02 .con2_slider .item { margin-right: 10px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap > div p { padding: 6px 10px; font-size: 13px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul { padding: 20px 0; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul li:nth-of-type(1) { font-size: 13px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul li:nth-of-type(2) { margin: 5px 0; font-size: 18px; } .subpage_02 .sub_container_02 .con2_slider .item .wrap ul li:nth-of-type(3) { font-size: 13px; } .subpage_02 .panel_base_inner .title h6 { font-size: 30px; } .subpage_02 .panel_base_inner .title p { font-size: 14px; } .subpage_02 .panel_base_inner .contents { width: calc(100% - 135px); gap: 120px; } .subpage_02 .panel_base_inner .contents .portrait { width: 63vw; } .subpage_02 .panel_base_inner .contents .portrait > div { height: 70vw; } .subpage_02 .panel_base_inner .contents .portrait ul { gap: 4px; padding: 20px 20px; } .subpage_02 .panel_base_inner .contents .portrait ul li:nth-of-type(1) { font-size: 14px; } .subpage_02 .panel_base_inner .contents .portrait ul li:nth-of-type(2) { font-size: 22px; } .subpage_02 .panel_base_inner .contents_inner { margin-top: 25px; margin-left: 0; } .subpage_02 .panel_base_inner .contents_inner_title { margin-bottom: 20px; padding-left: 20px; font-size: 26px; } .subpage_02 .panel_base_inner .contents_inner_title::before { width: 4px; } .subpage_02 .panel_base_inner .contents_inner_desc { gap: 13px; margin-bottom: 5vw; } .subpage_02 .panel_base_inner .contents_inner_desc p { padding-left: 13px; font-size: 12px; } .subpage_02 .panel_base_inner .contents_inner_table table th, .subpage_02 .panel_base_inner .contents_inner_table table td { padding: 12px 0; font-size: 12px; } .subpage_02 .panel_base_inner .contents_inner_table table th > img, .subpage_02 .panel_base_inner .contents_inner_table table td > img { width: 22px; } .subpage_02 .panel_base_inner .contents_inner_table table th:last-of-type > img, .subpage_02 .panel_base_inner .contents_inner_table table td:last-of-type > img { width: 20px; } .subpage_03 .container_01::before { bottom: -40px; height: 80px; } .subpage_03 .container_01 .con1_title h3 { align-items: center; justify-content: center; gap: 10px; margin-bottom: 20px; text-align: center; } .subpage_03 .container_01 .con1_title p { font-size: 13px; } .subpage_03 .container_01 .con1_swiper { height: 400px; } .subpage_03 .sub_container_01 .main_title { margin-bottom: 10vw; } .subpage_03 .sub_container_01 .main_title h3 { margin-bottom: 40px; padding-bottom: 30px; font-size: 20px; } .subpage_03 .sub_container_01 .main_title h3::before { width: 40px; height: 4px; } .subpage_03 .sub_container_01 .main_title p { font-size: 12px; } .subpage_03 .sub_container_01 .box_wrap { margin-bottom: 10vw; } .subpage_03 .sub_container_01 .box_wrap .box { width: calc(100% - 400px + 250px + 250px); margin-top: 150px; margin-left: -250px; } .subpage_03 .sub_container_01 .box_wrap .box_text { padding: 10vw 20px 10vw 20px; } .subpage_03 .sub_container_01 .box_wrap .box_text h6 { margin-bottom: 40px; padding-bottom: 30px; font-size: 22px; } .subpage_03 .sub_container_01 .box_wrap .box_text h6::before { width: 30px; height: 4px; } .subpage_03 .sub_container_01 .box_wrap .box_text p { font-size: 12px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box { width: calc(100% - 400px + 260px + 260px); margin-top: 144px; margin-left: 0; margin-right: -260px; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_img { margin-left: -260px; margin-right: 0; } .subpage_03 .sub_container_01 .box_wrap:nth-of-type(odd) .box_text { padding: 10vw 5vw 10vw 5vw; } .subpage_03 .sub_container_02 h5 { margin-bottom: 10px; font-size: 15px; } .subpage_03 .sub_container_02 h5::before { top: calc(-100vh - 30px); } .subpage_03 .sub_container_02 h6 { margin-bottom: 10px; font-size: 26px; } .subpage_03 .sub_container_02 p { font-size: 13px; } .subpage_04 .sub_container_01 { padding: 15vw 0; } .subpage_04 .sub_container_01 .inner { max-width: calc(100% - 20px); } .subpage_04 .sub_container_01 .search_wrap { margin-bottom: 100px; } .subpage_04 .sub_container_01 .search_wrap .top_bar { margin-bottom: 20px; padding-top: 60px; padding-left: initial; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el { width: 300px; min-height: 50px; max-height: 50px; font-size: 13px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el label { height: 50px; line-height: 50px; padding-left: 40px; padding-right: 70px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el label:nth-child(2) { margin-top: 50px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el::after { top: 19px; right: 20px; width: 18px; height: 14px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .dropdown-el.expanded::after { width: 19px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap { width: 300px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search { height: 50px; padding: 0 60px 0 20px; font-size: 13px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search::placeholder { font-size: 13px; } .subpage_04 .sub_container_01 .search_wrap .top_bar .input_wrap .input_search_btn { right: 20px; width: 22px; height: 22px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap { gap: 5px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap li { padding: 7px 15px; font-size: 13px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap li.on { padding-left: 50px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap li.on::before { left: 22px; width: 13px; height: 14px; } .subpage_04 .sub_container_01 .search_wrap .category_wrap .bubble { left: 50%; bottom: -50px; transform: translate(-50%, 0); padding: 7px 25px; font-size: 12px; white-space: nowrap; } .subpage_04 .sub_container_01 .search_wrap .category_wrap .bubble::before { top: -9px; left: 50%; transform: translate(-50%, 0); width: 19px; height: 10px; } .subpage_04 .sub_container_01 .contents_wrap > ul { margin-bottom: 10vw; gap: 30px 10px; } .subpage_04 .sub_container_01 .contents_wrap > ul li { width: calc(50% - 5px); } .subpage_04 .sub_container_01 .contents_wrap > ul li a > img { height: calc(50vw - 15px); max-height: 273px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info { gap: 7px; margin-top: 10px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_title { gap: 14px; font-size: 12px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_title span { height: 24px; padding: 0 10px; font-size: 12px; } .subpage_04 .sub_container_01 .contents_wrap > ul li a .link_info_desc p { font-size: 12px; } .subpage_04 .sub_container_01 .contents_wrap .pagination { gap: 10px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group { gap: 5px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group:first-of-type, .subpage_04 .sub_container_01 .contents_wrap .pagination_group:last-of-type { gap: 5px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li:not(.unit) { min-width: 20px; height: 20px; line-height: 18px; padding: 0 5px; font-size: 11px; } .subpage_04 .sub_container_01 .contents_wrap .pagination_group li.unit { width: 20px; height: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box { padding-bottom: 90px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_img { width: 75%; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc { width: 100%; margin-top: 30px; margin-left: initial; margin-right: initial; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6 { margin-bottom: 10px; padding-left: 15px; gap: 10px; font-size: 30px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6::before { top: 6px; left: 0; width: 5px; height: 25px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > h6 span { margin-bottom: 6px; font-size: 13px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc > p { margin-bottom: 20px; font-size: 14px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec { gap: 10px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li { gap: 15px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li span { width: 80px; height: 30px; font-size: 14px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .box_desc .spec li p { margin-top: 6px; font-size: 14px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option { gap: 0 7px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev, .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next { width: 25px; height: 25px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-prev::before, .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .swiper-button-next::before { width: 9px; height: 10px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .count { width: 50px; font-size: 16px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .guide_text { margin-top: 10px; padding-left: 15px; font-size: 12px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper2 .option .guide_text::before { top: -1px; width: 20px; height: 20px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper { width: calc(100% - 30px); max-width: calc(100% - 30px); margin-left: 30px; padding-bottom: 30px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-slide { width: 40vw; height: 61vw; padding-top: 14px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-slide-thumb-active::before { width: 80px; height: 28px; line-height: 28px; padding-left: 35px; font-size: 12px; background-position: 14px 50%; background-size: 13px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img { height: 58vw; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text { left: 10px; bottom: 20px; gap: 3px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text h6 { font-size: 14px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .box_img .text p { font-size: 9px; } .subpage_05 .sub_container_01 .contents .swiper.mySwiper .swiper-pagination { left: 45px; width: calc(100% - 120px); height: 3px; } .subpage_policy .sub_container_01 h6 { margin-bottom: 15px; padding-left: 25px; font-size: 30px; } .subpage_policy .sub_container_01 h6::before { width: 6px; height: 30px; } .subpage_policy .sub_container_01 p { font-size: 12px; } .subpage_login .container_01 { padding-top: 59px; } .subpage_login .container_01 .login_wrap { padding: 10vw 0; } .subpage_login .container_01 .login_wrap .login { max-width: 90%; } .subpage_login .container_01 .login_wrap .login h3 { margin-bottom: 15px; font-size: 30px; } .subpage_login .container_01 .login_wrap .login ul li h6 { font-size: 18px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap { height: 60px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .input_text { padding: 0 15px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .btn_show_pw { right: 20px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap.for_checkbox { height: 26px; gap: 10px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .input_checkbox { width: 26px; height: 26px; } .subpage_login .container_01 .login_wrap .login ul li .input_wrap .input_checkbox + label { height: 26px; line-height: 26px; font-size: 16px; } .subpage_login .container_01 .login_wrap .login ul li .find_password { padding-right: 25px; font-size: 16px; } .subpage_login .container_01 .login_wrap .login ul li .find_password::before { width: 13px; height: 18px; } .subpage_login .container_01 .login_wrap .login ul li .login_btn { height: 60px; font-size: 22px; } .subpage_login .container_01 .login_wrap .login ul li.sns_link { gap: 20px; padding-top: 30px; } .subpage_login .container_01 .login_wrap .login ul li.sns_link p { font-size: 18px; } .subpage_login .container_01 .login_wrap .login ul li.sns_link .link_wrap { gap: 10px; } .subpage_join .container_01 { padding-top: 59px; } .subpage_join .container_01 .join_wrap .join h3 { margin-bottom: 25px; font-size: 30px; } .subpage_join .container_01 .join_wrap .join .step_img { margin-bottom: 30px; } .subpage_join .container_01 .join_wrap .join .step_img p { margin-top: 25px; font-size: 14px; } .subpage_join .container_01 .join_wrap .join ul { padding: 0 15px; } .subpage_join .container_01 .join_wrap .join ul li { gap: 10px; } .subpage_join .container_01 .join_wrap .join ul li h6 { font-size: 20px; } .subpage_join .container_01 .join_wrap .join ul li .text_wrap { height: 200px; } .subpage_join .container_01 .join_wrap .join ul li .text_wrap .text { padding: 30px 10px; font-size: 12px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap { height: 28px; gap: 12px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap .input_checkbox { width: 20px; height: 20px; } .subpage_join .container_01 .join_wrap .join ul li .input_wrap .input_checkbox + label { height: 28px; line-height: 28px; font-size: 14px; } .subpage_join .container_01 .join_wrap .join ul li .join_btn { width: 80%; height: 60px; margin-top: 10px; font-size: 16px; } .subpage_join .container_01 .join_wrap .join_congratulate > img { width: 100px; } .subpage_join .container_01 .join_wrap .join_congratulate p { margin: 30px 0 30px 0; font-size: 12px; } .subpage_join .container_01 .join_wrap .join_congratulate a { width: 80%; height: 60px; font-size: 16px; } .subpage_join_info .container_01 { padding-top: 69px; } .subpage_join_info .container_01 .join_info_wrap .join_info h3 { font-size: 30px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul { max-width: 90%; gap: 25px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li { gap: 10px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li h6 { font-size: 16px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li.custom h6 { height: 30px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li.custom .input_wrap { min-height: 30px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap { flex: initial; width: 100%; min-height: 50px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .input_text { min-height: 50px; padding: 0 15px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap p { font-size: 14px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap p.guide_text { font-size: 14px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap.for_checkbox { min-height: 38px; gap: 10px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .input_checkbox { width: 20px; height: 20px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .input_checkbox + label { height: 20px; line-height: 20px; font-size: 14px; } .subpage_join_info .container_01 .join_info_wrap .join_info ul li .input_wrap .box { width: 100%; height: 50px; } .subpage_join_info .container_01 .join_info_wrap .join_info .btn_wrap { width: 100%; gap: 10px; margin-top: 50px; } .subpage_join_info .container_01 .join_info_wrap .join_info .btn_wrap .btn { height: 65px; font-size: 16px; } .subpage_06 .sub_container_01 { padding: 60px 15px 0 15px; } .subpage_06 .sub_container_01 .tab_base li { height: 45px; font-size: 15px; } .subpage_06 .panel_base_inner { padding: 0 15px 15vw 15px; } .subpage_06 .panel_base_inner .inner_title { margin-bottom: 40px; padding-top: 20px; } .subpage_06 .panel_base_inner .inner_title::before { width: 35px; height: 4px; } .subpage_06 .panel_base_inner .inner_title h6 { margin-bottom: 20px; font-size: 18px; letter-spacing: -0.5px; } .subpage_06 .panel_base_inner .inner_title p { font-size: 14px; } .subpage_06 .panel_base_inner .inner_title p b { margin-bottom: 20px; font-size: 14px; } .subpage_06 .panel_base_inner .inner_title .desc_text { gap: 10px; } .subpage_06 .panel_base_inner .inner_title .desc_text span { font-size: 14px; } .subpage_06 .panel_base_inner .contents_list li { margin-bottom: 20px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type { margin-bottom: 20px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type b { font-size: 16px; } .subpage_06 .panel_base_inner .contents_list li:first-of-type b > img { width: 18px; } .subpage_06 .panel_base_inner .contents_list li h6 { height: 35px; margin-bottom: 8px; padding: 0 15px; font-size: 14px; } .subpage_06 .panel_base_inner .contents_list li p { font-size: 14px; } .subpage_06 .panel_base_inner .swiper_wrap { margin-bottom: 15vw; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-prev, .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-next { top: 22%; width: 30px; height: 30px; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-prev { left: -10px; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-button-next { right: -10px; } .subpage_06 .panel_base_inner .swiper_wrap .swiper-pagination { margin-top: 20px; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide { width: 42vw; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box { gap: 10px; } .subpage_06 .panel_base_inner .sub_swiper .swiper-wrapper .swiper-slide .box_desc p { font-size: 12px; } } .br_show_1600, .br_show_992, .br_show_768, .br_show_576 { display: none; } body { position: relative; font-family: "Pretendard"; -ms-user-select: none; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; user-select: none; } .inner { width: 100%; max-width: 1920px; margin: 0 auto; } .quick_bar { position: absolute; top: 110px; right: 40px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 16px; opacity: 1; z-index: 20; } .quick_bar a { cursor: pointer; } .quick_bar a > img { border-radius: 50%; overflow: hidden; } .quick_bar .button { position: relative; transition: all 0.3s; } .quick_bar .button .deco { position: absolute; left: 50%; bottom: -5px; transform: translate(-50%, 0); opacity: 0; transition: all 0.3s; } .quick_bar .button:hover { position: relative; } .quick_bar .button:hover::before { position: absolute; top: 50%; left: -129px; transform: translate(0, -50%); content: "메뉴 닫기"; width: 105px; height: 42px; line-height: 42px; color: #4e4e4e; font-size: 20px; text-align: center; font-weight: bold; background-color: #fff; border-radius: 8px; } .quick_bar .button:hover::after { position: absolute; top: 50%; left: -24px; transform: translate(0, -50%); content: ""; width: 12px; height: 15px; background-image: url("/common/img/main/quick_deco2.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .quick_bar .button.on .deco { opacity: 1; } .quick_bar .button.on:hover { position: relative; } .quick_bar .button.on:hover::before { content: "메뉴 열기"; } .quick_bar .show { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 16px; display: none; } .quick_bar .show li:hover { position: relative; } .quick_bar .show li:hover::before { position: absolute; top: 50%; left: -129px; transform: translate(0, -50%); content: ""; width: 105px; height: 42px; line-height: 42px; color: #4e4e4e; font-size: 20px; text-align: center; font-weight: bold; background-color: #fff; border-radius: 8px; } .quick_bar .show li:hover::after { position: absolute; top: 50%; left: -24px; transform: translate(0, -50%); content: ""; width: 12px; height: 15px; background-image: url("/common/img/main/quick_deco2.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .quick_bar .show li:hover:nth-of-type(1)::before { content: "전화하기"; } .quick_bar .show li:hover:nth-of-type(2)::before { content: "오시는길"; } .quick_bar .show li:hover:nth-of-type(3)::before { content: "카카오톡"; } .quick_bar .show li:hover:nth-of-type(4)::before { content: "유튜브"; } .quick_bar .show li:hover:nth-of-type(5)::before { content: "블로그"; } .quick_bar .show li:hover:nth-of-type(6)::before { content: "상단이동"; } .quick_bar li:last-of-type:hover { position: relative; } .quick_bar li:last-of-type:hover::before { position: absolute; top: 50%; left: -129px; transform: translate(0, -50%); content: "상단이동"; width: 105px; height: 42px; line-height: 42px; color: #4e4e4e; font-size: 20px; text-align: center; font-weight: bold; background-color: #fff; border-radius: 8px; } .quick_bar li:last-of-type:hover::after { position: absolute; top: 50%; left: -24px; transform: translate(0, -50%); content: ""; width: 12px; height: 15px; background-image: url("/common/img/main/quick_deco2.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .follow_ul { position: absolute; top: 110px; left: 0; display: inline-flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 25px; width: 235px; padding: 30px 0; opacity: 1; z-index: 20; background-color: #fff; border-radius: 0 20px 20px 0; } .follow_ul .bubble { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 215px; height: 88px; margin-left: 10px; padding: 0 26px; color: #fff; font-size: 22px; background-color: #08b7ce; border-radius: 60px; transition: all 0.5s; } .follow_ul .bubble::after { position: absolute; left: 56px; bottom: -10px; content: ""; width: 11px; height: 12px; background-image: url("/common/img/main/con4_tab_base_deco.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .follow_ul li { height: 41px; padding-left: 26px; } .follow_ul li a { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 100%; height: 100%; color: #c5c5c5; font-size: 17px; font-weight: 500; } .follow_ul li a span { display: inline-block; width: 41px; height: 41px; line-height: 41px; margin-right: 10px; color: #fff; font-size: 21px; text-align: center; background-color: #c6c6c6; border-radius: 50%; } .follow_ul li.on a { position: relative; padding-right: 22px; color: #00b5cd; } .follow_ul li.on a span { position: relative; background-color: #05b6ce; } .follow_ul li.on a span::before { position: absolute; top: 50%; left: -27px; content: ""; width: 27px; height: 2px; background-color: #05b6ce; } .follow_ul li.on a::before { position: absolute; top: 50%; right: 0; transform: translate(0, -50%); content: ""; width: 11px; height: 12px; background-image: url("/common/img/main/con4_tab_base_arrow.png"); background-repeat: no-repeat; background-position: center; background-size: contain; opacity: 1; } /* header */ #header { position: fixed; top: 0; left: 0; width: 100vw; height: 90px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(255, 255, 255, 0.15); z-index: 9999; transition: all 0.5s; } #header.hov, #header.active, #header.on, #header:hover { background: #ffffff; border-bottom: 2px solid #f3f3f3; } #header.hov .header_inner .logo a:before, #header.hov .header_inner .logo a:after, #header.active .header_inner .logo a:before, #header.active .header_inner .logo a:after, #header.on .header_inner .logo a:before, #header.on .header_inner .logo a:after, #header:hover .header_inner .logo a:before, #header:hover .header_inner .logo a:after { background-image: url("/common/img/main/logo_color.png"); } #header.hov .header_inner #gnb > ul > li.depth1 > a, #header.active .header_inner #gnb > ul > li.depth1 > a, #header.on .header_inner #gnb > ul > li.depth1 > a, #header:hover .header_inner #gnb > ul > li.depth1 > a { color: #515151; } #header.hov .utile_menu .allmenu_open .bar, #header.active .utile_menu .allmenu_open .bar, #header.on .utile_menu .allmenu_open .bar, #header:hover .utile_menu .allmenu_open .bar { background: #000; } #header.hov .utile_menu .allmenu_open .bar:before, #header.hov .utile_menu .allmenu_open .bar:after, #header.active .utile_menu .allmenu_open .bar:before, #header.active .utile_menu .allmenu_open .bar:after, #header.on .utile_menu .allmenu_open .bar:before, #header.on .utile_menu .allmenu_open .bar:after, #header:hover .utile_menu .allmenu_open .bar:before, #header:hover .utile_menu .allmenu_open .bar:after { background: #000; } #header .header_inner { display: flex; flex-direction: row; align-items: center; width: 100%; height: 100%; padding: 0 43px; } #header .header_inner .logo { position: relative; margin-right: auto; } #header .header_inner .logo > a { position: relative; display: block; width: 180px; height: 55px; font-size: 0; } #header .header_inner .logo > a:before, #header .header_inner .logo > a:after { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-image: url("/common/img/main/logo_white.png"); background-repeat: no-repeat; background-position: center; background-size: contain; opacity: 1; transition: opacity 0.4s ease; } #header .header_inner .logo > a:after { opacity: 0; } #header .header_inner_grip { height: 100%; } #header .utile_menu { display: flex; justify-content: flex-end; align-items: center; margin-left: auto; } #header .utile_menu_user { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 13px; } #header .utile_menu_user .user { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 129px; height: 42px; color: #fff; font-size: 21px; font-weight: 400; border-radius: 40px; } #header .utile_menu_user .user_join { background-color: #676767; } #header .utile_menu_user .user_login { background-color: #00bbb6; } #header .utile_menu .allmenu_open { position: relative; display: inline-block; width: 24px; height: 18px; display: none; } #header .utile_menu .allmenu_open .bar { position: absolute; top: 0; width: 24px; height: 2px; background: #fff; } #header .utile_menu .allmenu_open .bar:before, #header .utile_menu .allmenu_open .bar:after { content: ""; position: absolute; left: 0; width: 100%; height: 2px; background: #fff; } #header .utile_menu .allmenu_open .bar:before { top: 8px; width: 20px; } #header .utile_menu .allmenu_open .bar:after { top: 16px; width: 16px; } #header.hov #header .utile_menu .allmenu_open .bar, #header.active #header .utile_menu .allmenu_open .bar, #header.hov #header .utile_menu .allmenu_open .bar:before, #header.active #header .utile_menu .allmenu_open .bar:before, #header.hov #header .utile_menu .allmenu_open .bar:after, #header.active #header .utile_menu .allmenu_open .bar:after { background: #134097; } #header .pan { position: absolute; top: calc(100% + 1px); left: 0; display: flex; align-items: center; justify-content: center; width: 100vw; height: 300px; z-index: 1; opacity: 0; visibility: hidden; background: #fff; z-index: 0; } #header #gnb { height: 100%; } #header #gnb:hover > ul > li.depth1 > a { color: #515151; } #header #gnb:hover .depth2 { opacity: 1 !important; visibility: visible !important; } #header #gnb:hover .pan { opacity: 1; visibility: visible; } #header #gnb > ul { display: flex; align-items: center; justify-content: center; height: 100%; } #header #gnb > ul > li { width: 220px; } #header #gnb > ul > li.depth1 { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; height: 100%; transition: all 0.5s ease-in-out; } #header #gnb > ul > li.depth1:hover > a { color: #00bbb6; } #header #gnb > ul > li.depth1:hover > a:after { width: 17px; } #header #gnb > ul > li.depth1 > a { position: relative; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 100%; height: 100%; color: #fff; font-size: 27px; text-align: center; } #header #gnb > ul > li.depth1 > a:after { position: absolute; left: 50%; bottom: 21px; transform: translate(-50%, 0); content: ""; display: block; width: 0; height: 3px; background: #00bbb6; border-radius: 40px; transition: width 0.2s ease; z-index: 10; } #header #gnb > ul > li.depth1 > a.active { color: #00bbb6; } #header #gnb > ul > li.depth1 ul.depth2 { position: absolute; top: 100%; display: block; width: 220px; height: fit-content; transition: all 0.5s ease-in-out; transition-property: opacity; transition-duration: 0.3s; z-index: 1; opacity: 0; visibility: hidden; } #header #gnb > ul > li.depth1 ul.depth2 li { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; height: 60px; } #header #gnb > ul > li.depth1 ul.depth2 li a { color: #515151; font-size: 19px; } #header #gnb > ul > li.depth1 ul.depth2 li a:hover { color: #00bbb6; } #header #gnb > ul > li:hover a { font-weight: 700; } #lnb { position: fixed; width: 100vw; height: 100vh; top: 0; right: 0; z-index: 9999; display: block; visibility: hidden; } #lnb .lnb_bg { position: fixed; top: 0; right: 0; width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.8); transition: all 0.8s; opacity: 0; } #lnb .lnb_area { width: 80%; height: 100vh; position: absolute; top: 0; right: 0; background: #fff; opacity: 0; transform: translate(80%, 0); transition: all 0.8s; overflow-y: auto; -webkit-overflow-scrolling: touch; } #lnb .lnb_area .custom_scroll_content { padding: 20px 24px 48px 32px; overflow-y: auto; position: relative; } #lnb a.lnb_close { width: 35px; height: 35px; top: 20px; position: absolute; right: 20px; opacity: 0; } #lnb a.lnb_close i { position: absolute; width: 100%; height: 3px; background: #222; left: 0; transform: rotate(-45deg); top: 50%; } #lnb a.lnb_close i:nth-child(2) { transform: rotate(45deg); top: 50%; } #lnb ul.menu_area { overflow: hidden; margin-top: 60px; } #lnb ul.menu_area li.depth1 { transition: all 0.8s; margin-left: 80px; white-space: nowrap; width: 100%; opacity: 0; } #lnb ul.menu_area li.depth1:nth-of-type(1) { transition-delay: 0.5s; } #lnb ul.menu_area li.depth1:nth-of-type(2) { transition-delay: 0.4s; } #lnb ul.menu_area li.depth1:nth-of-type(3) { transition-delay: 0.3s; } #lnb ul.menu_area li.depth1:nth-of-type(4) { transition-delay: 0.2s; } #lnb ul.menu_area li.depth1:nth-of-type(5) { transition-delay: 0.1s; } #lnb ul.menu_area li.depth1 > a { position: relative; display: block; padding: 15px 0; color: rgba(0, 0, 0, 0.5); font-size: 18px; font-weight: 700; } #lnb ul.menu_area li.depth1 > a.active { color: rgb(0, 0, 0); } #lnb ul.menu_area li.depth1 .depth2 { display: none; padding: 5px 0; } #lnb ul.menu_area li.depth1 .depth2 a { display: block; padding: 10px 0; color: rgb(0, 0, 0); font-size: 16px; font-weight: 600; transition: all 0.8s; opacity: 0; } #lnb ul.menu_area li.depth1 .depth2 a span { position: relative; } #lnb ul.menu_area li.depth1 .depth2 a.on span:before { content: ""; position: absolute; width: 100%; height: 1px; color: rgb(0, 0, 0); left: 0; bottom: -2px; } #lnb ul.menu_area li.depth1 a.on:after { transform: rotate(180deg); opacity: 1; } #lnb ul.menu_area li.depth1 .depth2.active { display: block; } #lnb.on { visibility: visible; } #lnb.on .lnb_bg { opacity: 1; } #lnb.on .lnb_area { opacity: 1; transform: translate(0, 0); } #lnb.on a.lnb_close { opacity: 1; transition-delay: 0.8s; } #lnb.on ul.menu_area li.depth1 { margin-left: 0; opacity: 1; } #lnb.on ul.menu_area li.depth1:nth-of-type(1) { transition-delay: 0.1s; } #lnb.on ul.menu_area li.depth1:nth-of-type(2) { transition-delay: 0.2s; } #lnb.on ul.menu_area li.depth1:nth-of-type(3) { transition-delay: 0.3s; } #lnb.on ul.menu_area li.depth1:nth-of-type(4) { transition-delay: 0.4s; } #lnb.on ul.menu_area li.depth1:nth-of-type(5) { transition-delay: 0.5s; } #lnb.on ul.menu_area li.depth1 .depth2 a { opacity: 1; color: #111827; font-weight: 600; } #lnb.on ul.menu_area li.depth1 .depth2 a.on { font-weight: 400; color: #111; } #lnb.on ul.menu_area li.depth1 .depth2 .depth3 { padding-left: 10px; } .container_01 .inner { position: relative; max-width: 100%; } .container_01 .con1_title { position: absolute; top: 50%; left: 13%; transform: translate(0, -50%); z-index: 2; } .container_01 .con1_title h3 { margin-bottom: 10px; color: #fff; font-size: 78px; font-weight: 600; } .container_01 .con1_title p { margin-bottom: 40px; color: #fff; font-size: 30px; font-weight: 500; } .container_01 .con1_title h6 { margin-bottom: 60px; color: #fff; font-size: 36px; font-weight: 500; } .container_01 .con1_title h6 b { font-weight: 600; } .container_01 .con1_title .con1_swiper_option { position: relative; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: flex-start; gap: 25px; } .container_01 .con1_title .con1_swiper_option .autoplay-progress { position: relative; width: 33px; height: 33px; display: flex; align-items: center; justify-content: center; font-weight: bold; color: #969699; z-index: 10; } .container_01 .con1_title .con1_swiper_option .autoplay-progress::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; width: 100%; height: 100%; border: 5px solid #959597; border-radius: 50%; } .container_01 .con1_title .con1_swiper_option .autoplay-progress svg { --progress: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(-90deg); width: 34px; height: 34px; stroke-width: 6px; stroke: #00c4de; fill: none; stroke-dashoffset: calc(125.6px * (1 - var(--progress))); stroke-dasharray: 125.6; z-index: 10; } .container_01 .con1_title .con1_swiper_option .autoplay-progress span { display: none; } .container_01 .con1_title .con1_swiper_option .count { width: initial; color: #c4c4c4; font-size: 20px; } .container_01 .con1_title .con1_swiper_option .count span:first-of-type { color: #fff; } .container_01 .con1_title .con1_swiper_option .swiper-button-prev, .container_01 .con1_title .con1_swiper_option .swiper-button-next { position: initial; display: flex; align-items: center; justify-content: center; width: initial; height: initial; margin-top: initial; background-image: initial; } .container_01 .con1_swiper { position: relative; width: 100%; height: calc(100vh - 100px); overflow: hidden; } .container_01 .con1_swiper .swiper-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; } .container_01 .con1_swiper .swiper-slide { position: relative; width: 100%; height: 100%; } .container_01 .con1_swiper .swiper-slide::before { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: calc(100% - 2px); background-color: rgba(0, 0, 0, 0.53); z-index: 2; } .container_01 .con1_swiper .swiper-slide > img { width: 100%; height: calc(100vh - 100px); object-fit: cover; } .container_01 .con1_swiper .swiper-pagination { position: absolute; top: 0; left: 0; } .container_01 .scroll_down { position: absolute; left: 50%; bottom: 30px; transform: translate(-50%, 0); display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px; z-index: 1; } .container_01 .scroll_down p { color: #fff; font-size: 20px; } .container_01 .search_box { position: absolute; right: 70px; bottom: -195px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; width: 600px; height: 330px; padding: 0 50px; background-color: #00b5cd; border-radius: 15px; z-index: 2; } .container_01 .search_box h6 { margin-bottom: 12px; color: #fff; font-size: 26px; font-weight: 600; } .container_01 .search_box .input_box { position: relative; width: 100%; height: 51px; } .container_01 .search_box .input_box .input_search { height: 100%; } .container_01 .search_box .input_box .btn_search { position: absolute; top: 0; right: 0; width: 54px; height: 51px; background-image: url("/common/img/main/main_icon_search.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .container_01 .search_box .input_box .last_search_words { position: absolute; top: 51px; left: 0; width: 100%; padding: 15px 0; background-color: white; border-top: 1px solid #000; border-radius: 0 0 15px 15px; z-index: 2; } .container_01 .search_box .input_box .last_search_words ul { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; width: 100%; height: 100%; gap: 5px; } .container_01 .search_box .input_box .last_search_words ul li { padding-left: 14px; color: #000; font-size: 14px; text-align: left; } .container_01 .search_box .word_list { display: flex; flex-direction: row; align-items: center; align-items: flex-start; justify-content: flex-start; gap: 35px; margin-top: 25px; } .container_01 .search_box .word_list span { position: relative; padding-right: 16px; color: #fff; font-size: 18px; } .container_01 .search_box .word_list span::before { position: absolute; top: 50%; right: 0; transform: translate(0, -50%); content: ""; width: 7px; height: 8px; background-image: url("/common/img/main/main_icon_mini_arrow.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .container_01 .search_box .word_list ul { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 5px; } .container_01 .search_box .word_list ul li { color: #fff; list-style-type: decimal; } .container_01 .search_box .word_list ul li i { color: #fff; font-size: 17px; opacity: 0.8; } .container_02 { padding: 320px 0 320px 0; } .container_02 .inner { max-width: initial; } .container_02 .con2_title { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-bottom: 200px; } .container_02 .con2_title > img { margin-bottom: 50px; } .container_02 .con2_title h4 { margin-bottom: 30px; color: #202020; font-size: 64px; font-weight: 800; text-align: center; } .container_02 .con2_title h4 span { color: #00b5cd; } .container_02 .con2_title p { color: #b1b1b1; font-size: 24px; font-weight: 600; } .container_02 .con2_swiper { position: relative; width: 100%; height: 100%; overflow: hidden; } .container_02 .con2_swiper .swiper-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .container_02 .con2_swiper .swiper-slide { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; justify-content: flex-end; gap: 50px; height: 700px; } .container_02 .con2_swiper .swiper-slide > div { width: 100%; height: 100%; border-radius: 15px; overflow: hidden; } .container_02 .con2_swiper .swiper-slide > div > img { width: 100%; height: 100%; object-fit: cover; } .container_02 .con2_swiper .swiper-slide.slide_01 { width: 576px; padding-top: 100px; } .container_02 .con2_swiper .swiper-slide.slide_02 { width: 385px; height: 700px; } .container_02 .con2_swiper .swiper-slide.slide_03 { width: 400px; height: 600px; padding-top: 88px; padding-bottom: 112px; } .container_02 .con2_swiper .swiper-slide.slide_04 { width: 500px; padding-top: 200px; } .container_02 .con2_swiper .swiper-slide.slide_05 { width: 385px; height: 700px; } .container_02 .swiper_option { display: flex; flex-direction: column; justify-content: center; align-items: center; width: calc(100% - 30vw); margin: 0 15vw; margin-top: 50px; } .container_02 .swiper_option .swiper-pagination { position: initial; width: 100%; height: 4px; margin-top: 0; } .container_02 .swiper_option .swiper-pagination-progressbar { background: #eeeeee; opacity: 1; } .container_02 .swiper_option .swiper-pagination-progressbar-fill { background: #c3c3c3; } .container_03 { position: relative; padding: 128px 0 160px 0; background-color: #fff; } .container_03::before { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 513px; background-color: #00b5cd; z-index: 0; } .container_03 .inner { position: relative; z-index: 2; } .container_03 .con3_title h4 { margin-bottom: 130px; color: #fff; font-size: 60px; font-weight: 600; text-align: center; } .container_03 ul { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 60px; } .container_03 ul li { display: flex; flex-direction: column; justify-content: center; align-items: center; transition: all 0.2s; } .container_03 ul li .icon { border: 15px solid #fff; border-radius: 50%; } .container_03 ul li p { margin: 35px 0 25px 0; color: #767676; font-size: 32px; font-weight: 600; } .container_03 ul li a { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 119px; height: 42px; color: #00bcd5; font-size: 20px; font-weight: 700; border: 2px solid #00bcd5; border-radius: 40px; transition: all 0.3s; } .container_03 ul li a:hover { color: #fff; background-color: #00bcd5; } .container_03 ul li:hover { transform: scale(1.1); } .container .contents { width: 100%; } .container .contents_title { display: flex; flex-direction: column; justify-content: center; align-items: center; } .container .contents_title p { margin-bottom: 35px; color: #00b5cd; font-size: 32px; font-weight: 700; text-transform: uppercase; } .container .contents_title h4 { line-height: 1.4; color: #202020; font-size: 56px; font-weight: 700; text-align: center; } .container .contents_title h4 span { position: relative; color: #00b5cd; } .container .contents_title h4 span::before { position: absolute; top: -14px; left: 50%; transform: translate(-50%, 0); content: ""; width: 8px; height: 8px; background-color: #00b5cd; border-radius: 50%; } .container .contents_title > div { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 30px; } .container .contents_title > div .swiper-pagination { position: initial; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 12px; margin-top: 45px; } .container .contents_title > div .swiper-pagination .swiper-pagination-bullet { display: inline-block; width: 13px; height: 13px; border-radius: 100%; background: #d6d6d6; opacity: 1; } .container .contents_title > div .swiper-pagination .swiper-pagination-bullet-active { width: 36px; background: #00c3dd; border-radius: 20px; transition: all 0.3s; } .container .contents_title .title_bottom { position: relative; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; margin-top: 45px; padding: 10px 56px 10px 30px; color: #989898; font-size: 24px; font-weight: 500; border: 1px solid #dcdcdc; border-radius: 40px; } .container .contents_title .title_bottom::before { position: absolute; top: 50%; right: 30px; transform: translate(0, -50%); content: ""; width: 12px; height: 21px; background-image: url("/common/img/main/main_title_bottom_arrow.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .container_04 { position: relative; padding: 160px 0 200px 0; } .container_04 .inner { display: flex; flex-direction: row; align-items: flex-start; } .container_04 .contents_inner { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 80px; } .container_04 .contents_inner .con4_swiper_wrap { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 750px; } .container_04 .contents_inner .con4_swiper { position: relative; width: 637px; overflow: hidden; } .container_04 .contents_inner .con4_swiper .swiper-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .container_04 .contents_inner .swiper-button-prev, .container_04 .contents_inner .swiper-button-next { position: absolute; top: 50%; width: 48px; height: 48px; border-color: #00c3dd; margin-top: -31px; background-image: initial; } .container_04 .contents_inner .swiper-button-prev { border-bottom: 6px solid #00c3dd; border-left: 6px solid #00c3dd; transform: rotate(45deg); left: 0; } .container_04 .contents_inner .swiper-button-next { border-bottom: 6px solid #00c3dd; border-left: 6px solid #00c3dd; transform: rotate(-135deg); right: 0; } .container_04 .contents_inner .box { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; } .container_04 .contents_inner .box_img { width: 637px; height: 424px; margin-bottom: 42px; border-radius: 15px; overflow: hidden; } .container_04 .contents_inner .box_img > img { width: 100%; height: 100%; object-fit: cover; border-radius: 15px; overflow: hidden; } .container_04 .contents_inner .box_step { margin-bottom: 15px; margin-left: 25px; color: #00b5cd; font-size: 26px; font-weight: 700; } .container_04 .contents_inner .box_title { margin-bottom: 20px; margin-left: 25px; line-height: 1.4; color: #343434; font-size: 34px; font-weight: 700; } .container_04 .contents_inner .box_title span { position: relative; color: #00b5cd; z-index: 1; box-shadow: inset 0 -10px #ebfdff; } .container_04 .contents_inner .box_tag { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 10px; margin-left: 25px; } .container_04 .contents_inner .box_tag i { display: inline-block; padding: 6px 25px; color: #00b5cd; font-weight: 500; font-style: normal; border: 1px solid #00b5cd; border-radius: 40px; } .container_04 .contents_inner .bottom { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 30px; } .container_04 .contents_inner .bottom .title_bottom { position: relative; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; margin-top: 45px; padding: 10px 56px 10px 30px; color: #989898; font-size: 24px; border: 1px solid #dcdcdc; border-radius: 40px; } .container_04 .contents_inner .bottom .title_bottom::before { position: absolute; top: 50%; right: 30px; transform: translate(0, -50%); content: ""; width: 12px; height: 21px; background-image: url("/common/img/main/main_title_bottom_arrow.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .container_04 .contents_inner .bottom .swiper-pagination { position: initial; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 12px; margin-top: 45px; } .container_04 .contents_inner .bottom .swiper-pagination .swiper-pagination-bullet { display: inline-block; width: 13px; height: 13px; border-radius: 100%; background: #d6d6d6; opacity: 1; } .container_04 .contents_inner .bottom .swiper-pagination .swiper-pagination-bullet-active { width: 36px; background: #00c3dd; border-radius: 20px; transition: all 0.3s; } .container_05 { position: relative; background-color: #00b5cd; } .container_05 .inner { display: flex; flex-direction: row; align-items: flex-start; } .container_05 .contents { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; padding-left: 300px; } .container_05 .contents_inner .con5_slider { position: relative; width: 550px; height: 920px; overflow: hidden; } .container_05 .contents_inner .con5_slider .swiper-slide { width: 100%; opacity: 0; transition: all 0.3s; } .container_05 .contents_inner .con5_slider .swiper-slide-active { transform: scale(0.6) translate(0, 30%); opacity: 0.6; } .container_05 .contents_inner .con5_slider .swiper-slide-active + .swiper-slide { transform: scale(0.8); opacity: 0.8; } .container_05 .contents_inner .con5_slider .swiper-slide-active + .swiper-slide + .swiper-slide { opacity: 1; } .container_05 .contents_inner .con5_slider .swiper-slide-active + .swiper-slide + .swiper-slide + .swiper-slide { transform: scale(0.8); opacity: 0.8; } .container_05 .contents_inner .con5_slider .swiper-slide-active + .swiper-slide + .swiper-slide + .swiper-slide + .swiper-slide { transform: scale(0.6) translate(0, -30%); opacity: 0.6; } .container_05 .contents_inner .con5_slider .swiper-slide > div { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 20px; width: 100%; height: 160px; padding: 0 30px; background-color: #fff; border-radius: 20px; } .container_05 .contents_inner .con5_slider .swiper-slide > div img { width: 87px; object-fit: contain; } .container_05 .contents_inner .con5_slider .swiper-slide > div > div { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; width: calc(100% - 87px); gap: 10px; } .container_05 .contents_inner .con5_slider .swiper-slide > div > div h6 { color: #202020; font-size: 24px; font-weight: 700; } .container_05 .contents_inner .con5_slider .swiper-slide > div > div p { color: #a8a8a8; font-size: 16px; font-weight: 600; } .container_05 .contents_title { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; margin-left: 150px; } .container_05 .contents_title p { color: #fff; font-weight: 600; z-index: 1; } .container_05 .contents_title h4 { color: #fff; font-size: 50px; font-weight: 600; text-align: left; z-index: 1; } .container_05 .contents_title h4 b { color: #fff; font-weight: 700; } .container_05 .contents_title span { margin-top: 25px; line-height: 1.2; color: #fff; font-size: 20px; font-weight: 500; z-index: 1; } .container_05 .contents_title .title_bottom { color: #00b6ce; font-weight: 700; background-color: #fff; border: 0; z-index: 1; } .container_05 .contents_title .title_bottom::before { background-image: url("/common/img/main/main_title_bottom_arrow_mint.png"); } .container_05 .contents_title::before { position: absolute; top: -100px; right: 70px; content: ""; width: 359px; height: 381px; background-image: url("/common/img/main/main_con5_title_deco.png"); background-repeat: no-repeat; background-position: center; background-size: contain; z-index: 0; } .container_06 { position: relative; padding: 200px 0 200px 0; background-color: #f6f6f6; } .container_06 .inner { display: flex; flex-direction: row; align-items: flex-start; max-width: initial; } .container_06 .contents { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; } .container_06 .contents_title { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; margin-bottom: 180px; } .container_06 .contents_title p { color: #00b5cd; font-weight: 700; } .container_06 .contents_title h4 { color: #202020; font-size: 60px; font-weight: 700; text-align: center; } .container_06 .contents_title span { margin-top: 25px; line-height: 1.4; color: #8d8d8d; font-size: 24px; font-weight: 600; text-align: center; } .container_06 .contents_title .title_bottom { color: #fff; font-weight: 600; background-color: #00b5cd; border: 0; } .container_06 .contents_title .title_bottom::before { background-image: url("/common/img/main/main_title_bottom_arrow_white.png"); } .container_06 .contents_inner { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; width: 100%; margin-bottom: 80px; padding-left: 280px; overflow: hidden; } .container_06 .contents_inner .con6_swiper_title { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; width: 400px; height: 590px; padding: 95px 40px; background-color: #00b5cd; border-radius: 20px; overflow: hidden; } .container_06 .contents_inner .con6_swiper_title h5 { margin-bottom: 10px; color: #fff; font-size: 46px; font-weight: 700; } .container_06 .contents_inner .con6_swiper_title .slider-for { position: relative; } .container_06 .contents_inner .con6_swiper_title .slider-for p { position: relative; display: inline-block; color: #fff; font-size: 40px; font-weight: 600; white-space: nowrap; z-index: 1; box-shadow: inset 0 -10px #00afc5; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-arrow { position: absolute; top: 100px; width: 59px; height: 59px; font-size: 0; background-repeat: no-repeat; background-position: center; background-size: contain; cursor: pointer; z-index: 2; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-arrow.slick-prev { left: 0; background-image: url("/common/img/main/con6_arrow_left.png"); } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-arrow.slick-next { left: 74px; background-image: url("/common/img/main/con6_arrow_right.png"); } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots { position: absolute; top: 190px; left: 0; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 12px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots li { width: 13px; height: 13px; font-size: 0; border-radius: 100%; background: #66d3e1; opacity: 1; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots li.slick-active { width: 36px; background: #fff; border-radius: 20px; transition: all 0.3s; } .container_06 .contents_inner .con6_swiper_title a { position: relative; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; margin-top: 220px; padding: 10px 56px 10px 30px; color: #00b5cd; font-size: 24px; font-weight: 700; background-color: #fff; border-radius: 40px; } .container_06 .contents_inner .con6_swiper_title a::before { position: absolute; top: 50%; right: 30px; transform: translate(0, -50%); content: ""; width: 12px; height: 21px; background-image: url("/common/img/main/main_title_bottom_arrow_mint.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .container_06 .contents_inner .slider-nav { width: calc(100% - 310px); margin-left: -90px; } .container_06 .contents_inner .slider-nav .item { width: 380px; height: 380px; margin-right: 40px; } .container_06 .contents_inner .slider-nav .wrap { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; width: 100%; height: 100%; padding: 30px; background-color: #fff; border-radius: 20px; } .container_06 .contents_inner .slider-nav .wrap > div { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; gap: 6px; } .container_06 .contents_inner .slider-nav .wrap > div h6 { color: #00b5cd; font-size: 28px; font-weight: 700; } .container_06 .contents_inner .slider-nav .wrap > div p { color: #b6b6b6; font-size: 20px; font-weight: 600; } .container_06 .contents_inner .slider-nav .wrap ul { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; gap: 15px; margin-top: 20px; width: 100%; } .container_06 .contents_inner .slider-nav .wrap ul li { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; color: #8c8c8c; font-size: 20px; font-weight: 600; width: 100%; } .container_06 .contents_inner .slider-nav .wrap ul li > img { max-width: 45px; max-height: 45px; margin-right: 10px; border-radius: 50%; overflow: hidden; width: 100%; height: 100%; object-fit: cover; } .container_06 .contents_inner .slider-nav .wrap ul li span { margin-left: 5px; color: #00bcd5; font-size: 15px; } .container_06 .contents_inner .for_hidden { position: relative; width: calc(100% - 400px + 80px); margin-left: -80px; overflow: hidden; z-index: 3; } .container_06 .contents_bottom { display: flex; flex-direction: column; justify-content: center; align-items: center; } .container_06 .contents_bottom ul { position: relative; width: 1043px; height: 350px; } .container_06 .contents_bottom ul li { position: absolute; display: flex; flex-direction: column; justify-content: center; align-items: center; line-height: 1.3; color: #00b5cd; font-weight: 600; text-align: center; background-color: #fff; border-radius: 50%; transition: all 0.3s; } .container_06 .contents_bottom ul li:hover { color: #fff; background-color: #00b5cd; } .container_06 .contents_bottom ul li:nth-of-type(1) { top: 40px; left: 370px; gap: 10px; width: 300px; height: 300px; font-size: 80px; opacity: 1; animation: 3s icon infinite linear; } .container_06 .contents_bottom ul li:nth-of-type(1) span { font-size: 30px; font-weight: 500; opacity: 0.7; } @-webkit-keyframes icon { 0% { transform: translateY(0); } 50% { transform: translateY(20px); } 100% { transform: translateY(0); } } .container_06 .contents_bottom ul li:nth-of-type(1):hover { top: 20px; left: 350px; width: 340px; height: 340px; } .container_06 .contents_bottom ul li:nth-of-type(2) { top: 27px; left: 0; width: 178px; height: 178px; font-size: 36px; animation: 2s icon infinite linear; } @-webkit-keyframes icon { 0% { transform: translateY(0); } 50% { transform: translateY(10px); } 100% { transform: translateY(0); } } .container_06 .contents_bottom ul li:nth-of-type(2):hover { top: 7px; left: -20px; width: 218px; height: 218px; } .container_06 .contents_bottom ul li:nth-of-type(3) { top: 187px; left: 177px; width: 140px; height: 140px; font-size: 30px; animation: 1.5s icon infinite linear; } @-webkit-keyframes icon { 0% { transform: translateY(0); } 50% { transform: translateY(10px); } 100% { transform: translateY(0); } } .container_06 .contents_bottom ul li:nth-of-type(3):hover { top: 167px; left: 157px; width: 180px; height: 180px; } .container_06 .contents_bottom ul li:nth-of-type(4) { top: 204px; left: 680px; width: 150px; height: 150px; font-size: 24px; animation: 1s icon infinite linear; } @-webkit-keyframes icon { 0% { transform: translateY(0); } 50% { transform: translateY(5px); } 100% { transform: translateY(0); } } .container_06 .contents_bottom ul li:nth-of-type(4):hover { top: 184px; left: 660px; width: 190px; height: 190px; } .container_06 .contents_bottom ul li:nth-of-type(5) { top: 0; right: 142px; width: 150px; height: 150px; font-size: 30px; animation: 3s icon infinite linear; } @-webkit-keyframes icon { 0% { transform: translateY(0); } 50% { transform: translateY(20px); } 100% { transform: translateY(0); } } .container_06 .contents_bottom ul li:nth-of-type(5):hover { top: -20px; right: 122px; width: 190px; height: 190px; } .container_06 .contents_bottom ul li:nth-of-type(6) { top: 119px; right: 0; width: 140px; height: 140px; font-size: 26px; animation: 4s icon infinite linear; } @-webkit-keyframes icon { 0% { transform: translateY(0); } 50% { transform: translateY(15px); } 100% { transform: translateY(0); } } .container_06 .contents_bottom ul li:nth-of-type(6):hover { top: 99px; right: -20px; width: 180px; height: 180px; } .container_06 .contents_bottom h6 { margin-top: 70px; color: #2e2e2e; font-size: 56px; font-weight: 700; text-align: center; } .container_06 .contents_bottom h6 span { color: #00b5cd; font-weight: 800; } .container_07 { position: relative; padding: 120px 0 180px 0; background-color: #ffffff; } .container_07::before { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 500px; background-color: #00b5cd; } .container_07 .inner { display: flex; flex-direction: row; align-items: flex-start; max-width: initial; } .container_07 .contents { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; width: 100%; } .container_07 .contents_title { position: relative; display: flex; flex-direction: row; align-items: center; align-items: flex-end; justify-content: flex-start; margin-bottom: 75px; padding-left: 320px; } .container_07 .contents_title > div { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 0; } .container_07 .contents_title > div p { color: #fff; font-weight: 600; } .container_07 .contents_title > div h4 { color: #fff; font-size: 50px; font-weight: 600; text-align: left; } .container_07 .contents_title > div h4 b { position: relative; font-weight: 700; z-index: 1; box-shadow: inset 0 -10px #00afc5; } .container_07 .contents_title .con7_swiper_option { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: flex-start; gap: 33px; margin-left: 180px; margin-bottom: -10px; } .container_07 .contents_title .con7_swiper_option .swiper-button { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 15px; } .container_07 .contents_title .con7_swiper_option .swiper-button-prev, .container_07 .contents_title .con7_swiper_option .swiper-button-next { position: initial; display: flex; align-items: center; justify-content: center; width: initial; height: initial; margin-top: initial; background-image: initial; } .container_07 .contents_title .con7_swiper_option .swiper-pagination { width: 252px; height: 3px; margin-top: 0; } .container_07 .contents_title .con7_swiper_option .swiper-pagination-progressbar { background: #66d3e1; opacity: 1; } .container_07 .contents_title .con7_swiper_option .swiper-pagination-progressbar-fill { background: #fff; } .container_07 .contents_inner { display: flex; flex-direction: row; align-items: center; justify-content: flex-end; width: 100%; margin-bottom: 100px; padding-left: 700px; overflow: hidden; } .container_07 .contents_inner .for_hidden { position: relative; width: 100%; overflow: hidden; z-index: 3; } .container_07 .contents_inner .for_hidden .con7_swiper { width: 636px; width: 100%; } .container_07 .contents_inner .for_hidden .con7_swiper .swiper-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .container_07 .contents_inner .for_hidden .con7_swiper .swiper-wrapper .swiper-slide { width: 303px; } .container_07 .contents_inner .for_hidden .con7_swiper .swiper-wrapper .swiper-slide-active .box_img h6 { color: #fff; } .container_07 .contents_inner .for_hidden .con7_swiper .swiper-wrapper .swiper-slide-active .box_img p { color: #fff; } .container_07 .contents_inner .for_hidden .con7_swiper .swiper-wrapper .swiper-slide-active .box_desc { opacity: 1; } .container_07 .contents_inner .for_hidden .con7_swiper .box { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 16px; width: 303px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_img { position: relative; width: 100%; height: 435px; border-radius: 15px; overflow: hidden; } .container_07 .contents_inner .for_hidden .con7_swiper .box_img > img { width: 100%; height: 100%; object-fit: cover; } .container_07 .contents_inner .for_hidden .con7_swiper .box_img h6 { position: absolute; left: 30px; bottom: 55px; color: rgba(255, 255, 255, 0.4); font-size: 30px; font-weight: 600; } .container_07 .contents_inner .for_hidden .con7_swiper .box_img p { position: absolute; left: 30px; bottom: 30px; color: rgba(255, 255, 255, 0.4); font-size: 18px; font-weight: 600; } .container_07 .contents_inner .for_hidden .con7_swiper .box_desc { width: 100%; height: 125px; padding: 22px; background-color: #f1f1f1; border-radius: 15px; overflow: hidden; opacity: 0.6; } .container_07 .contents_inner .for_hidden .con7_swiper .box_desc p { color: #888888; font-size: 20px; font-weight: 500; } .container_07 .contents_bottom { display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 0 auto; } .container_07 .contents_bottom p { color: #8d8d8d; font-size: 26px; font-weight: 600; text-align: center; } .container_07 .contents_bottom .title_bottom { position: relative; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; width: 259px; margin-top: 41px; padding: 10px 56px 10px 30px; color: #fff; font-size: 24px; font-weight: 600; background-color: #00bcd5; border-radius: 40px; } .container_07 .contents_bottom .title_bottom::before { position: absolute; top: 50%; right: 30px; transform: translate(0, -50%); content: ""; width: 12px; height: 21px; background-image: url("/common/img/main/main_title_bottom_arrow_white.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .container_08 { position: relative; padding: 100px 0 0 0; } .container_08 .inner { max-width: initial; } .container_08::before { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 1271px; background-image: url("/common/img/main/con8_bg_new.jpg"); background-repeat: no-repeat; background-position: center; background-size: cover; border-radius: 30px 30px 0 0; } .container_08::after { position: absolute; top: 1155px; left: 70%; content: ""; width: 10px; height: 230px; background-image: url("/common/img/main/con8_arrow_deco.png"); background-repeat: no-repeat; background-position: 100% 100%; background-size: cover; z-index: 2; } .container_08 .contents { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; } .container_08 .contents_title { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; margin-bottom: 100px; } .container_08 .contents_title p { margin-bottom: 20px; color: #fff; font-weight: 500; } .container_08 .contents_title h4 { color: #fff; font-size: 60px; font-weight: 600; text-align: center; } .container_08 .contents_title span { color: #fff; font-size: 24px; font-weight: 500; opacity: 0.5; } .container_08 .tab_base { margin-top: 70px; position: relative; width: 477px; margin-left: 60%; z-index: 1; } .container_08 .tab_base li { width: 100%; border-top: 2px solid rgba(255, 255, 255, 0.3); } .container_08 .tab_base li a { position: relative; display: flex; flex-direction: row; align-items: center; align-items: flex-start; justify-content: flex-start; width: 100%; height: 100%; padding: 20px 0 25px 0; } .container_08 .tab_base li a::before { position: absolute; top: 44px; left: -24px; content: ""; width: 9px; height: 9px; background-color: #fff; border-radius: 50%; } .container_08 .tab_base li a h6 { width: 97px; margin-right: 20px; color: #fff; font-size: 46px; font-weight: 600; text-align: center; } .container_08 .tab_base li a .floor_info { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 7px 0; flex: 1; margin-top: 5px; } .container_08 .tab_base li a .floor_info span { position: relative; padding: 0 15px; color: #fff; font-size: 24px; } .container_08 .tab_base li a .floor_info span::before { position: absolute; top: 50%; right: 0; transform: translate(0, -50%); content: ""; width: 2px; height: 13px; background-color: rgba(255, 255, 255, 0.6); } .container_08 .tab_base li a .floor_info span.end::before, .container_08 .tab_base li a .floor_info span:last-of-type::before { display: none; } .container_08 .tab_base li.on a { background-color: #202c3f; } .container_08 .tab_base li:hover { background-color: rgba(255, 255, 255, 0.05); } .container_08 .tab_base li:last-of-type { border-bottom: 2px solid rgba(255, 255, 255, 0.1); } .container_08 .panel_base > li { display: none; } .container_08 .panel_base_inner { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 0 auto; margin-top: 360px; overflow: hidden; z-index: 2; } .container_08 .panel_base_inner .title { display: flex; flex-direction: column; justify-content: center; align-items: flex-end; width: 100%; max-width: 1920px; margin-bottom: 75px; } .container_08 .panel_base_inner .title > div { margin-right: 10%; } .container_08 .panel_base_inner .title span { margin-bottom: 7px; color: #00bcd5; font-size: 32px; font-weight: 600; } .container_08 .panel_base_inner .title h4 { margin-bottom: 15px; color: #202020; font-size: 50px; font-weight: 700; } .container_08 .panel_base_inner .title p { color: #9f9f9f; font-size: 26px; font-weight: 600; } .container_08 .panel_base_inner .swiper_wrap { width: calc(100% - 120px); width: 85vw; margin-left: 15vw; overflow: hidden; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper { width: 100%; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide { width: 450px; height: 450px; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div { position: relative; width: 100%; height: 100%; border-radius: 20px; overflow: hidden; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div > img { width: 100%; height: 100%; object-fit: cover; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div span { position: absolute; left: 40px; bottom: 79px; color: #fff; font-size: 20px; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div p { position: absolute; left: 40px; bottom: 36px; color: #fff; font-size: 34px; font-weight: 600; } .container_08 .panel_base_inner .swiper_option { display: flex; flex-direction: column; justify-content: center; align-items: center; width: calc(100% - 30vw); margin: 0 15vw; margin-top: 50px; } .container_08 .panel_base_inner .swiper_option .swiper-pagination { position: initial; width: 100%; height: 4px; margin-top: 0; } .container_08 .panel_base_inner .swiper_option .swiper-pagination-progressbar { background: #eeeeee; opacity: 1; } .container_08 .panel_base_inner .swiper_option .swiper-pagination-progressbar-fill { background: #c3c3c3; } .container_09 { padding: 250px 0 190px 0; background-color: #ffffff; } .container_09 .contents { padding-left: 250px; padding-right: 250px; } .container_09 .contents .top { display: flex; flex-direction: row; align-items: center; align-items: flex-start; justify-content: flex-start; margin-bottom: 30px; } .container_09 .contents .top > a { width: 700px; } .container_09 .contents_title { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; margin-left: 50px; flex: 1; } .container_09 .contents_title p { color: #00b6ce; font-weight: 700; } .container_09 .contents_title h4 { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 15px; color: #202020; font-size: 50px; font-weight: 700; text-align: left; } .container_09 .contents_title span { margin-top: 25px; line-height: 1.2; color: #868686; font-size: 28px; font-weight: 600; } .container_09 .contents_title .title_bottom { color: #fff; font-weight: 600; background-color: #00b6ce; border: 0; } .container_09 .contents_title .title_bottom::before { background-image: url("/common/img/main/main_title_bottom_arrow_white.png"); } .container_09 .contents_inner { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 30px; } .container_09 .contents_inner .box { height: 380px; border-radius: 20px; } .container_09 .contents_inner .box_01 { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; flex: 1; padding-left: 58px; background-color: #00b5cd; } .container_09 .contents_inner .box_01::before { position: absolute; right: 0; bottom: 0; content: ""; width: 323px; height: 324px; background-image: url("/common/img/main/con9_img1.png"); background-repeat: no-repeat; background-position: center; background-size: contain; z-index: 0; } .container_09 .contents_inner .box_01 .box_title { color: #fff; font-size: 45px; font-weight: 600; z-index: 1; } .container_09 .contents_inner .box_01 .box_title span { position: relative; font-weight: 700; z-index: 1; box-shadow: inset 0 -10px #00afc5; } .container_09 .contents_inner .box_01 .call { margin: 20px 0; color: #fff; font-size: 80px; font-weight: 600; z-index: 1; } .container_09 .contents_inner .box_01 .info { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 10px; z-index: 1; } .container_09 .contents_inner .box_01 .info li { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 30px; } .container_09 .contents_inner .box_01 .info_title { width: 70px; color: #fff; font-size: 26px; font-weight: 600; } .container_09 .contents_inner .box_01 .info_title.custom { white-space: nowrap; letter-spacing: 23px; } .container_09 .contents_inner .box_01 .info_desc { color: #fff; font-size: 26px; font-weight: 500; } .container_09 .contents_inner .box_02, .container_09 .contents_inner .box_03 { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 335px; } .container_09 .contents_inner .box_02 .box_title, .container_09 .contents_inner .box_03 .box_title { margin: 27px 0 20px 0; font-size: 32px; font-weight: 700; } .container_09 .contents_inner .box_02 a, .container_09 .contents_inner .box_03 a { position: relative; display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; padding: 10px 56px 10px 30px; color: #989898; font-size: 24px; font-weight: 700; background-color: #fff; border-radius: 40px; } .container_09 .contents_inner .box_02 a::before, .container_09 .contents_inner .box_03 a::before { position: absolute; top: 50%; right: 30px; transform: translate(0, -50%); content: ""; width: 12px; height: 21px; background-image: url("/common/img/main/main_title_bottom_arrow.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .container_09 .contents_inner .box_02 { background-color: #ffdb17; } .container_09 .contents_inner .box_02 .box_title { color: #311500; } .container_09 .contents_inner .box_02 a { color: #311500; } .container_09 .contents_inner .box_02 a::before { background-image: url("/common/img/main/main_title_bottom_arrow_kakao.png"); } .container_09 .contents_inner .box_03 { background-color: #29b909; } .container_09 .contents_inner .box_03 .box_title { color: #fff; } .container_09 .contents_inner .box_03 a { color: #29b909; } .container_09 .contents_inner .box_03 a::before { background-image: url("/common/img/main/main_title_bottom_arrow_naver.png"); } .footer > ul { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; gap: 50px; height: 87px; background-color: #555555; } .footer > ul li a { color: rgba(255, 255, 255, 0.6); font-size: 18px; } .footer > ul li:hover a { color: rgb(255, 255, 255); } .footer_contents { display: flex; flex-direction: row; align-items: center; align-items: flex-start; justify-content: space-between; padding: 60px 134px 80px 134px; background-color: #fff; } .footer_contents .logo { width: 253px; height: 66px; background-image: url("/common/img/main/logo_gray.png"); background-repeat: no-repeat; background-position: center; background-size: contain; } .footer_contents ul { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 12px; } .footer_contents ul li { color: #636363; font-size: 20px; font-weight: 500; } .footer_contents ul li span { color: #a1a1a1; } @media screen and (max-width: 1920px) { .container_08 .panel_base_inner .swiper_wrap { width: calc(100% - 250px); margin-left: 250px; } .container_08 .panel_base_inner .swiper_option { width: calc(100% - 500px); margin: 0 250px; margin-top: 50px; } .container_09 .contents { width: calc(100% - 500px); max-width: 1500px; margin: 0 250px; padding-left: 0; padding-right: 0; } .container_09 .contents .top > a { width: 640px; } .container_09 .contents_title { margin-left: 30px; } .container_09 .contents_inner .box_01 { padding-left: 30px; overflow: hidden; } .container_09 .contents_inner .box_01::before { width: 20vw; height: 20vw; } .container_09 .contents_inner .box_01 .box_title { font-size: 35px; } .container_09 .contents_inner .box_01 .call { margin: 15px 0; font-size: 70px; } .container_09 .contents_inner .box_01 .info li { gap: 10px; } .container_09 .contents_inner .box_01 .info_title { width: 70px; font-size: 22px; } .container_09 .contents_inner .box_01 .info_title.custom { letter-spacing: 19px; } .container_09 .contents_inner .box_01 .info_desc { font-size: 22px; } .container_09 .contents_inner .box_02, .container_09 .contents_inner .box_03 { width: 305px; } .container_09 .contents_inner .box_02 .box_title, .container_09 .contents_inner .box_03 .box_title { margin: 27px 0 20px 0; font-size: 30px; } .container_09 .contents_inner .box_02 a, .container_09 .contents_inner .box_03 a { font-size: 22px; } .container_09 .contents_inner .box_02 a::before, .container_09 .contents_inner .box_03 a::before { height: 16px; } } @media screen and (max-width: 1800px) { .container_09 .contents { width: 100%; margin: 0 auto; padding-left: 250px; padding-right: 30px; } .container_09 .contents_inner .box_01 .call { margin: 15px 0; font-size: 60px; } } @media screen and (max-width: 1600px) { .br_show_1600 { display: block; } .container_01 .scroll_down { bottom: 160px; } .container_03 ul { gap: 30px; } .container_05 .contents_title { margin-left: 50px; } .container_06 .contents_bottom { width: 100%; } .container_06 .contents_bottom ul { display: flex; flex-direction: row; align-items: center; justify-content: center; width: calc(100% - 500px); height: 350px; } .container_06 .contents_bottom ul li:nth-of-type(1) { position: initial; top: initial; left: initial; gap: 10px; width: 300px; height: 300px; font-size: 80px; opacity: 1; } .container_06 .contents_bottom ul li:nth-of-type(1) span { font-size: 18px; } .container_06 .contents_bottom ul li:nth-of-type(1):hover { top: initial; left: initial; width: 340px; height: 340px; } .container_06 .contents_bottom ul li:nth-of-type(2) { top: 27px; left: 0; width: 178px; height: 178px; font-size: 36px; } .container_06 .contents_bottom ul li:nth-of-type(2):hover { top: 7px; left: -20px; width: 218px; height: 218px; } .container_06 .contents_bottom ul li:nth-of-type(3) { top: 187px; left: 157px; width: 140px; height: 140px; font-size: 30px; } .container_06 .contents_bottom ul li:nth-of-type(3):hover { top: 167px; left: 137px; width: 180px; height: 180px; } .container_06 .contents_bottom ul li:nth-of-type(4) { top: 204px; left: 680px; width: 150px; height: 150px; font-size: 30px; } .container_06 .contents_bottom ul li:nth-of-type(4):hover { top: 184px; left: 660px; width: 190px; height: 190px; } .container_06 .contents_bottom ul li:nth-of-type(5) { top: 0; right: 142px; width: 150px; height: 150px; font-size: 30px; } .container_06 .contents_bottom ul li:nth-of-type(5):hover { top: -20px; right: 122px; width: 190px; height: 190px; } .container_06 .contents_bottom ul li:nth-of-type(6) { top: 119px; right: -20px; width: 140px; height: 140px; font-size: 26px; } .container_06 .contents_bottom ul li:nth-of-type(6):hover { top: 99px; right: -40px; width: 180px; height: 180px; } .container_06 .contents_bottom h6 { margin-top: 70px; color: #2e2e2e; font-size: 56px; font-weight: 700; text-align: center; } .container_06 .contents_bottom h6 span { color: #00b5cd; font-weight: 800; } .container_07 .contents_title { padding-left: 280px; } .container_07 .contents_title > div h4 { font-size: 45px; } .container_07 .contents_inner { padding-left: 500px; } .container_09 .contents { width: 100%; margin: 0 auto; padding-left: 250px; padding-right: 20px; } .container_09 .contents .top { margin-bottom: 20px; } .container_09 .contents .top > a { width: 550px; } .container_09 .contents_title { margin-left: 30px; } .container_09 .contents_title p { margin-bottom: 15px; } .container_09 .contents_title h4 { font-size: 45px; } .container_09 .contents_title span { margin-top: 18px; font-size: 24px; } .container_09 .contents_title .title_bottom { margin-top: 25px; font-size: 22px; } .container_09 .contents_inner { gap: 20px; } .container_09 .contents_inner .box_01 { padding-left: 30px; overflow: hidden; } .container_09 .contents_inner .box_01::before { width: 20vw; height: 20vw; } .container_09 .contents_inner .box_01 .box_title { font-size: 35px; } .container_09 .contents_inner .box_01 .call { margin: 15px 0; font-size: 60px; } .container_09 .contents_inner .box_01 .info li { gap: 10px; } .container_09 .contents_inner .box_01 .info_title { width: 70px; font-size: 22px; } .container_09 .contents_inner .box_01 .info_title.custom { letter-spacing: 19px; } .container_09 .contents_inner .box_01 .info_desc { font-size: 22px; } .container_09 .contents_inner .box_02, .container_09 .contents_inner .box_03 { width: 265px; } .container_09 .contents_inner .box_02 .box_title, .container_09 .contents_inner .box_03 .box_title { margin: 27px 0 20px 0; font-size: 30px; } .container_09 .contents_inner .box_02 a, .container_09 .contents_inner .box_03 a { padding: 10px 40px 10px 20px; font-size: 20px; } .container_09 .contents_inner .box_02 a::before, .container_09 .contents_inner .box_03 a::before { right: 20px; height: 13px; } .footer > ul li a { font-size: 16px; } .footer_contents ul li { font-size: 16px; } } @media screen and (max-width: 1400px) { /* header */ #header.hov .utile_menu .allmenu_open .bar, #header.active .utile_menu .allmenu_open .bar, #header.on .utile_menu .allmenu_open .bar { background: rgba(0, 0, 0, 0.53); } #header.hov .utile_menu .allmenu_open .bar:before, #header.hov .utile_menu .allmenu_open .bar:after, #header.active .utile_menu .allmenu_open .bar:before, #header.active .utile_menu .allmenu_open .bar:after, #header.on .utile_menu .allmenu_open .bar:before, #header.on .utile_menu .allmenu_open .bar:after { background: rgba(0, 0, 0, 0.53); } #header .header_inner_grip { display: none; } #header .utile_menu_user { gap: 13px; } #header .utile_menu_user .user { width: 120px; height: 40px; font-size: 18px; } #header .utile_menu .allmenu_open { display: block; margin-left: 15px; } .quick_bar { top: 110px; right: 40px; gap: 16px; } .quick_bar a { display: inline-block; width: 50px; height: 50px; } .quick_bar .button:hover { position: relative; } .quick_bar .button:hover::before { position: absolute; top: 50%; left: -129px; transform: translate(0, -50%); content: "메뉴 닫기"; width: 105px; height: 35px; line-height: 35px; color: #4e4e4e; font-size: 14px; text-align: center; font-weight: bold; background-color: #fff; border-radius: 8px; } .quick_bar .button:hover::after { position: absolute; top: 50%; left: -24px; transform: translate(0, -50%); content: ""; width: 12px; height: 12px; background-image: url("/common/img/main/quick_deco2.png"); background-repeat: no-repeat; background-position: 0 50%; background-size: contain; } .quick_bar .show { gap: 10px; } .quick_bar .show li:hover::before { height: 35px; line-height: 35px; font-size: 14px; } .quick_bar .show li:hover::after { height: 12px; background-position: 0 50%; } .quick_bar li:last-of-type:hover::before { height: 35px; line-height: 35px; font-size: 14px; } .quick_bar li:last-of-type:hover::after { height: 12px; background-position: 0 50%; } .follow_ul { display: none; } .container_01 .con1_title { left: 5%; } .container_01 .con1_title h3 { margin-bottom: 5px; font-size: 60px; } .container_01 .con1_title p { margin-bottom: 30px; font-size: 26px; } .container_01 .con1_title h6 { margin-bottom: 30px; font-size: 20px; } .container_01 .con1_title .con1_swiper_option { gap: 25px; } .container_01 .con1_title .con1_swiper_option .autoplay-progress { width: 33px; height: 33px; } .container_01 .con1_title .con1_swiper_option .autoplay-progress::before { border: 5px solid #959597; } .container_01 .con1_title .con1_swiper_option .autoplay-progress svg { width: 34px; height: 34px; stroke-width: 6px; } .container_01 .con1_title .con1_swiper_option .count { font-size: 16px; } .container_01 .scroll_down { left: 5%; bottom: 131px; transform: initial; align-items: flex-start; gap: 10px; } .container_01 .scroll_down p { font-size: 14px; } .container_01 .scroll_down > img { margin-left: 3px; } .container_01 .search_box { right: 40px; bottom: -50px; width: 50%; max-width: 600px; height: 270px; padding: 0 30px; } .container_01 .search_box h6 { margin-bottom: 7px; font-size: 22px; } .container_01 .search_box .input_box { position: relative; width: 100%; height: 40px; } .container_01 .search_box .input_box .input_search { height: 100%; font-size: 14px; } .container_01 .search_box .input_box .input_search::placeholder { font-size: 14px; } .container_01 .search_box .input_box .btn_search { width: 54px; height: 100%; } .container_01 .search_box .input_box .last_search_words { top: 40px; } .container_01 .search_box .word_list { gap: 20px; margin-top: 25px; } .container_01 .search_box .word_list span { padding-right: 16px; font-size: 14px; } .container_01 .search_box .word_list span::before { width: 7px; height: 8px; } .container_01 .search_box .word_list ul li i { font-size: 14px; } .container_02 { padding: 15vw 0 10vw 0; } .container_02 .con2_title { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-bottom: 10vw; } .container_02 .con2_title > img { width: 90px; margin-bottom: 3vw; } .container_02 .con2_title h4 { margin-bottom: 2vw; font-size: 50px; } .container_02 .con2_title p { font-size: 20px; } .container_02 .con2_swiper .swiper-slide { gap: 20px; height: 700px; } .container_02 .con2_swiper .swiper-slide.slide_01 { width: auto; padding-top: 100px; } .container_02 .con2_swiper .swiper-slide.slide_02 { width: auto; height: 700px; } .container_02 .con2_swiper .swiper-slide.slide_03 { width: auto; height: 600px; padding-top: 88px; padding-bottom: 112px; } .container_02 .con2_swiper .swiper-slide.slide_04 { width: auto; padding-top: 200px; } .container_02 .con2_swiper .swiper-slide.slide_05 { width: auto; height: 700px; } .container_03 { padding: 15vw 0; } .container_03::before { height: 40vw; } .container_03 .con3_title h4 { margin-bottom: 5vw; font-size: 60px; } .container_03 ul { gap: 30px; } .container_03 ul li .icon { width: 150px; height: 150px; border: 10px solid #fff; } .container_03 ul li .icon > img { border-radius: 50%; } .container_03 ul li p { margin: 2vw 0 1.4vw 0; font-size: 26px; } .container_03 ul li a { width: 100px; height: 40px; font-size: 16px; } .container_03 ul li:hover { transform: initial; } .container .contents { padding-left: 0; } .container .contents_title p { margin-bottom: 2vw; font-size: 24px; } .container .contents_title h4 { font-size: 50px; } .container .contents_title h4 span::before { top: -10px; width: 6px; height: 6px; } .container .contents_title > div { gap: 20px; } .container .contents_title > div .swiper-pagination { gap: 10px; margin-top: 2vw; } .container .contents_title > div .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; } .container .contents_title > div .swiper-pagination .swiper-pagination-bullet-active { width: 30px; border-radius: 20px; } .container .contents_title .title_bottom { margin-top: 2vw; padding: 10px 56px 10px 30px; font-size: 18px; } .container .contents_title .title_bottom::before { right: 30px; width: 12px; height: 14px; } .container_04 { padding: 10vw 0 10vw 0; } .container_04 .contents_inner { margin-top: 10vw; } .container_04 .contents_inner .box { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; } .container_04 .contents_inner .box_img { width: 100%; height: 400px; margin-bottom: 2vw; } .container_04 .contents_inner .box_step { margin-bottom: 1vw; margin-left: 25px; font-size: 24px; } .container_04 .contents_inner .box_title { margin-bottom: 1vw; margin-left: 25px; font-size: 30px; } .container_04 .contents_inner .box_tag { gap: 10px; margin-left: 25px; } .container_04 .contents_inner .box_tag i { padding: 5px 20px; } .container_05 { padding-top: 10vw; padding-bottom: 5vw; } .container_05 .contents { display: flex; flex-direction: column; justify-content: center; align-items: center; flex-direction: column-reverse; padding-left: 0; } .container_05 .contents_inner .con5_swiper { width: 550px; height: 560px; } .container_05 .contents_inner .con5_swiper .swiper-slide { gap: 20px; height: 160px; } .container_05 .contents_inner .con5_swiper .swiper-slide > div { gap: 10px; } .container_05 .contents_inner .con5_swiper .swiper-slide > div h6 { font-size: 24px; } .container_05 .contents_inner .con5_swiper .swiper-slide > div p { font-size: 16px; } .container_05 .contents_title { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-left: 0; margin-bottom: 5vw; } .container_05 .contents_title h4 { font-size: 45px; text-align: center; } .container_05 .contents_title span { font-size: 18px; text-align: center; } .container_05 .contents_title::before { top: 50%; left: 50%; right: initial; transform: translate(-50%, -50%); width: 100%; height: 100%; } .container_06 { padding: 10vw 0; } .container_06 .contents { padding-left: 0; } .container_06 .contents_title { margin-bottom: 10vw; } .container_06 .contents_title h4 { font-size: 45px; } .container_06 .contents_title span { margin-top: 2vw; font-size: 18px; } .container_06 .contents_inner { margin-bottom: 5vw; padding-left: 30px; } .container_06 .contents_inner .con6_swiper_title { width: 400px; height: 470px; padding: 95px 30px; } .container_06 .contents_inner .con6_swiper_title h5 { margin-bottom: 10px; font-size: 38px; } .container_06 .contents_inner .con6_swiper_title .slider-for p { font-size: 30px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-arrow { top: 70px; width: 45px; height: 45px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-arrow.slick-prev { left: 0; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-arrow.slick-next { left: 60px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots { top: 140px; left: 0; gap: 12px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots li { width: 13px; height: 13px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots li.slick-active { width: 36px; } .container_06 .contents_inner .con6_swiper_title a { margin-top: 140px; padding: 10px 46px 10px 20px; font-size: 20px; } .container_06 .contents_inner .con6_swiper_title a::before { right: 20px; height: 16px; } .container_06 .contents_inner .slider-nav { width: calc(100% - 310px); margin-left: -90px; } .container_06 .contents_inner .slider-nav .item { width: 340px; height: 340px; margin-right: 30px; } .container_06 .contents_inner .slider-nav .wrap { padding: 30px; } .container_06 .contents_inner .slider-nav .wrap > div { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; gap: 6px; } .container_06 .contents_inner .slider-nav .wrap > div h6 { color: #00b5cd; font-size: 28px; font-weight: 700; } .container_06 .contents_inner .slider-nav .wrap > div p { color: #b6b6b6; font-size: 20px; font-weight: 600; } .container_06 .contents_inner .slider-nav .wrap ul { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; gap: 15px; margin-top: 20px; width: 100%; } .container_06 .contents_inner .slider-nav .wrap ul li { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; color: #8c8c8c; font-size: 20px; font-weight: 600; width: 100%; } .container_06 .contents_inner .slider-nav .wrap ul li > img { margin-right: 10px; border-radius: 50%; overflow: hidden; } .container_06 .contents_inner .slider-nav .wrap ul li span { margin-left: 5px; color: #00bcd5; font-size: 15px; } .container_06 .contents_inner .for_hidden { position: relative; width: calc(100% - 400px + 80px); margin-left: -80px; overflow: hidden; z-index: 3; } .container_06 .contents_bottom > img { height: 100px; } .container_06 .contents_bottom ul { width: 80%; height: 350px; } .container_06 .contents_bottom ul li:nth-of-type(1) { gap: 10px; width: 300px; height: 300px; font-size: 60px; opacity: 1; } .container_06 .contents_bottom ul li:nth-of-type(1) span { font-size: 18px; } .container_06 .contents_bottom ul li:nth-of-type(1):hover { width: 340px; height: 340px; } .container_06 .contents_bottom ul li:nth-of-type(2) { top: 27px; left: 0; width: 178px; height: 178px; font-size: 36px; } .container_06 .contents_bottom ul li:nth-of-type(2):hover { top: 7px; left: -20px; width: 218px; height: 218px; } .container_06 .contents_bottom ul li:nth-of-type(3) { top: 187px; left: 157px; width: 140px; height: 140px; font-size: 30px; } .container_06 .contents_bottom ul li:nth-of-type(3):hover { top: 167px; left: 137px; width: 180px; height: 180px; } .container_06 .contents_bottom ul li:nth-of-type(4) { top: 204px; left: 680px; width: 150px; height: 150px; font-size: 30px; } .container_06 .contents_bottom ul li:nth-of-type(4):hover { top: 184px; left: 660px; width: 190px; height: 190px; } .container_06 .contents_bottom ul li:nth-of-type(5) { top: 0; right: 142px; width: 150px; height: 150px; font-size: 30px; } .container_06 .contents_bottom ul li:nth-of-type(5):hover { top: -20px; right: 122px; width: 190px; height: 190px; } .container_06 .contents_bottom ul li:nth-of-type(6) { top: 119px; right: -20px; width: 140px; height: 140px; font-size: 26px; } .container_06 .contents_bottom ul li:nth-of-type(6):hover { top: 99px; right: -40px; width: 180px; height: 180px; } .container_06 .contents_bottom h6 { margin-top: 10vw; font-size: 40px; } .container_07 { padding: 10vw 0 20vw 0; } .container_07::before { height: 500px; } .container_07 .contents_title { padding-left: 50px; margin-bottom: 5vw; } .container_07 .contents_title > div h4 { font-size: 40px; } .container_07 .contents_title .con7_swiper_option { gap: 33px; margin-left: 50px; margin-bottom: 0px; } .container_07 .contents_title .con7_swiper_option .swiper-button { gap: 10px; } .container_07 .contents_title .con7_swiper_option .swiper-button-prev, .container_07 .contents_title .con7_swiper_option .swiper-button-next { width: 30px; height: 30px; } .container_07 .contents_title .con7_swiper_option .swiper-pagination { width: 252px; height: 3px; margin-top: 0; } .container_07 .contents_inner { margin-bottom: 10vw; padding-left: 10vw; } .container_07 .contents_inner .for_hidden .con7_swiper { width: 636px; width: 100%; } .container_07 .contents_inner .for_hidden .con7_swiper .swiper-wrapper .swiper-slide { width: 303px; } .container_07 .contents_inner .for_hidden .con7_swiper .box { gap: 12px; width: 100%; } .container_07 .contents_inner .for_hidden .con7_swiper .box_img h6 { left: 30px; bottom: 55px; font-size: 20px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_img p { left: 30px; bottom: 30px; font-size: 16px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_desc { height: 100px; padding: 22px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_desc p { font-size: 14px; } .container_07 .contents_bottom { position: absolute; left: 50%; bottom: 10vw; transform: translate(-50%, 0); align-items: center; justify-content: center; width: 100%; margin-left: initial; } .container_07 .contents_bottom p { font-size: 26px; } .container_07 .contents_bottom .title_bottom { margin-top: 2vw; padding: 10px 56px 10px 30px; font-size: 18px; } .container_07 .contents_bottom .title_bottom::before { right: 30px; width: 12px; height: 14px; } .container_08 { padding: 10vw 0 0 0; } .container_08::before { background-position: 40% 100%; height: 1271px; } .container_08::after { left: 70%; width: 10px; } .container_08 .contents { padding-left: 50px; } .container_08 .contents_title { margin-top: 5vw; margin-bottom: 10vw; } .container_08 .contents_title p { margin-bottom: 10px; } .container_08 .contents_title h4 { font-size: 50px; } .container_08 .contents_title span { margin-top: 10px; font-size: 20px; } .container_08 .tab_base { width: 300px; margin-left: 68%; } .container_08 .tab_base li { height: initial; } .container_08 .tab_base li a { gap: 10px; padding: 20px 0 25px 0; } .container_08 .tab_base li a::before { top: 35px; left: -24px; width: 9px; height: 9px; } .container_08 .tab_base li a h6 { width: 70px; margin-right: 0px; font-size: 30px; } .container_08 .tab_base li a .floor_info { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 7px 0; flex: 1; margin-top: 5px; } .container_08 .tab_base li a .floor_info span { padding: 0 15px; font-size: 17px; } .container_08 .tab_base li a .floor_info span::before { width: 2px; height: 10px; } .container_08 .tab_base li.on a::after { top: 38px; left: -136px; width: 112px; } .container_08 .panel_base_inner { margin-top: 480px; } .container_08 .panel_base_inner .title { margin-bottom: 5vw; } .container_08 .panel_base_inner .title span { margin-bottom: 7px; font-size: 20px; } .container_08 .panel_base_inner .title h4 { margin-bottom: 15px; font-size: 40px; } .container_08 .panel_base_inner .title p { font-size: 20px; } .container_08 .panel_base_inner .swiper_wrap { width: calc(100% - 10vw); margin-left: 10vw; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide { width: 25vw; height: 25vw; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div span { left: 40px; bottom: 79px; font-size: 16px; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div p { left: 40px; bottom: 36px; font-size: 25px; } .container_08 .panel_base_inner .swiper_option { width: calc(100% - 20vw); margin: 0 10vw; margin-top: 30px; } .container_08 .panel_base_inner .swiper_option .swiper-pagination { height: 4px; } .container_09 { padding: 20vw 0 10vw 0; } .container_09 .contents { width: 50%; padding-right: 0; } .container_09 .contents .top { display: flex; flex-direction: column; justify-content: center; align-items: center; justify-content: center; } .container_09 .contents .top > a { width: 100%; } .container_09 .contents .top > a > img { width: 100%; object-fit: cover; } .container_09 .contents_title { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-left: 0; margin-bottom: 5vw; flex: 1; } .container_09 .contents_title h4 { flex-direction: column; gap: 15px; font-size: 40px; } .container_09 .contents_title span { margin-top: 25px; font-size: 20px; text-align: center; } .container_09 .contents_title .title_bottom { padding: 10px 56px 10px 30px; font-size: 18px; } .container_09 .contents_title .title_bottom::before { right: 30px; width: 12px; height: 14px; } .container_09 .contents_inner { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; flex-wrap: wrap; } .container_09 .contents_inner .box { height: 380px; } .container_09 .contents_inner .box_01 { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; flex: initial; width: 100%; padding-left: 58px; background-color: #00b5cd; } .container_09 .contents_inner .box_01::before { width: 323px; height: 324px; } .container_09 .contents_inner .box_01 .box_title { font-size: 45px; } .container_09 .contents_inner .box_01 .call { margin: 20px 0; font-size: 60px; } .container_09 .contents_inner .box_01 .info { gap: 10px; } .container_09 .contents_inner .box_01 .info li { gap: 20px; } .container_09 .contents_inner .box_01 .info_title { width: 70px; font-size: 20px; } .container_09 .contents_inner .box_01 .info_title.custom { letter-spacing: 23px; } .container_09 .contents_inner .box_01 .info_desc { font-size: 20px; } .container_09 .contents_inner .box_02, .container_09 .contents_inner .box_03 { width: initial; flex: 1; } .container_09 .contents_inner .box_02 .box_title, .container_09 .contents_inner .box_03 .box_title { margin: 27px 0 20px 0; font-size: 28px; } .container_09 .contents_inner .box_02 a, .container_09 .contents_inner .box_03 a { padding: 10px 56px 10px 30px; font-size: 20px; } .container_09 .contents_inner .box_02 a::before, .container_09 .contents_inner .box_03 a::before { right: 30px; width: 12px; height: 14px; } .footer > ul { gap: 30px; height: 60px; } .footer > ul li a { font-size: 16px; } .footer_contents { flex-direction: column; justify-content: flex-start; flex-wrap: wrap; gap: 0 50px; padding: 7vw 50px 7vw 50px; } .footer_contents .logo { width: 253px; height: 66px; margin-right: calc(100% - 253px); margin-bottom: 2vw; } .footer_contents ul { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 12px; } .footer_contents ul li { font-size: 14px; } .footer_contents ul:last-of-type { margin-top: 12px; } } @media screen and (max-width: 1200px) { .container_01 .con1_title { left: 5%; } .container_01 .con1_title h3 { margin-bottom: 5px; font-size: 60px; } .container_01 .con1_title p { margin-bottom: 20px; font-size: 20px; } .container_01 .con1_title h6 { margin-bottom: 30px; font-size: 20px; } .container_01 .scroll_down { left: 5%; bottom: 5%; gap: 10px; } .container_01 .scroll_down p { font-size: 12px; } .container_01 .scroll_down > img { height: 40px; } .container_02 .con2_title > img { width: 60px; margin-bottom: 3vw; } .container_02 .con2_title h4 { margin-bottom: 2vw; font-size: 40px; } .container_02 .con2_title p { font-size: 18px; } .container_02 .con2_swiper .swiper-slide { height: 500px; } .container_02 .con2_swiper .swiper-slide.slide_01 { padding-top: 100px; } .container_02 .con2_swiper .swiper-slide.slide_02 { height: 500px; } .container_02 .con2_swiper .swiper-slide.slide_03 { height: 400px; padding-top: 70px; padding-bottom: 20px; } .container_02 .con2_swiper .swiper-slide.slide_04 { padding-top: 100px; } .container_02 .con2_swiper .swiper-slide.slide_05 { height: 500px; } .container_03::before { height: 35vw; } .container_03 .con3_title h4 { margin-bottom: 5vw; font-size: 40px; } .container_03 ul { gap: 30px; } .container_03 ul li .icon { width: 150px; height: 150px; border: 10px solid #fff; } .container_03 ul li p { margin: 2vw 0 1.4vw 0; font-size: 20px; } .container_03 ul li a { width: 90px; height: 35px; font-size: 14px; } .container .contents_title p { font-size: 24px; } .container .contents_title h4 { font-size: 40px; } .container .contents_title > div { gap: 20px; } .container .contents_title .title_bottom { padding: 7px 56px 7px 30px; font-size: 16px; } .container .contents_title .title_bottom::before { right: 30px; width: 12px; height: 14px; } .container_04 .contents_inner .bottom .title_bottom { margin-top: 45px; padding: 10px 56px 10px 20px; font-size: 20px; } .container_04 .contents_inner .bottom .title_bottom::before { height: 14px; } .container_06 .contents_title h4 { font-size: 40px; } .container_06 .contents_title span { font-size: 18px; } .container_06 .contents_inner { margin-bottom: 5vw; padding-left: 30px; } .container_06 .contents_inner .con6_swiper_title { width: 400px; height: 470px; padding: 95px 30px; } .container_06 .contents_inner .con6_swiper_title h5 { margin-bottom: 10px; font-size: 38px; } .container_06 .contents_inner .con6_swiper_title .slider-for p { font-size: 30px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-arrow { top: 70px; width: 45px; height: 45px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-arrow.slick-prev { left: 0; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-arrow.slick-next { left: 60px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots { top: 140px; left: 0; gap: 12px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots li { width: 13px; height: 13px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots li.slick-active { width: 36px; } .container_06 .contents_inner .con6_swiper_title a { margin-top: 140px; padding: 10px 46px 10px 20px; font-size: 20px; } .container_06 .contents_inner .con6_swiper_title a::before { right: 20px; height: 16px; } .container_06 .contents_inner .slider-nav { width: calc(100% - 310px); margin-left: -90px; } .container_06 .contents_inner .slider-nav .item { width: 340px; height: 340px; margin-right: 30px; } .container_06 .contents_inner .slider-nav .wrap { padding: 30px; } .container_06 .contents_inner .slider-nav .wrap > div { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; gap: 6px; } .container_06 .contents_inner .slider-nav .wrap > div h6 { color: #00b5cd; font-size: 28px; font-weight: 700; } .container_06 .contents_inner .slider-nav .wrap > div p { color: #b6b6b6; font-size: 20px; font-weight: 600; } .container_06 .contents_inner .slider-nav .wrap ul { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; justify-content: flex-start; gap: 15px; margin-top: 20px; width: 100%; } .container_06 .contents_inner .slider-nav .wrap ul li { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; color: #8c8c8c; font-size: 20px; font-weight: 600; width: 100%; } .container_06 .contents_inner .slider-nav .wrap ul li > img { margin-right: 10px; border-radius: 50%; overflow: hidden; } .container_06 .contents_inner .slider-nav .wrap ul li span { margin-left: 5px; color: #00bcd5; font-size: 15px; } .container_06 .contents_inner .for_hidden { position: relative; width: calc(100% - 400px + 80px); margin-left: -80px; overflow: hidden; z-index: 3; } .container_06 .contents_bottom ul { width: 90vw; height: 350px; } .container_06 .contents_bottom ul li:nth-of-type(1) { top: 40px; left: 50%; transform: translate(-50%, 0); gap: 10px; width: 260px; height: 260px; font-size: 60px; } .container_06 .contents_bottom ul li:nth-of-type(1) span { font-size: 20px; } .container_06 .contents_bottom ul li:nth-of-type(2) { top: 27px; left: 0; width: 178px; height: 178px; font-size: 30px; } .container_06 .contents_bottom ul li:nth-of-type(3) { top: 187px; left: 17%; width: 140px; height: 140px; font-size: 22px; } .container_06 .contents_bottom ul li:nth-of-type(4) { top: 204px; left: 65%; width: 150px; height: 150px; font-size: 24px; } .container_06 .contents_bottom ul li:nth-of-type(4):hover { left: calc(65% + 20px); } .container_06 .contents_bottom ul li:nth-of-type(5) { top: 0; right: 12%; width: 150px; height: 150px; font-size: 26px; } .container_06 .contents_bottom ul li:nth-of-type(6) { top: 119px; right: 0; width: 140px; height: 140px; font-size: 20px; } .container_06 .contents_bottom h6 { margin-top: 8vw; line-height: 1.4; font-size: 30px; } .container_07::before { height: 50vw; } .container_07 .contents_title { margin-bottom: 5vw; } .container_07 .contents_title > div h4 { font-size: 40px; } .container_07 .contents_title .con7_swiper_option { gap: 20px; margin-left: 30px; } .container_08::before { background-position: 40% 100%; height: 100vw; } .container_08::after { top: 93.2vw; left: 70%; width: 10px; height: 180px; } .container_08 .contents_title { margin-top: 2vw; margin-bottom: 7vw; } .container_08 .contents_title p { margin-bottom: 10px; } .container_08 .contents_title h4 { font-size: 40px; } .container_08 .contents_title span { margin-top: 10px; font-size: 20px; } .container_08 .tab_base { margin-left: 64%; } .container_08 .tab_base li.on a::after { top: 38px; left: -87px; width: 70px; } .container_08 .panel_base_inner { margin-top: 30vw; } .container_08 .panel_base_inner .title { margin-bottom: 5vw; } .container_08 .panel_base_inner .title span { margin-bottom: 7px; font-size: 20px; } .container_08 .panel_base_inner .title h4 { margin-bottom: 15px; font-size: 40px; } .container_08 .panel_base_inner .title p { font-size: 20px; } .container_08 .panel_base_inner .swiper_wrap { width: calc(100% - 10vw); margin-left: 10vw; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide { width: 25vw; height: 25vw; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div span { left: 40px; bottom: 79px; font-size: 16px; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div p { left: 40px; bottom: 36px; font-size: 25px; } .container_08 .panel_base_inner .swiper_option { width: calc(100% - 20vw); margin: 0 10vw; margin-top: 30px; } .container_08 .panel_base_inner .swiper_option .swiper-pagination { height: 4px; } .container_09 .contents { width: 70%; } .container_09 .contents_title h4 { font-size: 40px; } .container_09 .contents_title span { margin-top: 25px; font-size: 18px; } .container_09 .contents_title .title_bottom { padding: 10px 56px 10px 30px; font-size: 18px; } .container_09 .contents_title .title_bottom::before { right: 30px; width: 12px; height: 14px; } .container_09 .contents_inner .box { height: 380px; } .container_09 .contents_inner .box_01 { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; flex: initial; width: 100%; padding-left: 58px; background-color: #00b5cd; } .container_09 .contents_inner .box_01::before { width: 323px; height: 324px; } .container_09 .contents_inner .box_01 .box_title { font-size: 30px; } .container_09 .contents_inner .box_01 .call { margin: 20px 0; font-size: 60px; } .container_09 .contents_inner .box_01 .info { gap: 10px; } .container_09 .contents_inner .box_01 .info li { gap: 20px; } .container_09 .contents_inner .box_01 .info_title { width: 70px; font-size: 20px; } .container_09 .contents_inner .box_01 .info_title.custom { letter-spacing: 23px; } .container_09 .contents_inner .box_01 .info_desc { font-size: 20px; } .container_09 .contents_inner .box_02, .container_09 .contents_inner .box_03 { width: initial; flex: 1; } .container_09 .contents_inner .box_02 .box_title, .container_09 .contents_inner .box_03 .box_title { margin: 27px 0 20px 0; font-size: 28px; } .container_09 .contents_inner .box_02 a, .container_09 .contents_inner .box_03 a { padding: 10px 56px 10px 30px; font-size: 20px; } .container_09 .contents_inner .box_02 a::before, .container_09 .contents_inner .box_03 a::before { right: 30px; width: 12px; height: 14px; } } @media screen and (max-width: 992px) { .br_show_992 { display: block; } .container_01 .con1_title { left: 5%; } .container_01 .con1_title h3 { margin-bottom: 5px; font-size: 40px; } .container_01 .con1_title p { margin-bottom: 20px; font-size: 18px; } .container_01 .con1_title h6 { margin-bottom: 30px; font-size: 18px; } .container_01 .scroll_down { left: 5%; bottom: 5%; gap: 10px; } .container_01 .scroll_down p { font-size: 12px; } .container_01 .scroll_down > img { height: 40px; } .container_01 .search_box { right: 40px; bottom: -80px; width: 62%; height: 260px; padding: 0 20px; } .container_01 .search_box h6 { margin-bottom: 7px; font-size: 20px; } .container_01 .search_box .input_box { position: relative; width: 100%; height: 40px; } .container_01 .search_box .input_box .input_search { font-size: 14px; } .container_01 .search_box .input_box .input_search::placeholder { font-size: 14px; } .container_01 .search_box .input_box .btn_search { width: 54px; } .container_01 .search_box .word_list { gap: 20px; margin-top: 25px; } .container_01 .search_box .word_list span { padding-right: 16px; font-size: 14px; } .container_01 .search_box .word_list span::before { width: 7px; height: 8px; } .container_01 .search_box .word_list ul li i { font-size: 14px; } .container_03::before { height: 35vw; } .container_03 .con3_title h4 { margin-bottom: 5vw; font-size: 40px; } .container_03 ul { gap: 20px; } .container_03 ul li .icon { width: 120px; height: 120px; border: 7px solid #fff; } .container_03 ul li p { margin: 2vw 0 1.4vw 0; font-size: 20px; } .container_03 ul li a { width: 90px; height: 35px; font-size: 14px; } .container .contents_title p { margin-bottom: 1vw; font-size: 22px; } .container .contents_title h4 { font-size: 34px; } .container .contents_title > div { gap: 20px; } .container .contents_title .title_bottom { padding: 7px 56px 7px 30px; font-size: 14px; } .container .contents_title .title_bottom::before { right: 30px; width: 12px; height: 14px; } .container_06 .contents_title h4 { font-size: 40px; } .container_06 .contents_title span { font-size: 18px; } .container_06 .contents_bottom ul { width: 95vw; height: 350px; } .container_06 .contents_bottom ul li:nth-of-type(1) { top: 40px; left: 50%; transform: translate(-50%, 0); gap: 10px; width: 210px; height: 210px; font-size: 40px; } .container_06 .contents_bottom ul li:nth-of-type(1) span { font-size: 20px; } .container_06 .contents_bottom ul li:nth-of-type(2) { top: 27px; left: 5%; width: 150px; height: 150px; font-size: 24px; } .container_06 .contents_bottom ul li:nth-of-type(3) { top: 187px; left: 17%; width: 140px; height: 140px; font-size: 22px; } .container_06 .contents_bottom ul li:nth-of-type(4) { top: 204px; left: 65%; width: 130px; height: 130px; font-size: 22px; } .container_06 .contents_bottom ul li:nth-of-type(5) { top: 0; right: 15%; width: 150px; height: 150px; font-size: 26px; } .container_06 .contents_bottom ul li:nth-of-type(6) { top: 119px; right: 0; width: 120px; height: 120px; font-size: 20px; } .container_06 .contents_bottom h6 { font-size: 28px; } .container_07 { padding-bottom: 25vw; } .container_07::before { height: 50vw; } .container_07 .contents_title { margin-bottom: 5vw; } .container_07 .contents_title > div h4 { font-size: 30px; } .container_07 .contents_title .con7_swiper_option { gap: 20px; margin-left: 30px; } .container_07 .contents_title .con7_swiper_option .swiper-pagination { width: 150px; } .container_07 .contents_inner { padding-left: 6vw; } .container_07 .contents_bottom p { font-size: 22px; } .container_08::before { background-position: 50% 100%; height: 850px; } .container_08::after { display: none; } .container_08 .contents { padding-left: 50px; } .container_08 .contents_title { margin-top: 2vw; margin-bottom: 7vw; } .container_08 .contents_title p { margin-bottom: 10px; } .container_08 .contents_title h4 { font-size: 40px; } .container_08 .contents_title span { margin-top: 10px; font-size: 20px; } .container_08 .tab_base { margin-left: 55%; } .container_08 .tab_base li.on a::after { top: 38px; left: -87px; width: 70px; } .container_08 .panel_base_inner { margin-top: 100px; } .container_08 .panel_base_inner .title { margin-bottom: 5vw; } .container_08 .panel_base_inner .title span { margin-bottom: 7px; font-size: 20px; } .container_08 .panel_base_inner .title h4 { margin-bottom: 15px; font-size: 40px; } .container_08 .panel_base_inner .title p { font-size: 20px; } .container_08 .panel_base_inner .swiper_wrap { width: calc(100% - 5vw); margin-left: 5vw; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide { width: 30vw; height: 30vw; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div span { left: 30px; bottom: 79px; font-size: 16px; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div p { left: 30px; bottom: 36px; font-size: 25px; } .container_08 .panel_base_inner .swiper_option { width: calc(100% - 10vw); margin: 0 5vw; margin-top: 20px; } .container_08 .panel_base_inner .swiper_option .swiper-pagination { height: 4px; } .container_09 .contents { width: 60%; } .container_09 .contents_title h4 { font-size: 40px; } .container_09 .contents_title span { margin-top: 25px; font-size: 18px; } .container_09 .contents_title .title_bottom { padding: 10px 56px 10px 30px; font-size: 18px; } .container_09 .contents_title .title_bottom::before { right: 30px; width: 12px; height: 14px; } .container_09 .contents_inner .box { height: 320px; } .container_09 .contents_inner .box_01 { padding-left: 30px; } .container_09 .contents_inner .box_01 .box_title { font-size: 30px; } .container_09 .contents_inner .box_01 .call { margin: 20px 0; font-size: 40px; } .container_09 .contents_inner .box_01 .info { gap: 10px; } .container_09 .contents_inner .box_01 .info li { gap: 20px; } .container_09 .contents_inner .box_01 .info_title { width: 40px; font-size: 14px; } .container_09 .contents_inner .box_01 .info_title.custom { letter-spacing: 12px; } .container_09 .contents_inner .box_01 .info_desc { font-size: 14px; } .container_09 .contents_inner .box_02 .box_title, .container_09 .contents_inner .box_03 .box_title { margin: 27px 0 20px 0; font-size: 22px; } .container_09 .contents_inner .box_02 a, .container_09 .contents_inner .box_03 a { padding: 10px 46px 10px 20px; font-size: 16px; } .container_09 .contents_inner .box_02 a::before, .container_09 .contents_inner .box_03 a::before { right: 20px; width: 12px; height: 10px; } .footer > ul { flex-wrap: wrap; gap: 15px; height: initial; padding: 10px 0; } .footer > ul li { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; } .footer > ul li a { font-size: 12px; letter-spacing: -0.5px; } } @media screen and (max-width: 768px) { .br_show_768 { display: block; } /* header */ #header { height: 70px; } #header .header_inner { padding: 0 20px; } #header .header_inner .logo > a { width: 140px; height: 40px; } #header .utile_menu_user { gap: 10px; } #header .utile_menu_user .user { width: 90px; height: 35px; font-size: 12px; } .container_01 .con1_title { left: 5%; } .container_01 .con1_title h3 { margin-bottom: 5px; font-size: 30px; } .container_01 .con1_title p { margin-bottom: 10px; font-size: 14px; } .container_01 .con1_title h6 { margin-bottom: 15px; font-size: 14px; } .container_01 .con1_title .con1_swiper_option { gap: 25px; } .container_01 .con1_title .con1_swiper_option .autoplay-progress { width: 33px; height: 33px; } .container_01 .con1_title .con1_swiper_option .autoplay-progress::before { border: 5px solid #959597; } .container_01 .con1_title .con1_swiper_option .autoplay-progress svg { width: 34px; height: 34px; stroke-width: 6px; } .container_01 .con1_title .con1_swiper_option .count { font-size: 12px; } .container_01 .scroll_down { left: 5%; transform: initial; align-items: flex-start; gap: 10px; } .container_01 .scroll_down p { font-size: 12px; } .container_01 .scroll_down > img { height: 30px; } .container_01 .search_box { left: 50%; right: initial; bottom: -220px; transform: translate(-50%, 0); width: 75%; height: 260px; padding: 0 30px; } .container_01 .search_box h6 { margin-bottom: 7px; font-size: 20px; } .container_01 .search_box .input_box { position: relative; width: 100%; height: 40px; } .container_01 .search_box .input_box .input_search { font-size: 14px; } .container_01 .search_box .input_box .input_search::placeholder { font-size: 14px; } .container_01 .search_box .input_box .btn_search { width: 54px; } .container_01 .search_box .word_list { gap: 30px; margin-top: 25px; } .container_01 .search_box .word_list span { padding-right: 16px; font-size: 14px; } .container_01 .search_box .word_list span::before { width: 7px; height: 8px; } .container_01 .search_box .word_list ul li { font-size: 14px; } .container_01 .search_box .word_list ul li i { font-size: 14px; } .container_02 { padding: 300px 0 10vw 0; } .container_02 .con2_title > img { width: 60px; } .container_02 .con2_title h4 { font-size: 35px; } .container_02 .con2_title p { font-size: 14px; } .container_02 .con2_swiper .swiper-slide { height: 400px; gap: 10px; } .container_02 .con2_swiper .swiper-slide.slide_01 { padding-top: 30px; } .container_02 .con2_swiper .swiper-slide.slide_02 { height: 400px; } .container_02 .con2_swiper .swiper-slide.slide_03 { height: 300px; padding-top: 20px; padding-bottom: 50px; } .container_02 .con2_swiper .swiper-slide.slide_04 { padding-top: 60px; } .container_02 .con2_swiper .swiper-slide.slide_05 { height: 400px; } .container_03::before { height: 43vw; max-height: 281px; } .container_03 .con3_title h4 { margin-bottom: 5vw; font-size: 34px; } .container_03 ul { gap: 15px; } .container_03 ul li .icon { width: 90px; height: 90px; border: 5px solid #fff; } .container_03 ul li p { margin: 2vw 0 1.4vw 0; font-size: 18px; } .container_03 ul li a { width: 80px; height: 30px; font-size: 12px; } .container .contents_title p { margin-bottom: 2vw; font-size: 18px; } .container .contents_title h4 { font-size: 30px; } .container_04 .contents_inner .con4_swiper_wrap { width: 95vw; } .container_04 .contents_inner .con4_swiper { width: 90%; } .container_04 .contents_inner .swiper-button-prev, .container_04 .contents_inner .swiper-button-next { width: 30px; height: 30px; margin-top: -15px; } .container_04 .contents_inner .swiper-button-prev { border-bottom: 4px solid #00c3dd; border-left: 4px solid #00c3dd; } .container_04 .contents_inner .swiper-button-next { border-bottom: 4px solid #00c3dd; border-left: 4px solid #00c3dd; } .container_04 .contents_inner .box_img { width: auto; height: initial; margin-bottom: 2vw; } .container_04 .contents_inner .box_step { margin-bottom: 1vw; margin-left: 25px; font-size: 18px; } .container_04 .contents_inner .box_title { margin-bottom: 1vw; margin-left: 25px; font-size: 20px; } .container_04 .contents_inner .box_tag { gap: 10px; margin-left: 25px; } .container_04 .contents_inner .box_tag i { padding: 5px 15px; font-size: 12px; } .container_04 .contents_inner .bottom .title_bottom { font-size: 16px; } .container_05 .contents_inner { width: 100%; } .container_05 .contents_inner .con5_slider { width: 85%; height: 410px; margin: 0 auto; } .container_05 .contents_inner .con5_slider .swiper-slide { display: flex; flex-direction: row; align-items: center; justify-content: center; } .container_05 .contents_inner .con5_slider .swiper-slide-active { transform: scale(0.7); opacity: 0.6; } .container_05 .contents_inner .con5_slider .swiper-slide-active + .swiper-slide { transform: scale(1); opacity: 1; } .container_05 .contents_inner .con5_slider .swiper-slide-active + .swiper-slide + .swiper-slide { transform: scale(0.7); opacity: 0.6; } .container_05 .contents_inner .con5_slider .swiper-slide > div { gap: 10px; height: 130px; } .container_05 .contents_inner .con5_slider .swiper-slide > div > img { width: 65px; } .container_05 .contents_inner .con5_slider .swiper-slide > div > div { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 10px; } .container_05 .contents_inner .con5_slider .swiper-slide > div > div h6 { color: #202020; font-size: 17px; font-weight: 700; } .container_05 .contents_inner .con5_slider .swiper-slide > div > div p { color: #a8a8a8; font-size: 13px; font-weight: 600; } .container_05 .contents_title h4 { font-size: 35px; } .container_05 .contents_title span { font-size: 14px; } .container_06 .contents_title h4 { font-size: 35px; } .container_06 .contents_title span { font-size: 14px; } .container_06 .contents_inner { margin-bottom: 5vw; padding-left: 30px; } .container_06 .contents_inner .con6_swiper_title { width: 280px; height: 400px; padding: 45px 20px; } .container_06 .contents_inner .con6_swiper_title h5 { margin-bottom: 10px; font-size: 30px; } .container_06 .contents_inner .con6_swiper_title .slider-for p { font-size: 26px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-arrow { top: 60px; width: 40px; height: 40px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-arrow.slick-next { left: 50px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots { top: 130px; left: 0; gap: 10px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots li { width: 10px; height: 10px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots li.slick-active { width: 36px; } .container_06 .contents_inner .con6_swiper_title a { margin-top: 140px; padding: 10px 46px 10px 20px; font-size: 14px; } .container_06 .contents_inner .con6_swiper_title a::before { right: 20px; height: 12px; } .container_06 .contents_inner .slider-nav { width: calc(100% - 230px); margin-left: -50px; } .container_06 .contents_inner .slider-nav .item { width: 300px; height: 300px; margin-right: 30px; } .container_06 .contents_inner .slider-nav .wrap { padding: 30px; } .container_06 .contents_inner .slider-nav .wrap > div { gap: 6px; } .container_06 .contents_inner .slider-nav .wrap > div h6 { font-size: 22px; } .container_06 .contents_inner .slider-nav .wrap > div p { font-size: 16px; } .container_06 .contents_inner .slider-nav .wrap ul { gap: 15px; margin-top: 20px; width: 100%; } .container_06 .contents_inner .slider-nav .wrap ul li { font-size: 18px; width: 100%; } .container_06 .contents_inner .slider-nav .wrap ul li span { font-size: 14px; } .container_06 .contents_bottom > img { height: 100px; } .container_06 .contents_bottom ul { width: 100vw; height: 350px; } .container_06 .contents_bottom ul li:nth-of-type(1) { gap: 5px; width: 170px; height: 170px; font-size: 30px; } .container_06 .contents_bottom ul li:nth-of-type(1) span { font-size: 14px; } .container_06 .contents_bottom ul li:nth-of-type(1):hover { width: 220px; height: 220px; } .container_06 .contents_bottom ul li:nth-of-type(2) { top: 27px; left: 5%; width: 120px; height: 120px; font-size: 20px; } .container_06 .contents_bottom ul li:nth-of-type(2):hover { width: 150px; height: 150px; } .container_06 .contents_bottom ul li:nth-of-type(3) { top: 187px; left: 17%; width: 100px; height: 100px; font-size: 22px; } .container_06 .contents_bottom ul li:nth-of-type(3):hover { width: 130px; height: 130px; } .container_06 .contents_bottom ul li:nth-of-type(4) { top: 60%; left: 65%; width: 110px; height: 110px; font-size: 18px; } .container_06 .contents_bottom ul li:nth-of-type(4):hover { width: 130px; height: 130px; } .container_06 .contents_bottom ul li:nth-of-type(5) { top: 0; right: 15%; width: 120px; height: 120px; font-size: 22px; } .container_06 .contents_bottom ul li:nth-of-type(5):hover { width: 140px; height: 140px; } .container_06 .contents_bottom ul li:nth-of-type(6) { top: 119px; right: 0; width: 110px; height: 110px; font-size: 20px; } .container_06 .contents_bottom ul li:nth-of-type(6):hover { width: 140px; height: 140px; } .container_06 .contents_bottom h6 { font-size: 22px; } .container_07 { padding-bottom: 30vw; } .container_07::before { height: 50vw; } .container_07 .contents_title { margin-bottom: 5vw; } .container_07 .contents_title > div h4 { font-size: 25px; } .container_07 .contents_title .con7_swiper_option { gap: 10px; margin-left: 20px; } .container_07 .contents_title .con7_swiper_option .swiper-pagination { width: 80px; } .container_07 .contents_inner .for_hidden .con7_swiper .swiper-wrapper .swiper-slide { width: 35%; } .container_07 .contents_inner .for_hidden .con7_swiper .box { gap: 10px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_img { height: 260px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_img h6 { left: 20px; bottom: 55px; font-size: 20px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_img p { left: 20px; bottom: 30px; font-size: 12px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_desc { height: 80px; padding: 20px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_desc p { font-size: 13px; } .container_07 .contents_bottom p { font-size: 20px; } .container_07 .contents_bottom .title_bottom { width: 150px; margin-top: 2vw; padding: 7px 40px 7px 30px; font-size: 14px; } .container_08::before { background-position: 60% 100%; height: 760px; } .container_08 .contents { padding-left: 0; } .container_08 .contents_title { margin-top: 2vw; margin-bottom: 7vw; } .container_08 .contents_title p { margin-bottom: 10px; } .container_08 .contents_title h4 { font-size: 35px; } .container_08 .contents_title span { margin-top: 10px; font-size: 18px; } .container_08 .tab_base { width: 45%; margin-left: 50%; } .container_08 .tab_base li a .floor_info span { font-size: 12px; } .container_08 .tab_base li.on a::after { top: 38px; left: -87px; width: 70px; } .container_08 .panel_base_inner { align-items: center; margin-top: 30vw; } .container_08 .panel_base_inner .title { align-items: center; margin-bottom: 7vw; } .container_08 .panel_base_inner .title > div { display: flex; flex-direction: column; align-items: center; justify-content: center; margin-right: initial; } .container_08 .panel_base_inner .title span { margin-bottom: 7px; font-size: 20px; text-align: center; } .container_08 .panel_base_inner .title h4 { margin-bottom: 10px; font-size: 35px; text-align: center; } .container_08 .panel_base_inner .title p { font-size: 14px; } .container_08 .panel_base_inner .swiper_wrap { width: calc(100% - 5vw); margin-left: 5vw; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide { width: 40vw; height: 40vw; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div span { left: 20px; bottom: 60px; font-size: 12px; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div p { left: 20px; bottom: 36px; font-size: 18px; } .container_08 .panel_base_inner .swiper_option { width: calc(100% - 10vw); margin: 0 5vw; margin-top: 20px; } .container_08 .panel_base_inner .swiper_option .swiper-pagination { height: 4px; } .container_09 .contents { width: 80%; } .container_09 .contents .top > a > div { height: 30vh !important; } .container_09 .contents_inner { gap: 10px; } .container_09 .contents_inner .box { height: 280px; } .container_09 .contents_inner .box_01 { padding-left: 30px; } .container_09 .contents_inner .box_01::before { width: 323px; height: 80%; background-position: 100% 100%; } .container_09 .contents_inner .box_01 .box_title { font-size: 20px; } .container_09 .contents_inner .box_01 .call { margin: 20px 0; font-size: 40px; } .container_09 .contents_inner .box_01 .info { gap: 10px; } .container_09 .contents_inner .box_01 .info li { gap: 10px; } .container_09 .contents_inner .box_01 .info_title { width: 50px; font-size: 14px; } .container_09 .contents_inner .box_01 .info_title.custom { letter-spacing: 13px; } .container_09 .contents_inner .box_01 .info_desc { font-size: 14px; } .container_09 .contents_inner .box_02 > img { width: 30%; } .container_09 .contents_inner .box_02 .box_title { margin: 27px 0 20px 0; font-size: 20px; } .container_09 .contents_inner .box_02 a { padding: 7px 46px 7px 20px; font-size: 14px; } .container_09 .contents_inner .box_02 a::before { right: 20px; width: 8px; height: 12px; } .container_09 .contents_inner .box_03 > img { width: 30%; } .container_09 .contents_inner .box_03 .box_title { margin: 27px 0 20px 0; font-size: 20px; } .container_09 .contents_inner .box_03 a { padding: 7px 46px 7px 20px; font-size: 14px; } .container_09 .contents_inner .box_03 a::before { right: 20px; width: 8px; height: 12px; } .footer > ul { flex-wrap: wrap; gap: 15px; height: initial; padding: 10px 0; } .footer > ul li { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: center; margin: 0 3%; } .footer > ul li a { font-size: 12px; letter-spacing: -0.5px; } .footer_contents { display: flex; flex-direction: row; align-items: center; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 0 50px; padding: 7vw 50px 7vw 50px; } .footer_contents .logo { width: 150px; height: 40px; margin-right: calc(100% - 150px); margin-bottom: 2vw; } .footer_contents ul { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 12px; } .footer_contents ul li { font-size: 12px; } .footer_contents ul:last-of-type { margin-top: 12px; } } @media screen and (max-width: 576px) { .br_show_576 { display: block; } /* header */ #header { height: 60px; } #header .header_inner { padding: 0 10px; } #header .header_inner .logo > a { width: 120px; height: 30px; } #header .utile_menu_user { gap: 5px; } #header .utile_menu_user .user { width: 60px; height: 30px; font-size: 11px; } .quick_bar { right: 10px; gap: 10px; } .quick_bar a { width: 35px; height: 35px; } .quick_bar .button:hover::before { height: 30px; line-height: 30px; font-size: 12px; } .quick_bar .button:hover::after { left: -24px; width: 12px; height: 15px; } .quick_bar .show { gap: 10px; } .quick_bar .show li:hover::before { height: 30px; line-height: 30px; font-size: 12px; } .quick_bar .show li:hover::after { left: -24px; width: 12px; height: 15px; } .quick_bar li:last-of-type:hover::before { height: 30px; line-height: 30px; font-size: 12px; } .quick_bar li:last-of-type:hover::after { left: -24px; width: 12px; height: 15px; } .container .contents_title .title_bottom { margin-top: 8vw; } .container_01 .con1_title { left: 5%; } .container_01 .con1_title h3 { margin-bottom: 5px; font-size: 20px; } .container_01 .con1_title p { margin-bottom: 10px; font-size: 12px; } .container_01 .con1_title h6 { margin-bottom: 15px; font-size: 12px; } .container_01 .con1_title .con1_swiper_option { gap: 25px; } .container_01 .con1_title .con1_swiper_option .autoplay-progress { width: 33px; height: 33px; } .container_01 .con1_title .con1_swiper_option .autoplay-progress::before { border: 5px solid #959597; } .container_01 .con1_title .con1_swiper_option .autoplay-progress svg { width: 34px; height: 34px; stroke-width: 6px; } .container_01 .con1_title .con1_swiper_option .count { font-size: 12px; } .container_01 .con1_swiper { height: 60vh; } .container_01 .con1_swiper .swiper-slide { height: 60vh; } .container_01 .con1_swiper .swiper-slide > img { width: 100%; height: 60vh; object-fit: cover; } .container_01 .swiper-slide > img { width: 100%; height: 100%; object-fit: cover; } .container_01 .scroll_down { bottom: 8%; } .container_01 .search_box { bottom: -237px; width: 90%; height: 260px; padding: 0 20px; } .container_01 .search_box h6 { margin-bottom: 7px; font-size: 16px; } .container_01 .search_box .input_box { height: 40px; } .container_01 .search_box .input_box .input_search { font-size: 14px; } .container_01 .search_box .input_box .input_search::placeholder { font-size: 14px; } .container_01 .search_box .input_box .btn_search { width: 54px; } .container_01 .search_box .word_list { gap: 30px; margin-top: 25px; } .container_01 .search_box .word_list span { padding-right: 16px; font-size: 12px; } .container_01 .search_box .word_list span::before { width: 7px; height: 8px; } .container_01 .search_box .word_list ul li { font-size: 11px; } .container_01 .search_box .word_list ul li i { font-size: 11px; } .container_02 .con2_title > img { width: 50px; } .container_02 .con2_title h4 { font-size: 26px; } .container_02 .con2_title p { font-size: 12px; } .container_02 .con2_swiper .swiper-slide { height: 400px; gap: 10px; } .container_02 .con2_swiper .swiper-slide.slide_01 { padding-top: 30px; } .container_02 .con2_swiper .swiper-slide.slide_02 { height: 400px; } .container_02 .con2_swiper .swiper-slide.slide_03 { height: 300px; padding-top: 50px; padding-bottom: 0px; } .container_02 .con2_swiper .swiper-slide.slide_04 { padding-top: 60px; } .container_02 .con2_swiper .swiper-slide.slide_05 { height: 400px; } .container_03::before { height: 50vw; } .container_03 .con3_title h4 { margin-bottom: 5vw; font-size: 28px; } .container_03 ul { flex-wrap: wrap; justify-content: center; gap: 10px; } .container_03 ul li { width: 30%; } .container_03 ul li .icon { width: 27vw; height: 27vw; border: 5px solid #fff; } .container_03 ul li p { margin: 2vw 0 1.4vw 0; font-size: 14px; } .container_03 ul li a { width: 60px; height: 28px; font-size: 11px; } .container_04 .contents_title p { margin-bottom: 20px; } .container_04 .contents_title h4 { font-size: 26px; } .container_04 .contents_title > div { gap: 10px; } .container_04 .contents_title > div .title_bottom { padding: 7px 46px 7px 20px; font-size: 12px; } .container_04 .contents_title > div .title_bottom::before { right: 20px; height: 10px; } .container_04 .contents_inner .con4_swiper { width: 90%; } .container_04 .contents_inner .swiper-button-prev, .container_04 .contents_inner .swiper-button-next { width: 17px; height: 17px; } .container_04 .contents_inner .swiper-button-prev { border-bottom: 3px solid #00c3dd; border-left: 3px solid #00c3dd; } .container_04 .contents_inner .swiper-button-next { border-bottom: 3px solid #00c3dd; border-left: 3px solid #00c3dd; } .container_04 .contents_inner .box_img { width: auto; height: initial; margin-bottom: 2vw; } .container_04 .contents_inner .box_step { margin-top: 10px; margin-bottom: 1vw; margin-left: 10px; font-size: 18px; } .container_04 .contents_inner .box_title { margin-bottom: 1vw; margin-left: 10px; font-size: 17px; } .container_04 .contents_inner .box_tag { gap: 10px; margin-top: 10px; margin-left: 10px; } .container_04 .contents_inner .box_tag i { padding: 5px 15px; font-size: 12px; } .container_04 .contents_inner .bottom { gap: 10px; } .container_04 .contents_inner .bottom .title_bottom { padding: 10px 40px 10px 20px; font-size: 14px; } .container_04 .contents_inner .bottom .title_bottom::before { right: 20px; } .container_05 .contents_inner .con5_slider { width: calc(100% - 20px); height: 400px; margin: 0 auto; } .container_05 .contents_inner .con5_slider .swiper-slide { gap: 10px; width: 100%; height: 160px; } .container_05 .contents_inner .con5_slider .swiper-slide > div { gap: 10px; padding: 0 20px; } .container_05 .contents_inner .con5_slider .swiper-slide > div > img { width: 60px; } .container_05 .contents_inner .con5_slider .swiper-slide > div h6 { font-size: 18px; } .container_05 .contents_inner .con5_slider .swiper-slide > div p { font-size: 11px; } .container_05 .contents_title h4 { font-size: 28px; } .container_05 .contents_title span { margin-top: 15px; font-size: 12px; } .container_06 .contents_title h4 { font-size: 28px; } .container_06 .contents_title span { margin-top: 6vw; font-size: 12px; } .container_06 .contents_inner { flex-direction: column; align-items: center; justify-content: center; width: 100%; margin-bottom: 5vw; padding-left: 0; } .container_06 .contents_inner .con6_swiper_title { width: calc(100% - 20px); height: 350px; padding: 45px 20px; } .container_06 .contents_inner .con6_swiper_title h5 { margin-bottom: 10px; font-size: 28px; } .container_06 .contents_inner .con6_swiper_title .slider-for { width: 100%; height: 100px; } .container_06 .contents_inner .con6_swiper_title .slider-for p { font-size: 24px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-arrow { top: 50px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots { top: 100px; left: 0; gap: 10px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots li { width: 10px; height: 10px; } .container_06 .contents_inner .con6_swiper_title .slider-for .slick-dots li.slick-active { width: 36px; } .container_06 .contents_inner .con6_swiper_title a { margin-top: 40px; padding: 10px 40px 10px 20px; font-size: 16px; } .container_06 .contents_inner .con6_swiper_title a::before { right: 17px; height: 12px; } .container_06 .contents_inner .slider-nav { width: calc(100% - 80px); margin-top: -40px; margin-left: 0; } .container_06 .contents_inner .slider-nav .item { width: 100%; height: 80vw; margin-right: 10px; } .container_06 .contents_inner .slider-nav .wrap { padding: 20px; } .container_06 .contents_inner .slider-nav .wrap > div { gap: 6px; } .container_06 .contents_inner .slider-nav .wrap > div h6 { font-size: 22px; } .container_06 .contents_inner .slider-nav .wrap > div p { font-size: 20px; } .container_06 .contents_inner .slider-nav .wrap ul { gap: 10px; margin-top: 20px; width: 100%; } .container_06 .contents_inner .slider-nav .wrap ul li { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; font-size: 16px; width: 100%; } .container_06 .contents_inner .slider-nav .wrap ul li > img { width: 30px; height: 30px; } .container_06 .contents_inner .slider-nav .wrap ul li span { margin-left: 5px; font-size: 12px; } .container_06 .contents_bottom > img { height: 80px; } .container_06 .contents_bottom ul { width: 100vw; height: 400px; } .container_06 .contents_bottom ul li:nth-of-type(1) { top: 100px; gap: 5px; width: 150px; height: 150px; font-size: 30px; } .container_06 .contents_bottom ul li:nth-of-type(1) span { font-size: 14px; } .container_06 .contents_bottom ul li:nth-of-type(2) { top: 27px; left: 0; width: 110px; height: 110px; font-size: 18px; } .container_06 .contents_bottom ul li:nth-of-type(3) { top: 60%; left: 10%; width: 100px; height: 100px; font-size: 20px; } .container_06 .contents_bottom ul li:nth-of-type(3):hover { top: calc(60% - 20px); left: calc(10% - 20px); } .container_06 .contents_bottom ul li:nth-of-type(4) { top: 60%; left: 65%; width: 110px; height: 110px; font-size: 18px; } .container_06 .contents_bottom ul li:nth-of-type(5) { top: -5%; right: 15%; width: 120px; height: 120px; font-size: 18px; } .container_06 .contents_bottom ul li:nth-of-type(5):hover { top: calc(-5% - 20px); right: calc(15% - 20px); } .container_06 .contents_bottom ul li:nth-of-type(6) { top: 119px; right: 0; width: 90px; height: 90px; font-size: 16px; } .container_06 .contents_bottom h6 { font-size: 20px; } .container_07 { padding-bottom: 35vw; } .container_07::before { height: 80vw; } .container_07 .contents_title { flex-direction: column; align-items: flex-start; margin-bottom: 5vw; padding-left: 30px; } .container_07 .contents_title > div h4 { font-size: 25px; } .container_07 .contents_title .con7_swiper_option { gap: 10px; margin-top: 10px; margin-left: 0; } .container_07 .contents_title .con7_swiper_option .swiper-pagination { width: 180px; } .container_07 .contents_inner .for_hidden .con7_swiper .swiper-wrapper .swiper-slide { width: 50%; } .container_07 .contents_inner .for_hidden .con7_swiper .box { gap: 10px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_img h6 { left: 10px; bottom: 55px; font-size: 20px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_img p { left: 10px; bottom: 25px; font-size: 12px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_desc { height: 80px; padding: 15px; } .container_07 .contents_inner .for_hidden .con7_swiper .box_desc p { font-size: 13px; } .container_07 .contents_bottom p { font-size: 14px; } .container_07 .contents_bottom .title_bottom { width: 150px; margin-top: 4vw; padding: 7px 40px 7px 30px; font-size: 12px; } .container_08::before { background-position: 60% 100%; height: 864px; } .container_08::after { display: none; } .container_08 .contents { padding-left: 0; } .container_08 .contents_title { margin-top: 5vw; margin-bottom: 10vw; } .container_08 .contents_title p { margin-bottom: 10px; } .container_08 .contents_title h4 { font-size: 27px; } .container_08 .contents_title span { margin-top: 10px; font-size: 12px; } .container_08 .tab_base { width: 64%; margin-left: 30%; } .container_08 .tab_base li a { flex-direction: column; } .container_08 .tab_base li a .floor_info span { font-size: 12px; } .container_08 .tab_base li.on a::after { top: 38px; left: -87px; width: 70px; } .container_08 .panel_base_inner { margin-top: 100px; } .container_08 .panel_base_inner .title { margin-bottom: 7vw; } .container_08 .panel_base_inner .title span { margin-bottom: 7px; font-size: 18px; } .container_08 .panel_base_inner .title h4 { margin-bottom: 10px; font-size: 27px; } .container_08 .panel_base_inner .title p { font-size: 12px; } .container_08 .panel_base_inner .swiper_option { margin-top: 10px; } .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div span, .container_08 .panel_base_inner .swiper_wrap .con8_swiper .swiper-slide > div p { left: 10px; } .container_09 .contents { width: 90%; } .container_09 .contents_title { margin-bottom: 30px; } .container_09 .contents_title span { margin-top: 15px; font-size: 14px; } .container_09 .contents_title .title_bottom { margin-top: 4vw; padding: 7px 30px 7px 20px; font-size: 12px; } .container_09 .contents_title .title_bottom::before { right: 15px; width: 8px; height: 10px; } .container_09 .contents .top { margin-bottom: 10px; } .container_09 .contents_inner { gap: 10px; } .container_09 .contents_inner .box { height: 280px; } .container_09 .contents_inner .box_01 { padding-left: 25px; } .container_09 .contents_inner .box_01::before { width: 323px; height: 80%; background-position: 100% 100%; } .container_09 .contents_inner .box_01 .box_title { font-size: 20px; } .container_09 .contents_inner .box_01 .call { margin: 20px 0; font-size: 30px; } .container_09 .contents_inner .box_01 .info { gap: 7px; } .container_09 .contents_inner .box_01 .info li { gap: 7px; } .container_09 .contents_inner .box_01 .info li:last-of-type { align-items: flex-start; } .container_09 .contents_inner .box_01 .info_title { width: 40px; font-size: 14px; } .container_09 .contents_inner .box_01 .info_title.custom { letter-spacing: 13px; } .container_09 .contents_inner .box_01 .info_desc { font-size: 14px; } .container_09 .contents_inner .box_01 .info_desc.last { width: 147px; } .container_09 .contents_inner .box_02 { height: 200px; } .container_09 .contents_inner .box_02 > img { width: 30%; } .container_09 .contents_inner .box_02 .box_title { margin: 15px 0 10px 0; font-size: 20px; } .container_09 .contents_inner .box_02 a { padding: 7px 30px 7px 20px; font-size: 12px; } .container_09 .contents_inner .box_02 a::before { right: 15px; width: 8px; height: 10px; } .container_09 .contents_inner .box_03 { height: 200px; } .container_09 .contents_inner .box_03 > img { width: 30%; } .container_09 .contents_inner .box_03 .box_title { margin: 15px 0 10px 0; font-size: 20px; } .container_09 .contents_inner .box_03 a { padding: 7px 30px 7px 20px; font-size: 12px; } .container_09 .contents_inner .box_03 a::before { right: 15px; width: 8px; height: 10px; } .footer > ul { padding: 15px 0; } } /*# sourceMappingURL=main.css.map */