@charset "utf-8"; /*** common ***/ #wrap {min-width:1240px;overflow:hidden;} .after_div {*zoom:1;} .after_div:after {clear:both;content:"";display:block;} .clear {*zoom:1;} .clear:after {clear:both;content:"";display:block;} .fl {float:left;} .fr {float:right;} .relative {position:relative;} .absolute {position:absolute;} .block {display:block;} .blind, .dn {display:none !important;} /*** 정렬 ***/ .ta_left {text-align:left !important;} .ta_center {text-align:center !important;} .ta_right {text-align:right !important;} /*─────────────────────────────────────────────────────────── input, button ───────────────────────────────────────────────────────────*/ /* input */ input[type="text"], input[type="password"], input[type="number"], input[type="date"] {letter-spacing:-0.03em;height:45px;line-height:45px;color:#333;font-size:16px;text-indent:20px;padding:0;margin:0;background:#fff;box-sizing:border-box;border: 1px solid #ddd;vertical-align:middle;text-align:left;border-radius:0;outline:0;} input[type="text"]:focus, input[type="password"]:focus, input[type="number"]:focus, input[type="date"]:focus {border-color: #000;} input[type="text"]::placeholder {color: #aaa;} input[type="text"]::-webkit-input-placeholder {color:#aaa;} input[type="text"]::-moz-placeholder {color:#aaa;} input[type="text"]:-ms-input-placeholder {color:#aaa;} input[type="text"]:-moz-placeholder {color:#aaa;} input[type="password"]::placeholder {color: #aaa;} input[type="password"]::-webkit-input-placeholder {color:#aaa;} input[type="password"]::-moz-placeholder {color:#aaa;} input[type="password"]:-ms-input-placeholder {color:#aaa;} input[type="password"]:-moz-placeholder {color:#aaa;} select {min-width: 140px; height: 45px; background: #fff url("../images/da_image/bg_select_arrow.png") no-repeat 86% center; padding: 0 36px 0 20px; box-sizing:border-box; border: 1px solid #ddd; outline: 0; font-size: 16px; color: #333; letter-spacing: -0.035em; line-height: 45px;} select {-webkit-appearance:none;-moz-appearance:none;appearance:none;} select::-ms-expand {display:none;} select option {line-height:30px;padding:5px 0;} /* select option:checked, select option:hover {line-height:25px;background:#e0e0e0;font-size:12px;color:#555;} select option:checked, select option:hover {line-height:25px;box-shadow:0 0 10px 100px #e0e0e0 inset;font-size:12px;color:#555;} */ .select_box_wrap {display:inline-block;height:30px;line-height:30px;position:relative;z-index:1;box-sizing:border-box;margin:0;padding:0;} .select_box_wrap .select_box_arrow {display:none;cursor:pointer;position:absolute;z-index:5;width:0px;height:0px;right:7px;top:12px;border-right:6px solid transparent;border-bottom:6px solid #aaa;transform:rotate(315deg);-ms-transform:rotate(315deg);-webkit-transform:rotate(315deg);-moz-transform:rotate(225deg);-o-transform:rotate(315deg);}/*right:5px;top:15px;width:8px;height:5px;background:url(../../../../lib/images/icon_select_arrow.png) 0 0 no-repeat;*/ input[type="checkbox"] {display:none;} input[type="checkbox"] + label {cursor:pointer;font-size:14px;} input[type="checkbox"] + label:before, input[type="checkbox"] + label::before {display:inline-block;content:"";width:18px;height:18px;margin:-2px 5px 0 0;vertical-align:middle;background:url("../images/da_image/icon_chk.png") left top no-repeat;cursor:pointer;} input[type="checkbox"]:checked + label:before, input[type="checkbox"]:checked + label::before {background:url("../images/da_image/icon_chk_on.png") left top no-repeat;} input[type="radio"] {display:none;} input[type="radio"] + label {cursor:pointer;} input[type="radio"] + label:before, input[type="radio"] + label::before {display:inline-block;content:"";width:13px;height:13px;margin:-2px 5px 0 20px;vertical-align:middle;background:url('../../../../lib/images/icon_input_radio.png') left top no-repeat;cursor:pointer;} input[type="radio"]:checked + label:before, input[type="radio"]:checked + label::before {background:url('../../../../lib/images/icon_input_radio_on.png') left top no-repeat;} input[type="radio"] + label:first-of-type:before, input[type="radio"] + label:first-of-type::before {margin-left:0;} textarea {font-size:12px;color:#666;border:1px solid #ddd;box-sizing:border-box;margin:0;padding:0 10px;vertical-align:middle;text-align:left;border-radius:0;} button {outline:0;box-sizing:border-box;} .btn_center {text-align:center;font-size:0;} .btn_center a {margin:0;} .btn_center button + button, .btn_center a + button, .btn_center button + a, .btn_center a + a {margin-left:8px;} .btn_center input {margin-top:-10px;} .btn_right a {font-size:15px;font-weight:700;} .btn, .btn_sm, .btn_bbs_go {font-weight:700;border-style:solid;border-width:1px;padding:0;margin:0;text-indent:0;vertical-align:top;text-align:center;display:inline-block;box-sizing:border-box;cursor:pointer;box-shadow:none;outline:0 !important;} .btn, .btn:hover {width:105px;height:40px;line-height:38px;font-size:15px;color:#fff;} .btn_basic, .btn_basic:hover {border-color:#0070c0 !important;background-color:#0070c0 !important;} .btn_point, .btn_point:hover {border-color:#eb3b4b !important;background-color:#eb3b4b !important;} .btn_sm, .btn_sm:hover {border-color:#ddd !important;background-color:#fff !important;color:#555 !important;} .btn_reset {background:#fff url('../images/board/icon_btn_reset.gif') no-repeat 9px 50%;padding:0 10px 0 30px;line-height:28px;} /*─────────────────────────────────────────────────────────── layout ───────────────────────────────────────────────────────────*/ .skip_nav {position:relative;z-index:9999;} .skip_nav a {display:block;height:1px;width:1px;margin-bottom:-1px;overflow:hidden;font-size:12px;color:#fff;font-weight:bold;white-space:nowrap;text-align:center;} .skip_nav a:focus, .skip_nav a:active {height:auto;width:100%;padding:0;margin-bottom:0;position:absolute;left:0;top:0;} .w_layout, .wid_100 {width:100%;text-align:center;margin:0;padding:0;}/*text-align은 익스7이하에서 맞추기 위해서 명명*/ .w_set {width:1430px;text-align:left;margin:0 auto;padding:0 15px;box-sizing:border-box;position:relative;} .w_custom, .wid_cus {width:1230px;text-align:left;margin:0 auto;padding:0 15px;box-sizing:border-box;position:relative;} /* header 레이아웃 */ .warpper {width:100%;} /* header 와 footer 제외하고 전체를 감싸는 영역 */ .warpper .contents_wrap {width:1200px;margin:0 auto;padding:0;position:relative;z-index:1;vertical-align:top;font-size:0;min-height:540px;} /* warpper 안에 측면과 컨텐츠를 감싸는 영역 */ .warpper .contents_wrap #aside {vertical-align:top;} /* 측면을 감싸는 영역 */ .warpper .contents_wrap #contents_box {width:100%;padding:0 0 140px 0;vertical-align:top;} /* 컨텐츠를 감싸는 영역 */ .warpper .contents_wrap #aside + #contents_box {width: 100%;} /* 측면과 컨텐츠가 함께 나올때 영역 사이즈 재설정 */ /*.warpper .contents_wrap .nav_wrap {margin-top:-7px;} 네비게이션 감싸는 영역. 레이아웃에 따라 위치가 ".contents_wrap > .nav_wrap" 일수도, ".contents_wrap #contents_box > .nav_wrap" 일수도 있음 */ .warpper .contents_wrap #contents_box #content {width:100%;margin:0;padding:0;text-align:left;} /* 컨텐츠 */ /* .warpper .contents_wrap #contents_box #content:after {clear:both;content:"";display:block;} */ /* 네비게이션 영역 */ .nav_wrap {width: 100%; background: #f5f7fa; box-sizing: border-box; padding: 0 100px;} .nav_wrap .nav_box {} .nav_wrap .nav_box ul {display: flex; align-items: center; height: 50px;} .nav_wrap .nav_box ul li {position: relative; font-size: 0;} .nav_wrap .nav_box ul li + li {} .nav_wrap .nav_box ul li + li:before {content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 19px 0 16px; border-top: 1px solid #888; border-right: 1px solid #888; transform: translateY(-2px) rotate(45deg);} .nav_wrap .nav_box ul li span, .nav_wrap .nav_box ul li strong, .nav_wrap .nav_box ul li a {display: inline-block; font-size: 16px; color: #666; letter-spacing: -0.04em;} .nav_wrap .nav_box ul li strong a {padding:0;} .nav_wrap .nav_box ul li a.home {width: 14px; height: 15px; background:url('../images/da_image/icon_nav_home.png') no-repeat center; font-size: 0;} .nav_wrap .nav_box ul li:last-child a, .nav_wrap .nav_box ul li:last-child span, .nav_wrap .nav_box ul li:last-child strong {color:#333; font-weight: 400;} /*측면영역*/ #aside {padding-top: 10px; padding-bottom: 55px;} #aside .sub_menu {text-align: left;} #aside .sub_menu h2 {font-size: 50px; font-weight: 600; color: #333; letter-spacing: -0.03em;} #aside .sub_menu ul {display: flex; margin-top: 39px;} #aside .sub_menu ul li {position: relative;} #aside .sub_menu ul li, #aside .sub_menu ul li a {font-size: 20px; color: #333; letter-spacing: -0.03em;} #aside .sub_menu ul li + li {margin-left: 52px;} #aside .sub_menu ul li.on, #aside .sub_menu ul li.on a {font-weight: 600; color: #0070c0;} #aside .sub_menu ul li.on:after {content: ""; position: absolute; left: 0; bottom: -5px; width: 100%; height: 2px; background: #0070c0;} @media only screen and (max-width:1560px) { .nav_wrap {padding: 0 50px;} } @media only screen and (max-width:1430px) { .w_set {min-width:1230px;width:100%;} } @media only screen and (max-width:1340px) { .nav_wrap {padding: 0 20px;} } @media only screen and (max-width:1230px) { .w_custom {min-width:1230px;width:100%;} } /*─────────────────────────────────────────────────────────── HEADER | outline/header.html, outline/nav.html ───────────────────────────────────────────────────────────*/ #header {position:fixed;top:0;left:0;width:100%;height:100px;background:#fff;/* box-shadow: 0px 8px 15px 0 rgba(0, 0, 0, 0.1); */transition: all 0.3s;z-index:100;} #header.on {box-shadow: 0px 8px 15px 0 rgba(0, 0, 0, 0.1);} #header .header_cont {padding:0 100px;position:relative;z-index:1;height:100%;} #header .hd_logo {width:111px;height:64px;position:absolute;top:50%;transform:translateY(-50%);left:100px;} #header .hd_logo a {display:block;width:100%;height:100%;background:url('../images/da_image/hd-logo.png') no-repeat center;background-size:100%;font-size:0;} #header .hd_lnb {text-align:center;font-size:0;height: 100%;display: flex;align-content: center;justify-content: center;align-items: center;} #header .hd_lnb > li {display:inline-block;padding:0 36.5px;vertical-align: middle;position:relative;} #header .hd_lnb > li > a {padding:0;font-size:20px;line-height:100px;font-weight:400;color:#333;letter-spacing:-0.03em;display:block;text-align:center;} #header .hd_lnb > li:hover > a {color:#0070c0;font-weight:700;} #header .hd_lnb .hd_lnb_dep2 {z-index:55;display:none;position:absolute;left:50%;transform:translateX(-50%);top:80%;background:#fff;width:100%;padding:40px 36px;width:100%;box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1);box-sizing:border-box;} #header .hd_lnb > li:nth-of-type(1) .hd_lnb_dep2 {min-width:220px;} #header .hd_lnb > li:nth-of-type(6) .hd_lnb_dep2 {min-width:150px;} #header .hd_lnb .hd_lnb_dep2 li {} #header .hd_lnb .hd_lnb_dep2 li + li {margin-top:26px;} #header .hd_lnb .hd_lnb_dep2 li a {font-size:16px;line-height:1;font-weight:400;color:#666;letter-spacing:-0.03em;} #header .hd_lnb .hd_lnb_dep2 li:hover a {color:#0070c0;} @media only screen and (max-width:1560px) { #header .header_cont {padding:0 50px;} #header .hd_logo {left:50px;} } @media only screen and (max-width:1340px) { #header .header_cont {padding:0 20px;} #header .hd_logo {left:20px;} #header .hd_lnb > li {padding:0 20px;} #header .hd_lnb > li > a {font-size:18px;} } @media only screen and (max-width:1230px) { #header .header_cont {min-width:1230px;} } /*─────────────────────────────────────────────────────────── FOOTER | outline/footer.html ───────────────────────────────────────────────────────────*/ #footer {background:#111;} #footer .btn_top {position:fixed;width:60px;height:60px;background:#fff;box-shadow: 0 0 15px 0 rgba(0, 112, 192, 0.2);bottom:50px;right:50px;z-index:10;opacity:0;transition:all 0.5s;visibility:hidden;transform-origin: top center;} #footer .btn_top.on {opacity:1;visibility:visible;} #footer .btn_top a {display:block;width:100%;height:100%;text-align:center;} #footer .btn_top a span {font-size:14px;line-height:1;font-weight:400;color:#0070c0;letter-spacing:-0.03em;padding-top:33px;position:relative;z-index:1;display:inline-block;} #footer .btn_top a span:before {content:'';display:block;position:absolute;width:9px;height:12px;background:url('../images/da_image/icon-scrolltop.png') no-repeat center top;top:15px;left:50%;transform:translateX(-50%);} #footer .footer_cont {} #footer .footer_top {border-bottom:1px solid rgba(255,255,255,0.3);} #footer .footer_top .w_set {display:flex;justify-content: space-between;align-items: center;} #footer .footer_top .ft_gnb {font-size:0;padding:40px 0;} #footer .footer_top .ft_gnb li {display:inline-block;} #footer .footer_top .ft_gnb li + li {padding-left:40px;} #footer .footer_top .ft_gnb li a {font-size:18px;line-height:1;font-weight:400;color:#fff;letter-spacing:-0.03em;} #footer .footer_top .ft_gnb li a strong {font-size:inherit;font-weight:600;} #footer .footer_top .ft_sns {font-size:0;} #footer .footer_top .ft_sns li {display:inline-block;vertical-align:middle;width:44px;height:44px;} #footer .footer_top .ft_sns li + li {padding-left:10px;} #footer .footer_top .ft_sns li a {display:block;width:100%;height:100%;border-radius:100%;font-size:0;} #footer .footer_top .ft_sns li.blog a {background:rgba(255,255,255,0.3) url('../images/da_image/icon-sns-1.png') no-repeat center;} #footer .footer_top .ft_sns li.cafe a {background:rgba(255,255,255,0.3) url('../images/da_image/icon-sns-2.png') no-repeat center;} #footer .footer_top .ft_sns li.facebook a {background:rgba(255,255,255,0.3) url('../images/da_image/icon-sns-3.png') no-repeat center;} #footer .footer_top .ft_sns li.band a {background:rgba(255,255,255,0.3) url('../images/da_image/icon-sns-4.png') no-repeat center;} #footer .footer_info {padding:60px 0 100px;} #footer .footer_info .w_set {} #footer .footer_info .ft_logo {display:inline-block;padding-right:70px;vertical-align:sub;} #footer .footer_info .ft_logo a {display:block;} #footer .footer_info .ft_logo a img {} #footer .footer_info .ft_info {} #footer .footer_info .ft_info .info {display:inline-block;vertical-align:top;} #footer .footer_info .ft_info .info address {font-size:16px;line-height:30px;font-weight:400;color:#999;letter-spacing:-0.03em;} #footer .footer_info .ft_info .info address a {font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;} #footer .footer_info .ft_info .info span {display:inline-block;margin:0 18px;} #footer .footer_info .ft_info .copy {font-size:16px;line-height:1;font-weight:400;color:#999;letter-spacing:-0.03em;opacity:0.6;padding-top:10px;} #footer .footer_info .ft_info .copy a {font-size:inherit;font-weight:inherit;color:Inherit;} #footer .footer_info .family_site {display:inline-block;width:200px;height:50px;border:1px solid rgba(255,255,255,0.5);position:absolute;top:0;right:15px;cursor:pointer;background:#111;} #footer .footer_info .family_site dt:before {content: '';width: 7px;height: 7px;border: 1px solid #fff;border-width: 1px 1px 0 0;transform: rotate(135deg);right:21px;top:18px;position: absolute;transition: 0.6s;opacity:0.5;} #footer .footer_info .family_site dt.on:before {transform: rotate(315deg);top:21px;} #footer .footer_info .family_site dt span {padding:0 20px;font-size:16px;line-height:48px;font-weight:400;color:rgba(255,255,255,0.5);letter-spacing:-0.03em;display:block;} #footer .footer_info .family_site .site_tit {} #footer .footer_info .family_site dd {position:absolute;bottom:100%;left:-1px;width:100%;border:1px solid rgba(255,255,255,0.5);z-index:2;background:#111;display:none;padding:10px 0;} #footer .footer_info .family_site dd li {height:30px;line-height:30px;box-sizing:border-box;transition:all 0.3s;} #footer .footer_info .family_site dd li a {padding:0 20px;font-size:15px;color:rgba(255,255,255,0.5);display:block;} #footer .footer_info .family_site dd li img {} @keyframes menuAni { 0% { opacity: 0; } 100% { opacity: 1; } } /*─────────────────────────────────────────────────────────── INDEX | index.html ───────────────────────────────────────────────────────────*/ /* 공통 */ .main .main_title {text-align:center;padding-bottom:60px;} .main .main_title h3 {font-size:50px;line-height:1;font-weight:600;color:#333;letter-spacing:-0.03em;} .main .main_tab {font-size:0;padding-top:40px;} .main .main_tab li {display:inline-block;font-size:20px;line-height:1;font-weight:400;color:#333;letter-spacing:-0.03em;position:relative;z-index:1;cursor:pointer;transition:all 0.5s;} .main .main_tab li + li {margin-left:46px;} .main .main_tab li.on {color:#0070c0;font-weight:600;} .main .main_tab li:after {content:'';display:block;position:absolute;width:0;height:2px;background:#0070c0;left:0;bottom:-6px;transition:all 0.5s;} .main .main_tab li.on:after {width:100%;} .main .main_tab li:hover {color:#0070c0;} .main .main_tab li:hover:after {width:100%;} .main .main_tab_con .tab_con {display:none;} .main .main_tab_con .tab_con.on {display:block;} .main .main_tab_con .tab_con .data_no {text-align:center;font-size:16px;font-weight:400;color:#666;} .main .board_ul .subject {display:block;font-size:24px;line-height:1;font-weight:600;color:#333;letter-spacing:-0.03em;word-break:break-all;overflow:hidden;white-space:normal;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;word-wrap:break-word;} .main .board_ul p {font-size:16px;line-height:26px;font-weight:400;color:#666;letter-spacing:-0.03em;margin-top:15px;word-break:break-all;overflow:hidden;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;} .main .board_ul .date {display:block;font-size:15px;line-height:15px;font-weight:400;color:#999;letter-spacing:-0.03em;padding-left:24px;position:relative;margin-top:30px;} .main .board_ul .date:before {content:'';display:block;position:absolute;width:15px;height:15px;background:url('../images/da_image/icon-date.png') no-repeat center;background-size:15px;top:0;left:0;} .main .board_ul .link {display:block;position:absolute;width:100%;height:100%;top:0;left:0;z-index:2;} .main .btn_more {display:block;width:220px;height:60px;border-radius:30px;border:1px solid #0070c0;box-sizing:border-box;font-size:18px;line-height:58px;font-weight:600;color:#0070c0;letter-spacing:-0.03em;padding:0 30px;margin:60px auto 0;overflow:hidden;} .main .btn_more:hover {color:#fff;} .main .btn_more:before {content:'';display:block;position:absolute;width:0;height:calc(100% + 2px);background:#0070c0;transition:all 0.3s;top:-1px;left:-1px;} .main .btn_more:hover:before {width:calc(100% + 2px);} .main .btn_more span {display:block;font-size:inherit;font-weight:inherit;color:inherit;position:relative;} .main .btn_more span:after, .main .btn_more span:before {content:'';display:block;position:absolute;width:11px;height:1px;background:#0070c0;top:50%;right:0;transition-delay:0.1s;} .main .btn_more span:before {width:1px;height:11px;right:5px;margin-top:-5.5px;} .main .btn_more:hover span:before, .main .btn_more:hover span:after {background:#fff;} /* 메인 비주얼 */ #wrap .main_visual {position:relative;width:100%;min-width:1200px;margin:0;height:870px;background:#000;} #wrap .main_visual .slick-slide {overflow:hidden;position:relative;text-align:center;height:870px;} .main_visual .slick-slide a {display:inline-block;height:100%;width:100%;margin:0 auto;text-align:Center;position:absolute;left:0;top:0;outline:0;background-position:center;background-size:cover !important;transition:transform 2s ease-in-out, opacity 2s ease-in-out;/*transform:scale(1.2) rotate(0.003deg);*/} .main_visual .slick-slide img {display:inline-block;height:auto;width:100%;} .main_visual .slick-dots {position:absolute;width:auto;bottom:50px;left:50%;transform:translateX(-50%);font-size:0;} .main_visual .slick-dots li {display:inline-block;padding:0 10px;} .main_visual .slick-dots li button {display:block;width:8px;height:8px;background:rgba(255,255,255,0.6);border-radius:100%;font-size:0;} .main_visual .slick-dots li.slick-active button {background:#0070c0;width:12px;height:12px;} /* 메인 퀵메뉴 */ .main_quick {padding:100px 0;} .main_quick ul {font-size:0;} .main_quick ul li {display:inline-block;width:20%;position:relative;} .main_quick ul li + li {} .main_quick ul li + li:before {content:'';display:block;position:absolute;width:1px;height:100%;background:#ddd;top:0;left:0;} .main_quick ul li p {font-size:18px;line-height:1;font-weight:600;color:#333;letter-spacing:-0.03em;padding-top:85px;text-align:center;} .main_quick ul li:hover p {font-weight:700;color:#00b050;} .main_quick ul li p:before {content:'';display:block;position:absolute;width:0;height:0;border-radius:100%;background:#00b050;opacity:0.1;top:-20px;right:81px;opacity:0;transition:all 0.5s;} .main_quick ul li:hover p:before {width:50px;height:50px;} .main_quick ul li:hover p:before {content:'';display:block;position:absolute;width:50px;height:50px;border-radius:100%;background:#00b050;opacity:0.1;top:-20px;right:81px;} .main_quick ul li:nth-of-type(1) p {background:url('../images/da_image/main-quick-menu-1.png') no-repeat center top;} .main_quick ul li:nth-of-type(2) p {background:url('../images/da_image/main-quick-menu-2.png') no-repeat center top;} .main_quick ul li:nth-of-type(3) p {background:url('../images/da_image/main-quick-menu-3.png') no-repeat center top;} .main_quick ul li:nth-of-type(4) p {background:url('../images/da_image/main-quick-menu-4.png') no-repeat center top;} .main_quick ul li:nth-of-type(5) p {background:url('../images/da_image/main-quick-menu-5.png') no-repeat center top;} /* DMZ 갤러리 */ .main_gallery {background:#f9f9f9;padding:130px 0;} .main_gallery .gallery_cont {} .main_gallery .gallery_cont .slick-slider {font-size:0;} .main_gallery .gallery_cont .slick-list {overflow:visible;width:calc(100% + 50px);margin-left:-25px;} .main_gallery .gallery_cont .slick-slide {padding:0 25px;} .main_gallery .gallery_cont .thumb {height:0;position:relative;padding-bottom: 245px;overflow: hidden;margin-bottom:40px;} .main_gallery .gallery_cont .thumb img {position:absolute;width: 102%;height:100%;object-fit: cover;top: 50%;left: 50%;transform: translate(-50%,-50%);} .main_gallery .gallery_cont .txt_wrap {} .main_gallery .gallery_cont .txt_wrap p {line-height:16px;-webkit-line-clamp:1;} .main_gallery .gallery_cont .txt_wrap .date {padding-top:30px;margin-top:30px;border-top:1px solid #ddd;} .main_gallery .gallery_cont .txt_wrap .date:before {top:30px;} .main_gallery .gallery_cont .slick-arrow {position:absolute;width:70px;height:70px;border-radius:100%;font-size:0;top:90px;z-index:1;transition:all .3s;} .main_gallery .gallery_cont .slick-prev {background:#333 url('../images/da_image/icon-sld-prev.png') no-repeat center;left:-35px;} .main_gallery .gallery_cont .slick-next {background:#333 url('../images/da_image/icon-sld-next.png') no-repeat center;right:-35px;} .main_gallery .gallery_cont .slick-arrow:hover {background-color:#0070c0;} /* 공지사항 */ .main_notice {background:#0070c0 url('../images/da_image/main-notice-bg.png') no-repeat center;background-size:cover;background-blend-mode:multiply;padding:130px 0;text-align:center;} .main_notice .main_title {text-align:left;} .main_notice .main_title h3 {display:inline-block;color:#fff;} .main_notice .main_title .main_tab {display:inline-block;padding-top:0;padding-left:60px;} .main_notice .main_title .main_tab li {color:#fff;} .main_notice .main_title .main_tab li.on {color:#ffc000;} .main_notice .main_title .main_tab li.on:after {background:#ffc000;} .main_notice .main_title .main_tab li:hover {color:#ffc000;} .main_notice .main_title .main_tab li:hover:after {background:#ffc000;} .main_notice .btn_more {border-color:#fff;color:#fff;} .main_notice .btn_more:hover {color:#0070c0;} .main_notice .btn_more:hover:before {background:#fff;} .main_notice .btn_more span:before, .main_notice .btn_more span:after {background:#fff;} .main_notice .btn_more:hover span:before, .main_notice .btn_more:hover span:after {background:#0070c0;} .main_notice .notice_cont {} .main_notice .notice_cont ul {font-size:0;} .main_notice .notice_cont ul li {display:inline-block;background:#fff;width:calc(33.333% - 112px);padding:40px 46px;position:relative;z-index:1;} .main_notice .notice_cont ul li:hover:before {content:'';display:block;position:absolute;width:100%;height:100%;background:rgba(0,0,0,0.55);border:5px solid #ffc000;box-sizing:border-box;top:0;left:0;z-index:1;transition:all 0.5s;} .main_notice .notice_cont ul li + li {margin-left:30px;} .main_notice .notice_cont ul li:nth-of-type(4n) {margin-left:0;} .main_notice .notice_cont ul li:nth-of-type(n+4) {margin-top:30px;} .main_notice .notice_cont ul li em {display:block;font-size:17px;line-height:1;font-weight:400;color:#ffc000;letter-spacing:-0.03em;padding-bottom:20px;} .main_notice .notice_cont ul li .btn_plus {opacity:0;transition:all 0.5s;position:absolute;width:60px;height:60px;background:#ffc000;border-radius:100%;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;} .main_notice .notice_cont ul li:hover .btn_plus {opacity:1;} .main_notice .notice_cont ul li .btn_plus:before, .main_notice .notice_cont ul li .btn_plus:after {content:'';display:block;position:absolute;width:22px;height:2px;background:#fff;top:50%;left:50%;transform:translate(-50%,-50%);} .main_notice .notice_cont ul li .btn_plus:after {width:2px;height:22px;} /*─────────────────────────────────────────────────────────── company ───────────────────────────────────────────────────────────*/ /*** DMZ평화네트워크 소개 | company/about.html ***/ .sub_about .about_img {width: 100%; height: 360px; margin-bottom: 73px; background: url("../images/da_image/sub_about_img.jpg") no-repeat center;} .sub_about .about_cont {position: relative;} .sub_about .about_cont .txt_box h3 {margin-bottom: 34px; font-size: 42px; font-weight: 600; color: #333; letter-spacing: -0.035em; line-height: 1.28;} .sub_about .about_cont .txt_box p {font-size: 18px; color: #666; letter-spacing: -0.035em; line-height: 1.77;} .sub_about .about_cont .txt_box p + p {margin-top: 14px;} .sub_about .about_cont .object_box {position: absolute; right: 15px; top: 15px; font-size: 0;} .sub_about .about_cont .object_box span {display: inline-block; width: 80px; height: 20px; background: #ffc000; vertical-align: top;} .sub_about .about_cont .object_box span + span {margin-left: 2px; background: #00b050;} .sub_about .about_cont .object_box span + span + span {background: #0070c0;} /*** 연혁 | company/history.html ***/ .sub_history {background: #fafafa; padding-top: 74px; padding-bottom: 140px;} .sub_history .w_custom {display: flex;} .sub_history .history_tit {display: inline-flex; flex-direction: column; align-items: flex-start; width: 500px;} .sub_history .history_tit * {font-weight: 600; letter-spacing: -0.035em; background-image: linear-gradient(to right, #ffc000, #00b050, #0070c0); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;} .sub_history .history_tit span {font-size: 32px;} .sub_history .history_tit h3 {margin-top: 14px; font-size: 80px;} .sub_history .history_cont {width: calc(100% - 500px); padding-top: 83px;} .sub_history .history_cont > ul {position: relative; width: 100%;} .sub_history .history_cont > ul:before {content: ""; position: absolute; left: 99px; top: 5px; width: 1px; height: calc(100% - 15px); background: #ddd;} .sub_history .history_cont > ul > li {display: flex; width: 100%;} .sub_history .history_cont > ul > li + li {margin-top: 68px;} .sub_history .history_cont > ul > li .year {position: relative; width: 108px; font-size: 22px; font-weight: 600; color: #333; letter-spacing: -0.035em;} .sub_history .history_cont > ul > li .year:before, .sub_history .history_cont > ul > li .year:after {content: ""; position: absolute; box-sizing: border-box; border-radius: 50%;} .sub_history .history_cont > ul > li .year:before {top: 5px; right: 0; width: 17px; height: 17px; background: #fff; border: 1px solid #ddd;} .sub_history .history_cont > ul > li .year:after {top: 10px; right: 5px; width: 7px; height: 7px; background: #0070c0;} .sub_history .history_cont > ul > li .detail {width: calc(100% - 108px); box-sizing: border-box; padding-left: 40px;} .sub_history .history_cont > ul > li .detail dl {display: flex;} .sub_history .history_cont > ul > li .detail dl + dl {margin-top: 12px;} .sub_history .history_cont > ul > li .detail dt {width: 98px; margin-right: 40px; font-size: 18px; color: #0070c0; letter-spacing: -0.035em; line-height: 1.55;} .sub_history .history_cont > ul > li .detail dd li {font-size: 17px; font-weight: 300; color: #666; letter-spacing: -0.03em; line-height: 1.64;} .sub_history .history_cont > ul > li .detail dd li + li {margin-top: 12px;} /*** 사업영역 | company/busindess.html ***/ .sub_business {} .sub_business .business_list {display: flex; align-items: center;} .sub_business .business_list li {position: relative; display: inline-flex; align-items: center; justify-content: center; width: 200px; height: 200px; border-radius: 50%; text-align: center;} .sub_business .business_list li + li {margin-left: -20px;} .sub_business .business_list li span {font-size: 22px; font-weight: 600; line-height: 1; letter-spacing: -0.035em;} .sub_business .business_cont {counter-reset: bsn_num; display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px; margin-top: 60px;} .sub_business .business_cont dl {counter-increment: bsn_num; position: relative; min-height: 290px; box-sizing: border-box; border: 1px solid #ddd; padding: 42px 88px 40px;} .sub_business .business_cont dl:before {content: "0" counter(bsn_num); position: absolute; left: 39px; top: 39px; display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; font-size: 16px; font-weight: 600; color: #fff; letter-spacing: -0.035em;} .sub_business .business_cont dl dt {margin-bottom: 24px; font-size: 24px; font-weight: 600; color: #333; letter-spacing: -0.035em;} .sub_business .business_cont dl dd .bar_list li {position: relative; padding-left: 10px; font-size: 18px; font-weight: 300; color: #666; letter-spacing: -0.035em;} .sub_business .business_cont dl dd .bar_list li:before {content: ""; position: absolute; left: 0; top: 10px; width: 6px; height: 1px; background: #666;} .sub_business .business_cont dl dd .bar_list li + li {margin-top: 12px;} .sub_business .business_cont dl dd .icon_list li {display: flex; align-items: flex-start; font-size: 17px; color: #666; line-height: 1.64;} .sub_business .business_cont dl dd .icon_list li + li {margin-top: 16px;} .sub_business .business_cont dl dd .icon_list li a {font-size: inherit; color: inherit;} .sub_business .business_cont dl dd .icon_list li img {margin-top: 2px; margin-right: 12px;} /* 01 */ .sub_business .business_list li.bsn01 {background: rgba(75,168,53,0.08);} .sub_business .business_list li.bsn01 span {color: #4ba835; line-height: 1.36;} .sub_business .business_cont dl.bsn01:before {background: #4ba835;} /* 02 */ .sub_business .business_list li.bsn02 {background: rgba(0,91,156,0.08);} .sub_business .business_list li.bsn02 span {color: #005b9c;} .sub_business .business_cont dl.bsn02:before {background: #005b9c;} /* 03 */ .sub_business .business_list li.bsn03 {background: rgba(149,66,144,0.08);} .sub_business .business_list li.bsn03 span {color: #954290;} .sub_business .business_cont dl.bsn03:before {background: #954290;} /* 04 */ .sub_business .business_list li.bsn04 {background: rgba(234,191,0,0.08);} .sub_business .business_list li.bsn04 span {color: #eabf00;} .sub_business .business_cont dl.bsn04:before {background: #eabf00;} /* 05 */ .sub_business .business_list li.bsn05 {background: rgba(239,119,0,0.08);} .sub_business .business_list li.bsn05:before, .sub_business .business_list li.bsn05:after {content: ""; position: absolute; top: 50%; transform: translateY(calc(-50% + 1px)); background: #ddd;} .sub_business .business_list li.bsn05:before {right: -40px; width: 40px; height: 1px;} .sub_business .business_list li.bsn05:after {right: -40px; width: 7px; height: 7px; border-radius: 50%;} .sub_business .business_list li.bsn05 span {color: #ef7700;} .sub_business .business_cont dl.bsn05:before {background: #ef7700;} /* DMZ */ .sub_business .business_list li.dmz {width: 220px; height: 220px; background-image: linear-gradient(to right, #ffc000, #00b050, #0070c0); margin-left: 62px; box-sizing: border-box; padding: 10px;} .sub_business .business_list li.dmz span {display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: #fff; border-radius: 50%;} .sub_business .business_cont dl.dmz {display: flex; background: #f5f5f5; border: 0; padding: 40px;} .sub_business .business_cont dl.dmz:before {display: none;} .sub_business .business_cont dl.dmz dt {width: 118px;} .sub_business .business_cont dl.dmz dt img {width: 100%;} .sub_business .business_cont dl.dmz dd {width: calc(100% - 118px); box-sizing: border-box; padding-left: 40px;} /*** 이사장 인사말 | company/greetings.html ***/ .sub_greetings {} .sub_greetings .greetings_main {position: relative;} .sub_greetings .greetings_main .img_box {width: 650px; height: 430px; background: url("/theme/dmz/img/sub_image/sub_greetings_img.jpg") no-repeat center;} .sub_greetings .greetings_main .txt_box {position: absolute; right: 0; bottom: 0; width: 630px; height: 350px; background: #0070c0; box-sizing: border-box; padding: 55px 60px;} .sub_greetings .greetings_main .txt_box p {font-size: 20px; font-weight: 600; color: #ffc000; letter-spacing: -0.035em;} .sub_greetings .greetings_main .txt_box h3 {margin-top: 17px; font-size: 38px; font-weight: 600; color: #fff; line-height: 1.31; letter-spacing: -0.035em;} .sub_greetings .greetings_main .txt_box .ceo:before {content: ""; display: block; width: 80px; height: 1px; margin: 32px 0 36px; background: rgba(255,255,255,0.1);} .sub_greetings .greetings_main .txt_box .ceo span {display: inline-block; font-size: 18px; color: rgba(255,255,255,0.5); letter-spacing: -0.03em; vertical-align: middle;} .sub_greetings .greetings_main .txt_box .ceo strong {display: inline-block; margin-left: 20px; font-size: 26px; font-weight: 400; color: #fff; letter-spacing: 0.2em; vertical-align: middle;} .sub_greetings .greetings_cont {padding-top: 56px;} .sub_greetings .greetings_cont * {letter-spacing: -0.03em;} .sub_greetings .greetings_cont b {font-size: 26px; font-weight: 600; color: #333;} .sub_greetings .greetings_cont p {margin-top: 13px; font-size: 18px; font-weight: 300; color: #666; line-height: 1.77;} .sub_greetings .greetings_cont strong {position: relative; display: inline-block; margin-top: 40px; font-size: 22px; font-weight: 500; color: #333;} .sub_greetings .greetings_cont strong:before {content: ""; position: absolute; left: 0; bottom: -2px; width: 100%; height: 10px; background: rgba(0,112,192,0.12); z-index: -1;} .sub_greetings .greetings_cont h4 {margin-top: 34px; font-size: 26px; font-weight: 600; color: #0070c0; line-height: 1.53;} /*** 함께하는 사람들 | company/together.html ***/ .sub_together {} .sub_together .together_wrap {padding-top: 80px;} .sub_together .together_wrap .w_custom {display: flex; justify-content: space-between;} .sub_together .together_wrap .tit_box {width: 300px; height: 300px; background: #00b050; box-sizing: border-box; padding: 33px 40px;} .sub_together .together_wrap .tit_box p {font-size: 20px; font-weight: 600; color: #ffda68; letter-spacing: -0.035em; line-height: 1.6;} .sub_together .together_wrap .tit_box h3 {margin-top: 13px; font-size: 44px; font-weight: 600; color: #fff; letter-spacing: -0.035em; line-height: 1.36; word-break: keep-all;} .sub_together .together_wrap .tit_box .date {font-size: 18px; color: rgba(255,255,255,0.5); letter-spacing: -0.03em;} .sub_together .together_wrap .tit_box .date:before {content: ""; display: block; width: 60px; height: 1px; margin: 29px 0 41px; background: rgba(255,255,255,0.1);} .sub_together .together_wrap .cont_box {width: 840px; padding-top: 26px;} .sub_together .together_wrap .member_box {font-size: 0;} .sub_together .together_wrap .member_box + .member_box {margin-top: 56px;} .sub_together .together_wrap .member_box h4 {margin-bottom: 26px; font-size: 28px; font-weight: 600; color: #333; letter-spacing: -0.035em;} .sub_together .together_wrap .member_box .member_list {display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px;} .sub_together .together_wrap .member_box .member_list li {display: flex; align-items: center; flex-direction: column; justify-content: center; width: 260px; min-height: 185px; background: #fff; box-sizing: border-box; padding: 12px 24px; border: 1px solid #ddd;} .sub_together .together_wrap .member_box .member_list li strong {font-size: 20px; font-weight: 600; color: #333; letter-spacing: -0.035em;} .sub_together .together_wrap .member_box .member_list li p {font-size: 16px; font-weight: 300; color: #666; letter-spacing: -0.035em; line-height: 1.625; text-align: center;} .sub_together .together_wrap .member_box .member_list li p:before {content: ""; display: block; margin: 16px auto; width: 40px; height: 1px; background: #ddd;} /* 이사진 제1기 */ .sub_together .together_wrap:first-child {background: #f5f5f5; padding-bottom: 80px;} .sub_together .together_wrap:first-child .tit_box {background: #0070c0;} .sub_together .together_wrap:first-child .tit_box p {color: #ffc000;} .sub_together .together_wrap:first-child .member_box .member_list li {border-color: #fff;} .sub_together .together_wrap .member_box.inline {display: inline-block; vertical-align: top;} .sub_together .together_wrap .member_box.inline + .member_box.inline {margin-top: 0; margin-left: 30px;} .sub_together .together_wrap .member_box.inline .member_list {display: block;} /*─────────────────────────────────────────────────────────── 후원 ───────────────────────────────────────────────────────────*/ /*** 후원 | support/about.html ***/ .sub_support .support_img {width: 100%; height: 360px;background: url("/theme/dmz/img/sub_image/sub-support-img.jpg") no-repeat center;} .sub_support .support_cont {text-align:center;} .sub_support .support_cont .txt_box {padding:100px 0;} .sub_support .support_cont .txt_box h3 {font-size:50px;line-height:1;font-weight:500;color:#333;letter-spacing:-0.03em;} .sub_support .support_cont .txt_box p {font-size:20px;line-height:1.7;font-weight:400;color:#333;letter-spacing:-0.03em;padding-top:27px;} .sub_support .support_cont .apply_wrap {background:#f5f5f5;position:relative;padding:110px 0 124px;} .sub_support .support_cont .apply_wrap:before {content:'';display:block;position:absolute;width:1px;height:100px;background:#000;left:50%;top:-50px;} .sub_support .support_cont .apply_wrap .apply {display:inline-block;width:calc(50% - 22px);border:1px solid #ddd;padding:60px 40px 55px;box-sizing:border-box;background:#fff;text-align:center;vertical-align:top;} .sub_support .support_cont .apply_wrap .apply:nth-of-type(2) + .apply {margin-left:40px;} .sub_support .support_cont .apply_wrap .apply h5 {font-size:24px;line-height:1;font-weight:600;color:#333;letter-spacing:-0.03em;padding-top:89px;padding-bottom:40px;} .sub_support .support_cont .apply_wrap .apply p {font-size:18px;line-height:30px;font-weight:300;color:#666;letter-spacing:-0.03em;} .sub_support .support_cont .apply_wrap .apply p strong {font-size:inherit;font-weight:500;color:#333;} .sub_support .support_cont .apply_wrap .apply01 {width:100%;display:block;border-color:#000;padding-bottom:60px;margin-bottom:40px;} .sub_support .support_cont .apply_wrap .apply01 h4 {font-size:36px;line-height:1;font-weight:600;color:#333;letter-spacing:-0.03em;padding-top:95px;background:url('/theme/dmz/img/sub_image/support-icon-1.png') no-repeat center top;} .sub_support .support_cont .apply_wrap .apply01 h4 strong {display:inline-block;position:relative;z-index:1;font-size:inherit;font-weight:inherit;line-height:inherit;color:inherit;} .sub_support .support_cont .apply_wrap .apply01 h4 strong:after {content:'';display:block;position:absolute;width:calc(100% + 14px);margin-left:-7px;height:14px;background:#e0eef7;bottom:-3px;left:0;z-index:-1;} .sub_support .support_cont .apply_wrap .apply01 h4 strong span {font-size:20px;font-weight:500;color:inherit;} .sub_support .support_cont .apply_wrap .apply01 p {line-height:1;padding:40px 0;} .sub_support .support_cont .apply_wrap .apply01 .cs {font-size:0;text-align:center;} .sub_support .support_cont .apply_wrap .apply01 .cs li {display:inline-block;font-size:17px;line-height:23px;font-weight:400;color:#666;letter-spacing:-0.03em;} .sub_support .support_cont .apply_wrap .apply01 .cs li + li {margin-left:40px;padding-left:41px;position:relative;} .sub_support .support_cont .apply_wrap .apply01 .cs li + li:before {content:'';display:block;position:absolute;width:1px;height:20px;background:#ddd;top:50%;left:0;transform:translateY(-50%);} .sub_support .support_cont .apply_wrap .apply01 .cs li a {font-size:inherit;font-weight:inherit;color:inherit;padding-left:27px;background:url('/theme/dmz/img/sub_image/support-icon-tel.png') no-repeat top left;display:block;} .sub_support .support_cont .apply_wrap .apply01 .cs li + li a {padding-left:36px;background:url('/theme/dmz/img/sub_image/support-icon-mail.png') no-repeat center left;} .sub_support .support_cont .apply_wrap .apply01 .btn_wrap {padding-top:60px;font-size:0;} .sub_support .support_cont .apply_wrap .apply01 .btn_wrap a {font-size:18px;line-height:60px;font-weight:600;color:#fff;letter-spacing:-0.03em;display:inline-block;width:240px;height:60px;border-radius:30px;text-align:center;} .sub_support .support_cont .apply_wrap .apply01 .btn_wrap a + a {margin-left:10px;} .sub_support .support_cont .apply_wrap .apply01 .btn_wrap a:nth-of-type(1) {background:#0070c0;} .sub_support .support_cont .apply_wrap .apply01 .btn_wrap a:nth-of-type(2) {background:#00b050;} .sub_support .support_cont .apply_wrap .apply01 .btn_wrap a:nth-of-type(3) {background:#ffc000;} .sub_support .support_cont .apply_wrap .apply02 h5 {background:url('/theme/dmz/img/sub_image/support-icon-2.png') no-repeat center top;} .sub_support .support_cont .apply_wrap .apply02 ol {counter-reset: section;} .sub_support .support_cont .apply_wrap .apply02 ol li {text-align:left;padding-left:44px;position:relative;} .sub_support .support_cont .apply_wrap .apply02 ol li + li {margin-top:27px;} .sub_support .support_cont .apply_wrap .apply02 ol li:before {content: "0" counter(section);counter-increment: section;display:block;position:absolute;width:34px;height:34px;background:#0070c0;border-radius:100%;font-size:16px;line-height:34px;font-weight:500;color:#fff;letter-spacing:-0.03em;text-align:center;left:0;} .sub_support .support_cont .apply_wrap .apply03 h5 {background:url('/theme/dmz/img/sub_image/support-icon-3.png') no-repeat center top;} .sub_support .support_cont .apply_wrap .apply03 .bank {} .sub_support .support_cont .apply_wrap .apply03 .bank dt {font-size:18px;line-height:50px;font-weight:600;color:#fff;letter-spacing:-0.03em;background:#0070c0;} .sub_support .support_cont .apply_wrap .apply03 .bank dd {border:1px solid #0070c0;border-top:0;padding:21px 40px;text-align:left;} .sub_support .support_cont .apply_wrap .apply03 .bank dd p {padding-left:69px;background:url('/theme/dmz/img/sub_image/support-bank-img.png') no-repeat center left;line-height:28px;} .sub_support .support_cont .apply_wrap .apply03 .bank dd p strong {} /*─────────────────────────────────────────────────────────── 게시판, 회원 공통 요소 ───────────────────────────────────────────────────────────*/ /*** 페이징 ***/ #wrap .paging {text-align:center;} #wrap .paging span {display:inline-block;padding: 0 2px;vertical-align:top;} #wrap .paging a {display: inline-flex;font-size: 15px;color: #aaa;border: 0;box-sizing:border-box;height: 34px;width: 34px;line-height: 1;align-items: center;justify-content: center;border-radius: 100%;font-weight: 600; min-width:auto;} #wrap .paging a img {} #wrap .paging span + span a, #wrap .paging a + a, #wrap .paging a + span a{} #wrap .paging .on a{color: #fff;background: #0070c0;} #wrap .paging .arrow {padding: 0 3px;} #wrap .paging .arrow a {display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; box-sizing: border-box; border: 1px solid #ddd; border-radius:100%; font-size:0;} #wrap .paging .arrow a img {display:none;} #wrap .paging .arrow.first a {background:#fff url("/theme/dmz/img/sub_image/paging_first.png") no-repeat center; margin-right:10px;} #wrap .paging .arrow.prev {margin-right: 15px;} #wrap .paging .arrow.prev a {background:#fff url("/theme/dmz/img/sub_image/paging_prev.png") no-repeat center; margin-right:0;} #wrap .paging .arrow.next {margin-left: 15px;} #wrap .paging .arrow.next a {background:#fff url("/theme/dmz/img/sub_image/paging_next.png") no-repeat center; margin-left:0;} #wrap .paging .arrow.last a {background:#fff url("/theme/dmz/img/sub_image/paging_last.png") no-repeat center; margin-left:10px;} /*─────────────────────────────────────────────────────────── BOARD | 게시판서브타입 type ───────────────────────────────────────────────────────────*/ /*** 게시판 리스트 공통 | board/board_list.html ***/ .sub_board {position:relative;} /* 검색 */ .sub_board .board_num {padding:4px 0 0 0;display:inline-block;line-height:19px;text-align:left;font-size:13px;color:#666;display:none;} .sub_board .board_num strong {color:#eb3b4b;font-family:'Lato','Nanum Gothic', sans-serif;font-weight:700;} .sub_board .board_search {text-align:right;padding: 20px;margin-bottom:30px;width:100%;box-sizing:border-box;background: #f5f5f5;} .sub_board .board_search:after {clear:both;content:"";display:block;} .sub_board .board_search span {display:inline-block;color:#888;font-size:12px;font-family:'Lato','Nanum Gothic', sans-serif;font-weight:700;line-height:18px;padding:6px 0 6px 0;text-align:left;} .sub_board .board_search span strong {color:#eb3b4b;} .sub_board .board_search fieldset {font-size: 0;} .sub_board .board_search select {border: 0;} .sub_board .board_search input[type="text"] {width: 300px; margin: 0 10px; border: 0;} .sub_board .board_search .btn {font-size: 0; width: 45px; height: 45px; background: #0070c0 url("/theme/dmz/img/sub_image/con_search.png") no-repeat center;} /* 하단 버튼 */ .sub_board .paging_wrap {height:30px;position:relative;} .sub_board .paging_wrap2 {margin-top:35px;margin-bottom:39px;height:40px;position:relative;} .sub_board h2.btn_writing {position:absolute;right:0;top:-5px;} .sub_board .view_btn {padding-top:60px;margin-top:0px;} .sub_board .view_btn h2 {float:right;} .sub_board .view_btn p {text-align:center;} .sub_board .view_btn p a {} .board_btm{min-height: 60px;margin:60px 0 0 0;position:relative;} .board_btm:after {content: ""; display: block; clear: both;} .board_btm .paging{} .board_btm .btn_right{position:absolute;right:0px;top:50%; transform: translateY(-50%);} /*** 게시판 리스트 (리스트형) | layout/board/kist_default.html ***/ /* 리스트 고정글 */ .sub_board table.board_list tr.board_notice td {background:#f4f4f4;} .sub_board table.board_list tr.board_notice td:nth-of-type(1) {font-size:17px;color:#00b050;font-weight:600;} /* 리스트 */ .sub_board table.board_list {text-align:center;background:#fff;border-top: 2px solid #333;table-layout:fixed;} .sub_board table.board_list tr {border-top:1px solid #ddd;border-bottom:1px solid #ddd;} .sub_board table.board_list th {padding: 22px 0; font-size: 18px; font-weight: 600; color: #333; letter-spacing: -0.03em; vertical-align: middle;} .sub_board table.board_list td {padding: 20px 0; font-size: 16px; font-weight: 400; color: #888; letter-spacing: -0.03em; vertical-align: middle;} .sub_board table.board_list td:first-child {font-size: 17px;} .sub_board table.board_list td.left {text-align:left;padding-left: 24px;} .sub_board table.board_list td .board_tit .board_ico, .sub_board table.board_list td .board_tit img, .sub_board table.board_list td .board_tit h3, .sub_board table.board_list td .board_tit span {display:inline-block;vertical-align:middle;} .sub_board table.board_list td .board_tit h3 .board_ico {} .sub_board table.board_list td .board_tit img {vertical-align: middle;margin-right: 5px;} .sub_board table.board_list td .board_tit h3 {font-weight: 400;font-size: 18px;color: #333;display: inline-block;vertical-align: middle;width: calc(100% - 10px);max-width: 900px;letter-spacing: -0.03em;} .sub_board table.board_list td .board_tit h3:hover {font-weight: 600;} .sub_board table.board_list td .board_tit h3 strong {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: inline-block;vertical-align: top;max-width:97%;font-size: inherit;color: inherit;font-weight: inherit;position:relative;line-height: 1.5;} .sub_board table.board_list td .board_tit h3:hover strong:before {content:'';display:block;position:absolute;width:100%;height:1px;background:#000;bottom:0;left:0;} /*** 게시판 리스트 (갤러리형) | layout/board/list_gallery01.html ***/ /* 갤러리 고정글 */ .sub_board table.board_list.board_notice {margin-bottom:30px;} /* 갤러리 고정글 */ .sub_board .gallery_notice {border-top:1px solid #333;margin:0 0 30px;} .sub_board .gallery_notice li {padding:15px 30px;box-sizing:border-box;background:#f5f5f5;border-bottom:1px solid #d3d3d3;font-size:0;position:relative;} .sub_board .gallery_notice li + li {} .sub_board .gallery_notice li a {position:absolute;left:0;top:0;right:0;bottom:0;z-index:5;} .sub_board .gallery_notice li .thumb, .sub_board .gallery_notice li .txt_info {display:inline-block;vertical-align:middle;} .sub_board .gallery_notice li .thumb {width:145px;height: 100px;overflow: hidden;position: relative;} .sub_board .gallery_notice li .thumb img {width:100%;height: auto;position: absolute;left:50%;top:50%;transform:translate(-50%, -50%);} .sub_board .gallery_notice li .txt_info {width:calc(100% - 145px);padding-left:25px;box-sizing:border-box;} .sub_board .gallery_notice li .txt_info b {font-size:15px;color:#eb3949;line-height:1;margin-bottom:5px;display:block;} .sub_board .gallery_notice li .txt_info .board_tit {padding: 5px 0 3px;line-height: 20px;font-size: 0;} .sub_board .gallery_notice li .txt_info .board_tit h3 {font-size: 13px;color: #333333;font-weight: 600;} .sub_board .gallery_notice li .txt_info .board_tit .board_ico, .sub_board .gallery_notice li .txt_info .board_tit img, .sub_board .gallery_notice li .txt_info .board_tit h3 {display: inline;vertical-align: top;} .sub_board .gallery_notice li .txt_info .board_tit h3 .board_ico {} .sub_board .gallery_notice li .txt_info .board_tit img {vertical-align: middle;margin-right: 5px;} .sub_board .gallery_notice li .txt_info .board_tit h3 {max-width: calc(100% - 80px);width: auto;} .sub_board .gallery_notice li .txt_info .board_tit h3 strong {display: inline;vertical-align: top;max-width: 100%;font-size: inherit;color: inherit;font-weight: inherit;line-height: inherit;} .sub_board .gallery_notice li p {display:block;font-size:12px;color:#888;font-weight:100;line-height:19px;text-align:left;margin:10px 0 0;} .sub_board .gallery_notice li p span {display:inline-block;width:1px;height:9px;background:#d3d3d3;margin:6px 8px 0 8px;vertical-align:top;} /* 리스트 */ .sub_board ul.gallery_list_top.no_data {justify-content: center; border-top: 2px solid #333; border-bottom: 1px solid #ddd; font-size: 17px; color: #888; letter-spacing: -0.03em; padding:55px 0;} .sub_board ul.gallery_list {display: flex; flex-wrap: wrap;} .sub_board ul.gallery_list li {position:relative; width: calc(33.33% - 20px); margin-right: 30px; margin-bottom: 46px;} .sub_board ul.gallery_list li:nth-child(3n) {margin-right: 0;} .sub_board ul.gallery_list li:nth-last-child(-n+3) {margin-bottom: 0;} .sub_board ul.gallery_list li a {position:absolute;left:0;top:0;right:0;bottom:0;z-index:5;} .sub_board ul.gallery_list li .thumb {height: 0; position: relative; padding-bottom: 220px; overflow: hidden;margin-bottom: 26px;} .sub_board ul.gallery_list li .thumb img {position: absolute;min-width:100%; min-height: 100%;max-width: 135%;max-height: 135%;object-fit: cover;top: 50%;left: 50%;transform: translate(-50%,-50%);} .sub_board ul.gallery_list li:hover .thumb:after {content: '';display: block;position: absolute;width: 100%;height: 100%;background: rgba(0,0,0,0.55);border: 5px solid #ffc000;box-sizing: border-box;top: 0;left: 0;z-index: 1;transition: all 0.5s;} .sub_board ul.gallery_list li .thumb .btn_plus {opacity: 0;transition: all 0.5s;position: absolute;width: 50px;height: 50px;background: #ffc000;border-radius: 100%;top: 50%;left: 50%;transform: translate(-50%,-50%);z-index: 2;} .sub_board ul.gallery_list li:hover .thumb .btn_plus {opacity: 1;} .sub_board ul.gallery_list li .thumb .btn_plus:before, .sub_board ul.gallery_list li .thumb .btn_plus:after {content: '';display: block;position: absolute;width: 18px;height: 2px;background: #fff;top: 50%;left: 50%;transform: translate(-50%,-50%);} .sub_board ul.gallery_list li .thumb .btn_plus:after {width: 2px;height: 18px;} .sub_board ul.gallery_list li .txt_info {} .sub_board ul.gallery_list li .txt_info h3 {display:block;font-size: 24px;color: #333;font-weight:600;letter-spacing:-0.03em;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .sub_board ul.gallery_list li .txt_info p {display:block; margin: 14px 0 22px; border-bottom: 1px solid #ddd; padding-bottom: 24px; font-size:16px;color:#666;font-weight:400;letter-spacing:-0.03em;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .sub_board ul.gallery_list li .txt_info .date{position: relative; display: block; font-size: 15px; color: #999; letter-spacing: -0.03em; padding-left: 24px;} .sub_board ul.gallery_list li .txt_info .date:before {content: '';display: block;position: absolute;width: 15px;height: 15px;background: url(../images/da_image/icon-date.png) no-repeat center;top: 2px;left: 0;} /*** 게시판 쓰기 | board/_form_board_write.html ***/ table.board_write {border-top:1px solid #333;border-bottom:1px solid #bbbbbb;font-size:13px;text-align:left;margin-bottom:60px;} table.board_write tr + tr th, table.board_write tr + tr td {border-top:1px solid #ddd;} table.board_write th, table.board_write td {font-size:12px;font-weight:300;color:#888;text-align:left;vertical-align:middle;box-sizing:border-box;padding-top:10px;padding-bottom:10px;padding-left:20px;padding-right:20px;line-height:30px;} table.board_write th {color:#444;font-weight:600;font-size:14px;padding-left:25px;padding-right:25px;background-color:#fafafa;} table.board_write td {} table.board_write td p {padding:5px 0 0;} table.board_write td div.view_cont {padding:8px 10px 50px 10px;line-height:26px;min-height:150px;} table.board_write td label {color:#666;font-size:12px;font-weight:600;} table.board_write td select, table.board_write td input[type="text"], table.board_write td input[type="password"], table.board_write td input[type="number"], table.board_write td input[type="date"] {min-width:25%;margin-right:10px;} table.board_write td input[name="title"] {width:100%;} table.board_write td input[name="video_url"] {width:100%;} table.board_write td input.tel {min-width:50px;} table.board_write td textarea {min-width:100%;height:200px;} /*** 게시판 상세 | board/board_view.html ***/ .sub_board .board_view {margin-bottom:0px;text-align:left;} .sub_board .board_view div.view_tit {display: flex; justify-content: space-between; box-sizing: border-box; padding: 26px 50px; border-top: 2px solid #333; border-bottom: 1px solid #ddd; line-height: 1.45;} .sub_board .board_view div.view_tit h3 {font-size: 30px; font-weight: 600; color: #333; letter-spacing: -0.03em;} .sub_board .board_view div.view_tit .write_info {min-width: max-content; padding-left: 60px; padding-top: 12px; font-size: 15px; color: #999; letter-spacing: -0.02em; text-align: right;} .sub_board .board_view div.view_tit .write_info span {position: relative; font-size: inherit; color: inherit;} .sub_board .board_view div.view_tit .write_info span.date{padding-left: 24px;} .sub_board .board_view div.view_tit .write_info span.date:before {content: '';display: block;position: absolute;width: 15px;height: 15px;background: url(../images/da_image/icon-date.png) no-repeat center;top: 2px;left: 0;} .sub_board .board_view div.view_cont {color:#555;width:100%;box-sizing:border-box;font-size:18px;padding:50px 50px 70px;line-height:1.77;min-height:320px;border-bottom: 1px solid #000;} .sub_board .board_view div.view_cont .thumb_img_wrap {width:100%;margin:0;text-align:center;font-size:0;vertical-align:top;} .sub_board .board_view div.view_cont .thumb_img_wrap img {width:auto;max-width:100%;height:auto;margin:0 0 10px 0;padding:0;vertical-align:top;} .sub_board .board_view div.view_cont .thumb_img_wrap img + img {} .sub_board .board_view h4 {border-bottom:1px solid #d3d3d3;border-top:none;padding:17px 30px;font-size:13px;color:#444;font-weight:600;} .sub_board .board_view h4.thumb_wrap {padding-bottom:7px;} .sub_board .board_view h4 span {display:inline-block;color:inherit;font-weight:inherit;padding-right:0;margin-right:0;} .sub_board .board_view h4 span:after {display:inline-block;width:1px;height:10px;background:#d3d3d3;vertical-align:middle;margin:0 15px;padding:0;content:"";} .sub_board .board_view h4 a {display:inline-block;} .sub_board .board_view h4 a + a {margin-left:20px;} .sub_board .board_view .thumb_img_wrap {padding-top:10px;font-size:0;vertical-align:top;} .sub_board .board_view .thumb_img_wrap img {vertical-align:top;display:inline-block;margin-bottom:10px;} .sub_board .board_view .thumb_img_wrap img + img {margin-left:20px;} .sub_board .board_view .extra_editor_wrap {display:table;width:100%;margin:0;table-layout:fixed;border-collapse:collapse;margin-top:-1px;} .sub_board .board_view .extra_editor_wrap > h4, .sub_board .board_view .extra_editor_wrap > div.extra_cont {padding:23px 16px;display:table-cell;box-sizing:border-box;border-collapse:collapse;vertical-align:middle;border: 1px solid #ddd;text-align:left;border-bottom-color:#000;} .sub_board .board_view .extra_editor_wrap > h4 {border-left: 0; border-right: 0; padding: 23px 0; width:154px; font-size: 17px; font-weight: 600; letter-spacing: -0.03em; text-align: center;} .sub_board .board_view .extra_editor_wrap > div.extra_cont {width: calc(100% - 154px); border-left:0; border-right: 0;} .sub_board .board_view .extra_editor_wrap > div.extra_cont a {font-size: 17px; color: #999 !important; letter-spacing: -0.03em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .sub_board .board_view .extra_editor_wrap div.img_cont {} .sub_board .board_view .extra_editor_wrap div.extra_cont > span {font-size:12px;color:#888;vertical-align:middle;display:block;} .sub_board .board_view .extra_editor_wrap div.extra_cont > span + span {margin-top:10px;} .sub_board .board_view .extra_editor_wrap div.extra_cont a.icon_down {font-size:0;background:url('../images/board/icon_download.png') no-repeat 0 0;display:inline-block;width:15px;height:15px;background-size:100% auto;margin:0 0 0 5px;padding:0;vertical-align:middle;} .sub_board .board_view .extra_editor_wrap div.extra_cont img {width:auto;height:auto;vertical-align:middle;max-width:100%;} .view_video_wrap {position:relative !important; height:0 !important; padding-bottom:56.28% !important;margin:0 auto !important;text-align:center !important;max-width:100% !important;} .view_video_wrap > iframe {position:absolute;width:100%;height:100%;left:0;top:0;} .sub_board .view_btn {position:relative;} .sub_board .view_btn h2 {float:right;} .sub_board .view_btn p {position:absolute;right:0px;top:30px;font-size:14px;font-weight:bold;text-align:center;} .sub_board .view_btn p a {} .sub_board .btn_point {text-align:left;position:relative;display:inline-block;width:180px;height:60px;border-radius:30px;border:1px solid #0070c0 !important;box-sizing:border-box;font-size:18px;line-height:58px;font-weight:600;color:#0070c0;background:#fff !important;letter-spacing:-0.03em;padding:0 30px;overflow:hidden;} .sub_board .btn_point:before {content:'';display:block;position:absolute;width:0;height:calc(100% + 2px);background:#0070c0;transition:all 0.3s;top:-1px;left:-1px;} .sub_board .btn_point:hover:before {width:calc(100% + 2px);} .sub_board .btn_point span {display:block;font-size:inherit;font-weight:inherit;color:inherit;position:relative;} .sub_board .btn_point span:after {content: "";position:absolute;right:-16px;top:50%;width: 6px;height: 6px;margin: 0 19px 0 16px;border-top: 1px solid #0070c0;border-right: 1px solid #0070c0;transform: translateY(-50%) rotate(45deg);} .sub_board .btn_point:hover span {color:#fff !important;} .sub_board .btn_point:hover span:after {border-color: #fff;} .sub_board .board_write + .btn_center .btn_basic {} .sub_board .board_write + .btn_center .btn_basic {text-align:left;position:relative;display:inline-block;width:180px;height:60px;border-radius:30px;border:1px solid #888 !important;box-sizing:border-box;font-size:18px;line-height:58px;font-weight:600;color:#888;background:#fff !important;letter-spacing:-0.03em;padding:0 30px;overflow:hidden;} .sub_board .board_write + .btn_center .btn_basic:before {content:'';display:block;position:absolute;width:0;height:calc(100% + 2px);background:#888;transition:all 0.3s;top:-1px;left:-1px;} .sub_board .board_write + .btn_center .btn_basic:hover:before {width:calc(100% + 2px);} .sub_board .board_write + .btn_center .btn_basic span {display:block;font-size:inherit;font-weight:inherit;color:inherit;position:relative;} .sub_board .board_write + .btn_center .btn_basic span:after {content: "";position:absolute;right:-16px;top:50%;width: 6px;height: 6px;margin: 0 19px 0 16px;border-top: 1px solid #888;border-right: 1px solid #888;transform: translateY(-50%) rotate(45deg);} .sub_board .board_write + .btn_center .btn_basic:hover span {color:#fff !important;} .sub_board .board_write + .btn_center .btn_basic:hover span:after {border-color: #fff;} /* 댓글 */ .sub_board .comment {margin:0 0 0px 0;padding:0;} .sub_board .comment .comment_box {position:relative;padding:30px 20px 30px 20px;border-top:1px #d3d3d3 solid;background:#fdfdfd;} .sub_board .comment .comment_box .comment_name {width:650px;margin-bottom:10px;} .sub_board .comment .comment_box .comment_name span {width:233px;line-height:25px;display:inline-block;} .sub_board .comment .comment_box .comment_name span.no_line {background:none;} .sub_board .comment .comment_box .comment_name span label {font-size:13px;color:#333;font-family:'Lato','Nanum Gothic', sans-serif;font-weight:700;line-height:25px;padding:0;width:auto;margin-right:20px;display:inline-block;} .sub_board .comment .comment_box .comment_name span input {border:1px solid #d3d3d3;line-height:23px;height:23px;padding:0;text-indent:5px;width:158px;min-width:158px;margin:0;} .sub_board .comment .comment_box .comment_memo {width:680px;} .sub_board .comment .comment_box .comment_memo label {font-size:13px;color:#333;font-family:'Lato','Nanum Gothic', sans-serif;font-weight:700;line-height:80px;padding:0;width:43px;display:block;min-height:80px;} .sub_board .comment .comment_box textarea {border:1px solid #d3d3d3;width:620px;min-width:610px;padding:5px 0 5px 5px;min-height:68px;height:68px;float:left;} .sub_board .comment .comment_box h3 {position:absolute;right:20px;top:30px;height:78px;text-align:center;width:108px;background-color:#333;border:1px #333 solid;line-height:78px;padding:0;} .sub_board .comment .comment_box h3 a {font-size:14px;color:#fff;font-family:'Lato','Nanum Gothic', sans-serif;font-weight:700;display:block;line-height:78px;} .sub_board .comment .comment_cont {position:relative;border-top:1px #d3d3d3 solid;} .sub_board .comment .comment_cont h2 {color:#888;padding:12px 0 12px 20px;line-height:25px;font-size:12px;} .sub_board .comment .comment_cont div {position:relative;border-top:1px #d3d3d3 solid;padding:12px 20px 14px 20px;z-index:1;} .sub_board .comment .comment_cont div h3 {color:#888;padding-bottom:2px;} .sub_board .comment .comment_cont div h3 strong {color:#333;font-family:'Lato','Nanum Gothic', sans-serif;font-weight:700;display:inline-block;margin-right:10px;} .sub_board .comment .comment_cont div h4 {color:#888;font-size:12px;line-height:19px;} .sub_board .comment .comment_cont div .comment_btn {position:absolute;right:20px;top:12px;color:#888;font-size:12px;border:0;margin:0;padding:0;} .sub_board .comment .comment_cont div .comment_btn a { color:#888;font-size:12px;display:inline-block;} .sub_board .comment .comment_cont div .comment_btn span.bar {color:#9b9b9b;display:inline-block;width:6px;text-align:center;margin:0;background:none;} .sub_board .comment .comment_cont div.com_reple {border-bottom:1px solid #d3d3d3;background:#fff url("../images/da_image/bg_dot_line.png") repeat-x left top;position:relative;z-index:3;margin-top:-1px;padding:12px 20px 14px 20px;} .sub_board .comment .comment_cont div.comment_reply {position:relative;z-index:3;margin-top:-1px;padding:12px 20px 14px 20px;} .sub_board .comment .comment_cont div.comment_box2 {position:relative;padding:10px 0;border:0;} .sub_board .comment .comment_cont div.comment_box2 .comment_name {width:650px;margin-bottom:10px;padding:0px;border:0;} .sub_board .comment .comment_cont div.comment_box2 .comment_name span {width:233px;line-height:25px;display:inline-block;} .sub_board .comment .comment_cont div.comment_box2 .comment_name span.no_line {background:none;} .sub_board .comment .comment_cont div.comment_box2 .comment_name span label {font-size:13px;color:#333;font-family:'Lato','Nanum Gothic', sans-serif;font-weight:700;line-height:25px;padding:0;width:auto;margin-right:20px;display:inline-block;} .sub_board .comment .comment_cont div.comment_box2 .comment_name span input {border:1px solid #d3d3d3;line-height:23px;height:23px;padding:0;text-indent:5px;width:158px;min-width:158px;margin:0;} .sub_board .comment .comment_cont div.comment_box2 .comment_memo {width:680px;padding:0px;border:0;} .sub_board .comment .comment_cont div.comment_box2 .comment_memo label {font-size:13px;color:#333;font-family:'Lato','Nanum Gothic', sans-serif;font-weight:700;line-height:80px;padding:0;width:43px;display:block;min-height:80px;} .sub_board .comment .comment_cont div.comment_box2 textarea {border:1px solid #d3d3d3;width:620px;min-width:618px;padding:5px 0 5px 5px;min-height:68px;height:68px;} .sub_board .comment .comment_cont div.comment_box2 h3 {position:absolute;right:0px;top:47px;height:78px;text-align:center;width:108px;background-color:#333;border:1px #333 solid;line-height:78px;padding:0;} .sub_board .comment .comment_cont div.comment_box2 h3 a {font-size:14px;color:#fff;font-family:'Lato','Nanum Gothic', sans-serif;font-weight:700;display:block;line-height:78px;} .sub_board .comment .comment_cont div.com_reserve {border:0;background:#fff url("../images/da_image/bg_dot_line.png") repeat-x left 10px;position:relative;z-index:3;margin-top:-1px;padding:30px 0px 0px 20px;margin:0;margin-left:-20px;margin-right:-20px;width:790px;} .sub_board .comment .comment_cont div.com_reserve textarea.com_reserve {border:1px solid #d3d3d3;width:653px;min-width:653px;padding:5px 0 5px 5px;min-height:68px;height:68px;margin-right:20px;} .sub_board .comment .comment_cont div.com_reserve a {position:absolute;right:0px;top:30px;height:78px;text-align:center;width:108px;background-color:#333;border:1px #333 solid;font-size:14px;color:#fff;font-family:'Lato','Nanum Gothic', sans-serif;font-weight:700;display:block;line-height:78px;padding:0;} .sub_board .board_comment {position:relative;box-sizing:border-box;border:1px solid #d3d3d3;padding:20px;margin-top:20px;} .sub_board .board_comment .comment_name {color:#555;padding:0 0 10px 0;text-align:left;} .sub_board .board_comment .comment_name span, .sub_board .board_comment .comment_memo span {display:inline-block;font-size:12px;color:#555;font-family:'Lato','Nanum Gothic', sans-serif;line-height:25px;padding:0;} .sub_board .board_comment .comment_name span input {vertical-align:top;border:1px solid #d3d3d3;padding:5px;} .sub_board .board_comment .comment_name span + span {margin-left:20px;} .sub_board .board_comment .comment_memo {} .sub_board .board_comment .comment_memo span {margin-right:20px;} .sub_board .board_comment, .sub_board .board_comment textarea, .sub_board .board_comment .comment_btn {vertical-align:top;} .sub_board .board_comment textarea {border:1px solid #d3d3d3;width:698px;min-width:610px;padding:5px 0 5px 5px;min-height:72px;height:72px;box-sizing:border-box;} .sub_board .board_comment .comment_btn {width:80px;height:72px;background:#eb3b4b;text-align:center;color:#fff;line-height:72px;font-size:14px;font-weight:bold;display:block;} .sub_board .board_comment_list {position:relative;margin:0 0 20px;} .sub_board .board_comment_list .comment_title {border-bottom:1px solid #d3d3d3;color:#888;padding:15px 0 7px 0;text-align:left;} .sub_board .board_comment_list .comment_title span {color:#eb3b4b;} .sub_board .board_comment_list .comment {position:relative;border-bottom:1px solid #d3d3d3;padding:8px 0;} .sub_board .board_comment_list .comment .comment_writer {color:#333;padding-bottom:3px;text-align:left;} .sub_board .board_comment_list .comment span.board_line {display:inline-block;width:1px;height:9px;background:#999;margin:0 8px;} .sub_board .board_comment_list .comment .com_btn {position:absolute;right:0;top:9px;} .sub_board .board_comment_list .comment .com_btn a {color:#999;} .sub_board .board_comment_list .comment .com_txt {color:#888;text-align:left;word-break:break-all;} .sub_board .board_comment_list .comment .com_txt_reply {color:#888;text-align:left;border-top:1px solid #d3d3d3;padding:16px 0 10px 40px;margin:10px 0 0;background:url("../images/sub/comment_reply.png") no-repeat 20px 18px;} .sub_board .board_comment_list .comment .com_modify {position:relative;margin:5px 0 0;} .sub_board .board_comment_list .comment .com_modify:after {clear:both;content:"";display:block;} .sub_board .board_comment_list .comment .com_modify textarea {float:left;width:90%;height:50px;border:1px solid #d3d3d3;} .sub_board .board_comment_list .comment .com_modify .btn_modify {float:right;width:9.2%;height:52px;display:inline-block;line-height:52px;background:#aaa;color:#fff;font-size:15px;font-weight:600;text-align:center;} .sub_board .board_comment_list .comment .comment_password {position:absolute;right:25px;top:0;width:300px;border:2px solid #757575;padding:7px;background:#fff;z-index:100;text-align:left;} .sub_board .board_comment_list .comment .comment_password.modify {right:72px;} .sub_board .board_comment_list .comment .comment_password span {display:inline-block;height:20px;line-height:20px;font-weight:600;vertical-align:middle;} .sub_board .board_comment_list .comment .comment_password input {width:195px;height:19px;} .sub_board .board_comment_list .comment .comment_password h5 {display:inline-block;width:39px;height:20px;line-height:20px;border:1px solid #ccc;background:#fff;text-align:center;border-radius:5px;vertical-align:middle;} .sub_board .board_comment_list .comment .comment_password a.close {position:absolute;right: 6px;top: 50%;margin-top: -4px;} .sub_board .board_comment_list .comment .com_btn a.on + .comment_password {display:block !important;} /* 게시판 개인정보취급 */ .sub_board .policy_cont {} .sub_board .policy_cont > div {text-align:left;margin:15px 0;} .sub_board .policy_cont > div input[type=checkbox] {} .sub_board .policy_cont > div label {color:#333;font-size:12px;font-weight:500;cursor:pointer;} .sub_board .policy_cont > div a {display:inline-block;line-height:20px;border:1px #ccc solid;padding:0 8px;height:22px;box-sizing:border-box;color:#666;font-size:12px;text-decoration:none;background:#fff;margin:0 0 0 10px;} .sub_board .policy_cont > div textarea {display:block !important;width:100% !important;margin:10px 0 0 !important;text-align:left !important;color:#666 !important;font-size:12px !important;line-height:18px !important;box-sizing:border-box;} .sub_board .policy_cont > div textarea.write {min-width:80% !important;width:100% !important;padding:10px !important;height:100px !important;} /*** 게시판(비밀번호) | layout/board/board_secret.html ***/ .sub_pw_input {max-width:1058px;margin:0 auto;border:20px solid #eee;outline:1px solid #ddd;} .sub_pw_input .ok_box {width:100%;margin:0 auto;padding:70px 0;font-family:'Nanum Gothic', sans-serif;text-align:center;} .sub_pw_input .ok_box h2 {padding-bottom:20px;font-size:16px;font-weight:600;color:#333;} .sub_pw_input .ok_box div.input_box {padding-bottom:40px;} .sub_pw_input .ok_box div.input_box input {width:200px;height:30px;padding:5px 10px;border:1px solid #aaa;} .sub_pw_input .ok_box a.ok_bt {display:inline-block;font-size:15px;font-weight:700;width:120px;height:40px;background:#eb3b4b;border:1px solid #eb3b4b;text-align:center;line-height:40px;color:#fff;font-weight:600;} .sub_board .board_css tr{border-left:1px solid #d3d3d3;border-right:1px solid #d3d3d3;} .sub_board .board_css tr th{line-height:30px;padding:11px 0;padding-left:35px;vertical-align:middle;width:176px;} .sub_board .board_css tr td{line-height:30px;padding:11px 30px;} .sub_board .board_css tr td.td_textarea {padding-right:16px;} .sub_board table.board_css td input[type=text], table.board_css td input[type=password]{border:1px solid #d9d9d9;} .sub_board table.board_css td input[name=title] {width:80%;} /*─────────────────────────────────────────────────────────── GOODS(상품) ───────────────────────────────────────────────────────────*/ /*** 상품리스트, 상품검색 | goods/goods_list.html, goods/goods_search.html ***/ .sub_list {} /* 서브 카테고리 */ .sub_cate_wrap {margin-bottom:2.4%;border-top:1px solid #333;border-bottom:1px solid #d3d3d3;} .sub_cate_wrap ul.sub_cate {margin:1.2% 17px;line-height:26px;vertical-align:top;} .sub_cate_wrap ul.sub_cate:after {clear:both; content:""; display:block;} .sub_cate_wrap ul.sub_cate li {padding:0 12px 0 0;line-height:26px;font-size:0;float:left;text-align:left;box-sizing:border-box;vertical-align:top;} .sub_cate_wrap ul.sub_cate li a {font-size:13px;color:#666;font-weight:400;display:inline-block;line-height:inherit;vertical-align:top;} .sub_cate_wrap ul.sub_cate li:hover a {color:#333;} .sub_cate_wrap ul.sub_cate li + li {padding-left:0;} .sub_cate_wrap ul.sub_cate li + li:before {margin:0;margin-right:10px;width:1px;height:10px;background:#d3d3d3;display:inline-block;content:"";vertical-align:middle;} /* 디스플레이 유형 */ .sub_list .list_array {margin:0;margin-bottom:2.4%;} .sub_list .list_array:after {clear:both; content:""; display:block;} .sub_list .list_array .list_count, .sub_list .list_array .list_count span {font-size:15px;line-height:30px;height:30px;font-weight:400;vertical-align:top;display:inline-block;text-align:left;} .sub_list .list_array .list_count {color:#555;float:left;} .sub_list .list_array .list_count span {color:#eb3b4b;font-weight:700;} .sub_list .list_array ul {float:right;} .sub_list .list_array ul:after {clear:both; content:""; display:block;} .sub_list .list_array ul li {width:30px;height:30px;border:1px solid #ccc;float:left;box-sizing:border-box;background:#fff;text-indent:-9999px;cursor:pointer;position:relative;z-index:1;} .sub_list .list_array ul li:before, .sub_list .list_array ul li::before {content:"";display:inline-block;width:28px;height:28px;position:absolute;cursor:pointer;left:0;top:0;bottom:0;right:0;box-sizing:border-box;} .sub_list .list_array ul li.typeA:before {background:url("../images/sub/icon_list_typeA.png") no-repeat left top;} .sub_list .list_array ul li.typeA.on:before {background:#eb3b4b url("../images/sub/icon_list_typeA_on.png") no-repeat left top;} .sub_list .list_array ul li.typeB:before {background:url("../images/sub/icon_list_typeB.png") no-repeat left top;} .sub_list .list_array ul li.typeB.on:before {background:#eb3b4b url("../images/sub/icon_list_typeB_on.png") no-repeat left top;} .sub_list .list_array ul li.on {border:1px solid #eb3b4b; background:#eb3b4b;} /* 상품 진열 */ .sub_list .list {} /* 검색결과없음 */ .sub_list .list .list_no {color:#555;padding:1.2%;font-size:15px;line-height:23px;font-weight:500;width:100%;background:#fafafa;border:1px #ccc solid;text-align:center;vertical-align:top;box-sizing:border-box;} .sub_list .list .list_no .no_data {font-size:inherit;line-height:inherit;font-weight:inherit;} .sub_list .list .list_no .no_data:before {color:#fff;width:21px;height:21px;border-radius:100%;margin:1px 8px 0 0;background:#777;font-size:inherit;line-height:21px;font-weight:700;content:"!";display:inline-block;vertical-align:top;box-sizing:border-box;} /*** 상품 리스트 (갤러리형) | layout/goods/gallery.html ***/ .sub_list .list .list_Galleryform {} .sub_list .list .list_Galleryform > ul {} .sub_list .list .list_Galleryform > ul:after {clear:both;content:"";display:block;} .sub_list .list .list_Galleryform > ul li {float:left;width:23.5%;margin:0 2% 30px 0;} .sub_list .list .list_Galleryform > ul li:nth-child(4n) {margin-right:0;} .sub_list .list .list_Galleryform > ul li:nth-child(4n+1) {clear:both;content:"";float:left;} .sub_list .list .list_Galleryform > ul li dl {} .sub_list .list .list_Galleryform > ul li dl dt {border:1px solid #ccc;margin:0 0 18px;height:auto;min-height:179px;position: relative;overflow:hidden;} .sub_list .list .list_Galleryform > ul li dl dt img {width:100%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);} .sub_list .list .list_Galleryform > ul li dl dd {text-align:left;} .sub_list .list .list_Galleryform > ul li dl dd > em {display: block;box-sizing:border-box;color:#333;font-size:16px;font-weight:400;padding:0 0 6px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;} .sub_list .list .list_Galleryform > ul li dl dd p {color:#777;font-size:14px;font-weight:500;line-height:22px;} /*** 상품 리스트 (리스트형) | layout/goods/list.html ***/ .sub_list .list .list_Listform {} .sub_list .list .list_Listform > ul {margin:0;padding:0;} .sub_list .list .list_Listform > ul:after {clear:both; content:""; display:block;} .sub_list .list .list_Listform > ul li {float:left; width: calc(50% - 6px); border:1px solid #ccc; margin:0 12px 12px 0;box-sizing:border-box;} .sub_list .list .list_Listform > ul li:nth-child(2n) {margin-right:0;} .sub_list .list .list_Listform > ul li:nth-child(2n+1) {clear:both; content:""; float:left;} .sub_list .list .list_Listform > ul li dl {display:table;height:100%;} .sub_list .list .list_Listform > ul li dl:after {clear:both;display:block;} .sub_list .list .list_Listform > ul li dl dt, .sub_list .list .list_Listform > ul li dl dd {box-sizing:border-box;display:table-cell;vertical-align:middle;text-align:left;} .sub_list .list .list_Listform > ul li dl dt {width:45%;border-right:1px solid #ccc;} .sub_list .list .list_Listform > ul li dl dt img {width:100%;height:auto;} .sub_list .list .list_Listform > ul li dl dd {width:55%;max-width: 200px;padding:12px;} .sub_list .list .list_Listform > ul li dl dd > em, .sub_list .list .list_Listform > ul li dl dd > .add_info p {width:100%;margin:0;padding:0;text-overflow:ellipsis;overflow:hidden;display:inline-block;box-sizing:border-box;position:relative;z-index:1;} .sub_list .list .list_Listform > ul li dl dd > em {display: block;color:#333;font-size:16px;font-weight:700;line-height:24px;height:24px;white-space:nowrap;box-sizing: border-box;} .sub_list .list .list_Listform > ul li dl dd > .add_info {padding-top:26px;position:relative;z-index:1;display:inline-block;box-sizing:border-box;} .sub_list .list .list_Listform > ul li dl dd > .add_info:before {position:absolute;left:0;top:12px;content:"";display:block;width:30px;height:2px;background:#222222;} .sub_list .list .list_Listform > ul li dl dd > .add_info p {color:#777;font-size:14px;line-height:20px;max-height:40px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;} /* 검색 페이지 - 검색창 */ .sub_list .list_search {width:100%;height:74px;background:#f4f4f2;margin:50px 0 30px;} .sub_list .list_search:after {clear:both;content:"";display:block;} .sub_list .list_search > div {float:right;padding-right:20px;} .sub_list .list_search > div:after {clear:both;content:"";display:block;} .sub_list .list_search > div > span {float:left;display:inline-block;height:74px;line-height:74px;margin-right:15px;} .sub_list .list_search > div > span label {color:#777;font-size:12px;font-weight:500;padding-left:5px;} .sub_list .list_search .search_form {float:left;} .sub_list .list_search .search_form .search {margin:20px 0 0;} .sub_list .list_search .search_form .search select {width:100px;height:32px;line-height:30px;} .sub_list .list_search .search_form .search input {width:218px;height:32px;line-height:32px;border:1px solid #ddd;background:#fff;text-indent:12px;} .sub_list .list_search .search_form .search a {display:inline-block;width:60px;height:32px;line-height:32px;text-align:center;background:#666;color:#fff;font-size:13px;font-weight:600;margin-left:3px;vertical-align:middle;} /*** 상세페이지 | goods/goods_view.html ***/ .sub_view {} .sub_view .info {} .sub_view .info dl {} .sub_view .info dl:after {clear:both; content:""; display:block;} .sub_view .info dl dt, .sub_view .info dl dd {float:left;box-sizing:border-box;margin:0;padding:0;} .sub_view .info dl dt {width:43%;border:1px solid #ccc;padding:18px;margin-right:3%;} .sub_view .info dl dd.goods_tit {width:54%;} .sub_view .info dl dd.goods_tit {padding:2.4% 30px;border-top:2px solid #222;border-bottom:1px solid #ccc;background:#f2f2f2;text-align:left;box-sizing:border-box;} .sub_view .info dl dd.goods_tit, .sub_view .info dl dd.goods_tit p {font-family:'Nanum Gothic', 'Malgun Gothic', '맑은 고딕', dotum, sans-serif;text-overflow:ellipsis;overflow:hidden;} .sub_view .info dl dd.goods_tit {font-size:32px;line-height:40px;font-weight:500;color:#222;white-space:nowrap;} .sub_view .info dl dd.goods_tit p {margin-top:8px;font-size:15px;line-height:24px;font-weight:400;color:#777;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;} .sub_view .info_wrap {margin:3.6% 0 0;text-align:left;} .sub_view .info_wrap .info_li {margin:0 0 6.8%;} .sub_view .info_wrap .info_li dt.info_tit {color:#222;font-size:25px;font-weight:700;padding:0 0 1.2%;margin:0 0 3.6%;border-bottom:1px solid #222;text-align:left;} .sub_view .info_wrap .info_li img {max-width:100%;width:auto;height:auto;margin:0 auto;} .sub_view .info_wrap .info_li p {color:#666;font-size:14px;font-weight:400;line-height:22px;letter-spacing:-0.5px;} /*─────────────────────────────────────────────────────────── MEMBER(회원) | 회원서브타입 type ───────────────────────────────────────────────────────────*/ /*** 로그인 | member/login.html ***/ .sub_login {position:relative;z-index:1;} .sub_login .login_box {position:relative;padding:63px 0 71px;border:1px solid #d3d3d3;overflow:hidden;background:url('../images/sub/login_bg_symbol.gif') no-repeat bottom right #eee;vertical-align:top;} .sub_login .login_box h2 {text-align:center;padding-bottom:30px;} .sub_login .login_box > div {min-height:136px;font-size:0;vertical-align:top;position:relative;width:315px;margin-left:50px;padding:0 50px 0px 0;float:left;background:url(../images/sub/login_line.gif) repeat-y right;} .sub_login .login_box div input.login_input {width:315px;height:24px;border:0;border-bottom:1px solid #dddddd;font-size:14px;/*color:#888888;*/font-weight:600;} .sub_login .login_box div input {font-size:15px;color:#222;letter-spacing:-0.015em;background:none;background-repeat:no-repeat;background-position:left center;} .sub_login .login_box div input.mb10 {margin-bottom:19px;} .sub_login .login_box div input.login_id, .sub_login .login_box div input.login_pw, .sub_login .login_box div input.login_name, .sub_login .login_box div input.login_email {width:100%;box-sizing:border-box;padding:0;color:#222;font-size:15px;font-weight:600;} .sub_login .login_box div input:-webkit-autofill { -webkit-box-shadow: 0 0 0 30px #eee inset ; -webkit-text-fill-color: #222; } .sub_login .login_box div input:-webkit-autofill, .sub_login .login_box div input:-webkit-autofill:hover, .sub_login .login_box div input:-webkit-autofill:focus, .sub_login .login_box div input:-webkit-autofill:active { transition: background-color 5000s ease-in-out 0s; } .sub_login .login_box div input[type="text"]::-webkit-input-placeholder {color:#222;font-size:15px;font-weight:600;} .sub_login .login_box div input[type="text"]::-moz-placeholder {color:#222;font-size:15px;font-weight:600;} .sub_login .login_box div input[type="text"]:-ms-input-placeholder {color:#222;font-size:15px;font-weight:600;} .sub_login .login_box div input[type="text"]:-moz-placeholder {color:#222;font-size:15px;font-weight:600;} .sub_login .login_box div input[type="password"]::-webkit-input-placeholder {color:#222;font-size:15px;font-weight:600;} .sub_login .login_box div input[type="password"]::-moz-placeholder {color:#222;font-size:15px;font-weight:600;} .sub_login .login_box div input[type="password"]:-ms-input-placeholder {color:#222;font-size:15px;font-weight:600;} .sub_login .login_box div input[type="password"]:-moz-placeholder {color:#222;font-size:15px;font-weight:600;} .sub_login .login_box div h3 {width:315px;height:35px;line-height:35px;cursor:pointer;font-weight:500;color:#fff;letter-spacing:-0.020em;text-align:center;font-size:13px;margin-top:6px;} .sub_login .login_box div h3.bg_eb3b4b {margin-top:34px;} .sub_login .login_box div h3 input, .sub_login .login_btn div a {vertical-align:top;cursor:pointer;font-weight:500;color:#fff;letter-spacing:-0.020em;text-align:center;font-size:13px;background:none;border:0;height:35px;line-height:35px;width:100%;outline:0;} .sub_login .login_box p {width:350px;margin:0 auto;color:#555;letter-spacing:-0.050em;line-height:19px;padding:0;font-size:13px;} .sub_login .login_box p input {border:1px solid #dddddd;} .sub_login .login_box p.save_btn {height:35px;line-height:35px;} .sub_login .login_box p.save_btn input {vertical-align:middle;margin-bottom:0;} .sub_login .login_btn {position:absolute !important;top:50%;right:0;height:136px;margin-top:-66px;background:none !important;} .sub_login .login_btn div a { background-color:#898989;display:inline-block;} .sub_login.pw_box {} .sub_login.pw_box .login_box > div {min-height:173px;} .sub_login.pw_box .login_box div h3.bg_eb3b4b {margin-top:28px;} .sub_login.pw_box {} .sub_login .login_btn div.btn_idfind {overflow:hidden;} .sub_login .login_btn div.btn_idfind a {width:153px;margin-left:9px;float:left;} .sub_login .login_btn div.btn_idfind a:first-child {margin:0;} .sub_login .login_btn div.btn_join a {margin:18px 0 10px;} .sub_login .login_btn div p {font-size:12px;color:#999999;padding-top:0px;} .sub_login .login_btn div h2 {font-size:14px;color:#555555;font-weight:600;padding-top:5px;} .sub_login .login_box div h3, .sub_login .login_box div h3 input, .sub_login .login_btn div a, .sub_login .login_box p {font-family:'Noto Sans KR', 'Nanum Gothic', dotum, sans-serif;} /*** 회원가입 | member/join.html ***/ h3.join_tit {font-size:18px;color:#222222;font-weight:600;text-align:left;padding-bottom:12px;} h3.join_tit.pt20 {padding-top:20px;} span.join_btn {display:inline-block;margin-left:5px;width:110px;height:28px;text-align:center;line-height:26px;font-size:13px;color:#ffffff;font-weight:600;background-color:#aaaaaa;border:1px solid #999999;} .sub_join table.board_write td input[name="zip"] {width:80px;min-width:70px;} .sub_join table.board_write td input[name="address"], .sub_join table.board_write td input[name="address2"] {width:55%;min-width:450px;} .sub_join table.board_write {border:1px solid #ddd;font-size:12px;text-align:left;margin-bottom:20px;} table.board_write th {background:#fafafa;font-size:18px;color:#333;font-weight:600;width:110px;letter-spacing:-0.03em;} table.board_write th .require_dot {position:absolute;left:14px;top:50%;margin-top:-15px;line-height:30px;height:30px;} table.board_write th .require_dot:before {content:'*';font-size:14px;color:#eb3b4b;line-height:14px;display:inline-block;width:auto;height:14px;} table.board_write td {color:#888;font-weight:100;padding:16px 20px;} table.board_write tr td .btn_reset {background:#fff url('../images/board/icon_btn_reset.gif') no-repeat 18px 50% !important;padding:0 14px 0 40px !important;cursor:pointer;} table.board_write .btn_sm {font-size:14px;color:#000;border-radius:2px;padding:0 9px !important;display:inline-block;background:#f3f3f3 !important;border:1px solid #d3d3d3;text-align:center;font-weight:normal;height:45px;line-height:43px;} table.board_write #captcha_box {display:inline-block;vertical-align:middle;margin-right:10px;} table.board_css {font-size:11px;text-align:left;margin-bottom:30px;} table.board_css tr {border-top:1px solid #d3d3d3;border-bottom:1px solid #d3d3d3;} table.board_css th, table.board_css td {color:#888;font-size:11px;box-sizing:border-box;font-family:'Lato','Nanum Gothic', sans-serif;line-height:28px;padding:13px 0;vertical-align:top;text-align:left;} table.board_css th {color:#333;font-weight:700;font-size:12px;padding-left:30px;background:#fafafa;width:180px;} table.board_css th.view_tit {background:#fbfbfb;} table.board_css th .require_dot {margin-left:5px;line-height:30px;height:30px;} table.board_css th .require_dot:before {content:'*';font-size:14px;color:#eb3b4b;line-height:14px;display:inline-block;width:auto;height:14px;} table.board_css td {padding-left:20px;padding-right:20px;background:#fff ;} table.board_css td .guide {display:inline-block;margin-left:3px;} table.board_css td div.view_cont {padding:9px 2px;line-height:25px;min-height:150px;} table.board_css td input[type=text], table.board_css td input[type=password]{min-width:198px;padding:0 10px;height:30px;border:1px solid #d3d3d3;margin-right:4px;} table.board_css td input.from_phone, table.board_css td input.form_tel {min-width:42px;} table.board_css td.field {padding-right:18px !important;} table.board_css td.field label {display:inline-block;width:62px;} table.board_css td textarea {min-width:98%;padding:8px 0 2% 8px;height:200px;border:1px solid #d3d3d3;} table.board_css td textarea.from_textarea {min-width:98%;padding:8px 0 2% 8px;height:200px;border:1px solid #d3d3d3;} table.board_css tr:last-child th, table.board_css tr:last-child td { background-image:none;border-bottom:1px #d3d3d3 solid;} table.board_css tr:last-child td .btn_reset {background:#fff url('../images/board/icon_btn_reset.gif') no-repeat 9px 50% !important;padding:0 10px 0 30px !important;cursor:pointer;} table.board_css .btn_sm {font-size:11px;color:#000;border-radius:2px;padding:0 9px !important;display:inline-block;background:#f3f3f3 !important;border:1px solid #d3d3d3;text-align:center;font-weight:normal;height:28px;line-height:26px;} .sub_join table.board_css{border-right:1px solid #d3d3d3;border-left:1px solid #d3d3d3;} .sub_join table.board_css th{font-size:12px;} .sub_join table.board_css td{} .sub_join table.board_css td input[type=text], .sub_join table.board_css td input[type=password] {min-width:220px;padding:0px !important;height:28px;border:1px solid #d3d3d3;} .sub_join table.board_css tr.mail input{min-width:120px !important;} .sub_join table.board_css td input[name=email_id], .sub_join table.board_css td input[name=email_domain]{min-width:180px;} .sub_join table.board_css td input[name=email_domain] {margin-left:4px;} .sub_join table.board_css td input[name=address], .sub_join table.board_css td input[name=address2] {width:80%;} .sub_join table.board_css td input, .sub_join table.board_css td a, .sub_join table.board_css td span, .sub_join table.board_css td strong, .sub_join table.board_css td select {vertical-align:top;} .sub_join table.captcha {} .sub_join table.captcha th, .sub_join table.captcha td {vertical-align:middle;} .sub_join table.captcha th {padding:10px 25px;} .sub_join table.captcha .sign{} .sub_join span.join_tit{font-size:16px;color:#333333;display:block;font-weight:600;text-align:left;padding-bottom:10px;} .sub_memberout p {font-size:13px;color:#666;line-height:20px;padding-bottom:20px;} .sub_join table.board_css td select {height:28px;line-height:28px;border:1px solid #d3d3d3;min-width:220px;padding:0 10px;box-sizing:border-box;} .sub_join table.board_css td select.mail_select {min-width:inherit;} .change_pw table.board_css tr{border-left:1px solid #d3d3d3;border-right:1px solid #d3d3d3;} .change_pw table.board_css table.board_css td input[type=text],.change_pw table.board_css td input[type=password]{min-width:272px;padding:0 10px;height:26px;background-color:#F6F6F6;border:1px solid #d3d3d3;} /*** 회원가입 완료 | member/join_ok.html ***/ .sub_ok {max-width:1058px;margin:0 auto;border:20px solid #eee;outline:1px solid #ddd;} .sub_ok .ok_box {width:100%;text-align:center;margin:0 auto;padding:70px 0;font-family:'Nanum Gothic', sans-serif;} .sub_ok .ok_box h3 {padding-bottom:20px;font-size:29px;font-weight:700;color:#333;} .sub_ok .ok_box h4 {font-size:16px;color:#777;line-height:26px;font-weight:500;} .sub_ok .ok_box h4 span {color:#eb3b4b;font-weight:600;} .sub_ok .ok_box .home_bt a {display:inline-block;font-size:15px;font-weight:700;width:120px;height:40px;background:#eb3b4b;border:1px solid #eb3b4b;text-align:center;line-height:40px;color:#fff;font-weight:600;} .sub_ok .ok_box .login_bt a {display:inline-block;font-size:15px;font-weight:700;width:120px;height:40px;background:#eb3b4b;border:1px solid #eb3b4b;text-align:center;line-height:40px;color:#fff;font-weight:600;} /*** 회원탈퇴 | member/withdrawal.html ***/ .memberout {font-size:13px;color:#666;line-height:20px;padding-bottom:20px;} .withdrawal table.board_css{border-left:1px solid #d3d3d3;border-right:1px solid #d3d3d3;} .withdrawal table.board_css tr th{line-height:1;padding:10px 0 10px 30px;vertical-align:middle;width:170px;} .withdrawal table.board_css tr td{line-height:1;padding:10px 0 10px 20px;;} /*** 비밀번호 변경 안내 | member/periodic_change_pw.html ***/ .sub_login.add {max-width:1135px;} .sub_login.add .login_box {width:100%;background: none;border: 0;padding: 0;} .sub_login.add .login_box h2 {color:#282828;font-size:23px;font-weight:600;line-height:32px;} .sub_login.add .login_box h2 span {color:#eb3b4b;font-size:23px;font-weight:600;} .sub_login.add .login_box table.board_write {width:662px;margin:58px auto 40px;} .sub_login.add .login_box table.board_write caption {overflow:auto;text-indent:0;height:20px;line-height:20px;color:#777;font-size:14px;font-weight:500;text-align:left;padding-bottom:14px;} .sub_login.add .login_box table.board_write caption span {color:#444;font-size:14px;font-weight:600;} .sub_login.add .login_box table.board_write input {width:396px;} .sub_login.add .login_box .btn_center {} .sub_login.add .login_box .btn_center button {width:160px;} .sub_login.add .login_box .btn_center button.gray {margin-left:16px;background:#999;border:1px solid #999;} /*─────────────────────────────────────────────────────────── SERVICE ───────────────────────────────────────────────────────────*/ /*** 이용약관 | service/agreement.html ***/ /*** 개인정보취급방침 | service/usepolicy.html ***/ /*** 회원가입동의 | member/join_agreement.html ***/ .member_agree {font-size:13px;line-height:23px;padding:0;text-align:left;} .sub_agree {text-align:center;margin:0;padding:0 0 20px 0;} .sub_agree h2 {font-size:17px;line-height:23px;text-align:left;color:#333;font-family:'Lato','Nanum Gothic', sans-serif;font-weight:700;padding:0 0 16px 0;} .sub_agree .agree_box {box-sizing: border-box; border: 1px solid #ddd; padding: 40px; font-size: 15px; line-height: 1.6; text-align: left;} .sub_agree .agree_box textarea {box-sizing:border-box;line-height:14px;font-size:12px;width:790px;color:#888;height:192px;line-height:20px;font-weight:100;padding:20px;border:1px solid #d3d3d3;background-color:#fff;} .sub_agree .agree_box div {font-size:12px;color:#444;line-height:20px;font-weight:100;padding:20px 0;background-color:#fff;text-align:left;} .sub_agree .agree_box .agree_box_con{font-size:12px;overflow-y:scroll;width:746px;color:#888888;height:500px;font-weight:100;padding:20px;border:1px solid #d3d3d3;background-color:#fff;} .sub_agree .agree_box p.agree_txt {display:block;padding:13px 0 0px 20px;line-height:20px;font-size:12px;color:#333;text-align:left;} .sub_agree .agree_box p.agree_txt label strong {font-family:'Lato','Nanum Gothic', sans-serif;font-weight:700;} .sub_agree .btn_center {padding:22px 0 0 0;} .sub_agree .agree_bg {background:#fff;border:1px #d3d3d3 solid;border-top:2px #373737 solid;padding:20px 0;} .sub_agree .agree_bg p {margin:0 20px;text-align:left;} .sub_agree .privacy_bg {background:#fff;} .sub_agree #module_policy {border:1px #d3d3d3 solid;line-height:18px;font-weight:100;padding:12px 0 12px 12px;border:1px solid #d3d3d3;background-color:#fff;text-align:left;overflow:auto;height:auto;} .join_agree h2{font-size:16px;padding-bottom:16px;} .join_agree .agree_box{background:#fbfafa;padding:19px;border:1px solid #d3d3d3;width:830px;box-sizing:border-box;} .join_agree .agree_box p.agree_txt{padding:13px 0 0 0;} /*─────────────────────────────────────────────────────────── ETC ───────────────────────────────────────────────────────────*/ /*** 에러페이지 | errors/index.html ***/ .error_cont {position:relative;min-height:900px;background:url("../images/sub/error_bg.gif") repeat-x left top;} .error_cont .error_form {position:absolute;left:50%;top:123px;margin-left:-450px;width:910px;height:610px;background:url("../images/sub/error_form_bg.png") no-repeat left top;text-align:center;} .error_cont .error_form h2 {color:#333;font-size:20px;font-weight:500;font-family:"Noto Sans KR", 'Nanum Gothic', sans-serif !important;padding:296px 0 10px;} .error_cont .error_form p {color:#777;font-size:14px;font-weight:400;line-height:22px;font-family:"Noto Sans KR", 'Nanum Gothic', sans-serif !important;} .error_cont .error_form h5 {width:156px;height:44px;border:2px solid #333;background:url("../images/sub/error_icon_arrow.png") no-repeat 118px center;margin:38px auto 0;} .error_cont .error_form h5 a {display:block;width:100%;height:44px;line-height:44px;color:#333;font-size:17px;font-weight:500;font-family:"Noto Sans KR", 'Nanum Gothic', sans-serif !important;text-align:left;text-indent:38px;} /* 정확한 용도파악 불가 */ /**********팝업***********/ .password_popup {text-align:center;} .password_popup p {color:#888;padding:40px 0 10px 0;} .password_popup h2 {} .password_popup h2 input {border:1px solid #d3d3d3;padding:3px 5px;width:150px;} .password_popup h3 {padding-top:15px;} /* layer-popup */ .layer-popup {font-size:12px;background:#fff;border:1px #000 solid;position:absolute;transform:none;} .layer-popup.layer_pc {} .layer-popup.layer_t {} .layer-popup.layer_m {left:50%;min-height:auto;transform:translate(-50%, 0)} .layer-popup h4 {font-size:12px;font-weight:700 !important;line-height:18px;padding:3px 12px;box-sizing:border-box;text-align:left;} .pop_content {margin:0;padding:0;} .pop_content img, .pop_content table, .pop_content div {max-width:100%;max-height:100%;} .layer-popup .pop_closed {text-align:right;padding:4px 12px;box-sizing:border-box;line-height:20px;font-size:12px;vertical-align:middle;} .layer-popup .pop_closed input[type="checkbox"] {} .layer-popup .pop_closed input[type="checkbox"] + label {font-size:12px;} .layer-popup .pop_closed a {vertical-align:top;display:inline-block;line-height:20px;margin-left:12px;position:relative;z-index:1;width:20px;height:20px;font-size:0;} .layer-popup .pop_closed a:before, .layer-popup .pop_closed a:after {display:inline-block;content:"";width:24px;height:1px;background:#000;position:absolute;left:0;top:50%;} .layer-popup .pop_closed a:before {transform:rotate(45deg);} .layer-popup .pop_closed a:after {transform:rotate(-45deg);}