/* 사용자 customer CSS */
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

body {background:#fff; margin:0; padding:0; font-family: 'Noto Sans KR', sans-serif}
ul, ol, li {margin:0;}
ol, ul {list-style: none;}
a { color:#48688F; font-size:14px;}
a:link, a:visited {text-decoration:none;}
a:hover {text-decoration:none;}
a:active {color:#ff3300;}
table {	border-collapse:collapse;	border-spacing:0;}
.cf:after {content:''; display:block; clear:both}
.cf {*zoom:1}
.inner {position: relative; width:1400px; margin:0 auto;}
.boards-inner {position:relative; width:1400px; margin:0px auto 120px;}
.tc {text-align: center}
.tr {text-align: right}
.tl {text-align: left}
.fl {float:left;}
.fr {float:right;}
.blind {	overflow: hidden;	position: absolute;	top: 0;	left: 0;	width: 0;	height: 0;	font-size: 0;	line-height: 0;}
.hidden {visibility: hidden;	line-height: 0;	font-size: 0;	width: 0;	height: 0;}
.btn-circle {font-family: Arial; display: block; height: 30px; width: 30px; line-height: 30px; -moz-border-radius: 30px; border-radius: 30px; background-color: #201c1d; text-align: center; font-size:20px;}
.point-color {color:#f42f00}
.underline {text-decoration: underline;}
.bold {font-weight:bold;}
.txtover {text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;}
.trans-2 {-webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out;}
.trans-3 {-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
.w100 {width:100%!important;}
.m0 {margin:0!important;}
.p0 {padding:0!important;}
b.point {color:#ee3223;}
a.link-more {display: inline-block; position: absolute; right:0px; top:0px; color:#fff; background:#313131; font-weight: normal; padding:5px 15px;}
a.link-more:hover {background:#ee3223;}
a.bus-time {display: inline-block; padding:0px 15px; color:#fff; background:#E42D18;}

/*btn-hover motion*/
a.link-st1 {position: relative; display: inline-block; height:40px; min-width:180px; background:#000; color:#fff; font-size:16px;}
a.link-st1:hover {background:#00436a; color:#fff;}
a.link-st1 .link-txt1 {display: inline-block; position: absolute; width:180px; text-align: center; top:8px; left:50%;  transform:translateX(-50%);}
a.link-st1:hover .link-txt1 {margin-left:-9px;}
a.link-st1 i {position: absolute; top:13px; right:25px; opacity: 0; font-size:14px;}
a.link-st1:hover i{ opacity: 1; margin-right:-9px;}

a.link-st2 {position: relative; display: inline-block; height:32px; min-width:120px; background:#000; color:#fff; font-size:14px; font-weight: 300}
a.link-st2:hover {background:#00436a; color:#fff;}
a.link-st2 .link-txt2 {display: inline-block; position: absolute; width:120px; text-align: center; top:6px; left:50%;  transform:translateX(-50%);}
a.link-st2:hover .link-txt2 {margin-left:-9px;}
a.link-st2 i {position: absolute; top:9px; right:25px; opacity: 0; font-size:14px;}
a.link-st2:hover i{ opacity: 1; margin-right:-9px;}

.trans-1 {-webkit-transition: all 0.1s ease-out; -moz-transition: all 0.1s ease-out; -o-transition: all 0.1s ease-out; transition: all 0.1s ease-out;}
.trans-2 {-webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out;}
.trans-3 {-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
.trans-4 {-webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out; transition: all 0.4s ease-out;}
.trans-5 {-webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
.trans-6 {-webkit-transition: all 0.6s ease-out; -moz-transition: all 0.6s ease-out; -o-transition: all 0.6s ease-out; transition: all 0.6s ease-out;}
.trans-7 {-webkit-transition: all 0.7s ease-out; -moz-transition: all 0.7s ease-out; -o-transition: all 0.7s ease-out; transition: all 0.7s ease-out;}
.trans-8 {-webkit-transition: all 0.8s ease-out; -moz-transition: all 0.8s ease-out; -o-transition: all 0.8s ease-out; transition: all 0.8s ease-out;}

.img-full {}
.row {width:50%;}
.radius {border-radius: 20px;}
.inner {margin:0 auto; width: 1200px; box-sizing: border-box}
ul {padding-left:0}








.burger-btn {float:left; width:32px; cursor: pointer; padding:32px 18px 25px 15px; background:#fff; display: none}
.burger-btn .line-1 {width:100%; height:2px; background:#000; margin-bottom:8px;}
.burger-btn .line-1.line-point {width:100%;}
.burger-btn .line-1.line-point2 {width:100%;}
.burger-btn .line-1:last-child {margin-bottom:0px;}

.mobile-call {display: none; position: absolute; z-index: 2; right:15px; top:16px; font-size: 34px; color:#313131}



header {height:160px; position: relative}
header .top-logo {width:277px; margin:0 auto; padding:35px 0;}
header .top-call {position: absolute; right:0; bottom:25px;}
nav {border-top:solid 1px #d4bfb2; background:#fcf9f5; text-align: center; height:68px}
nav .nav-menu {display: inline-block; padding-left:0}
nav .nav-menu li {float: left; position: relative}
nav .nav-menu li .nav-gubun {background:#d4bfb2; display: inline-block; width:1px; height:20px; position: absolute; right:0; top:22px}
nav .nav-menu li a {display: inline-block; padding:18px 40px; font-size: 22px; letter-spacing: -0.5px; color:#2f2f2f; font-weight: 500}
.visual {position: relative}
.visual .visual-in {height:220px; width:100%; background:#ede7e0}
.visual .visual-titbox {background:#702a00; width:600px; height:280px; position: absolute; top:80px; transform:translateX(-50%); left:50%; padding-top:80px; box-sizing: border-box}
.visual .tit {width:90%; margin:0 auto; text-align: center; color:#fff}
.visual .tit .eng {width:90%; margin:0 auto; font-weight: 200; font-size: 26px; display: block}
.visual .tit .eng .bold {font-weight: 700}
.visual .tit .tit-txt {font-size: 29px; letter-spacing: -1px; font-weight: 700; margin:15px 0 0 0}


.art-tit {font-size:46px; font-weight: 700; letter-spacing: -2px; padding-bottom:30px; text-align: center; color:#702a00}
.art-cmt {font-size:26px; font-weight: 200; letter-spacing: -0.5px; text-align: center}
.art-add {font-size:22px; font-weight: 400; text-align: center; margin-bottom:40px; padding-top:20px}

.case {padding-top:230px;}
.case .proc-box {padding-top:80px}
.case .proc-box .people {width:800px; margin:0 auto; position: relative}
.case .proc-box .people img {width:100%}
.case .proc-box .case-box {position: absolute; top:-515px; left:50%; transform: translateX(-50%); height:480px; width:424px;  overflow-y:auto; margin-left:10px }

.case .proc-box .people > .case-btn {position: absolute; top:0px; left:50%; transform: translateX(-50%); min-width:150px; background:#702a00; color:#fff; border:solid 2px #471b00; text-align: center; padding:2px 0 4px 0; font-size:17px; font-weight: 500; letter-spacing: -0.5px}
.case .proc-box .people > .case-btn:hover {background:#471b00}
.case .proc-box .people > .case-btn.active {background:#471b00}


.case .proc-box .people > .case-01 {top:123px; margin-left:-325px;}
.case .proc-box .people > .case-02 {top:166px; margin-left:-395px;}
.case .proc-box .people > .case-03 {top:236px; margin-left:-390px;}
.case .proc-box .people > .case-04 {top:306px; margin-left:-355px;}
.case .proc-box .people > .case-05 {top:232px; margin-left:-40px;}
.case .proc-box .people > .case-06 {top:170px; margin-left:70px;}
.case .proc-box .people > .case-07 {top:353px; margin-left:104px;}
.case .proc-box .people > .case-08 {top:143px; margin-left:370px;}
.case .proc-box .people > .case-09 {top:205px; margin-left:344px;}
.case .proc-box .people > .case-10 {top:400px; margin-left:350px;}
.case .proc-box .people > .case-11 {top:660px; margin-left:344px;}
.case .proc-box .people > .case-12 {top:440px; margin-left:350px;}
.case .proc-box .people > .case-13 {top:245px; margin-left:344px;}
.case .proc-box .people > .case-14 {top:166px; margin-left:-555px;}
.case .proc-box .people > .case-15 {top:110px; margin-left:90px;}
.case .proc-box .people > .case-16 {top:100px; margin-left:370px;}



.mobile-btn {display: none; padding:10px 10px}
.mobile-btn .st-1 li {width:100%; padding:1px; box-sizing: border-box}
.mobile-btn .st-1 li:last-child {width:100%}
.mobile-btn .st-2 {}
.mobile-btn .st-2 li {width:50%; padding:1px; box-sizing: border-box}
.mobile-btn .st-1 li, .mobile-btn .st-2 li , .mobile-btn .st-3 li {float: left}
.mobile-btn .st-1 li a, .mobile-btn .st-2 li a, .mobile-btn .st-3 li a {display: inline-block; padding:10px 0; text-align: center; width:100%; box-sizing: border-box; background:#712A02; color:#fff; font-size: 13px; letter-spacing: -0.5px}
.mobile-btn .st-3 li {width:33.33%; padding:1px; box-sizing: border-box}
.mobile-btn .st-3 li:last-child {width:33.34%}


.case-contents {padding-bottom:50px; padding-right:20px; padding-left:10px}
.case-contents .title {position: relative; border-bottom:solid 1px #000; height:55px; margin-bottom:10px}
.case-contents .title p {font-size:28px; color:#e2893a; font-weight: 600}
.case-contents .title .number {display: inline-block; position: absolute; right:10px; top:-20px; color:#000; font-weight: 500; font-size:20px;}
.case-contents .title .star {display: inline-block; position: absolute; right:10px; top:10px;}


.case-contents .case-con {font-size:17px; color:#666; font-weight: 300; line-height: 170%}
.case-contents .case-con .cmt {color:#000; font-size:20px; font-weight: 500; padding:15px 0 10px 0}
.case-contents .case-con .img-box {width:380px; padding:20px 0; text-align: center; margin:0 auto; clear: both}
.case-contents .case-con .img-box img {width:90%}






.check-point {padding:100px 0; background:#f2efec; margin-top:100px}
.check-point .icon-point {margin-top:50px}
.check-point .icon-point li {padding:20px 20px 0px 20px; width:20%; box-sizing: border-box; float: left; text-align: center}
.check-point .icon-point li img {}



.customer {padding:100px 0; }

.channel li {float: left; width:33.33%; padding:15px; box-sizing: border-box; position: relative}
.channel li.join-2 {width:66.66%; padding:15px; box-sizing: border-box;}
.channel.type-2 li div.sec {width:100%; height:450px}

.channel li div.sec {width:100%; background:yellow; height:350px}
.channel li div.map {width:100%}
.channel li div.address {background:#2f2f2f}
.channel li div.kakao {background:#fee330}
.channel li div.blog {background:#349b26}
.channel li div.call {background:#ececec}

.channel .sec-tit {color:#000; padding:40px 30px}
.channel .sec-tit.white {color:#fff}
.channel .sec-tit .line {width:28px; height:5px; background:#000; display: inline-block; margin-bottom:5px;}
.channel .sec-tit .tit {font-size:36px; font-weight: 600; margin-bottom:30px}
.channel .sec-tit .msg {font-size:24px; font-weight: 200; line-height: 150%}


.channel .proc {position: absolute; bottom:40px; right:50px; font-size: 40px; font-weight: 700; letter-spacing: -1px}


article {}

section {}

footer {text-align: center}
footer .foot-menu-box {border-top:solid 2px #2f2f2f; border-bottom:solid 1px #999; height:70px;}
footer .foot-menu-box .foot-menu {display: inline-block}
footer .foot-menu-box .foot-menu li {float: left}
footer .foot-menu-box .foot-menu li a {display: inline-block; padding:18px 40px; font-size: 20px; color:#2f2f2f; letter-spacing: -0.5px}

footer .biz-info {font-size: 18px; line-height: 180%; padding:50px 0 30px 0; color:#666}
footer .copyright {font-size: 14px;}


.quick-box {position: fixed; z-index:21;  top:167px; left:50%; margin-left:650px; width:140px; height:536px; background:url("../img/quick_bg.png") no-repeat}
.quick-box-in {position: relative;}
.quick-box-in .quick-top {position: absolute; bottom:-595px; left:38px;}
.quick-box .quick-menu {position: absolute; top:75px; left:34px;}
ß.quick-box .quick-menu li {padding:20px 0; position: relative;}
.quick-box .quick-menu li a {opacity: 0.7; display: block; text-align: center; color:#444}
.quick-box .quick-menu li a span {display: block; font-size:16px; font-weight: 400; padding-top:7px}
.quick-box .quick-menu li a:hover {opacity: 1}
.quick-box .btn-top {display: inline-block; width:70px; height:70px; position: absolute; z-index: 2; bottom:0; left:35px;}





@media (max-width:1200px) {
    .idx-check-point .check-item li img {width:100%;}
    .inner {width:100%; padding:0 15px}
    .art-tit {padding-right:20px; padding-left:20px}
    .art-cmt {padding-right:20px; padding-left:20px}
    .art-add {padding-right:20px; padding-left:20px}
}

@media (max-width:1024px) {
    .idx-check-point .check-item li img {width:100%;}
    .check-point .icon-point {display: inline-block; width:100%}
    .check-point .icon-point li {width:33.33%; padding:6px;}
    .check-point .icon-point li img {width:100%}

    .art-tit {font-size: 45px}
    .art-cmt {font-size: 24px}
    .art-add {font-size: 18px}

    .channel li {width:100%; padding:0}
    .channel li div.sec {width:100%; height:280px}
    .channel.type-2 li div.sec {width:100%; height:280px}
    .channel li.join-2 {width:100%; height:450px; padding:0}
    .channel.type-2 li div.sec.map {width:100%; height:450px;}
    .quick-bo, .case .proc-box .people {display: none}


    .mobile-btn {display: block}
    .case .proc-box .case-box {position: initial; height:480px; width:100%;  overflow-y:auto; transform:initial; border:solid 4px #712A02; margin-left:-3px}
    .case-contents .case-con .img-box {width:100%; padding:20px 0; text-align: center; margin:0 auto; display:block}

	.img-box {display:none}

}

@media (max-width:768px) {
    .idx-check-point .row {width:100%; padding:0 10px;}
    header {height:85px}
    header .top-call {display: none}
    header .top-logo {width:170px; padding:15px 0}
    header .top-logo img {width:100%}

    .case {padding-top:50px;}
    .case .proc-box {padding-top: 20px;}

}

@media (max-width:767px) {

    .burger-btn {display: inline-block}
    .mobile-call {display: inline-block}

    .channel li {padding:7px 0}
    .channel li.address {padding-top:0}
    .channel li div.sec {width:100%; height:260px}

    .channel.type-2 li div.sec {width:100%; height:200px}
    .channel.type-2 li div.sec.address {width:100%; height:240px}

    .channel .sec-tit .line {width:20px;}
    .channel .sec-tit .tit {font-size:32px; margin-bottom:20px}
    .channel .sec-tit .msg {font-size:20px;}
    .channel .proc {font-size:30px}

    nav {height:62px}
    nav .nav-menu {width:100%}
    nav .nav-menu li {width:33.33%}
    nav .nav-menu li a {font-size: 17px; padding-right:0; padding-left:0; letter-spacing: -0.5px}
    nav .nav-menu li .nav-gubun {display: none}

    .visual, .visual .visual-in {height: 170px;}
    .visual .visual-titbox {top:0; width:100%; height:170px; padding-top:40px; }
    /*.visual .tit {width:200px;}*/
    .visual .tit .eng {width:90%; margin:0 auto; font-weight: 200; font-size: 22px; display: block; letter-spacing: -0.5px}
    .visual .tit .eng .bold {font-weight: 700}
    .visual .tit .tit-txt {font-size: 28px; margin:10px 0 0 0}
    .visual .tit img {width:100%}

    .customer {padding-bottom:10px}
    footer .biz-info {padding-left:0; padding-right:0;}
    footer .foot-menu-box {height:62px}
    footer .foot-menu-box .foot-menu {width:100%;}
    footer .foot-menu-box .foot-menu li {width:33.33%}
    footer .foot-menu-box .foot-menu li a {font-size: 17px; padding-right:0; padding-left:0; letter-spacing: -0.5px}
    footer .biz-info {font-size: 15px;}
    footer .copyright {font-size: 12px;}



}

@media (max-width:540px) {

}

@media (max-width:480px) {
    .art-tit {font-size: 28px; padding-bottom:15px}
    .art-cmt {font-size: 17px}
    .art-add {font-size: 14px}
    .check-point {padding:60px 0 40px 0}
    .check-point .icon-point {margin-top:30px}
    .customer {padding-top:55px}

    .case-contents .case-con .img-box img {width:100%}

    .visual .visual-titbox {padding-top:25px; }
}

@media (max-width:440px) {

}

@media (max-width:320px) {

}






/*
IE Hack Site
https://gist.github.com/vidaaudrey/c16774076391d09e7ec7dbb7ed7a3189
*/

/* IE10+ */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    /* Enter your style code */

}


/* IE9,10 */
@media screen and (min-width:0\0){
    #nav > .inner > ul > .nav-1st > a {padding:27px 0 20px 0;}
}




/* IE8 */
@media \0screen {
    /* Enter your style code */
}



