/* INDEX------------------------------------------------------------------------ */ /* FONT */ /* RESET */ /* METHOD */ /* LAYOUT */ /* TOP */ /* FOOTER */ /* MEDIA QUERY */ /* ----------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------- */ /* RESET */ /* ----------------------------------------------------------------------------- */ * { margin:0; padding:0; } article, aside, hgroup, header, footer, figure, figcaption, nav, section { display:block; position:relative; padding:0; margin:0; } form, fieldset { border:0; } body, div, dl, dt, dd, ul, ol, li, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, img { margin:0; padding:0; border:0; outline:0; vertical-align:baseline; } legend, caption { display:none; } dl, dd, dt, ul, li, div, span { margin:0; padding:0; list-style:none; } img { border:0; } html, body { display:block; width:100%; height:100%; min-height:100%; font-size:17px; line-height:120%; font-family:'Roboto','Noto Sans KR', sans-serif; letter-spacing:-1px; background:#fff; } a { color:#000; text-decoration:none; } address { font-style:normal; } /* p { margin-bottom:10px; } */ table, tr, th, td { border-collapse:collapse; border-spacing:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } h2, h3, h4, h5 { font-family: ''; } .hide { display:none !important; } input[type="submit"] { cursor:pointer; font-family:'Noto Sans KR', sans-serif; } input, select { box-sizing:border-box; } /* input { -webkit-appearance:none; border-radius:0; } */ input[type="text"],i nput[type="password"], input[type="submit"], input[type="button"], textarea { -webkit-appearance:none; border-radius:0; font-family:'Noto Sans KR', sans-serif; } select { -webkit-appearance:none; border-radius:0; background:url('/images/common/select_arrow.gif') 96% center no-repeat; font-family:'Noto Sans KR', sans-serif; } iframe { width:100% !important; } .input_area { width:100% !important; background:#abc; } /* strong { font-family:'Noto Sans KR', sans-serif; } */ /* ----------------------------------------------------------------------------- */ /* METHOD */ /* ----------------------------------------------------------------------------- */ .last1 { padding-bottom:0 !important; margin-bottom:0 !important; border-bottom:0 !important; } ._en { ime-mode:disabled; } ._kr { ime-mode:active; } .hid { display:block; width:100px; border:1px solid #aaa; z-index:99; margin:0 auto; } .hid2 { display:inline-block; width:20px; border:1px solid #aaa; margin:0 0 0 5px !important; z-index:99; } .hid3 { display:block; width:80%; border:1px solid #aaa; margin:0 auto !important; z-index:99; } .hide { display:none !important; } .bd_r_none { border-right:0 !important; } .bd_l_none { border-left:0 !important; } .tc { text-align:center !important; } .tl { text-align:left !important; margin:0 0 0 3px; } .tr { text-align:right !important; } .clkDisa { pointer-events:none; } .clickDisable { pointer-events : none; } .bold { font-family:'Nanum Gothic B' !important; } .red { color: red !important; } .v_m { top:50%; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -ms-transform:translateY(-50%); -o-transform:translateY(-50%); transform:translateY(-50%); } .clear { display:block; width:100%; clear:both; } .f_13 { font-size:13px !important; } .req_form:after { content: ' *'; color: #F00; } .fr { float:right; } .fl { float:left; } /* ----------------------------------------------------------------------------- */ /* LAYOUT */ /* ----------------------------------------------------------------------------- */ .ex_wrap { display:block; height:100%; min-height:100%; } /* ----------------------------------------------------------------------------- */ /* TOP */ /* ----------------------------------------------------------------------------- */ .top_wrap { display:block; position:fixed; top:0; left:0; width:100%; height:90px; z-index:9980; } .top_wrap::before { display:block; overflow:hidden; width:100%; height:0; background:#fff; position:absolute; top:0; left:0; content:''; transition-duration:.5s; } .top_core { display:block; width:94%; max-width:1740px; margin:0 auto; height:100%; position:relative; z-index:3; } /* 상단 로고 */ .top_logo_wrap { display:block; overflow:hidden; width:222px; position:absolute; top:0; left:0; height:100%; } .top_logo_btn { display:block; overflow:hidden; width:100%; height:100%; background-image:url('../images/common/logo_w.png'); background-position:center center; background-repeat:no-repeat; background-size:100%; transition-duration:.5s; } /* 상단메뉴 */ .top_gnb_wrap { display:block; height:100%; position:relative; margin:0 330px;} .top_gnb { display:block; height:100%; } .top_gnb .nav_dep1_ul { display:flex; flex-wrap:wrap; justify-content:space-between; height:100%; } .top_gnb .nav_dep1_li { display:block; flex:1; height:100%; position:relative; } .top_gnb .nav_dep1_li .nav_dep1_a { display:block; overflow:hidden; height:100%; color:#fff; } .top_gnb .nav_dep1_li .nav_dep1_a .nav_k { display:block; overflow:hidden; position:relative; top:50%; transform:translateY(-50%); text-align:center; font-size:20px; line-height:120%; font-weight:500; } .top_gnb .nav_dep1_li .nav_dep1_a .nav_e { display:none; } .top_gnb .nav_dep2_ul { display:none; overflow:hidden; position:absolute; width:100%; background:rgba(0,0,0,.5); text-align:center; padding-top:15px; } .top_gnb .nav_dep2_ul .nav_dep2_li { display:block; overflow:hidden; margin-bottom:15px; } .top_gnb .nav_dep2_ul .nav_dep2_li a { display:block; overflow:hidden; color:#fff; line-height:130%; word-break:keep-all; } .top_gnb .nav_dep1_li:hover .nav_dep1_a { color:#1095d3; } /* 기타버튼 */ .top_utli_wrap { display:flex; flex-wrap:wrap; justify-content:end; align-items:center; position:absolute; top:50%; transform:translateY(-50%); right:0; } .top_lang_wrap { display:block; margin-right:15px; } .top_lang_btn { display:block; overflow:hidden; background-image:url('../images/common/t_lang_select.png'); background-position:right center; background-repeat:no-repeat; } .top_lang_btn.active { background-image:url('../images/common/t_lang_select_up.png'); } .top_lang_icon { display:block; overflow:hidden; width:24px; height:24px; background-image:url('../images/common/t_lang_iconb.png'); background-position:center center; background-size:100%; margin-right:15px; transition-duration:.5s; } .t_lang_list { display:none; overflow:hidden; position:absolute; top:68px; border:1px solid #ddd; border-top:0; border-radius:0 0 15px 5px; background:#fff; margin-left:-20px; } .t_lang_list ul { display:block; overflow:hidden; margin:10px 20px; } .t_lang_list ul li { display:block; overflow:hidden; margin-bottom:5px; } .t_lang_list ul li:last-child { margin-bottom:0; } .t_lang_list ul li a { display:block; overflow:hidden; line-height:120%; word-break:keep-all; font-size:15px; letter-spacing:0; font-weight:500; transition-duration:.5s; } .t_lang_list ul li a:hover { color:#1095d3; } .top_contact_btn { display:block; overflow:hidden; width:138px; border:1px solid #fff; box-sizing:border-box; border-radius:5px; text-align:center; height:46px; line-height:46px; background:#fff; font-size:14px; font-weight:500; letter-spacing:0; font-weight:bold; transition-duration:.5s; } .top_contact_btn:hover { color:#fff; background:#1095d3; border-color:#1095d3; } .top_mm_btn { display:none; overflow:hidden; margin-left:15px; width:24px; } .top_mm_btn span { display:block; overflow:hidden; width:100%; height:2px; background:#fff; } .top_mm_btn span:nth-child(2) { margin:7px 0 7px auto; width:calc(100% - 10px); } /* 전체메뉴 */ .total_menu_pop { display:none; overflow:hidden; position:fixed; top:0; left:0; width:100%; height:100%; z-index:9990; } .total_menu_bg { display:block; overflow:hidden; position:absolute; top:0; left:0; width:100%; height:100%; z-index:9991; background:rgba(0,0,0,.5); } .total_menu_wrap { display:block; overflow-y:auto; position:absolute; top:0; right:-100%; width:100%; max-width:450px; height:100%; z-index:9992; background:#f8f8f8; } .total_menu_core { display:block; margin:30px 20px; } .total_menu_top { display:block; position:relative; } .total_etc_wrap { display:block; overflow:hidden; } .total_etc_btn { display:inline-block; overflow:hidden; vertical-align:middle; font-size:16px; margin:0 20px 0 0; font-family: 'Montserrat', sans-serif; } .total_etc_btn.active { font-weight:600; } .total_close_btn { display:block; overflow:hidden; width:30px; height:24px; position:absolute; top:50%; transform:translateY(-50%); right:0; } .total_close { display:block; overflow:hidden; width:1px; height:100%; background:#000; position:absolute; top:0; left:50%; transform:translateX(-50%);} .total_close1 { transform:rotate(45deg); } .total_close2 { transform:rotate(-45deg); } .total_menu_cont { display:block; overflow:hidden; padding-top:0; font-family: 'Paperlogy'; } .total_menu_cont .nav_dep1_ul { display:block; overflow:hidden; margin-top:15px; } .total_menu_cont .nav_dep1_li { display:block; overflow:hidden; margin-top:15px; } .total_menu_cont .nav_dep1_li.hide { display:block !important; } .total_menu_cont .nav_dep1_li .nav_dep1_a { display:block; overflow:hidden; line-height:120%; font-size:24px; font-weight:400; position:relative; } .total_menu_cont .nav_dep1_li .nav_dep1_a.active { background-image:url('../images/common/t_menu_up.png'); } .total_menu_cont .nav_dep1_li .nav_dep1_a span { display:inline-block; overflow:hidden; line-height:130%; word-break:keep-all; position:relative; z-index:2; } .total_menu_cont .nav_dep1_li .nav_dep1_a span.nav_e { display:none; } .total_menu_cont .nav_dep1_li .nav_dep1_a span::after { display:block; overflow:hidden; position:absolute; bottom:10px; left:0; width:0; height:10px; background:#333; content:''; opacity:.2; transition-duration:.5s; } .total_menu_cont .nav_dep1_li .nav_dep1_a:hover span::after { width:100%;} .total_menu_cont .nav_dep1_li .nav_dep1_a.active span::after { width:100%;} .total_menu_cont .nav_dep2_ul { display:block; overflow:hidden; } .total_menu_cont .nav_dep2_ul .nav_dep2_li { display:block; overflow:hidden; vertical-align:middle; letter-spacing:-.5px; padding:0 3px 0 7px; margin:0 0 10px 0; opacity:.7; position:relative; font-weight:300; } .total_menu_cont .nav_dep2_ul .nav_dep2_li::nth-child(1) { margin-top:0; } .total_menu_cont .nav_dep2_ul .nav_dep2_li::before { display:block; overflow:hidden; width:3px; height:3px; background:#333; content:''; position:absolute; top:8px; left:0; } /* 상단 스크롤 이벤트 */ .top_wrap.active::before { height:100%; } .top_wrap.active .top_logo_btn { background-image:url('../images/common/logo_b.png'); } .top_wrap.active .top_lang_icon { background-image:url('../images/common/t_lang_iconc.png'); } .top_wrap.active .top_contact_btn { border-color:rgba(0,0,0,.2); } .top_wrap.active .top_mm_btn span { background:#000; } .top_wrap.active .top_gnb .nav_dep1_li .nav_dep1_a { color:#000; } .top_wrap:hover::before { height:100%; } .top_wrap:hover .top_logo_btn { background-image:url('../images/common/logo_b.png'); } .top_wrap:hover .top_lang_icon { background-image:url('../images/common/t_lang_iconc.png'); } .top_wrap:hover .top_contact_btn { border-color:rgba(0,0,0,.2); } .top_wrap:hover .top_mm_btn span { background:#000; } .top_wrap:hover .top_gnb .nav_dep1_li .nav_dep1_a { color:#000; } /* ----------------------------------------------------------------------------- */ /* FOOTER */ /* ----------------------------------------------------------------------------- */ .footer_wrap { display:block; overflow:hidden; background:#05151b; padding:70px 0; } /* 하단 문의하기 */ .f_contact_wrap { display:block; overflow:hidden; width:94%; max-width:1740px; margin:0 auto; background:url('../images/common/f_contact_bg.jpg') center center no-repeat; background-size:cover; } .f_contact_core { display:block; overflow:hidden; margin:100px 50px; text-align:center; } .f_contact_tit { display:block; overflow:hidden; color:#fff; font-size:55px; line-height:130%; word-break:keep-all; } .f_contact_btn { display:block; overflow:hidden; width:100%; max-width:230px; margin:50px auto 0 auto; height:57px; line-height:60px; color:#fff; background:#1095d3; font-size:18px; transition-duration:.5s; } .f_contact_btn:hover { background:#002d74; } /* 하단 정보 */ .f_info_wrap { display:block; overflow:hidden; width:94%; max-width:1400px; margin:0 auto; margin-top:80px; color:#fff; font-size:15px; } .f_info_wrap a { color:#fff; } .f_info_f1 { display:flex; flex-wrap:wrap; justify-content:space-between; border-bottom:1px solid rgba(255,255,255,.15); box-sizing:border-box; margin-bottom:30px; padding-bottom:65px; } .f_info_item { display:block; overflow:hidden; } .f_info_dl { display:flex; flex-wrap:wrap; justify-content:space-between; margin-bottom:12px; letter-spacing:-.5px; } .f_info_dl:last-child { margin-bottom:0; } .f_info_dt { display:block; overflow:hidden; line-height:140%; word-break:keep-all; } .f_info_dd { display:block; overflow:hidden; line-height:140%; word-break:keep-all; opacity:.5; font-family:'Lato', 'Noto Sans KR', sans-serif; } .f_info1 { width:310px; } .f_info1 .f_info_dd { width:calc(100% - 150px); } .f_info2 { width:170px; } .f_info2 .f_info_dd { width:calc(100% - 70px); } .f_info3 { width:510px; } .f_info_address { display:flex; flex-wrap:wrap; justify-content:space-between; margin-bottom:25px; } .f_info_address:last-child { margin-bottom:0; } .f_info_address_t { display:block; overflow:hidden; font-size:17px; line-height:140%; word-break:keep-all; font-weight:bold; } .f_info_address_c { display:block; overflow:hidden; width:calc(100% - 105px); } .f_info3 .f_info_address_c .f_info_dl { margin:2px 0 0 0; } .f_info3 .f_info_address_c .f_info_dd { width:calc(100% - 80px); } .f_info_f2 { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; } .f_copy_wrap { display:block; overflow:hidden; line-height:140%; word-break:keep-all; font-family: "Roboto", serif; letter-spacing:0; } .f_cout_wrap { display:none; flex-wrap:wrap; justify-content:space-between; width:270px; } .f_cout_dl { display:flex; flex-wrap:wrap; justify-content:space-between; width:calc(50% - 2px); background:#1a272b; border-radius:9999px; } .f_cout_dt { display:block; overflow:hidden; text-align:center; width:60px; } .f_cout_dd { display:block; overflow:hidden; text-align:right; width:calc(100% - 60px); } .f_cout_dl span { display:block; overflow:hidden; height:36px; line-height:38px; color:#989898; font-family: 'Gmarket'; font-size:12px; font-weight:500; margin:0 10px; letter-spacing:-.5px; } .f_cout_dt span { margin:0; } /* ----------------------------------------------------------------------------- */ /* MEDIA QUERY */ /* ------------------------------------------------------------------------------ */ @media only screen and (min-width:0px) and (max-width:359px) { /* width 360이하 모바일(갤럭시S2 대상) */ } @media only screen and (min-width:0px) and (max-width:767px) { /* 모바일(갤럭시노트급 대상) */ /* ----------------------------------------------------------------------------- */ /* RESET */ /* ----------------------------------------------------------------------------- */ html, body { font-size:16px; } .aos-animate { transition-delay: .1s !important; } /* ----------------------------------------------------------------------------- */ /* TOP */ /* ----------------------------------------------------------------------------- */ .top_wrap { height:70px; } /* 상단 로고 */ .top_logo_wrap { width:170px; } /* 상단메뉴 */ .top_gnb_wrap { display:none; } /* 기타버튼 */ .t_lang_list { top:47px; margin-left:-16px; } .t_lang_list ul { margin:5px 15px; } .t_lang_list ul li a { font-size:14px; } .top_contact_btn { display:none; } .top_mm_btn { display:block; margin-left:0; } /* ----------------------------------------------------------------------------- */ /* FOOTER */ /* ----------------------------------------------------------------------------- */ .footer_wrap { padding:0 0 50px 0; } /* 하단 문의하기 */ .f_contact_wrap { width:100%; max-width:100%; } .f_contact_core { margin:30px 20px; text-align:center; } .f_contact_tit { font-size:36px; } .f_contact_btn { max-width:200px; margin:20px auto 0 auto; height:46px; line-height:48px; font-size:16px; } /* 하단 정보 */ .f_info_wrap { margin-top:50px; font-size:14px; } .f_info_f1 { margin-bottom:30px; padding-bottom:30px; } .f_info_item { width:100%; } .f_info2 { margin:7px 0 20px 0; } .f_info_dl { margin-bottom:7px; } .f_info_dd { width:calc(100% - 150px) !important ; } .f_info_address { margin-bottom:10px; } .f_info_address_t { font-size:15px; } .f_info_address_c { width:calc(100% - 110px); } .f_info3 .f_info_address_c .f_info_dl { margin:0; } .f_info3 .f_info_address_c .f_info_dt { display:none; } .f_info3 .f_info_address_c .f_info_dd { width:100% !important; } .f_copy_wrap { width:100%; } .f_cout_wrap { width:100%; margin-top:20px; max-width:300px; } } @media only screen and (min-width:768px) and (max-width:1023px) { /* 테블릿() iPad Portrait */ /* ----------------------------------------------------------------------------- */ /* TOP */ /* ----------------------------------------------------------------------------- */ .top_wrap { height:80px; } /* 상단 로고 */ .top_logo_wrap { width:180px; } /* 상단메뉴 */ .top_gnb_wrap { display:none; } /* 기타버튼 */ .t_lang_list { top:52px; } .top_contact_btn { display:none; } .top_mm_btn { display:block; margin-left:0; } /* ----------------------------------------------------------------------------- */ /* FOOTER */ /* ----------------------------------------------------------------------------- */ .footer_wrap { padding:0 0 50px 0; } /* 하단 문의하기 */ .f_contact_wrap { width:100%; max-width:100%; } .f_contact_core { margin:60px 20px; text-align:center; } .f_contact_tit { font-size:46px; } .f_contact_btn { margin-top:30px; font-size:17px; height:52px; line-height:54px; } /* 하단 정보 */ .f_info_wrap { margin-top:50px; font-size:15px; } .f_info_f1 { margin-bottom:50px; padding-bottom:50px; } .f_info1 { width:50%; } .f_info2 { width:50%; } .f_info3 { width:100%; margin-top:40px; } .f_info_dl { margin-bottom:7px; } .f_info_address { margin-bottom:10px; } .f_info_address_t { font-size:16px; } .f_info_address_c { width:calc(100% - 100px); } .f_info3 .f_info_address_c .f_info_dl { margin:0; } .f_info3 .f_info_address_c .f_info_dd { width:calc(100% - 90px) !important; } } @media only screen and (min-width:1024px) and (max-width:1139px) { /* 테블릿() iPad LandSpace */ /* ----------------------------------------------------------------------------- */ /* TOP */ /* ----------------------------------------------------------------------------- */ .top_wrap { height:80px; } /* 상단 로고 */ .top_logo_wrap { width:200px; } /* 상단메뉴 */ .top_gnb_wrap { display:none; } /* 기타버튼 */ .t_lang_list { top:63px; } .top_contact_btn { width:130px; } .top_mm_btn { display:block; margin-left:20px; } /* ----------------------------------------------------------------------------- */ /* FOOTER */ /* ----------------------------------------------------------------------------- */ .footer_wrap { padding:50px 0; } /* 하단 문의하기 */ .f_contact_core { margin:50px 50px; } .f_contact_tit { font-size:50px; } /* 하단 정보 */ .f_info_wrap { margin-top:50px; } .f_info_f1 { margin-bottom:30px; padding-bottom:40px; } .f_info_item { display:block; overflow:hidden; } .f_info_dl { margin-bottom:10px; } .f_info1 { width:280px; } .f_info1 .f_info_dd { width:calc(100% - 120px); } .f_info2 { width:140px; } .f_info2 .f_info_dd { width:calc(100% - 40px); } .f_info3 { width:495px; } .f_info_address { margin-bottom:15px; } .f_info_address_c { width:calc(100% - 110px); } .f_info3 .f_info_address_c .f_info_dl { margin:1px 0 0 0; } .f_info3 .f_info_address_c .f_info_dd { width:calc(100% - 70px); } } @media only screen and (min-width:1140px) and (max-width:1400px) { /* 작은 PC */ /* ----------------------------------------------------------------------------- */ /* TOP */ /* ----------------------------------------------------------------------------- */ .top_wrap { height:80px; } /* 상단 로고 */ .top_logo_wrap { width:200px; } /* 상단메뉴 */ .top_gnb_wrap { margin:0 190px 0 240px;} .nav_k { font-size:18px; } .top_gnb .nav_dep2_ul .nav_dep2_li { margin-bottom:10px; } .top_gnb .nav_dep2_ul .nav_dep2_li a { font-size:15px; } .top_gnb .nav_dep1_li .nav_dep1_a .nav_k { font-size:18px; } /* 기타버튼 */ .t_lang_list { top:63px; } .top_contact_btn { width:120px; } /* ----------------------------------------------------------------------------- */ /* FOOTER */ /* ----------------------------------------------------------------------------- */ /* 하단 문의하기 */ .f_contact_core { margin:70px 50px; } } @media only screen and (min-width:1401px) and (max-width:1600px) { /* 작은 PC */ /* ----------------------------------------------------------------------------- */ /* TOP */ /* ----------------------------------------------------------------------------- */ /* 상단메뉴 */ .top_gnb_wrap { margin:0 230px 0 250px; } .top_gnb .nav_dep2_ul .nav_dep2_li a { font-size:16px; } } @media only screen and (min-width:1601px) and (max-width:1700px) { /* 작은 PC */ /* ----------------------------------------------------------------------------- */ /* TOP */ /* ----------------------------------------------------------------------------- */ /* 상단메뉴 */ .top_gnb_wrap { margin:0 300px; } .top_gnb .nav_dep2_ul .nav_dep2_li a { font-size:16px; } } @media only screen and (min-width:1140px) { /* PC */ /* ----------------------------------------------------------------------------- */ /* TOP */ /* ----------------------------------------------------------------------------- */ /* 전체메뉴 */ .total_menu_pop { display:none !important; } } @media only screen and (min-height:0px) and (max-height:600px) { /* 세로 */ }