@charset "utf-8"; /* subpage // */ .path-title{ } .path-title{position:relative; margin-bottom:50px; height:300px; box-sizing:border-box; padding:0; z-index:11;} .path-title>.in{ position:relative; margin:0 auto; height:100%; z-index:12;} .path-title .bg{position:absolute; top:0; left:0; width:100%; height:calc(100%); z-index:9; background-position:center; background-size:cover;} .path-title .bg:after{position:absolute; top:0; left:0; width:100%; height:100%; content:""; background:#000; opacity:0.3; z-index:10;} /* .path-title.img-1 .bg:after{opacity:0;} .path-title.img-2 .bg:after{opacity:0.2;} .path-title.img-3 .bg:after{opacity:0.3;} .path-title.img-4 .bg:after{opacity:0.2;} */ .path-title.img-1 .bg{background-image:url('/imgs/sub-top/01-1.jpg');} .path-title.img-2 .bg{background-image:url('/imgs/sub-top/01-2.jpg');} .path-title.img-3 .bg{background-image:url('/imgs/sub-top/01-3.jpg');} .path-title.img-4 .bg{background-image:url('/imgs/sub-top/02-1.jpg');} .path-title.img-5 .bg{background-image:url('/imgs/sub-top/02-2.jpg');} .path-title.img-6 .bg{background-image:url('/imgs/sub-top/04-1.jpg');} .path-title.img-7 .bg{background-image:url('/imgs/sub-top/05-1.jpg');} .path-title .pc{display:none;} .path-title .mo{display:block;} /* .path-title .path{position:relative; z-index:11; margin-bottom:22.9px;} .path-title .path ul{} .path-title .path ul li{position:relative; margin-right:20px;} .path-title .path ul li + li:after{position:absolute; top:50%; left:-10px; margin:-2px 0 0 -2px; width:3px; height:3px; background:#ccc; content:""; border-radius:50%;} .path-title .path ul li a{} .path-title .path ul li:last-child a{color:#323232; font-weight:bold;} */ .path-title .titleArea{position:absolute; bottom:calc(3%); padding:0 10px; box-sizing:border-box; left:0; width:100%; transform:translateY(-50%); color:#fff; z-index:11; } .path-title .titleArea h2{max-width:1500px; margin-left:auto; margin-right:auto; font-size:24.9px; margin-bottom:5px; font-weight:500;} .path-title .titleArea p{max-width:1500px; margin-left:auto; margin-right:auto; font-size:14px; } .path-title .titleArea i{position:absolute; font-size:17px; color:#999; top:6px; right:20px; width:22.9px; height:22.9px; background:#fff; line-height:22.9px; text-align:center; border-radius:50%; cursor:pointer; transition:0.2s; z-index:13;} .path-title .titleArea i:hover{color:#fff; background:#323232;} .path-title .path{ position:absolute; top:45%; left:0; width:100%; box-sizing:border-box; padding-left:10px;} .path-title .path ul{max-width:1500px; margin:0 auto;} .path-title .path ul li{position:relative; height:29.9px; line-height:29.9px; width:auto; font-size:15px; box-sizing:border-box; margin-right:15px;} .path-title .path ul li + li:after{ position:absolute; top:50%; left:-9px; opacity:1; transform:translateY(-50%); width:3px; height:3px; border-radius:50%; background:#fff; content:""; } .path-title .path ul li a{display:block; position:relative; color:#fff; cursor:pointer;} .path-title .path ul li a:after{display:none; position:absolute; top:50%; right:10px; transform:translateY(-50%); font-family:'xeicon'; font-size:10px; content:"\e943"; transition:0.3s;} /* .path-title .path ul li.home{width:39.9px; padding-left:0;} */ .path-title .path ul li.home a:after{display:none;} .path-title .path ul li.on a:after{transform:translateY(-50%) rotate(180deg);} .path-title .path ul li:last-child a{color:var(--c1);} .path-title .tnb{box-sizing:border-box; position:absolute; bottom:0; left:0; width:100%; height:39.9px; overflow-x:auto; overflow-y:hidden;} .path-title .tnb>.in{max-width:1600px; margin:0 auto;} .path-title .tnb{display:none; background:#fff; border-bottom:1px solid #aaa;} .path-title .tnb ul[class*="-all"]{display:none; position:absolute; top:5px; left:0; width:calc(50% - 19.9px); padding:15px 0; box-sizing:border-box; } .path-title .tnb ul[class*="-all"] .d1{} .path-title .tnb ul[class*="-all"] .d1 a{} .path-title .tnb ul[class*="-all"] .d2{position:relative; font-size:15px; line-height:39.9px;} .path-title .tnb ul[class*="-all"] .d2.on:after{position:absolute; bottom:0; left:0; width:100%; height:1px; background:#111; content:"";} .path-title .tnb ul[class*="-all"] .d1 .depthArea{} .path-title .tnb ul[class*="-all"] .d2.on a{color:#111;} .path-title .tnb ul[class*="-all"] .d1 .depthArea ul{display:flex; white-space:nowrap; } .path-title .tnb ul.d1-all{left:39.9px;} .path-title .tnb ul.d1-all .depthArea{display:none; } .path-title .tnb ul.d1-all .d1{} .path-title .tnb ul.d1-all .d1>a{display:block; padding:3px 2px 3px 15px; } .path-title .tnb ul.d2-all{position:static; display:block; width:100%; padding:0; text-align:center;} .path-title .tnb ul.d2-all .d1>a{display:none; color:#111;} .path-title .tnb ul.d2-all .d2>a{display:block; padding:0 5px; color:#777; } .path-title .tnb ul.d2-all .d2>a:hover{color:#999;} [class*="sub"]{} [class*="sub"]>.in{max-width:1600px; margin:0 auto; } .path-title .img-box{display:none;} @media all and (min-width:768px){ .path-title{height:450px; margin-bottom:120px;} .path-title .bg{height:calc(100%);} /* .path-title .titleArea{top:65%;} */ .path-title .titleArea h2{font-size:60px; margin-bottom:10px} .path-title .titleArea p{font-size:20px;} .path-title .path ul li{ font-size:20px;} .path-title .path ul li a:after{right:20px;} .path-title .path ul li + li:after{ left:-10px; width:5px; height:5px;} .path-title .tnb{height:80px;} .path-title .tnb ul[class*="-all"] {} .path-title .tnb ul.d2-all{ } .path-title .tnb ul.d1-all .d1>a{padding:5px 5px 5px 19.9px; } .path-title .tnb ul.d2-all .d2>a{padding:0 29.9px; } .path-title .tnb ul[class*="-all"] .d2{font-size:17.9px; line-height:80px;} .path-title .tnb ul[class*="-all"] .d2.on:after{ } } .tableArea{} .tableArea + .tableArea{margin-top:100px;} .tableArea h2.title{font-size:19.9px; margin-bottom:20px;} .tableArea h2.title i{display:inline-block; font-style:normal; font-size:15px; margin-left:29.9px; font-weight:normal;} .tableArea table{text-align:left; border-top:2px solid #193c86;} .tableArea table.center{text-align:center;} .tableArea table tr{} .tableArea table tr th{padding:10px 5px; border-top:1px solid #eee; border-bottom:1px solid #eee; vertical-align:middle;} .tableArea table tr td{padding:10px 5px; border-top:1px solid #eee; border-bottom:1px solid #eee;} .tableArea table thead{background:#f9f9f9;} .tableArea table thead tr{} .tableArea table thead tr th{} .tableArea table tbody{} .tableArea table tbody tr{} .tableArea table tbody tr th{} .tableArea table tbody tr td{} .tableArea table.bg-fff{background:#fff;} .tableArea table.type1 th{border:1px solid #eee;} .tableArea table.type1 th:first-child{border-left:0;} .tableArea table.type1 th:last-child{border-right:0;} .tableArea table.type1 td{border:1px solid #eee;} .tableArea table.type1 td:first-child{border-left:0;} .tableArea table.type1 td:last-child{border-right:0;} .tableArea table.type2{} .tableArea table.type2 th{border:1px solid #ccc; background:#d3ddff;} .tableArea table.type2 td{border:1px solid #ddd;} .tableArea table.type3{border:1px solid #333;} .tableArea table.type3 th{border:1px solid #333; background:#d3ddff;} .tableArea table.type3 td{border:1px solid #333;} .tableArea table.type4{border:1px solid #333;} .tableArea table.type4 th{border:1px solid #333; background:#fff;} .tableArea table.type4 td{border:1px solid #333;} .tableArea table.top-border{border-top:2px solid #333;} .tableArea table.middle th, .tableArea table.middle td{vertical-align:middle;} .tableArea table.th-middle{vertical-align:middle;} .tableArea table.th-center th{text-align:center;} .tableArea table select{padding:5px 20px; height:auto;} .tableArea .left{text-align:left !important;} .tableArea .small{font-size:12px;} .tableArea .bg-red{background:#ffebec;} @media all and (min-width:768px){ .tableArea h2.title{font-size:24.9px;} .tableArea table tr th{padding:15px 24.9px; font-size:16.9px;} .tableArea table tr td{padding:24.9px 24.9px; font-size:16.9px;} .tableArea table tr td.p-center{text-align:center;} .tableArea table tr td.p-center p{display:inline-block; text-align:left;} .tableArea .small{font-size:14px;} .tableArea .small.fs-17{font-size:17px;} } span.dot.bottom{position:relative;} span.dot.bottom:after{position:absolute; bottom:10px; right:-15px; width:3px; height:3px; border-radius:50%; content:""; background:#193c86;} @media all and (min-width:768px){ span.dot.bottom:after{width:6px; height:6px;} } .top-tabArea{display:none; margin-bottom:29.9px;} .top-tabArea.display{display:block;} .top-tabArea ul{} .top-tabArea ul li{font-size:12px; padding:0 20px; height:22.9px; line-height:28px; background:#f9f9f9; color:#999; border:1px solid #ddd; border-bottom-color:#111; cursor:pointer; margin-left:-1px; position:relative; z-index:10;} .top-tabArea ul li:hover{} .top-tabArea ul li.on{border-color:#111; color:#000; z-index:11; border-bottom:0; font-weight:500; background:#fff;} .make-tab .tableArea{display:none;} .make-tab .tableArea.on{display:block; margin-top:0;} @media all and (min-width:768px){ .top-tabArea{margin-bottom:49.9px;} .top-tabArea ul li{font-size:17px; height:39.9px; line-height:48px; padding:0 49.9px;} } .tabArea{margin:20px 0;} .tabArea ul{} .tabArea ul li{text-align:center; background:#f8f8f8; transition:0.2s;} .tabArea ul li a{display:block; color:var(--c2); line-height:29.9px;} .tabArea ul li.on{background:var(--c2);} .tabArea ul li.on a{color:#fff; font-weight:500;} .tabArea ul li:hover{background:#eee;} .tabArea ul.grid1 li{width:100%;} .tabArea ul.grid3 li{width:100%;} .tabArea ul.grid4 li{width:100%;} @media all and (min-width:768px){ .tabArea{margin:39.9px 0;} .tabArea ul li{font-size:16.9px;} .tabArea ul li a{line-height:49.9px;} .tabArea ul.grid1 li{width:100%;} .tabArea ul.grid3 li{width:calc(100% / 3);} .tabArea ul.grid4 li{width:calc(100% / 4);} } .estimate-box{display:flex; align-items:center; justify-content:space-between; box-sizing:border-box; padding:15px 20px; background:#fff; box-shadow:5px 5px 5px rgba(0,0,0,0.1); } .estimate-box p{font-size:14px; font-weight:500;} .estimate-box a{line-height:23px; background:var(--c2); color:#fff; width:30%; text-align:center; max-width:129.9px; transition:0.2s;} .estimate-box a:hover{background:#2e4ba4;} @media all and (min-width:768px){ .estimate-box{padding:20px 19.9px; box-shadow:5px 5px 10px rgba(0,0,0,0.1); } .estimate-box p{font-size:16.9px;} .estimate-box a{font-size:16.9px; line-height:29.9px; } .estimate-box.big p{font-size:22.9px;} .estimate-box.big a{font-size:22px; max-width:249.9px; line-height:44.9px;} } .red{color:#ff0000;} .lh-13{line-height:1.3; display:inline-block;} span.l{position:relative; display:block; margin-bottom:3px; padding-left:12px; box-sizing:border-box;} span.l:after{position:absolute; top:12px; left:0; width:4px; height:4px; background:var(--c2); border-radius:50%; content:""; } span.l.small{} span.l.small:after{width:3px; height:3px; background:#333;} span.l.top:after{top:10px; transform:none;} span.l.red-dot:after{background:#ff0000;} span.l-num i{font-style:normal;} span.l-num{position:relative; display:block; margin-bottom:3px; padding-left:20px; box-sizing:border-box;} span.l-num span{position:absolute; top:3px; left:0; line-height:1; _font-size: 10px; border-radius:5px; } span.l-num.b1{padding-left:29.9px;} @media all and (min-width:768px){ span.l{padding-left:19.9px; } span.l:after{top:12px; left:0; width:10px; height:10px; } span.l.small{} span.l.small:after{width:4px; height:4px;} span.l.top:after{top:15px; transform:none;} span.l-num{padding-left:19.9px; } span.l-num span{top:5px; _font-size:13px;} span.l-num.b1{padding-left:49.9px;} } .board_lnb{margin-bottom:20px;} .board_lnb ul{} .board_lnb ul li{margin-right:10px;} .board_lnb ul li a{display:inline-block; padding:7px 20px; background:#fbf8f4; border-radius:10px; transition:0.3s;} .board_lnb ul li.on a{color:#193c86; font-weight:bold; } .board_lnb ul li a:hover{color:#999;} @media all and (max-width:767px){ #sub-cont br.mo-only{display:none;} } #sub-cont{padding:0 15px; margin-top:22.9px; box-sizing:border-box; } #sub-cont>.in{max-width:1600px; margin:0 auto;} #sub-cont .titleArea{margin-bottom:20px;} #sub-cont .titleArea h3{font-size:13px; color:var(--c1); font-weight:600; margin-bottom:20px;} #sub-cont .titleArea h2{font-size:19.9px; font-weight:600; line-height:1.3; margin-bottom:10px;} #sub-cont .titleArea h4{font-size:16.9px; line-height:1.1; font-weight:500; margin-bottom:10px;} #sub-cont .titleArea h5{font-size:18px; line-height:1.1; font-weight:500; margin-bottom:10px;} #sub-cont .titleArea h6{font-size:16px; line-height:1.1; font-weight:500; margin-bottom:10px;} #sub-cont .titleArea p{font-size:13px; margin-top:10px;} #sub-cont .titleArea p.title{font-size:14px; margin-top:10px;} #sub-cont .titleArea p.title span{font-size:12px;} #sub-cont .titleArea p.title span.fs-inherit{font-size:inherit;} #sub-cont .titleArea p.title.c777{color:#777;} #sub-cont .titleArea b.red{font-weight:normal; color:#ff0000;} #sub-cont .titleArea p.fs30{font-size:15px;} #sub-cont .full-img{margin-left:-15px; margin-right:-15px; } #sub-cont .center{text-align:center;} #sub-cont .titleArea .line{display:block; width:20px; background:#000; margin:20px 0 22.9px 0; height:1px;} #sub-cont .titleArea .line.m0{margin:10px 0;} @media all and (min-width:768px){ #sub-cont{padding:0 20px; } #sub-cont .titleArea{margin-bottom:29.9px;} #sub-cont .titleArea h3{font-size:17px; margin-bottom:22.9px;} #sub-cont .titleArea h2{font-size:29.9px;; margin-bottom:20px; } #sub-cont .titleArea h2.fs44{font-size:44px; } #sub-cont .titleArea h4{font-size:24.9px; margin-bottom:20px; } #sub-cont .titleArea h5{font-size:22.9px; margin-bottom:20px; } #sub-cont .titleArea h6{font-size:19.9px; margin-bottom:20px; } #sub-cont .titleArea p{font-size:16.9px;; margin-top:20px;} #sub-cont .titleArea p.title{font-size:24px; margin-top:20px;} #sub-cont .titleArea p.title span{font-size:18px;} #sub-cont .titleArea p.fs30{font-size:22.9px;} #sub-cont .titleArea p.fs22{font-size:22px;} #sub-cont .titleArea p.fs15{font-size:15px;} #sub-cont .titleArea p.fs18{font-size:18px;} #sub-cont .titleArea p.fs-30{font-size:22.9px;} #sub-cont .titleArea p.fs-22{font-size:22px;} #sub-cont .titleArea p.fs-15{font-size:15px;} #sub-cont .titleArea p.fs-18{font-size:18px;} #sub-cont .full-img{margin-left:-20px; margin-right:-20px;} #sub-cont .titleArea .line{width:29.9px; margin:22.9px 0 49.9px 0; } #sub-cont .titleArea .line.m0{margin:20px 0; width:22.9px;} } #sub-cont article[class*="cont"]{} #sub-cont article[class*="cont"] + article[class*="cont"]{margin-top:49.9px;} @media all and (min-width:768px){ #sub-cont article[class*="cont"]{} #sub-cont article[class*="cont"] + article[class*="cont"]{margin-top:120px;} } #sub-cont .pc{display:none;} #sub-cont .mo{display:block;} #sub-cont ul.grid2{} #sub-cont ul.grid2 li{width:100%;} @media all and (min-width:768px){ #sub-cont .pc{display:block;} #sub-cont .mo{display:none;} #sub-cont ul.grid2{width:calc(100% + 29.9px); margin-left:-29.9px;} #sub-cont ul.grid2 li{width:calc(100% / 2 - 29.9px); margin-left:29.9px;} } #sub-cont.sub-01-01{} #sub-cont.sub-01-01 p:not(.title){width:100%;} @media all and (min-width:768px){ #sub-cont.sub-01-01 p:not(.title){} } .back-bg{background-position:center; background-size:cover;} #sub-cont.sub-01-1{position:relative;} #sub-cont.sub-01-1 .img{position:absolute; bottom:0; right:0; width:100%; height:90%; z-index:1;} #sub-cont.sub-01-1 .img img{width:100%; height:100%; object-fit:cover; object-position:center;} #sub-cont.sub-01-1 .txt{padding-bottom:50px; position:relative; z-index:11;} #sub-cont.sub-01-1 .txt i{font-size:20px; margin-bottom:10px;} #sub-cont.sub-01-1 .txt h2{font-size:17px; margin-bottom:10px;} #sub-cont.sub-01-1 .txt h3{font-size:15px; margin-bottom:30px;} #sub-cont.sub-01-1 .txt p{font-size:15px; margin-bottom:30px;} #sub-cont.sub-01-1 .txt span{font-size:35px; font-family:'나눔손글씨 강부장님체','Nanum GangBuJangNimCe';} @media all and (min-width:768px){ #sub-cont.sub-01-1 .img{width:80%; height:100%; max-width:1700px;} #sub-cont.sub-01-1 .txt{padding-bottom:100px;} #sub-cont.sub-01-1 .txt i{font-size:25px; margin-bottom:15px;} #sub-cont.sub-01-1 .txt h2{font-size:30px; margin-bottom:15px;} #sub-cont.sub-01-1 .txt h3{font-size:25px; margin-bottom:40px;} #sub-cont.sub-01-1 .txt p{font-size:17px; margin-bottom:40px;} #sub-cont.sub-01-1 .txt span{font-size:30px;} } @media all and (max-width:767px){ #sub-cont.sub-01-1{display:flex; flex-direction:column-reverse;} #sub-cont.sub-01-1 .img{position:static; height:auto; margin-top:-100px;} } /* 연혁 */ .history-wrap {width:100%; position:relative; box-sizing:border-box;} .history-wrap .top-img{position:absolute; top:0; left:0; width:auto;; margin:0 -20px;} .history-wrap .history { position:relative; margin-top:22.9px;} .history-wrap .history:last-child{margin-bottom:0px;} .history-wrap .history:after{ opacity:0; content:''; display:block; position:absolute; bottom:0; left:-3px; width:7px; height:7px; border-radius:50%; background:var(--c1);} .history-wrap .history:before { content:''; display:block; position:absolute; top:0; left:0; width:1px; height:calc(100% - 25px); background:var(--c1);} /* 라인색상 */ .history-wrap .history .box { position:relative; padding-left:29.9px; margin-bottom:34.9px; } .history-wrap .history .box:before { content:''; display:block; position:absolute; top:0; left:-3px; width:7px; height:7px; border-radius:50%; background:var(--c1);} /* 라인포인트색상 */ .history-wrap .history .box .year{position:relative; top:-10px; } .history-wrap .history .box .year strong{display:block; color:var(--c1); opacity:0.4; margin-bottom:5px; line-height:1; font-size:25.9px; font-weight:700; } .history-wrap .history .box ul {padding:0; margin:0; } .history-wrap .history .box ul li { padding:0; margin:0; line-height:2;} /* .history-wrap .history .box ul li b{display:block;} */ .history-wrap .history .box ul li p {display:flex; position:relative; margin-top:5px; line-height:2; align-items:flex-start;} .history-wrap .history .box ul li p:after{content:''; display:block; position:absolute; top:13px; left:-32px; width:5px; height:5px; border-radius:50%; background:var(--c1);} .history-wrap .history .box ul li p strong {width:80px; color:var(--c1); opacity:0.4; font-size:15px; padding-right:10px; display:inline-block; vertical-align:top; font-weight:400;} .history-wrap .history .box ul li p span {width:calc(100% - 80px); display:inline-block; box-sizing:border-box; } .history-wrap .history .box ul li p.year:after{opacity:0;} @media all and (min-width:768px){ .history-wrap { padding-left:37%;} .history-wrap .history:after{ width:15px; height:15px; margin-left:-7px;} .history-wrap .history:before{ height:calc(100% - 55px); } .history-wrap .history .box:before{width:30px; height:30px;} .history-wrap .history .box{padding-bottom:30px;} .history-wrap .history .box:last-child{margin:0;} .history-wrap .history .box .year{top:0;} .history-wrap .history .box .year strong{font-size:60px;width:300px; left:-292px; margin-bottom:-50px;} /* .history-wrap .history .box ul li b{font-size:16.9px;} */ .history-wrap .history .box ul li p{margin-top:50px; box-sizing:border-box; padding-left:50px;} .history-wrap .history .box ul li p span{font-size:16px;} .history-wrap .history .box ul li p:after{width:15px; height:15px; left:-37px; top:9px;} .history-wrap .history .box ul li p strong{position:absolute; top:50%; transform:translateY(-50%); width:150px; font-size:30px; left:-220px;} .history-wrap .history .box ul li p span{width:calc(100% - 150px); font-size:16px;} .history-wrap .history .box:nth-child(odd){} .history-wrap .history .box:nth-child(even){} .history-wrap .history .box:before{ margin-left:-11px;} .history-wrap .history .box:nth-child(odd){} .history-wrap .history .box:nth-child(even){} } #sub-cont.sub-01-2 .top{background:#ededed; box-sizing:border-box; padding:50px 20px; margin:50px -15px 0 -15px;} #sub-cont.sub-01-2 .top>.in{max-width:1400px; margin:0 auto;} #sub-cont.sub-01-2 .top ul{ text-align:center;} #sub-cont.sub-01-2 .top ul li{ display:flex; box-sizing:border-box; transition:0.3s;} #sub-cont.sub-01-2 .top ul li:hover{opacity:0.7;} #sub-cont.sub-01-2 .top ul li a{display:flex;; width:100%; height:100%; ; align-items:center; justify-content:center;} #sub-cont.sub-01-2 .top ul li a img{} #sub-cont.sub-01-2 .top .swiper{overflow:visible; position:relative;} #sub-cont.sub-01-2 .top .swiper-container{overflow:hidden; position:static;} #sub-cont.sub-01-2 .top .swiper-button-prev{width:30px; height:30px; background:#777; color:#fff; border-radius:50%; display:none;} #sub-cont.sub-01-2 .top .swiper-button-next{width:30px; height:30px; background:#777; color:#fff; border-radius:50%; display:none;} #sub-cont.sub-01-2 .top .swiper-button-prev:after, #sub-cont.sub-01-2 .top .swiper-button-next:after{font-size:15px;} @media all and (min-width:768px){ #sub-cont.sub-01-2 .top{ padding:70px 0; margin:100px -20px 0 -20px;} #sub-cont.sub-01-2 .top ul li{ justify-content:center; margin-bottom:0; } #sub-cont.sub-01-2 .top .swiper-button-prev{width:40px; height:40px; line-height:40px; text-align:center; left:-100px; display:block; } #sub-cont.sub-01-2 .top .swiper-button-next{width:40px; height:40px; line-height:40px; text-align:center; right:-100px; display:block;} #sub-cont.sub-01-2 .top .swiper-button-prev:after, #sub-cont.sub-01-2 .top .swiper-button-next:after{font-size:15px;} } #sub-cont.sub-01-3{} #sub-cont.sub-01-3 .txt{margin-top:50px; font-size:15px;} #sub-cont.sub-01-3 .txt b{display:block; margin-top:10px;} #sub-cont.sub-01-3 iframe, #sub-cont.sub-01-3 .root_daum_roughmap_landing, #sub-cont.sub-01-3 .root_daum_roughmap .wrap_map{width:100% !important; height:300px !important;} #sub-cont.sub-01-3 .txtbox h1{max-width:400px;} #sub-cont.sub-01-3 .txtbox h1 img{max-width:100%;} @media all and (min-width:768px){ #sub-cont.sub-01-3{} #sub-cont.sub-01-3 .txt{margin-top:100px; font-size:17px;} #sub-cont.sub-01-3 .txt b{font-size:19px; margin-top:20px;} #sub-cont.sub-01-3 .txtbox h1 img{} #sub-cont.sub-01-3 iframe, #sub-cont.sub-01-3 .root_daum_roughmap_landing, #sub-cont.sub-01-3 .root_daum_roughmap .wrap_map{height:700px !important;} } #sub-cont .top-prd{} #sub-cont .top-prd ul{} #sub-cont .top-prd ul li.img{width:100%;} #sub-cont .top-prd ul li.txt{width:100%; position:relative;} #sub-cont .top-prd ul li.txt p{} #sub-cont .top-prd ul li.txt h2{} #sub-cont .top-prd ul li.txt .line{} #sub-cont .top-prd ul li.txt .estimate-box{margin-top:22.9px; padding:0; box-shadow:none;} #sub-cont .top-prd ul li.txt .estimate-box{} #sub-cont .top-prd ul li.txt .estimate-box a{width:48%; max-width:initial; line-height:22.9px; font-size:19.9px;} #sub-cont .top-prd ul li.txt .estimate-box a:nth-child(1){box-shadow:5px 5px 5px rgba(0,0,0,0.03); background:#fff; color:var(--c2); border:1px solid #eee;} #sub-cont .top-prd ul li.txt .estimate-box a:nth-child(1):hover{background:#eee;} @media all and (min-width:768px){ #sub-cont .top-prd ul{display:flex;} #sub-cont .top-prd ul li.img{width:49%;} #sub-cont .top-prd ul li.txt{width:49%; margin-left:2%; } #sub-cont .top-prd ul li.txt .estimate-box{position:absolute; bottom:0; left:0; width:100%;} #sub-cont .top-prd ul li.txt .estimate-box a{line-height:62px;} #sub-cont .top-prd ul li.txt .titleArea p.title{font-size:22px; line-height:1.3;} } #sub-cont.sub-02-01{} #sub-cont.sub-02-01 .cont3 .box{position:relative; padding-left:39.9px;} #sub-cont.sub-02-01 .cont3 .box + .box{margin-top:22.9px;} #sub-cont.sub-02-01 .cont3 .box span{position:absolute; top:0; left:0; width:39.9px;} #sub-cont.sub-02-01 .cont3 .box h3{font-size:17px; font-weight:600; margin-bottom:10px;} #sub-cont.sub-02-01 .cont3 .box p{font-size:14px;} #sub-cont.sub-02-01 .cont3 .img{margin-top:39.9px;} @media all and (min-width:768px){ #sub-cont.sub-02-01 .cont3 .box{padding-left:70px;} #sub-cont.sub-02-01 .cont3 .box span{top:10px;} #sub-cont.sub-02-01 .cont3 .box h3{font-size:19.9px;} #sub-cont.sub-02-01 .cont3 .box p{font-size:16.9px;} #sub-cont.sub-02-01 .cont3 .img{margin-top:0;} } #sub-cont.sub-03-01 .titleArea.a1{position:relative; padding-left:39.9px; box-sizing:border-box;} #sub-cont.sub-03-01 .titleArea.a1 .img{position:absolute; top:0; left:0; width:22.9px;} @media all and (min-width:768px){ #sub-cont.sub-03-01 .titleArea.a1{padding-left:80px;} #sub-cont.sub-03-01 .titleArea.a1 .img{width:auto;} } @media all and (min-width:768px){ #sub-cont.sub-03-03 .cont3 ul li.img{width:calc(37% - 29.9px); vertical-align:middle;} #sub-cont.sub-03-03 .cont3 ul li.txt{width:calc(63% - 29.9px); vertical-align:middle;} #sub-cont.sub-03-03 .cont3 .titleArea{margin:0;} #sub-cont.sub-03-03 .cont3 .titleArea p{margin:0; font-size:21px; line-height:1.5;} } #sub-cont.sub-04-01{} #sub-cont.sub-04-01 .cont center{width:70%; margin:0 auto;} #sub-cont.sub-04-01 .cont center hr{margin:39.9px auto;} #sub-cont.sub-05-02{} #sub-cont.sub-05-02 hr{margin:39.9px 0;} #sub-cont .ico-box{} #sub-cont .ico-box ul{} #sub-cont .ico-box ul li{position:relative; padding:15px; padding-left:80px; box-sizing:border-box; background:#edeffb; border-radius:20px; box-shadow:5px 5px 5px rgba(0,0,0,0.1); } #sub-cont .ico-box ul li + li{margin-top:20px;} #sub-cont .ico-box ul li .img{position:absolute; display:flex; justify-content:center; align-items:center; padding:15px; box-sizing:border-box; transform:translateY(-50%); top:50%; left:0; width:49.9px; height:49.9px; overflow:hidden; border-radius:50%; background:var(--c2); } #sub-cont .ico-box ul li p{font-size:14px;} @media all and (min-width:768px){ #sub-cont .ico-box{} #sub-cont .ico-box ul{} #sub-cont .ico-box ul li{padding:29.9px; padding-left:149.9px; border-radius:29.9px; border-top-left-radius:100px; border-bottom-left-radius:100px;} #sub-cont .ico-box ul li + li{margin-top:29.9px;} #sub-cont .ico-box ul li .img{width:122.9px; height:122.9px; left:-5px;} #sub-cont .ico-box ul li p{font-size:19.9px;} } #sub-cont .circle-box{} #sub-cont .circle-box ul{display:flex; align-items:center; justify-content:space-around;} #sub-cont .circle-box ul li{display:flex; justify-content:center; align-items:center;} #sub-cont .circle-box ul li[class*="bg"]{position:relative; width:calc(100% / 4); height:0; padding-bottom:calc(100% / 4); border-radius:50%; } #sub-cont .circle-box ul li + li{} #sub-cont .circle-box ul li p{position:absolute; top:50%; left:0; transform:translateY(-50%); text-align:center; width:100%; font-size:14px; line-height:1.1; color:#fff; } #sub-cont .circle-box ul li span{font-size:22.9px;} @media all and (min-width:768px){ #sub-cont .circle-box ul li{} #sub-cont .circle-box ul li p{font-size:32px;} #sub-cont .circle-box ul li span{font-size:129.9px;} } /* board prd */ #sub-cont.board-sub.prd{} #sub-cont.board-sub.prd .cont{} #sub-cont.board-sub.prd .left-section{margin-bottom:50px;} #sub-cont.board-sub.prd .left-section nav{} #sub-cont.board-sub.prd .left-section nav + nav{margin-top:20px;} #sub-cont.board-sub.prd .left-section nav h2{position:relative; font-size:15px; box-sizing:border-box; border-bottom:1px solid #111; padding-bottom:5px; margin-bottom:15px; transition:0.3s;} #sub-cont.board-sub.prd .left-section nav.on h2{color:var(--c1); border-color:var(--c1);} #sub-cont.board-sub.prd .left-section nav h2>i{margin-right:5px; transition:0.3s;} #sub-cont.board-sub.prd .left-section nav h2 span{display:none;} #sub-cont.board-sub.prd .left-section nav h2 span i{font-size:10px;} #sub-cont.board-sub.prd .left-section nav h2 span i.plus{display:inline-block;} #sub-cont.board-sub.prd .left-section nav h2 span i.minus{display:none;} #sub-cont.board-sub.prd .left-section nav.on h2 span i.plus{display:none;} #sub-cont.board-sub.prd .left-section nav.on h2 span i.minus{display:inline-block;} #sub-cont.board-sub.prd .left-section ul{} #sub-cont.board-sub.prd .left-section ul li{margin:0 5px 5px 0;} #sub-cont.board-sub.prd .left-section ul li a{display:block; padding:5px 10px; border-radius:5px; background:#f4f4f4; transition:0.3s;} #sub-cont.board-sub.prd .left-section ul li a.bo_cate_on{background:var(--c1); color:#fff;} #sub-cont.board-sub.prd .right-section{} #sub-cont.board-sub .right-section .searchArea{} #sub-cont.board-sub .right-section .searchArea fieldset, #sub-cont.board-sub .right-section .searchArea form{display:flex;} #sub-cont.board-sub .right-section .searchArea select{height:35px; line-height:35px; margin-right:3px;} #sub-cont.board-sub .right-section .searchArea input[type="text"]{height:35px; line-height:35px; border-top-right-radius:0; border-right:0; border-bottom-right-radius:0;} #sub-cont.board-sub .right-section .searchArea button{border-radius:5px; width:50px; text-align:center; height:35px; line-height:35px; color:#fff; background:var(--c1); border-top-left-radius:0; border-bottom-left-radius:0;} #sub-cont.board-sub:not(.prd) .right-section .searchArea button{width:auto;} #sub-cont.board-sub .right-section .searchArea .sch_bar{display:flex;} #sub-cont.board-sub .right-section .searchArea .sch_bar + select{margin-left:20px;} #sub-cont.board-sub.prd #gall_ul>li{text-align:center;} #sub-cont.board-sub.prd #gall_ul>li .swiper-pagination{top:0; right:0; left:auto; bottom:auto; width:auto;} #sub-cont.board-sub.prd #gall_ul>li .swiper-pagination-bullet{margin:0 2px;} #sub-cont.board-sub.prd #gall_ul>li .swiper-pagination-bullet.swiper-pagination-bullet-active{background:#555;} #sub-cont.board-sub.prd #gall_ul>li .swiper-button-next, #sub-cont.board-sub.prd #gall_ul>li .swiper-button-prev{opacity:0; transition:0.3s;} #sub-cont.board-sub.prd #gall_ul>li .swiper-button-next:after, #sub-cont.board-sub.prd #gall_ul>li .swiper-button-prev:after{font-size:15px; color:#333;} #sub-cont.board-sub.prd #gall_ul>li:hover .swiper-button-next, #sub-cont.board-sub.prd #gall_ul>li:hover .swiper-button-prev{opacity:1;} #sub-cont.board-sub.prd #bo_gall .bo_tit{font-weight:bold;} #sub-cont.board-sub.prd #bo_gall .bo_tit + p{margin-top:5px;} @media all and (max-width:767px){ #sub-cont.board-sub .right-section .searchArea form{flex-wrap:wrap;} #sub-cont.board-sub .right-section .searchArea select{width:calc(30% - 3px);} #sub-cont.board-sub .right-section .searchArea .sch_bar{width:70%;} #sub-cont.board-sub .right-section .searchArea input[type="text"]{width:100%;} #sub-cont.board-sub .right-section .searchArea .sch_bar + select{margin:10px 0 0 auto; display:none;} } @media all and (min-width:768px){ #sub-cont.board-sub.prd:not(.read) .cont{display:flex;} #sub-cont.board-sub.prd:not(.read) .left-section{width:25%; box-sizing:border-box; padding-right:5%;} #sub-cont.board-sub.prd .left-section nav + nav{margin-top:100px;} #sub-cont.board-sub.prd .left-section nav h2{font-size:22px; cursor:pointer;} #sub-cont.board-sub.prd .left-section nav h2>i{margin-right:10px; font-size:21px;} #sub-cont.board-sub.prd .left-section nav h2 span{position:absolute; top:50%; right:0; transform:translateY(-50%); display:inline-block;} #sub-cont.board-sub.prd .left-section nav h2 span i{font-size:20px;} #sub-cont.board-sub.prd .left-section ul{display:none;} #sub-cont.board-sub.prd .left-section nav.on ul{display:block; animation:fadeIn 0.3s linear;} #sub-cont.board-sub.prd .left-section ul li{display:block; font-size:17px;} #sub-cont.board-sub.prd .left-section ul li a{display:inline-block; padding:2px 0; background:#fff;} #sub-cont.board-sub.prd .left-section ul li a:hover, #sub-cont.board-sub.prd .left-section ul li a.bo_cate_on{background:#fff; color:var(--c1);} #sub-cont.board-sub.prd:not(.read) .right-section{width:75%;} #sub-cont.board-sub .right-section .searchArea form{margin-left:auto;} #sub-cont.board-sub .right-section .searchArea select{font-size:16px; padding:0 15px; width:150px; height:40px; line-height:40px; margin-right:3px;} #sub-cont.board-sub .right-section .searchArea input[type="text"]{font-size:16px; padding:0 15px; width:350px; height:40px; line-height:40px; } #sub-cont.board-sub .right-section .searchArea button{ width:40px; height:40px; line-height:35px; font-size:16px;} } /* board prd read */ #sub-cont.board-sub.prd.read #bo_v_con{overflow:initial;} #sub-cont.board-sub.prd.read{} #sub-cont.board-sub.prd.read .swiper{ overflow:visible;} #sub-cont.board-sub.prd.read .swiper-container{position:static; overflow:hidden;} #sub-cont.board-sub.prd.read .swiper-button-prev{left:-10px; border-radius:50%; width:29.9px; height:29.9px; line-height:29.9px; background:rgba(0,0,0,0.5);} #sub-cont.board-sub.prd.read .swiper-button-next{right:-10px; border-radius:50%; width:29.9px; height:29.9px; line-height:29.9px; background:rgba(0,0,0,0.5); } #sub-cont.board-sub.prd.read .swiper-button-prev:after, #sub-cont.board-sub.prd.read .swiper-button-next:after{font-size:15px; color:#fff;} #sub-cont.board-sub.prd.read .swiper .item{} #sub-cont.board-sub.prd.read .swiper .item img{width:100%;} #sub-cont.board-sub.prd.read .detailTop{margin-bottom:50px;} #sub-cont.board-sub.prd.read .detailTop .imgArea{} #sub-cont.board-sub.prd.read .detailTop .infoArea{} #sub-cont.board-sub.prd.read ul{margin:0; padding:0;} #sub-cont.board-sub.prd.read .wr-extra{margin-bottom:50px;} #sub-cont.board-sub.prd.read .wr-extra li{} #sub-cont.board-sub.prd.read .wr-extra li p{} #sub-cont.board-sub.prd.read .wr-extra li:not(.title){display:flex;} #sub-cont.board-sub.prd.read .wr-extra li b{font-weight:400; white-space:nowrap;} #sub-cont.board-sub.prd.read .wr-extra li:not(.title) p{ box-sizing:border-box; padding-left:10px;} #sub-cont.board-sub.prd.read .wr-extra .title{margin-bottom:50px;} #sub-cont.board-sub.prd.read .wr-extra .title h2{margin-bottom:5px;} #sub-cont.board-sub.prd.read .wr-extra .title p{color:#999;} #sub-cont .fa-circle-o-notch{display:none;} @media all and (min-width:768px){ #sub-cont.board-sub.prd.read .swiper{padding:0 5%; box-sizing:border-box;} #sub-cont.board-sub.prd.read .swiper-button-prev{margin-top:-70px; left:15%; width:70px; height:70px; line-height:70px;} #sub-cont.board-sub.prd.read .swiper-button-next{margin-top:-70px; right:15%; width:70px; height:70px; line-height:70px;} #sub-cont.board-sub.prd.read .swiper-button-prev:after, #sub-cont.board-sub.prd.read .swiper-button-next:after{font-size:20px;} #sub-cont.board-sub.prd.read .detailTop{margin-bottom:80px;} #sub-cont.board-sub.prd.read .detailTop>.in{display:flex;} #sub-cont.board-sub.prd.read .detailTop .imgArea{width:50%;} #sub-cont.board-sub.prd.read .detailTop .infoArea{width:50%;} #sub-cont.board-sub.prd.read .wr-extra{margin-bottom:100px;} #sub-cont.board-sub.prd.read .wr-extra li{font-size:17px; line-height:1.6; margin-bottom:5px;} #sub-cont.board-sub.prd.read .wr-extra .title{margin-bottom:70px;} #sub-cont.board-sub.prd.read .wr-extra .title h2{font-size:30px; margin-bottom:10px;} #sub-cont.board-sub.prd.read .wr-extra .title p{font-size:20px;} } .table01{ border-top:2px solid var(--c1); clear:both; margin-bottom:20px; width:100%; background:#fff; } .table01 th, .table01 td{ padding:10px 13px; border:1px solid #ddd; word-break:keep-all; } .table01 th{ width:18%; min-height:40px; background:#fff0e1; border-bottom:1px solid #d4d8de; font-weight:600; color:#333; text-align:center; } .table01 td{ width:82%; padding-left:20px; text-align:left;} .table01 td a{ color:#555; } .table01 td a:hover{ color:#00a1e9; } .table01 td .m_tel{ display:none; } .table01 caption{ text-align:left; margin:20px 0 10px 0; padding:0 1% 0 0; } .table01 caption:before{content:''; font:normal 16px 'icon'; padding-right:7px; vertical-align:-1px; color:#00a1e9; } .new_map{ width:100% !important; } .new_map span{ font-family:'Nanum Square' !important; } .root_daum_roughmap.root_daum_roughmap_landing.os_mac{ max-width:100% !important; width:auto; margin:0 auto; } /*------------------------------------ 제품소개 ------------------------------------*/ .table02 th, .table02 td{ padding:10px 13px; width:40%; text-align:center; } .table02 th.th_s{ width:20%; } .table03 th, .table03 td{ padding:10px 13px; width:70%; text-align:center; } .table03 td{text-align:left;} .table03 th.th_s{ width:30%; } /*타이틀*/ .product_detail_wrap h3{ margin:40px 0 20px; } .product_detail_wrap h3:first-child{ margin-top:0; } /* .product_detail_wrap h3:before{ display:block; margin-bottom:8px; width:18px; height:3px; background:#00a1e9; content:''; } */ .product_detail_wrap h3 i{ margin-right:3px; font-size:14px; color:#00a1e9; vertical-align:2px; } .product_detail_wrap ul{} .product_detail_wrap ul li{ position:relative; padding-left:10px; } .product_detail_wrap ul li:before{ position:absolute; left:0; top:10px; display:inline-block; content:''; width:3px; height:3px; border-radius:100em; margin-right:3px; background:#242424; vertical-align:middle; } @media all and (min-width:768px){ .product_detail_wrap h3{font-size:20px; margin-top:100px;} .product_detail_wrap ul li{font-size:17px; padding-left:30px;} .product_detail_wrap ul li:before{top:13px;} .table01 th, .table01 td{font-size:17px; padding:20px 25px;} } /* board basic */ #sub-cont.board-sub>.in{padding:0;} #sub-cont.board-sub .tbl_wrap table{border-top:2px solid #333; border:0;} /* list */ #sub-cont.board-sub #bo_list .td_name{width:139.9px; text-align:center;} #sub-cont.board-sub #bo_list .td_datetime{width:200px;} #sub-cont.board-sub #bo_list .btn_bo_user>li{width:auto; min-width:29.9px; } #sub-cont.board-sub #bo_list .btn_bo_user .btn_submit{display:inline-block; background:var(--c1); height:24.9px; line-height:24.9px; padding:0 20px; border-radius:3px; transition:0.3s;} #sub-cont.board-sub #bo_list .btn_bo_user .btn_submit:hover{background:#666;} #sub-cont.board-sub #bo_list table th, #sub-cont.board-sub #bo_list table td{} /* read */ #sub-cont.board-sub #bo_v_title{margin-bottom:10px;} #sub-cont.board-sub #bo_v_title .bo_v_tit{font-size:16.9px;} #sub-cont.board-sub #bo_v_info{border:0;} #sub-cont.board-sub #bo_v_info .profile_info{margin:0 0 0 0; float:none; display:block;} #sub-cont.board-sub #bo_v_info .profile_info_ct{float:none;} #sub-cont.board-sub #bo_v_info .profile_info_ct i{display:none;} #sub-cont.board-sub #bo_v_info ul{display:} #sub-cont.board-sub #bo_v_info ul li{position:relative; margin-right:20px; } #sub-cont.board-sub #bo_v_info ul li + li:after{position:absolute; top:50%; left:-10px; width:1px; height:10px; transform:translateY(-50%); background:#ddd; content:"";} #sub-cont.board-sub #bo_v_info ul li strong{margin:0;} #sub-cont.board-sub #bo_v_info ul li span:not(.sv_member){color:#111; font-weight:500; margin-right:10px; } #sub-cont.board-sub #bo_v_info ul li .sv_member, #sub-cont.board-sub #bo_v_info ul li b{font-weight:normal; color:#666; display:inline-block; } #sub-cont.board-sub #bo_v_atc{padding-top:0;} #sub-cont.board-sub #bo_v_con{margin:10px 0; font-size:14px; padding:22.9px 0; border-top:2px solid #333; border-bottom:2px solid #333; border:0;} #sub-cont.board-sub #bo_v_img{margin-top:39.9px; } @media all and (min-width:768px){ /* list */ #sub-cont.board-sub #bo_list table th, #sub-cont.board-sub #bo_list table td{font-size:17px;} #sub-cont.board-sub #bo_list table td{} /* read */ #sub-cont.board-sub #bo_v_title{} #sub-cont.board-sub #bo_v_title .bo_v_tit{font-size:20px;} #sub-cont.board-sub #bo_v_info{text-align:center;} #sub-cont.board-sub #bo_v_info ul li{margin:0 20px;} #sub-cont.board-sub #bo_v_info ul li + li:after{left:-20px;} #sub-cont.board-sub #bo_v_con{font-size:16.9px; padding:39.9px 0; } #sub-cont #bo_list .td_num{width:100px;} } #bo_list .bo_tit .fa-download{display:none;} .board-sub .bo_fx{float:none;} /* board - galley */ #sub-cont.board-sub #gall_ul{display:flex; justify-content:space-between; flex-wrap:wrap;} #sub-cont.board-sub #gall_ul>li{width:calc(100% / 1 - 5px); text-align:center;} #sub-cont.board-sub #bo_gall .btn_bo_user>li{width:auto; min-width:29.9px; } #sub-cont.board-sub #bo_gall .btn_bo_user .btn_submit{display:inline-block; background:var(--c1); height:24.9px; line-height:24.9px; padding:0 20px; border-radius:3px; transition:0.3s;} #sub-cont.board-sub #bo_gall .btn_bo_user .btn_submit:hover{background:#666;} @media all and (min-width:768px){ #sub-cont.board-sub #gall_ul{justify-content:flex-start; margin:0 0 0 -20px; } #sub-cont.board-sub #gall_ul>li{width:calc(100% / 3 - 20px); margin-left:20px; } #sub-cont.board-sub #bo_gall .btn_bo_user .btn_submit, #sub-cont.board-sub #bo_list .btn_bo_user .btn_submit{width:144.9px; line-height:44.9px; height:44.9px; font-size:16.9px;} } #sub-cont.board-sub .pg_wrap{display:block; float:none; margin:80px 0;} #sub-cont.board-sub .pg{display:block;} #sub-cont.board-sub .pg_current{line-height:30px; padding:0; border-radius:50%; margin:0 5px; color:var(--c1); text-decoration:underline; background:transparent; border:0;} #sub-cont.board-sub .pg_page{line-height:30px; background-color:#fff; padding:0; border:0; margin:0 2px;} /* #sub-cont.board-sub .pg_end{background:transparent; font-size:0; line-height:0; text-indent:0;} #sub-cont.board-sub .pg_end:after{font-family:'xeicon'; content:"\e90b"; font-size:15px; line-height:19.9px;} */ @media all and (max-width:767px){ #sub-cont.board-sub .pg_wrap{overflow-x:auto; padding-bottom:10px;} #sub-cont.board-sub .pg{display:flex; align-items:center;} } @media all and (min-width:768px){ #sub-cont.board-sub .pg_current, #sub-cont.board-sub .pg_page, #sub-cont.board-sub .pg_end:after{font-size:19.9px;} #sub-cont.board-sub .pg_end{font-size:0;} } #sub-cont.board-sub.sub-06-1 #bo_list table{text-align:center;} #sub-cont.board-sub.sub-06-1 #bo_list table tbody tr:nth-child(odd){background:#f7f7f7;} #sub-cont.board-sub.sub-06-1 #bo_list table tbody td{ color:#111;} #sub-cont.board-sub.sub-06-1 #bo_list table th, #sub-cont.board-sub.sub-06-1 #bo_list table td{border:1px solid #ccc;} #sub-cont.board-sub.sub-06-1 #bo_list table th:first-child, #sub-cont.board-sub.sub-06-1 #bo_list table td:first-child{border-left:0;} #sub-cont.board-sub.sub-06-1 #bo_list table th:last-child, #sub-cont.board-sub.sub-06-1 #bo_list table td:last-child{border-right:0;} #sub-cont.board-sub.sub-06-3 #bo_list table{text-align:center;} #sub-cont.board-sub.sub-06-3 #bo_list table tbody td{ color:#111;} #sub-cont.board-sub.sub-06-3 #bo_list table td{border:1px solid #ccc;} #sub-cont.board-sub.sub-06-3 #bo_list table td:first-child{border-left:0; background:#f7f7f7; width:40%;} #sub-cont.board-sub.sub-06-3 #bo_list table td:last-child{border-right:0; width:60%; box-sizing:border-box;padding-left:2%; padding-right:5%;} #sub-cont.board-sub.sub-06-3 #bo_list table td input, #sub-cont.board-sub.sub-06-3 #bo_list table td select{width:100%; height:30px;} @media all and (min-width:768px){ #sub-cont.board-sub.sub-06-3 #bo_list table td:last-child{padding-left:5%; padding-right:25%;} #sub-cont.board-sub.sub-06-3 #bo_list table td input, #sub-cont.board-sub.sub-06-3 #bo_list table td select{ height:50px; font-size:16.9px;} } #sub-cont[board-name="자유게시판"] .hits, #sub-cont[board-name="자유게시판"] #bo_list .td_num{display:none;} #sub-cont.guide{} #sub-cont.guide article{white-space:pre-line;} #sub-cont.guide h2{margin-top:39.9px;} #sub-cont.guide h6{padding-left:10px;} #sub-cont.guide p{padding-left:20px; margin-top:10px; margin-bottom:39.9px;} @media all and (min-width:768px){ #sub-cont.guide h2{font-size:22.9px;} #sub-cont.guide h2:nth-child(n+2){margin-top:80px; } #sub-cont .titleArea h6{font-size:22px;} } #sub-cont.in{max-width:1600px; margin:0 auto;} #sub-cont[class*="sub-06-"]{_max-width:1100px; _margin-left:auto; _margin-right:auto;} .JS-form_mail2{ box-sizing:border-box; background:#efefef; width:100%;} .JS-form_mail2>.in{max-width:100%; padding:22.9px;} .JS-form_mail2 .left{width:100%;} .JS-form_mail2 .right{width:100%;} .JS-form_mail2 .input-1, .JS-form_mail2 input:not([type="checkbox"]){position:relative; font-size:14px; width:100%; height:32px; margin:0 0 0 0; border:0; background:#fff; padding:0 10px; border-radius:5px;} .JS-form_mail2 textarea{font-size:14px; width:100%; min-height:100px; max-height:400px; margin:0 0 5px 0; border:0; background:#fff; padding:10px;} .JS-form_mail2 .ec-base-button{margin-top:20px;} .JS-form_mail2 button[class*="btn"]{padding:5px 20px; border-radius:5px;} .JS-form_mail2 input.btnSubmit{background:var(--c1); width:100%; margin:0 auto; margin-top:22.9px; cursor:pointer;} .JS-form_mail2 input[type="file"]{position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; cursor:pointer; z-index:12;} .JS-form_mail2 .input-box{position:relative; padding-left:100px; margin-bottom:10px;} .JS-form_mail2 .input-box h3{font-size:14px; width:80px; text-align:right; position:absolute; top:5px; left:0; font-weight:normal;} .JS-form_mail2 .input-box h3 span{color:#F29600;} .JS-form_mail2 .input-1{color:#999; display:flex; align-items:center; justify-content:space-between; padding-left:15px; box-sizing:border-box;} .JS-form_mail2 .attatch{display:inline-block; padding:2px 10px; background:#999; color:#fff; border-radius:5px; font-size:11px;} .JS-form_mail2 .top{text-align:left;} .JS-form_mail2 .top>.input-box{width:100%;} .JS-form_mail2 .top>.input-box.textarea{width:100%;} .JS-form_mail2 .top .flex{} .JS-form_mail2 .top .flex select{height:32px; width:100%; margin-bottom:10px;} .JS-form_mail2 .top .flex input{} .JS-form_mail2 input.btnSubmit { } .JS-form_mail2 .input-box .infoArea{margin:0;} .JS-form_mail2 .input-box .infoArea .box{background:#fff; border-radius:5px;} @media all and (min-width:768px){ .sub-c2-1 h2{ font-size:19.9px;} .JS-form_mail2>.in{ padding:55.9px;} .JS-form_mail2 .left{width:47%;} .JS-form_mail2 .right{position:relative; width:50%; margin-left:3%; padding-left:2%; } .JS-form_mail2 .right:after{position:absolute; top:0; left:0; width:1px; height:calc(100% - 10px); background:#ddd; content:"";} .JS-form_mail2 .input-1, .JS-form_mail2 input:not([type="checkbox"]){height:50px; font-size:14.9px;} .JS-form_mail2 textarea{font-size:16.9px;} .JS-form_mail2 .input-box{padding-left:190px; margin-bottom:15px;} .JS-form_mail2 .input-box h3{font-size:16.9px; width:129.9px; font-weight:500; top:50%; transform:translateY(-50%);} .JS-form_mail2 .input-box.last h3{} .JS-form_mail2 .attatch{font-size:13px; padding:7px 22.9px;} .JS-form_mail2 .top .flex{display:flex;} .JS-form_mail2 .top .flex select{height:50px; width:30%; margin-bottom:0; font-size:16.9px; padding-left:10px;} .JS-form_mail2 .top .flex input{width:69%; margin-left:1%;} .JS-form_mail2 .top>.input-box{width:48%; margin-left:2%;} .JS-form_mail2 .top>.input-box.w100{width:98%;} .JS-form_mail2 input.btnSubmit {font-size:16.9px;} } .sub-06-3 .resultArea{margin-top:39.9px; text-align:center;} .sub-06-3 .resultArea p{} .sub-06-3 .resultArea .printArea{} .sub-06-3 .resultArea .printArea>.in{padding:5% 5%; height:100%; box-sizing:border-box;} #print-this{text-align:center; position:fixed; top:0; left:0; width:100%; height:100%; padding:100px ; box-sizing:border-box; font-family: 'Noto Serif KR', serif; z-index:99999999} #print-this header{height:20vh; font-size:39.9px; font-weight:700; letter-spacing:22.9px;} #print-this article{height:30vh; text-align:left; line-height:2; font-size:16.9px;} #print-this p.sign{height:15vh; font-size:16.9px;} #print-this p.date{height:15vh; font-size:16.9px;} #print-this p.by{height:20vh; font-size:22.9px; font-weight:500;} .sub-06-3 .pop-01{position:fixed; top:0; left:0; width:100%; height:100%; z-index:99; } .sub-06-3 .pop-01 .bg{position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.2; z-index:11; cursor:pointer;} .sub-06-3 .pop-01 .in{position:absolute; top:50%; left:50%; border-radius:10px; box-sizing:border-box; padding:39.9px 0; width:90%; height:auto; background:#fff; transform:translate(-50%, -50%); z-index:12; } .sub-06-3 .pop-01 .in button{margin-top:22.9px;} .sub-06-3 .pop-01 p{font-size:15px;} .sub-06-3 .pop-01#PASS .in{background-image:url('/imgs/2024/bg_class.png'); background-position:center; background-size:cover;} .sub-06-3 .pop-01 .ec-base-button{margin-top:39.9px;} .sub-06-3 .pop-01 .ec-base-button a{height:49.9px; padding:0;} @media all and (min-width:768px){ .sub-06-3 .searchArea input.number{width:25%;} .sub-06-3 .searchArea input.name{width:19%; margin:0 0.5%;} .sub-06-3 .searchArea button{width:139.9px;} .sub-06-3 .pop-01 .in{width:600px; padding:39.9px 39.9px;} .sub-06-3 .pop-01 p{font-size:16.9px;} } /* 회원가입 메인 */ #sub-cont .memberArea.join-main{} #sub-cont .memberArea.join-main .buttonArea{padding:0;} #sub-cont .memberArea.join-main .buttonArea button{font-weight:bold;} #sub-cont .memberArea.join-main .buttonArea button + button{margin-top:5px;} #sub-cont .memberArea.join-main .buttonArea button span{position:relative; top:0; display:inline-block; margin-right:10px; } #sub-cont .memberArea.join-main .buttonArea button span img{width:17px; vertical-align:middle;} #sub-cont .memberArea.join-main .buttonArea button.naver{background:#03c75a;} #sub-cont .memberArea.join-main .buttonArea button.naver:hover{background:#06b152;} #sub-cont .memberArea.join-main .buttonArea button.kakao{background:#fee500; color:#000; } #sub-cont .memberArea.join-main .buttonArea button.kakao:hover{background:#e3ce0f;} #sub-cont .memberArea.join-main .buttonArea button.google{} #sub-cont .memberArea.join-main .buttonArea button b{color:var(--c1);} #sub-cont .memberArea.join-main .txt{margin-top:20px;} #sub-cont .memberArea.join-main .txt a{color:var(--c1);} @media all and (min-width:768px){ #sub-cont .memberArea.join-main .buttonArea button span{top:-2px;} #sub-cont .memberArea.join-main .buttonArea button + button{margin-top:10px;} #sub-cont #register_form .pc-flex{display:flex;} #sub-cont #register_form .pc-flex input:nth-child(2){margin-right:10px;} } /* 회원가입 */ #sub-cont .memberArea.join-form{} #sub-cont .memberArea.join-form .in{border-radius:20px; box-shadow:0 5px 10px rgba(0,0,0,0.2); box-sizing:border-box; padding:20px;} #sub-cont .memberArea.join-form fieldset h2{font-size:14px; color:var(--c2); text-align:left; margin-bottom:10px;} #sub-cont .memberArea.join-form fieldset h2.center{text-align:center; color:#000; margin-top:22.9px;} #sub-cont .memberArea.join-form fieldset ul{} #sub-cont .memberArea.join-form fieldset ul li{position:relative; display:flex; align-items:center; flex-wrap:wrap;} #sub-cont .memberArea.join-form fieldset ul li + li{margin-top:20px;} #sub-cont .memberArea.join-form fieldset ul li b{width:100%; color:#666; display:block; margin-bottom:5px; font-size:14px;} #sub-cont .memberArea.join-form fieldset ul li input{width:100%; background:transparent; border:0; border:1px solid #ddd; border-radius:3px; padding-left:20px;} #sub-cont .memberArea.join-form fieldset ul li input:focus{border-color:#111;} #sub-cont .memberArea.join-form fieldset ul li input[disabled]{border:0;} #sub-cont .memberArea.join-form fieldset ul li input[type="password"]{} #sub-cont .memberArea.join-form fieldset ul li input + input{width:40%; margin-left:10px;} #sub-cont .memberArea.join-form fieldset ul li span{position:absolute; top:50%; right:0; transform:translateY(-50%); color:var(--c1);} #sub-cont .memberArea.join-form fieldset ul li span.txt2{color:#ED2525;} #sub-cont .memberArea.join-form fieldset ul li button{margin-left:10px; height:29.9px; min-width:80px; text-align:center;} #sub-cont .memberArea.join-form fieldset ul li select{width:100%;} #sub-cont .memberArea.join-form fieldset ul li div.flex{display:flex; width:100%;} #sub-cont .memberArea.join-form fieldset ul li div.flex + div.flex{margin-top:10px;} #sub-cont .memberArea.join-form.login fieldset ul li:after{position:absolute; top:0; line-height:38px; left:0; width:22.9px; text-align:center; font-family:'xeicon'; content:"\e9f5"; } #sub-cont .memberArea.join-form.login fieldset ul li:nth-child(2):after{content:"\e966";} #sub-cont .memberArea.join-form.login fieldset ul li input{padding-left:24.9px;} @media all and (min-width:768px){ #sub-cont .memberArea.join-form{} #sub-cont .memberArea.join-form .in{padding:39.9px;} #sub-cont .memberArea.join-form fieldset h2{font-size:22.9px; margin-bottom:20px;} #sub-cont .memberArea.join-form fieldset ul li{position:relative; font-size:16px;} #sub-cont .memberArea.join-form fieldset ul li + li{margin-top:10px;} #sub-cont .memberArea.join-form fieldset ul li b{width:100px; display:inline-block; position:absolute; top:10px; left:0;} #sub-cont .memberArea.join-form fieldset ul li input{height:50px;} #sub-cont .memberArea.join-form fieldset ul li button{height:50px; min-width:110px;} #sub-cont .memberArea.join-form fieldset ul li select{height:50px;} #sub-cont .memberArea.join-form.login fieldset ul li:after{font-size:16.9px; line-height:54px; width:39.9px;} #sub-cont .memberArea.join-form.login fieldset ul li input{padding-left:44.9px;} } .mt-5{margin-top:5px; } .mb-5{margin-bottom:5px; } .mt-10{margin-top:10px; } .mb-10{margin-bottom:10px; } .mt-20{margin-top:20px; } .mb-20{margin-bottom:20px; } .mt-30{margin-top:20px; } .mb-30{margin-bottom:20px; } .mb-40{margin-bottom:20px; } .mb-50{margin-bottom:19.9px; } .mb-60{margin-bottom:22.9px; } @media all and (min-width:768px){ .mt-5{margin-top:5px; } .mb-5{margin-bottom:5px; } .mt-10{margin-top:10px; } .mb-10{margin-bottom:10px; } .mt-20{margin-top:20px; } .mb-20{margin-bottom:20px; } .mt-30{margin-top:22.9px; } .mb-30{margin-bottom:22.9px; } .mb-40{margin-bottom:29.9px; } .mb-50{margin-bottom:39.9px; } .mb-60{margin-bottom:49.9px; } } .sub-title{margin:20px 0; font-size:16.9px; font-weight:bold; } @media all and (min-width:768px){ .sub-title{margin:39.9px 0; font-size:22.9px; } } #sub-cont .txtbox{} #sub-cont .txtbox.board-title{margin:39.9px 0 22.9px 0;} #sub-cont .txtbox h2{} #sub-cont .txtbox p{} #sub-cont .txtbox .fs-44{font-size:21px;} #sub-cont .txtbox .fs-40{font-size:16.9px;} #sub-cont .txtbox .fs-38{font-size:19px;} #sub-cont .txtbox .fs-35{font-size:18px;} #sub-cont .txtbox .fs-32{font-size:17px;} #sub-cont .txtbox .fs-30{font-size:16px;} #sub-cont .txtbox .fs-28{font-size:16px;} #sub-cont .txtbox .fs-25{font-size:16px;} #sub-cont .txtbox .fs-23{font-size:15px;} #sub-cont .txtbox .fs-20{font-size:14px;} #sub-cont .txtbox.w, #sub-cont .txtbox .w{color:#fff;} #sub-cont .txtbox.c1, #sub-cont .txtbox .c1{color:var(--c1);} #sub-cont .txtbox .c-111{color:#111;} #sub-cont .txtbox .c-888{color:#888;} #sub-cont .bg-w{background:#fff;} #sub-cont .bg-c1{background:var(--c1);} #sub-cont .bg-111{background:#111;} #sub-cont .bg-888{background:#888;} #sub-cont .banner-txt{margin-bottom:29.9px; display:flex; align-items:center; height:auto; border-radius:20px; box-sizing:border-box; padding:29.9px 20px; background-position:center; background-size:cover;} #sub-cont .banner-txt .txtbox{} #sub-cont .banner-txt.dark{position:relative;} #sub-cont .banner-txt.dark:after{position:absolute; top:0; left:0; width:100%; height:100%; content:""; background:#333; opacity:0.25;} #sub-cont .banner-txt.dark .txtbox{position:relative; z-index:11;} #sub-cont hr.type1{border:0; height:1px; background:#ddd; margin:29.9px auto;;} #sub-cont hr.type2{border:0; height:29.9px; background:transparent; } #sub-cont .gall-box{width:calc(100% + 22.9px); margin-left:-22.9px;} #sub-cont .gall-box[class*="grid"] li{margin-left:22.9px; margin-bottom:22.9px;} #sub-cont .gall-box.grid1 li{width:calc(100% / 1 - 22.9px);} #sub-cont .gall-box.grid2 li{width:calc(100% / 1 - 22.9px);} #sub-cont .gall-box.grid3 li{width:calc(100% / 2 - 22.9px);} #sub-cont .gall-box.grid4 li{width:calc(100% / 2 - 22.9px);} #sub-cont .gall-box .img{} #sub-cont .gall-box .img img{width:100%;} #sub-cont .pc-only{display:none;} #sub-cont .mo-only{display:block;} #sub-cont .root_daum_roughmap_landing{width:100% !important;} #sub-cont .root_daum_roughmap .cont{display:none;} #sub-cont .root_daum_roughmap .map_border{display:none !important;} @media all and (min-width:768px){ #sub-cont .banner-txt{height:375px; padding:39.9px; margin-bottom:70px; } #sub-cont .txtbox{} #sub-cont .txtbox.board-title{margin:100px 0 70px 0;} #sub-cont .txtbox h2{} #sub-cont .txtbox p{} #sub-cont .txtbox .fs-44{font-size:44px; line-height:1.3;} #sub-cont .txtbox .fs-40{font-size:29.9px; line-height:1.3;} #sub-cont .txtbox .fs-38{font-size:26.9px; line-height:1.3;} #sub-cont .txtbox .fs-35{font-size:24.9px; line-height:1.3;} #sub-cont .txtbox .fs-32{font-size:23.9px; line-height:1.3;} #sub-cont .txtbox .fs-30{font-size:17px; line-height:1.3;} #sub-cont .txtbox .fs-28{font-size:21.9px; line-height:1.3;} #sub-cont .txtbox .fs-25{font-size:19.9px;} #sub-cont .txtbox .fs-23{font-size:17.9px;} #sub-cont .txtbox .fs-20{font-size:16.9px;} #sub-cont hr.type1{ margin:50px auto;;} #sub-cont hr.type2{height:50px; } #sub-cont .gall-box{width:calc(100% + 70px); margin-left:-70px;} #sub-cont .gall-box[class*="grid"] li{margin-left:70px; margin-bottom:70px;} #sub-cont .gall-box.grid1 li{width:calc(100% / 1 - 70px);} #sub-cont .gall-box.grid2 li{width:calc(100% / 2 - 70px);} #sub-cont .gall-box.grid3 li{width:calc(100% / 3 - 70px);} #sub-cont .gall-box.grid4 li{width:calc(100% / 4 - 70px);} #sub-cont .pc-only{display:block;} #sub-cont .mo-only{display:none;} } /* 설립목적 */ #sub-cont .logo{} #sub-cont .logo .l{} #sub-cont .logo .r{} @media all and (min-width:768px){ #sub-cont .logo{display:flex;} #sub-cont .logo .l{width:30%;} #sub-cont .logo .r{width:70%; padding-left:5%;} } /* 인사말 */ #sub-cont.sub-01-2 .person{position:relative;} @media all and (min-width:768px){ #sub-cont.sub-01-2 .person .txtbox{position:absolute; bottom:29.9px; left:29.9px;} } /* 사업안내 */ #sub-cont .box-a{background:#fef3e1; box-sizing:border-box; padding:15px;} #sub-cont .box-a .gall-box{width:calc(100% + 10px); margin-left:-10px; display:flex; flex-wrap: wrap;} #sub-cont .box-a .gall-box li{display:flex; justify-content:space-between; width:calc(100% / 1 - 10px); margin:0 0 10px 10px; padding:10px; box-sizing:border-box; background:#fff; border-radius:10px;} #sub-cont .box-a .gall-box li.a2{} #sub-cont .box-a .gall-box .img img{width:auto; max-width:100px;} #sub-cont .box-a .wrap{position:relative; margin-top:39.9px; background:#f19601; box-sizing:border-box; padding:15px; padding-top:22.9px; border-radius:22.9px;} #sub-cont .box-a .wrap .plus{position:absolute; top:-22.9px; left:50%; transform:translateX(-50%); width:70px; height:70px; line-height:49.9px; text-align:center; color:#fff; font-size:16.9px; border-radius:50%; background:#f19601; z-index:1;} #sub-cont .box-a .wrap .plus i{} #sub-cont .box-a .wrap ul li.last.one{width:calc(100% - 10px); background:var(--c1);} #sub-cont .box-a.type2{background:#fff; padding:0;} #sub-cont .box-a.type2 .gall-box{display:table;} #sub-cont .box-a.type2 .gall-box li{padding:0; display:inline-block; width:calc(100% / 2 - 10px);} #sub-cont .box-a.type2 .gall-box li img{max-width:100%;} @media all and (min-width:768px){ #sub-cont .box-a{padding:24.9px;} #sub-cont .box-a .gall-box{width:calc(100% + 22.9px); margin-left:-22.9px;} #sub-cont .box-a .gall-box li{flex-direction:column; width:calc(100% / 3 - 22.9px); margin:0 0 22.9px 22.9px; padding:22.9px 0px; text-align:center; } #sub-cont .box-a .gall-box li.last{width:calc(100% / 2 - 22.9px); margin:0 0 22.9px 22.9px;} #sub-cont .box-a .gall-box li p{letter-spacing:-1px; line-height:1.3;} #sub-cont .box-a .gall-box .img img{width:auto; max-width:100%;} #sub-cont .box-a .wrap{padding:24.9px; padding-top:49.9px; margin-top:100px;} #sub-cont .box-a .wrap .plus{width:150px; height:150px; line-height:100.9px; top:-50px; font-size:39.9px;} #sub-cont .box-a.type2 .gall-box li{margin-bottom:39.9px; width:calc(100% / 3 - 22.9px);} } #sub-cont .box-b{} #sub-cont .box-b ul{} #sub-cont .box-b ul li{ width:100%; background:#fafafa; border:1px solid #979797; border-radius:20px; padding:20px; box-sizing:border-box;} #sub-cont .box-b ul li + li{margin-top:20px;} #sub-cont .box-b ul li .img{width:80px; margin:0 0 20px 20px;} #sub-cont .box-b ul li .txtbox{box-sizing:border-box; padding-left:20px;} @media all and (min-width:768px){ #sub-cont .box-b ul li{padding:39.9px 80px; display:flex; align-items:center; } #sub-cont .box-b ul li .txtbox{padding-left:80px;} #sub-cont .box-b ul li .img{width:150px;} } #sub-cont .box-c{} #sub-cont .box-c ul{} #sub-cont .box-c ul li{text-align:center;} #sub-cont .box-c ul li + li{margin-top:22.9px; border-top:1px solid #ddd; padding-top:22.9px;} #sub-cont .box-c ul li .box{padding:10px; background:#708fae; border-radius:20px; box-sizing:border-box;} #sub-cont .box-c ul li .arrow{transform:rotate(90deg); padding:10px 0; box-sizing:border-box;} #sub-cont .box-c ul li .arrow img{height:20px;} #sub-cont .box-c ul li .box:nth-child(3){background:#01458e;} @media all and (min-width:768px){ #sub-cont .box-c ul li{display:flex; align-items:center; } #sub-cont .box-c ul li + li{margin-top:29.9px; padding-top:0; border:0;} #sub-cont .box-c ul li .box{width:40%; min-height:129.9px; display:flex; align-items:center; justify-content:center;} #sub-cont .box-c ul li .arrow{width:20%; transform:none; padding:0;} #sub-cont .box-c ul li .arrow img{height:auto;;} } @media all and (min-width:1500px){ #sub-cont .pc-nowrap{white-space:nowrap;} } .e-button{ } .e-button>.in{max-width:1600px; margin:0 auto;} .e-button a{position:relative; display:block; background:var(--c1); color:#fff; box-sizing:border-box; padding:22.9px; border-radius:22.9px; transition:0.3s;} .e-button a:hover{background:#003064;} .e-button a h2{font-size:16.9px;} .e-button a p{font-size:15px;} .e-button a i{position:absolute; top:50%; right:22.9px; transform:translateY(-50%); font-size:16.9px; width:22.9px; height:22.9px; text-align:center; line-height:22.9px; color:#fff; background:#F24000; border-radius:50%;} .e-button.color-2 a{background:#30B0E3;} .e-button.color-2 a:hover{background:var(--c1);} .e-button.color-2 a i{background:var(--c1);} .e-button.color-3 a{background:#0b808a;} .e-button.color-3 a:hover{background:var(--c1);} .e-button.color-3 a i{background:#f47121;} .e-button.gradient-bg{} .e-button.gradient-bg a{background: #F39702; background: linear-gradient(90deg, rgba(243, 151, 2, 1) 0%, rgba(255, 188, 109, 0.8) 50%, rgba(255, 148, 80, 1) 100%); transition:0.3s;} .e-button.gradient-bg a i{background:#fff; color:#F39702;} .e-button.gradient-bg a:hover{background: #F39702; background: linear-gradient(90deg, rgba(243, 151, 2, 1) 0%, rgba(255, 188, 109, 0.8) 50%, rgba(255, 148, 80, 1) 100%); opacity:0.7;} @media all and (min-width:768px){ .e-button{ } .e-button a{padding:39.9px;} .e-button a h2{font-size:24.9px;} .e-button a p{font-size:23.9px} .e-button a i{width:70px; height:70px; line-height:70px;} } .faq .tbl_head01 td .cons{font-weight:400; width:22.9px; height:22.9px; text-align:center; line-height:22.9px; border-radius:50%; font-size:15px; background:var(--c1); color:#fff;} .faq .tbl_head01 td .cons.a{background:#F29600;} .faq .bo_tit{cursor:pointer;} .faq #bo_list tbody td{ height:auto;} .faq #bo_list tbody tr.content{ display:none;} .faq #bo_list tbody tr.content .cont{white-space:pre-line; } .faq #bo_list tbody tr.on .td_datetime{} .faq #bo_list tbody tr .td_datetime i{transition: 0.2s;} .faq #bo_list tbody tr.on .td_datetime i{transform:rotate(180deg);} @media all and (min-width:768px){ .faq .tbl_head01 td .cons{width:39.9px; height:39.9px; line-height:39.9px; font-size:19.9px; margin-right:49.9px;} .faq #bo_list tbody td{ padding-top:20px; padding-bottom:20px;} } body #bo_list .bo_tit .fa-lock{background:transparent; color:#111; border:0; font-size:15px; width:22.9px;} body #bo_list .cnt_cmt{background:transparent; font-size:13px;} @media all and (min-width:768px){ body #bo_list .bo_tit .fa-lock{font-size:19.9px;} body #bo_list .cnt_cmt{font-size:15px; position:relative; top:-2px;} } .write-box{margin-top:39.9px; border-top:2px solid #222;} .write-box li{border-bottom:1px solid #ccc; box-sizing:border-box;} .write-box li h2{font-size:15px;;} .write-box li>div{} .write-box .opt{} .write-box .opt ul{} .write-box .opt ul li{padding:10px 0;} .write-box .opt ul li input{width:100%;} @media all and (min-width:768px){ .write-box{margin-top:100px;} .write-box li{display:flex; width:100%; padding:15px 0 15px 22.9px; align-items:center; } .write-box li h2{font-size:15.9px; width:139.9px;} .write-box li>div{width:calc(100% - 139.9px)} .write-box .full_input{height:50px;} .write-box .opt ul{display:flex; flex-wrap:wrap;} .write-box .opt ul li{width:50%; padding:15px 0 15px 22.9px;} .write-box .opt ul li input{width:80%;} .write-box .opt ul li select{width:91% !important;} .write-box .attatch ul{display:flex; flex-wrap:wrap;} .write-box .attatch ul li{width:50%;} } #sub-cont .bo_sch_wrap{display:flex; margin-top:20px; position:static; top:0; lefT:0; width:100%; height:auto;} #sub-cont .bo_sch_bg{display:none;} #sub-cont .wrap{margin-left:auto;} #sub-cont .bo_sch_wrap input[type="text"]{height:22.9px; } #sub-cont .bo_sch_wrap button{height:22.9px; } @media all and (min-width:768px){ #sub-cont .bo_sch_wrap{margin-top:39.9px;} #sub-cont .bo_sch_wrap input[type="text"]{height:39.9px; width:350px; font-size:15px;} #sub-cont .bo_sch_wrap button{height:39.9px; width:100px; font-size:14.9px;} } #sub-cont[board-name="공지사항"] .bo_tit i, #sub-cont[board-name="공지사항"] .bo_tit span{display:none;} #mb_login{} #mb_login.member_login{border-radius:20px; box-shadow:0 5px 10px rgba(0,0,0,0.2); box-sizing:border-box; overflow:hidden;} #mb_login.member_login .img{display:none;} #mb_login.member_login .option{margin:10px 0;} #mb_login.member_login .option ol{} #mb_login.member_login .option ol li{color:#666; font-size:14px; vertical-align:middle;} #mb_login.member_login .option ol li a{color:#666;} #mb_login.member_login .option ol li + li{margin-left:20px;} #mb_login.member_login .option ol + ol{margin-top:10px;} #mb_login.member_login .option ol li + li:after{left:-10px;} #mb_login.member_login .option label{cursor:pointer;} #mb_login.member_login .snslogArea .buttonArea{display:flex; justify-content:center; padding:0;} #mb_login.member_login .snslogArea .buttonArea button{margin:0 5px; padding:0; width:29.9px; height:29.9px; display:flex; justify-content:center; align-items:center; border-radius:50%;} #mb_login.member_login .snslogArea .buttonArea button + button{} #mb_login.member_login .snslogArea .buttonArea button span{} #mb_login.member_login .snslogArea .buttonArea button span img{width:20px; vertical-align:middle;} #mb_login.member_login .snslogArea .buttonArea button.naver{background:#03c75a;} #mb_login.member_login .snslogArea .buttonArea button.naver:hover{background:#06b152;} #mb_login.member_login .snslogArea .buttonArea button.kakao{background:#fee500; color:#000; } #mb_login.member_login .snslogArea .buttonArea button.kakao:hover{background:#e3ce0f;} #mb_login.member_login .snslogArea .buttonArea button.google{} #mb_login.member_login .txt{color:#666; margin-top:22.9px;} #mb_login.member_login .txt a{display:inline-block; margin-left:10px; color:#000;} #mb_login.member_login .login-img-bg{display:none;} #mb_login.member_login .memberArea.join-form form{box-sizing:border-box; padding:20px; width:100%;} @media all and (min-width:768px){ #mb_login.member_login{display:flex;} #mb_login.member_login .memberArea.join-form{width:45%; display:flex; align-items:center;} #mb_login.member_login .memberArea.join-form form{box-sizing:border-box; padding:39.9px;} #mb_login.member_login .img{display:block; width:55%; } #mb_login.member_login .img img{width:100%; height:100%; object-fit:cover; object-position: center;} #mb_login.member_login .option{margin:10px 0 39.9px 0; display:flex; justify-content:space-between;} #mb_login.member_login .option ol{width:auto;} #mb_login.member_login .option ol + ol{margin-top:0;} #mb_login.member_login .option ol:nth-child(1) li + li{margin-left:10px;} #mb_login.member_login .snslogArea .buttonArea button{height:52px; width:52px; margin:0 10px;} #mb_login.member_login .snslogArea .buttonArea button span img{width:24px} #mb_login.member_login .txt{font-size:16px; margin-top:39.9px;} } @media all and (min-width:1100px){ #mb_login.member_login{ } #mb_login.member_login .memberArea>.in{} #mb_login.member_login .login-img-bg{display:block; position:absolute; top:0; right:0; width:50%; height:100%;} #mb_login.member_login .login-img-bg img{width:100%; height:100%; object-fit:cover; object-position:top left;} } .register{} #register_form h2{border:0; padding:10px 0;} #register_form{} #register_form .mobile select, #register_form .mobile input{width:100%;} #register_form .mobile select, #register_form input[type="text"], #register_form input[type="password"]{background:transparent; border:0; border:1px solid #ddd; border-radius:5px; padding-left:20px; background-image:none !important;} #register_form ul{} #register_form ul li{position:relative;} #register_form ul li:not(.chk_box) label{display:block; } #register_form ul li:not(.chk_box) label i{display:none;} #register_form ul li:not(.chk_box) label .rq{color:#fab420;} #register_form div.check{position:absolute; top:50%; right:10px; transform:translateY(-50%); max-width:90px;} #register_form input[readonly]{background:#f4f4f4;} #register_form .certify_buttons{display:flex;} #register_form .certify_buttons button{min-height:40px; max-width:calc(100% / 3 - 20px);} #register_form .certify_buttons button + button{margin-left:20px;} @media all and (min-width:768px){ #register_form .mobile select, #register_form input[type="text"], #register_form input[type="password"]{height:50px; font-size:14.9px;} #register_form ul li:not(.chk_box){ padding-left:180px; margin-bottom:12.9px;} #register_form ul li:not(.chk_box) label{position:absolute; top:15px; left:0; font-size:15.9px;} #register_form div.check{max-width:139.9px;} } #sub-cont.sub-mypage{} #sub-cont.sub-mypage .box{box-shadow:5px 5px 15px rgba(0,0,0,0.1); border-radius:10px; box-sizing:border-box; padding:20px;} #sub-cont.sub-mypage .box + .box{margin-top:20px;} #sub-cont.sub-mypage .box1{text-align:center;} #sub-cont.sub-mypage .box1 .profile{} #sub-cont.sub-mypage .box1 .img{margin-bottom:10px;} #sub-cont.sub-mypage .box1 .img img{max-width:100px;} #sub-cont.sub-mypage .box1 p{margin-bottom:22.9px;} #sub-cont.sub-mypage .box1 .buttonArea{display:flex; max-width:400px; margin:0 auto; justify-content:center;} #sub-cont.sub-mypage .box1 a{width:100%; box-shadow:5px 5px 10px rgba(0,0,0,0.1); line-height:22.9px; color:var(--c1); border-radius:5px; transition:0.3s;} #sub-cont.sub-mypage .box1 a:nth-child(2){color:#999; margin-left:10px;} #sub-cont.sub-mypage .box1 a:hover{background:#f4f4f4; } #sub-cont.sub-mypage h2{font-size:15px; margin-bottom:20px;} #sub-cont.sub-mypage .box{} #sub-cont.sub-mypage .box table{text-align:left;} #sub-cont.sub-mypage .box table tr{} #sub-cont.sub-mypage .box table tr + tr{border-top:1px dashed #ccc;} #sub-cont.sub-mypage .box table th{width:30%; padding:10px 0; color:var(--c1); font-weight:normal;} #sub-cont.sub-mypage .box table td{ width:70%; padding:10px 0; } #sub-cont.sub-mypage .box table a{color:#ccc; transition:0.3s;} #sub-cont.sub-mypage .box table a:hover{color:#888;} @media all and (min-width:768px){ #sub-cont.sub-mypage .box{padding:39.9px; border-radius:20px; box-shadow:0 5px 20px rgba(0,0,0,0.2);} #sub-cont.sub-mypage .box + .box{margin-top:70px;} #sub-cont.sub-mypage .box1 .img img{max-width:100%;} #sub-cont.sub-mypage .box1 p{font-size:27px;} #sub-cont.sub-mypage .box1 a{width:200px; line-height:52px; font-size:16.9px;} #sub-cont.sub-mypage h2{font-size:27px; margin-bottom:39.9px;} #sub-cont.sub-mypage .box table th{font-size:19.9px; padding:20px 0; } #sub-cont.sub-mypage .box table td{font-size:19.9px; padding:20px 0; } } #sub-cont.max-w{max-width:1000px; margin-left:auto; margin-right:auto;} .paper-area{box-sizing:border-box; padding:0 15px;} .paper-area>.in{max-width:1000px; margin:0 auto; padding:100px 0;} .paper-area header{margin-bottom:39.9px; padding-bottom:39.9px; border-bottom:2px solid #333; } .paper-area header h2{font-size:15px; margin-bottom:10px;} .paper-area header p{font-size:14px;} .paper-area article{} .paper-area article + article{margin-top:22.9px; border-top:1px solid #eee; padding-top:22.9px;} .paper-area article h2{font-size:13px; margin-bottom:10px;} .paper-area article p{font-size:12px;} @media all and (min-width:768px){ .paper-area header{} .paper-area header h2{font-size:22.9px; margin-bottom:20px;} .paper-area header p{font-size:16.9px;} .paper-area article{} .paper-area article + article{margin-top:39.9px; padding-top:39.9px; } .paper-area article h2{font-size:16.9px; margin-bottom:15px;} .paper-area article p{font-size:17px;} } /* contact */ /* .JS-form_mail{ } .JS-form_mail>.in{position:relative; padding:0; max-width:600px; } .JS-form_mail .input-box{margin-bottom:10px;} .JS-form_mail h3{ font-size:14px; line-height:22.9px; font-weight:500;} .JS-form_mail h3 span{font-weight:normal; font-size:12px; display:inline-block; margin-left:10px;} .JS-form_mail input.input{border:1px solid #ddd; width:100%; height:34px; line-height:34px; padding:10px;} .JS-form_mail input.input:focus{border-color:#111;} .JS-form_mail input.send-this{display:block; border:0; width:100%; margin:20px 0 0 0; line-height:29.9px; cursor:pointer;} .JS-form_mail input[type="number"]::-webkit-outer-spin-button, .JS-form_mail input[type="number"]::-webkit-inner-spin-button {-webkit-appearance:none; margin:0;} .JS-form_mail textarea{min-height:39.9px; max-height:300px; width:100%; padding:10px;} .JS-form_mail .infoArea{margin-top:22.9px; max-width:700px; margin:22.9px auto; } .JS-form_mail .infoArea h2{font-size:15px;} .JS-form_mail .infoArea .box{overflow-y:auto; max-height:80px; font-size:13px; background:#f4f4f4; margin-bottom:20px; padding:10px; border:1px solid #ddd;} @media all and (min-width:768px){ .JS-form_mail .input-box{margin-bottom:15px;} .JS-form_mail h3{font-size:17px;} .JS-form_mail h3 span{font-size:15px; margin-left:15px;} .JS-form_mail input.send-this{width:50%;} } */ /* contact */ .JS-form_mail{max-width:1600px; margin:0 auto;} .JS-form_mail>.in{position:relative; padding:0; } .JS-form_mail .input-box{margin-bottom:10px; } .JS-form_mail .input-box .mail{display:flex; align-items:center;} .JS-form_mail .input-box .mail * + *{margin-left:10px;} .JS-form_mail h3{margin-bottom:5px; font-size:14px; line-height:22.9px; font-weight:500;} .JS-form_mail h3 span{font-weight:normal; font-size:12px; display:inline-block; margin-right:10px; color:var(--c1);} .JS-form_mail select, .JS-form_mail input.input{border:1px solid #ddd; width:100%; height:34px; line-height:34px; padding:10px; border-radius:10px;} .JS-form_mail select{padding-top:0; padding-bottom:0;} .JS-form_mail input.input:focus{border-color:#111;} .JS-form_mail input.send-this{display:block; border:0; width:100%; margin:20px 0 0 0; line-height:29.9px; cursor:pointer; background:var(--c1);} .JS-form_mail input[type="number"]::-webkit-outer-spin-button, .JS-form_mail input[type="number"]::-webkit-inner-spin-button {-webkit-appearance:none; margin:0;} .JS-form_mail textarea{min-height:39.9px; min-height:200px; max-height:470px; width:100%; padding:10px; border-radius:10px;} .JS-form_mail .infoArea{margin-top:22.9px; margin:22.9px auto; } .JS-form_mail .infoArea h2{font-size:15px;} .JS-form_mail .infoArea .box{overflow-y:auto; max-height:190px; font-size:13px; background:#e1e4e9; border-radius:15px; margin-bottom:20px; padding:15px; } .JS-form_mail .attatch .input-1, .JS-form_mail .attatch input:not([type="checkbox"]){position:relative; font-size:14px; width:100%; height:32px; margin:0 0 0 0; border:0; background:#fff; padding:0 10px; border-radius:5px;} .JS-form_mail .attatch textarea{font-size:14px; width:100%; min-height:100px; max-height:400px; margin:0 0 5px 0; border:0; background:#fff; padding:10px;} .JS-form_mail .attatch .ec-base-button{margin-top:20px;} .JS-form_mail .attatch button[class*="btn"]{padding:5px 20px; border-radius:5px;} .JS-form_mail .attatch input.btnSubmit{background:var(--c1); width:100%; margin:0 auto; margin-top:22.9px; cursor:pointer;} .JS-form_mail .attatch input[type="file"]{position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; cursor:pointer; z-index:12;} .JS-form_mail .attatch .input-1{padding-left:0; display:flex; justify-content:space-between;} .JS-form_mail .attatch .input-1 span{display:inline-block; overflow:hidden; text-overflow:ellipsis; width:80%; border:1px solid #ccc; background:#eee; padding:0 10px; border-radius:10px; height:34px; line-height:34px; color:#999;} .JS-form_mail .attatch .input-1 .attatch-btn{display:flex; justify-content:space-between; align-items:center; margin-left:20px; border:1px solid #ccc; width:20%; border-radius:10px; height:34px; line-height:34px; padding:0 10px;} .JS-form_mail .address{} .JS-form_mail .address div{display:flex; margin-bottom:10px;} .JS-form_mail .address input{} .JS-form_mail .address button{margin-left:20px; display:inline-block; width:20%; border:1px solid #ccc; padding:0 10px; border-radius:10px; height:34px; line-height:34px; color:#999;} .JS-form_mail p{} .JS-form_mail.top-select{margin-bottom:30px; padding-bottom:30px; border-bottom:1px solid #ddd;} .JS-form_mail.top-select .input-box{margin:0;} .JS-form_mail .top.r{text-align:right; margin:30px 0; padding:30px 0; border-bottom:1px solid #ddd;} .JS-form_mail .top.r span{font-weight:normal; font-size:12px; display:inline-block; margin-right:10px; color:var(--c1);} @media all and (max-width:767px){ .JS-form_mail .attatch .input-1 span{font-size:12px;} .JS-form_mail .attatch .input-1 .attatch-btn{width:21%; font-size: 12px; padding:0 5px; margin-left:5px;} } @media all and (min-width:768px){ .JS-form_mail.top-select{margin-bottom:60px; padding-bottom:60px;} .JS-form_mail .top.r{margin-bottom:30px;} .JS-form_mail .top.r span{font-size:20px; margin-right:15px;} .JS-form_mail{max-width:1000px; margin:0 auto;} .JS-form_mail>.in{display:flex; justify-content:space-between; flex-wrap:wrap;} .JS-form_mail .left{width:48%;} .JS-form_mail .right{width:48%;} .JS-form_mail .all{width:100%;} .JS-form_mail .input-box{margin-bottom:30px; } .JS-form_mail .input-box.contact{ } .JS-form_mail h3{font-size:20px; margin-bottom:10px;} .JS-form_mail h3 span{font-size:17px; margin-right:15px;} .JS-form_mail input.send-this{ margin-top:60px; font-size:17px; line-height:50px; max-width:350px;} .JS-form_mail select, .JS-form_mail input.input{ height:55px; font-size:17px; padding:15px;} .JS-form_mail .input-box.text{width:100%;} .JS-form_mail textarea{ padding:15px; font-size:17px; min-height:400px;} .JS-form_mail .infoArea .box{font-size:13px;} .JS-form_mail .attatch .input-1, .JS-form_mail .attatch input:not([type="checkbox"]){height:55px; font-size:14.9px;} .JS-form_mail .attatch textarea{font-size:16.9px;} .JS-form_mail .attatch .input-1 span{height:55px; font-size:17px; padding:0 15px; line-height:55px;} .JS-form_mail .attatch .input-1 .attatch-btn{height:55px; font-size:17px; padding:0 30px; line-height:55px;} .JS-form_mail .address{} .JS-form_mail .address div{width:60%;} .JS-form_mail .address input{} .JS-form_mail .address button{height:55px; font-size:17px; padding:0 30px; line-height:55px; width:30%;} .JS-form_mail p{font-size:20px; margin-top:50px;} } #find_info .new_win_con{max-width:700px; margin:50px auto; border-radius:20px; box-sizing:border-box;} @media all and (min-width:768px){ #find_info .new_win_con{padding:50px 25px; margin:150px auto;} } #contents>.register{max-width:600px; margin:22.9px auto;} #contents #fregister p{background:#333; font-weight:normal;} #contents #fregister p:before{display:none;} #contents .register .btn_confirm{} #contents .register .btn_confirm a, #contents .register .btn_confirm button{box-sizing:border-box;} #sub-cont.sub-pop{display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:1111;} #sub-cont.sub-pop .bg{position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:10;} #sub-cont.sub-pop>.in{max-width:1300px; position:absolute; top:50%; left:50%; box-sizing:border-box; padding:15px; transform:translate(-50%, -50%); width:90%; border-radius:10px; height:auto; background:#fff; z-index:11;} #sub-cont.sub-pop .sub-contact{overflow-y:auto; max-height:calc(90vh - 100px); } #sub-cont.sub-pop .close{position:absolute; top:10px; right:10px; z-index:11; cursor:pointer;} #sub-cont.sub-pop .close i{font-size:20px;} #sub-cont.sub-pop .title{margin-bottom:30px;} #sub-cont.sub-pop .title h2{margin-bottom:5px;} #sub-cont.sub-pop .title h2 input{font-size:17px; font-weight:bold; padding:0; background:transparent; border:0; } #sub-cont.sub-pop .title h3{font-size:14px; } #sub-cont.sub-pop .JS-form_mail select, #sub-cont.sub-pop .JS-form_mail input.input, #sub-cont.sub-pop .JS-form_mail textarea{border:0; background:#f6f6f6; border-radius:10px;} #sub-cont.sub-pop .JS-form_mail input.send-this{max-width:100%;} @media all and (min-width:768px){ #sub-cont.sub-pop>.in{padding:100px 30px 100px 50px; border-radius:50px;} #sub-cont.sub-pop .sub-contact{ max-height:calc(90vh - 200px); padding-right:20px; box-sizing:border-box;} #sub-cont.sub-pop .close{top:30px; right:30px;} #sub-cont.sub-pop .close i{font-size:40px;} #sub-cont.sub-pop .title{margin-bottom:50px;} #sub-cont.sub-pop .title h2{margin-bottom:15px;} #sub-cont.sub-pop .title h2 input{font-size:25px; } #sub-cont.sub-pop .title h3{font-size:17px;} } /**/