@charset "utf-8";

@font-face {
  font-family: 'NanumBarunGothic';
  font-style: normal;
  font-weight: 200;
  src: local('Nanum Barun Gothic UltraLight'), local('Nanum Barun Gothic-UltraLight'), local('NanumBarunGothic UltraLight');
  src: url(../font/NanumBarunGothicUltraLight.eot);
  src: url(../font/NanumBarunGothicUltraLight.eot?#iefix) format('embedded-opentype'),
       url(../font/NanumBarunGothicUltraLight.woff) format('woff'),
       url(../font/NanumBarunGothicUltraLight.ttf) format('truetype');
}

@font-face {
  font-family: 'NanumBarunGothic';
  font-style: normal;
  font-weight: 300;
  src: local('Nanum Barun Gothic Light'), local('Nanum Barun Gothic-Light'), local('NanumBarunGothic Light');
  src: url(../font/NanumBarunGothicLight.eot);
  src: url(../font/NanumBarunGothicLight.eot?#iefix) format('embedded-opentype'),
       url(../font/NanumBarunGothicLight.woff) format('woff'),
       url(../font/NanumBarunGothicLight.ttf) format('truetype');
}

@font-face {
  font-family: 'NanumBarunGothic';
  font-style: normal;
  font-weight: 400;
  src: local('Nanum Barun Gothic Regular'), local('Nanum Barun Gothic-Regular'), local('NanumBarunGothic Regular');
  src: url(../font/NanumBarunGothic.eot);
  src: url(../font/NanumBarunGothic.eot?#iefix) format('embedded-opentype'),
       url(../font/NanumBarunGothic.woff) format('woff'),
       url(../font/NanumBarunGothic.ttf) format('truetype');
}

@font-face {
  font-family: 'NanumBarunGothic';
  font-style: normal;
  font-weight: 700;
  src: local('Nanum Barun Gothic Bold'), local('Nanum Barun Gothic-Bold'), local('NanumBarunGothic Bold');
  src: url(../font/NanumBarunGothicBold.eot);
  src: url(../font/NanumBarunGothicBold.eot?#iefix) format('embedded-opentype'),
       url(../font/NanumBarunGothicBold.woff) format('woff'),
       url(../font/NanumBarunGothicBold.ttf) format('truetype');
}


/* Common */
* { -webkit-text-size-adjust:none; -moz-text-size-adjust:none; -ms-text-size-adjust:none; box-sizing:border-box; }
html, body { width:100%;  }
/*모바일*/
html, body { -webkit-touch-callout:none; -webkit-user-select:none; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-appearance:none; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary, time, mark, audio, video, button, input, select{ margin:0; padding:0; border:0; outline:0; font-size:100%; font:inherit; background:transparent; }
body,input,textarea,select,button,table,a{ font-family:"NanumBarunGothic",NotoSans,sans-serif; font-size:12px; color:#333; font-weight:400; word-break:break-all; vertical-align:baseline; line-height:1; letter-spacing:-1px; }
img { vertical-align:middle; }
ol,ul,li { list-style:none; }
em,address { font-style:normal; }
button { cursor:pointer; }
table{ border-collapse:collapse; border-spacing:0;}

/* Common Add */
caption,legend,.hide { visibility:hidden; overflow:hidden; position:absolute; top:0; left:-999em; width:0; height:0; font-size:0; line-height:0; text-align:left; text-indent:-9999px; }
caption { position:static; }
a { text-decoration:none; }
a:hover,
a:link,
a:visited { text-decoration:none; }
input { border-radius:0; }

/* HTML5 */
header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption, canvas, time, mark, video, audio, summary {display:block; margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:middle;}
/* input 클릭시 placeholder 없애기 */
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder { /* WebKit browsers */ color:transparent; } 
input:focus:-moz-placeholder, textarea:focus:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color:transparent; }
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder { /* Mozilla Firefox 19+ */ color:transparent; }
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder { /* Internet Explorer 10+ */ color:transparent; }
.pointer {
    cursor: pointer;
}

/*hidden*/
.elementHidden {display: none;}

/*main*/
.skipNavi { visibility:hidden; overflow:hidden; position:absolute; top:0; left:-999em; width:0; height:0; font-size:0; line-height:0; text-align:left; text-indent:-9999px; }

/*common*/
#wrap { min-width:1440px; }
.contentWrap { width:1440px; margin:0 auto; min-width:1440px;  }
.contentWrap h2 { padding:108px 0 38px 0; font-size:42px; text-align:center; line-height:1.4; }
.contentWrap p.subTxt { margin-bottom:72px; font-size:18px; color:#7f7f7f; text-align:center; line-height:1.6; }
.contentWrap p.subTxt b { font-weight:600; }
.dim.on { position:fixed; width:100%; top:0; bottom:0; left:0; z-index:999; pointer-events:none; background:#000; -webkit-transition:opacity .3s; transition:opacity .3s; background:rgba(0,0,0,0.5); transform:translate3d(0, 0, 0); -webkit-transform:translate3d(0, 0, 0);}
.grayBack { background:#f5f5f5; }
.grayBack2 { background:#eeeeee; }


/*header*/
#header { width:100%; height:91px; border-bottom:1px solid #dcdcdc; }
.headerBox { width:1200px; margin:0 auto; line-height:90px; }
.headerBox:after { content:""; display:block; clear:both; }
.headerBox .logo { float:left; }
.headerBox .logo a { width:221px; height:24px; font-size:25px; color:#424242; letter-spacing:-2px; font-weight:600;}
.headerBox .logo a img { width:100%;  }
.headerBox .logo a span { font-size:25px; color:#7167bb;}
.headerBox .nav { float:right; font-size:25px;}
.headerBox .nav li { float:left; margin-left:38px; color:#000; }
.headerBox .nav li a { font-size:18px; font-weight:600; }
.headerBox .nav li a:hover,
.headerBox .nav li a:active { color:#7167bb; }
#m_header { display:none; }

/*footer*/
footer .footerNoticeBox { height:70px; background:#373737; }
footer .footerNoticeBox .contentBox { width:1200px; margin:0 auto; }
footer .footerNoticeBox .contentBox ul { display:inline-block; }
footer .footerNoticeBox .contentBox ul li { position:relative; float:left; padding:0 14px; }
footer .footerNoticeBox .contentBox ul li a { display:block; font-size:15px; color:#d4d4d4; line-height:70px; }
footer .footerNoticeBox .contentBox ul li:after { content:""; display:block; position:absolute; top:50%; right:-1px; width:1px; height:11px; margin-top:-5px; background:#525252; }
footer .footerNoticeBox .contentBox ul li:last-child:after {content:"";display:none;}
footer .footerNoticeBox .contentBox .ftButtonBox { display: block; float:right; margin-top:16px; }
footer .footerNoticeBox .contentBox .ftButtonBox button { width:130px; height:40px; margin-left:10px; line-height:40px; font-size:15px; color:#949494; border:1px solid #545454; border-radius:5px;  }
footer .addressBox { background:#313131; }
footer .addressBox .contentBox { width:1200px; margin:0 auto; }
footer .addressBox .contentBox .address { padding:37px 0 0 0; }
footer .addressBox .contentBox .address ul { overflow:hidden; margin:10px 0; }
footer .addressBox .contentBox .address ul li { position:relative; float:left; padding:0 10px; color:#949494; font-size:15px; }
footer .addressBox .contentBox .address ul li:after { content:""; position:absolute; top:50%; right:-1px; width:1px; height:10px;  margin-top:-5px;  background:#525252; }
footer .addressBox .contentBox .address ul li:first-child { padding-left:0; }
footer .addressBox .contentBox .address ul li:last-child:after {content:"";display:none;}
footer .copyright { padding:40px 0; font-size:13px; color:#d4d4d4; }
footer .addressBox .contentBox .ftButtonBox {display: none; }

/*main*/
#section1 { width:100%; height:740px; background:url(../images/mainImg.png)no-repeat center center; background-size:cover; }
#section1 .contentWrap .mainImgTitle { padding-top:120px; margin-bottom:60px; text-align:center; font-size:44px; color:#fff; line-height:1.5; }
#section1 .contentWrap .mainImg { display:block; margin:0 auto 98px auto;  }
#section1 .contentWrap .experienceBox { position:relative; width:855px; height:99px; margin:0 auto; background:#f9f8f8; border-radius:5px; }
#section1 .contentWrap .experienceBox img { position:absolute; bottom:0; left:46px; }
#section1 .contentWrap .experienceBox p { padding-left:134px; font-size:20px; color:#7167bb; line-height:99px; }
#section1 .contentWrap .experienceBox button { display:inline-block; position:absolute; right:20px; top:50%; width:234px; height:56px; margin-top:-28px; padding-left:28px; border-radius:5px; font-size:20px; color:#fff; background:#7167bb url(../images/phoneBtnBg.png)no-repeat 200px center; text-align:left; line-height:54px; }

#section2 { width:100%; padding-bottom:50px; }
#section2 .m_visualSection { display:none; }
#section2 .slide { width: 1440px; height: 780px; margin:0 auto;} 
.slick-slide img { margin:0 auto; }
.slick-dots li button:before { font-size:40px; }
.slick-prev, .slick-next { width:19px; height:32px; }
.slick-next{ background:url(../images/slideNext.png)no-repeat center center; font-size:0; }
.slick-prev { background:url(../images/slidePrev.png)no-repeat center center; font-size:0; }
.slick-next:before { display:none; }
.slick-prev:before { display:none; }
.slick-prev:hover,
.slick-prev:focus{ background:url(../images/slidePrev.png)no-repeat center center; }
.slick-next:hover,
.slick-next:focus{ background:url(../images/slideNext.png)no-repeat center center; }
.slick-prev {left:0;}
.slick-next {right:0;}
.slick-dots {bottom:0;}

#section3 .explaineBox { height:706px; background:url(../images/exPhoneBg.png)no-repeat bottom center; overflow:hidden; }
#section3 .explaineBox .leftBox { float:left; }
#section3 .explaineBox .leftBox ul { margin-top:80px;  }
#section3 .explaineBox .leftBox ul li { display:table; width:475px; height:206px; padding:0 0 0 146px; margin-bottom:50px; background-color:#fff;  }
#section3 .explaineBox .leftBox ul li .explainTxt { display:table-cell; vertical-align:middle; }
#section3 .explaineBox .leftBox ul li .explainTxt h3 { margin-bottom:30px; font-size:20px; color:#000; }
#section3 .explaineBox .leftBox ul li .explainTxt .subTxt { font-size:16px; color:#7f7f7f; line-height:1.8;  }
#section3 .explaineBox .rightBox { float:right;  }
#section3 .explaineBox .rightBox ul { margin-top:80px;  }
#section3 .explaineBox .rightBox ul li { display:table; width:475px; height:206px; padding:0 0 0 146px; margin-bottom:50px; background-color:#fff;  }
#section3 .explaineBox .rightBox ul li .explainTxt { display:table-cell; vertical-align:middle; }
#section3 .explaineBox .rightBox ul li .explainTxt h3 { margin-bottom:30px; font-size:20px; color:#000; }
#section3 .explaineBox .rightBox ul li .explainTxt .subTxt { font-size:16px; color:#7f7f7f; line-height:1.8;  }
.exList1 { background:url(../images/exListBg1.png)no-repeat 46px center; }
.exList2 { background:url(../images/exListBg2.png)no-repeat 46px center; }
.exList3 { background:url(../images/exListBg3.png)no-repeat 46px center; }
.exList4 { background:url(../images/exListBg4.png)no-repeat 46px center; }

#section4 .articleBox { width:1320px; margin:0 auto; }
#section4 .articleBox:after { content:""; display:block; clear:both; }
#section4 .articleBox img { display:block; margin:0 auto; }
#section4 .articleBox .customerBox { float:right; margin-top:32px; text-align:right; }
#section4 .articleBox .m_customerBg { display:none; }
#section4 .articleBox .customerBox .boldTxt { margin-bottom:16px; font-size:35px; color:#000; font-weight:200;  }
#section4 .articleBox .customerBox .smallTxt {  margin-bottom:100px; font-size:20px; color:#7f7f7f; }

#section5 .articleBox { width:1320px; margin:0 auto; }
#section5 .articleBox:after { content:""; display:block; clear:both; }
#section5 .articleBox .videoBox { width:1320px; height:660px; margin:0 auto; background:#fff; }
#section5 .articleBox .customerBox { float:right; margin-top:32px; text-align:right; }
#section5 .articleBox .customerBox .boldTxt { margin-bottom:16px; font-size:35px; color:#000; font-weight:200;  }
#section5 .articleBox .customerBox .smallTxt {  margin-bottom:100px; font-size:20px; color:#7f7f7f; }
.m_iframe {display:none;}

#section6 .articleBox { width:990px; margin:0 auto; }
#section6 .articleBox .contentBox { padding-bottom:60px; }
#section6 .articleBox .contentBox ul { overflow:hidden; }
#section6 .articleBox .contentBox ul li { float:left; width:460px; margin-left:68px;}
#section6 .articleBox .contentBox ul li:nth-child(1),
#section6 .articleBox .contentBox ul li:nth-child(3) { margin-left:0; }
#section6 .articleBox .contentBox ul li img { width:100%; }
#section6 .articleBox .contentBox ul li .siteTitle { margin:30px 0 26px 0; font-size:20px; color:#000; }
#section6 .articleBox .contentBox ul li .siteTxt { margin-bottom:100px; font-size:16px; color:#6e6d6d; line-height:1.7; }

#section7 { padding:68px 0 0 0; background:#5a6d8e; text-align:center; }
#section7 .articleTxt { padding:56px 0 73px 0; color:#fff; font-size:18px; line-height:2;  }

/*따라다니는 버튼*/
.btnMobileAsk { position:fixed; left:67px; bottom:20px; width:133px; height:133px; padding-top:80px; background:#7a7a7a url(../images/askBg.png)no-repeat center 18px; border-radius:10px; cursor:pointer; z-index:100; display:none;}
.btnMobileAsk .small { margin-bottom:5px; text-align:center; font-size:14px; color:#fff;}
.btnMobileAsk .b {text-align:center; font-size:18px; font-weight:600; color:#fff;}
.btnMobileScrenning { position:fixed; left:67px; bottom:20px; width:133px; height:133px; padding-top:80px; background:#7a7a7a url(../images/screeningBg.png)no-repeat center 18px; border-radius:10px; cursor:pointer; z-index:100; display:none;}
.btnMobileScrenning .small { margin-bottom:5px; text-align:center; font-size:14px; color:#fff;}
.btnMobileScrenning .b {text-align:center; font-size:18px; font-weight:600; color:#fff;}


/*문의하기*/
.subContentWrap { padding:40px 0 60px 0; }
.containerWrap .TitleBox { height:221px; border-bottom:1px solid #dcdcdc; background:url(../images/subTitleBg.png)no-repeat center center; background-size:cover;  margin:0 auto; text-align:center; }
.containerWrap .TitleBox h3 { padding:63px 0 37px 0; font-size:42px; color:#fff; } 
.containerWrap .TitleBox p { margin-bottom:65px; font-size:18px; color:#fff; line-height:1.5 }
.containerWrap .customerNumBox { width:1200px; margin:0 auto; border:1px solid #e8e8e8; background:#f7f7f7; text-align:center;}
.containerWrap .customerNumBox .bold, .containerWrap .customerNumBox .bold a { margin-top:23px; font-size:18px; font-weight:600; color:#000; }
.containerWrap .customerNumBox .small { margin:10px 0 24px 0; font-size:15px; color:#7f7f7f; }
.subContentWrap .questionBox { width:1200px; margin:43px auto 0 auto; }
.subContentWrap .questionBox h4 { margin-bottom:10px; font-size:18px; color:#000; }
.subContentWrap .questionBox p { margin-bottom:22px; font-size:14px; color:#7f7f7f; }
.subContentWrap .questionBox table { width:100%;  border-top:1px solid #333333; }
.subContentWrap .questionBox table thead th { height:42px;  font-size:15px; color:#000; background:#f8f8f8; border-bottom:1px solid #e5e2df; }
.subContentWrap .questionBox table tbody th { height:42px;  font-size:15px; color:#000; background:#f8f8f8; border-bottom:1px solid #e5e2df; }
.subContentWrap .questionBox table tbody td { height:42px; font-size:15px; color:#7f7f7f; text-align:center; border-bottom:1px solid #e5e2df;}


/*체험하기*/
.containerWrap .exTitleBox { height:221px; border-bottom:1px solid #dcdcdc; background:url(../images/subTitleBg.png)no-repeat center center; background-size:cover;  margin:0 auto; text-align:center; }
.containerWrap .exTitleBox h3 { padding:60px 0 30px 0; font-size:42px; color:#fff; } 
.containerWrap .exTitleBox p { margin-bottom:65px; font-size:18px; color:#fff; line-height:1.5;} 
.customerInfoBox { width:1200px; margin:0 auto; }
.customerInfoBox h4 { font-size:18px; color:#000; }
.customerInfoBox .infoContentBox { width:1200px; margin:30px auto 0 auto; overflow:hidden; }
.customerInfoBox .infoContentBox .leftBox { float:left; width:646px; }
.customerInfoBox .infoContentBox .leftBox ul {} 
.customerInfoBox .infoContentBox .leftBox ul li { margin-bottom:18px; overflow:hidden; } 
.customerInfoBox .infoContentBox .leftBox ul li label { float:left; width:160px; height:46px; margin-right:5px; padding-left:36px; line-height:46px; background:#f9f9f9; color:#000; font-size:15px; }
.customerInfoBox .infoContentBox .leftBox ul li label:after { content:"*"; color:#7167bb; margin-left:8px; display:inline-block; font-size:15px; }
.customerInfoBox .infoContentBox .leftBox ul li input[type="radio"] { display:none; }
.customerInfoBox .infoContentBox .leftBox ul li input[type="radio"] + label { float:left; width:238px; height:46px; margin-right:5px; padding:0; background:#fff; color:#c1c1c1; font-size:15px; border:1px solid #e5e2df; text-align:center;letter-spacing:1px;  }
.customerInfoBox .infoContentBox .leftBox ul li input[type="radio"]:checked + label { float:left; width:238px; height:46px; margin-right:5px; padding:0; background:#fff; color:#000; font-size:15px; border:1px solid #000; text-align:center; }
.customerInfoBox .infoContentBox .leftBox ul li input[type="radio"] + label:after { display:none;}
.customerInfoBox .infoContentBox .leftBox ul li input[type="radio"] + label.userGender2 { margin-right:0; }
.customerInfoBox .infoContentBox .leftBox ul li input[type="text"]{ float:left; width:480px; height:46px; padding-left:20px; border:1px solid #e5e2df; font-size:15px; } 
.customerInfoBox .infoContentBox img { float:right; }
.agreeBox { width:1200px; margin:0 auto; }
.agreeBox h4 { margin:0 0 27px 0; font-size:18px; color:#000; display: inline; padding-right: 10px;}
.agreeBox .agreeContentBox { width:1200px; height: 160px; margin:0 auto; padding:0 40px 40px; background:#f9f9f9; border:1px solid #e5e2df; overflow: scroll; }
.agreeBox .agreeContentBox dl {}
.agreeBox .agreeContentBox dl dt { margin:20px 0 20px 0; font-size:15px; color:#000; font-weight:600; }
.agreeBox .agreeContentBox dl dd { font-size:14px; color:#7f7f7f; line-height:1.6; }
.agreeBox input[id="infoAgreeChk"] { display:none; }
.agreeBox input[id="infoAgreeChk"] + label { display:inline-block; position:relative; margin:20px 0; padding-left:30px; font-size:16px; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; cursor:pointer;}
.agreeBox input[id="infoAgreeChk"] + label:before { content: ''; position: absolute; left: 0; top: -4px; width: 18px; height: 18px; text-align: center; background: #fafafa; border: 1px solid #cacece; border-radius: 100%; box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05); }
.agreeBox input[id="infoAgreeChk"] + label:active:before, 
.agreeBox input[id="infoAgreeChk"]:checked + label:active:before { box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1); }
.agreeBox input[id="infoAgreeChk"]:checked + label:before { background: #E9ECEE; border-color: #adb8c0; }
.agreeBox input[id="infoAgreeChk"]:checked + label:after { content: ''; position: absolute; top:1px; left:5px; width:10px; height:10px; background: #99a1a7; border-radius: 100%; box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3); }
.resultBtnbox { margin:10px 0 10px 0; text-align:center; }
.resultBtnbox .showResult { width:280px; height:60px; background:#333; color:#fff; font-size:20px; }

/*자주묻는 질문*/
.faqContentWrap {
    margin: 20px 0 40px 0;
    padding-bottom: 40px;
}
.containerWrap .faqTitleBox { height:221px; border-bottom:1px solid #dcdcdc; background:url(../images/bg_faq.jpg)no-repeat center center; background-size:cover;  margin:0 auto; text-align:center; }
.containerWrap .faqTitleBox h3 { padding:60px 0 30px 0; font-size:42px; color:#fff; }
.containerWrap .faqTitleBox p { margin-bottom:65px; font-size:18px; color:#fff; line-height:1.5;}
.wrap_tab {
    margin-top: 20px;
}
.tab_faq {
    max-width: 1200px;
    margin: 0 auto;
}
.tab_faq:after {
    content: "";
    display: block;
    clear: both;
}
.tab-li {
    float:left;
    width: 20%;
    -moz-box-sizing: border-box; /* firefox */
    -webkit-box-sizing: border-box; /*safari, chrome*/
    box-sizing: border-box; /* etc */
    border: 1px solid #333;
    text-align:center;
    background:#fff;
    font-weight:bold;
    padding:10px 0;

    color: #666;
    font-size: 18px;
}
.tab_faq .tab-li:not(:first-child) {
    border-left: none;
}
.on, .tab-li:hover {background:#ccc; color:#fff;}
.tab_faq .tab-li a {
    font-size: 18px;
}

.faq_start {
    max-width: 1200px;
    margin: 0 auto;
    border-top:3px solid #666;
    list-style:none;
}

.faq_start li {
    padding:21px 0 19px 1%;
    border-top:1px solid #ccc;
}
.faq_start li:nth-last-child(1){
    border-bottom:1px solid #ccc;
}

.faq_start li:first-child {
    border:0 none;
}
.faq_start .title {
    display: grid;
    grid-template-columns: 100px auto 66px;
}
.faq_start li a {
    padding-right: 3%;
    font-size: 16px;
    line-height:20px;
    color:#000;
}
.faq_start li .answer-wrapper {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}
.faq_start li .answer_p {
     background-color: #f8f8f8;
     margin-top: 16px;
     padding: 30px 5% 30px 103px;
     text-align: left;
     font-size: 14px;
     line-height: 1.5;
     color: #666;
 }
.faq_start li .num {
    font-size: 16px;
    margin: 2px 60px 0 32px ;
}
.faq_start .icon_arrow {
    width: 14px;
    height: 8px;
    -webkit-mask-image: url("../images/ic_downArrow.png");
    mask-image: url("../images/ic_downArrow.png");
    -webkit-mask-size: 14px 8px;
    mask-size: 14px 8px;
    background-color: #666666;
    margin-top: 5px;
}
.faq_start .active > .icon_arrow  {
    -webkit-mask-image: url("../images/ic_upArrow.png");
    mask-image: url("../images/ic_upArrow.png");
}

/*알림 팝업*/
.layerPop { width:380px; height:276px; background:#fff; border-radius:10px; overflow:hidden; display:none; z-index:1000;  }
.layerPop .pu_title { height:49px; text-align:left; padding: 2px 40px; color:#fff; background:#7167bb; font-size:20px; line-height:49px; }
.layerPop .pu_container { text-align:center; }
.layerPop .pu_container .pu_content { padding:40px 0 36px 0; font-size:16px; line-height:2; color:#000; height: 150px; }
.layerPop .pu_container .okBtn { width:130px; height:40px; background:#7167bb; color:#fff; font-size:16px; font-weight:600; line-height:40px; }

.layerPop.again { width:380px; height:276px; background:#fff; border-radius:10px; overflow:hidden; display:none; z-index:1000;  }
.layerPop.again .pu_title { height:49px; text-align:left; padding: 2px 40px; color:#fff; background:#7167bb; font-size:20px; line-height:49px; }
.layerPop.again .pu_container { text-align:center; }
.layerPop.again .pu_container .pu_content { padding:40px 0 36px 0; font-size:16px; line-height:2; color:#000;  }
.layerPop.again .pu_container .okBtn { width:130px; height:40px; background:#7167bb; color:#fff; font-size:16px; font-weight:600; line-height:40px; }


/*오시는길*/
.containerWrap .locationTitleBox { height:221px; border-bottom:1px solid #dcdcdc; background:url(../images/subTitleBg3.png)no-repeat center center; background-size:cover;  margin:0 auto; text-align:center; }
.containerWrap .locationTitleBox h3 { padding:63px 0 37px 0; font-size:42px; color:#fff; } 
.containerWrap .locationTitleBox p { margin-bottom:65px; font-size:18px; color:#fff; } 
.mapBox { width:1200px; margin:0 auto; }
.mapBox .map { height:500px; }
.mapBox .locationBox { padding:25px 0 46px 60px; overflow:hidden; background:#f7f7f7; border:1px solid #e8e8e8;}
.mapBox .locationBox .inner { float:left; width:540px; }
.mapBox .locationBox .inner dl {}
.mapBox .locationBox .inner dl dt { margin-top:20px; font-size:15px; color:#000; font-weight:600;}
.mapBox .locationBox .inner dl dd { margin-top:5px; font-size:15px; color:#7f7f7f; line-height:1.6;}


/*개인정보처리방침*/
.legalContainerWrap { padding-bottom:50px; background:#f9f9f9;}
.legalContainerWrap h3 { width:1200px; margin:0 auto; padding:50px 0 20px 0; font-size:18px; }
.legalBox { width:1200px; margin:0 auto; padding:0 35px 35px 35px; background:#fff; border:1px solid #e4e3df; }
.legalBox dl {}
.legalBox dl dt { font-size:14px; font-weight:600; color:#000; margin:30px 0 5px 0; }
.legalBox dl dd { font-size:14px; color:#7f7f7f; line-height:1.6; }
.legalBox table { width:100%; border:1px solid #e5e2df; }
.legalBox table tr { height:40px;  }
.legalBox table thead tr th { background:#f9f9f9; font-size:16px; color:#000; border-left:1px solid #e5e2df; }
.legalBox table thead tr th:first-child { border-left:none; }
.legalBox table tbody tr td { padding:3px 0; font-size:14px; color:#7f7f7f; text-align:center; border-top:1px solid #e5e2df; border-left:1px solid #e5e2df; line-height:1.6; }
.legalBox table tbody tr td:first-child { border-left:none; }
.btn_goTop {display: none; position: fixed;  right: 16px; bottom: 3%;  width: 80px; height: 80px;background: url(../images/gotopBtn.png)no-repeat center center; background-size: 80px; text-indent: -9999px; border: none;}

@media (min-width: 769px) and (max-width: 1135px) {
    #wrap {
        width: 100%;
        min-width: auto;
    }
    .agreeBox {
        width: 97%;
        margin: auto;
    }
    .headerBox {
        width: 100%;
        min-width:auto;
    }
    footer .footerNoticeBox .contentBox {
        width: 100%;
        min-width:auto;
    }
    .customerInfoBox .infoContentBox img {
        display: none
    }
    .customerInfoBox .infoContentBox {
        /* text-align: center; */
        width: 100%;
        margin: 17px auto 0 auto;
    }
    .customerInfoBox .infoContentBox .leftBox {
        width: 100% !important;
    }
    .customerInfoBox .infoContentBox .leftBox ul li {
        margin-bottom: 9px !important;
    }
    .customerInfoBox .infoContentBox .leftBox ul li label {
        float: left !important;
        width: 20% !important;
        height: 40px !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        line-height: 40px !important;
        background: #f9f9f9 !important;
        color: #000 !important;
        fontf-size: 12px !important;
        text-align: center !important;
    }
    .customerInfoBox .infoContentBox .leftBox ul li label:after {
        content: "*";
        margin-left: 3px;
    }
    .customerInfoBox .infoContentBox .leftBox ul li input[type="text"] {
        float: right !important;
        width: 79% !important;
        height: 40px !important;
        padding-left: 10px !important;
        font-size: 12px !important;
    }
    .customerInfoBox .infoContentBox .leftBox ul li input[type="radio"] + label {
        width: 39% !important;
        height: 40px !important;
        margin-right: 0 !important;
        padding: 0 !important;
        font-size: 12px !important;
        margin-left: 1% !important;
    }
    .customerInfoBox {
        width: 97% !important;
    }
    .mailSpan {display:none}
    a[href*="tel:"] { pointer-events: none; }
}

@media (min-width: 769px) and (max-width: 1135px) {

    #wrap { width:100%; min-width:auto;}
    #header {  display:block; width:100%; }
    .headerBox { width: 100%; margin: 0 auto; line-height: 90px; padding: 0 20px;}
    .contentWrap { width: 100%;  margin: 0 auto; min-width: auto;}
    #section1 .contentWrap .experienceBox { width:784px; }
    #section2 .slide {width: 100%; height: auto;}
    .slick-slide img {width:90%;}
    .slick-dots{ bottom:-30px; }
    .slick-prev, .slick-next {z-index:20;}
    #section3 .explaineBox { padding:644px 0 30px 0; height:auto; background:url(../images/exPhoneBg.png)no-repeat center 0; overflow:hidden; }
    #section3 .explaineBox .leftBox { float:none; }
    #section3 .explaineBox .rightBox { float:none; }
    #section3 .explaineBox .leftBox ul li { margin:0 auto 50px auto; }
    #section3 .explaineBox .rightBox ul li { margin:0 auto 50px auto; }
    #section3 .explaineBox .rightBox ul { margin-top:50px; }
    #section4 .articleBox {width: auto;margin: 0 auto;padding: 0 20px;}
    #section4 .articleBox img { width:100%; }
    #section5 .articleBox { width: 100%; margin: 0 auto; padding: 0 20px;}
    #section5 .articleBox .videoBox { width: 100%; height: auto;}
    #section6 .articleBox .contentBox ul li {float: none; width: 460px; margin:0 auto;}
    #section6 .articleBox .contentBox ul li:nth-child(1), #section6 .articleBox .contentBox ul li:nth-child(3){ margin:0 auto; }
    #section6 .articleBox { width:100%; margin:0 auto; }
    footer .footerNoticeBox .contentBox { width: 100%; padding:0 20px;}
    footer .addressBox .contentBox .address {padding: 37px 20px 0 20px;}
    footer .addressBox .contentBox { width:100%; margin:0 auto; }
    .btnMobileAsk { bottom:20px; }
    .btnMobileScrenning { bottom:20px; }
    .containerWrap .customerNumBox { width:100%; }
    .subContentWrap .questionBox { width:100%; padding: 0 20px;}
    .mapBox {width:100%;     padding: 0 20px;}
    .legalContainerWrap h3 { width: auto; margin: 0px 20px; }
    .legalBox{ width: auto; margin: 0px 20px;}
    .customerInfoBox{ width:97%; }
    .agreeBox {width:100%;}
    .customerInfoBox .infoContentBox img {float:right;}
    /*.customerInfoBox .infoContentBox .leftBox {float: left; width: 532px; margin: 0 auto;}*/
    /*.customerInfoBox .infoContentBox {width:100%;}*/
    .customerInfoBox .infoContentBox .leftBox ul li input[type="radio"] + label { width:36%; }
    .agreeBox h4 {padding:0 20px;}
    .agreeBox .agreeContentBox { width: auto; margin: 0 20px;}
    .agreeBox input[id="infoAgreeChk"] + label { margin:20px; }
    .containerWrap .customerNumBox { width:auto; margin:0 20px; }
    .btn_goTop {display: none; position: fixed;  right: 16px; bottom: 40px;  width: 40px; height: 80px;background: url(../images/gotopBtn.png)no-repeat center center; background-size: 40px; text-indent: -9999px; border: none;}

    .mailSpan {display:none}
    a[href*="tel:"] { pointer-events: none; }

    .wrap_tab, .faqContentWrap {
        padding: 0 20px;
    }
}


@media screen and (min-width: 321px) and (max-width: 768px) {

    #wrap { width:100%; min-width:auto;}
    #header { display:none;  }
    #m_header {  display:block; width:100%; }
    .m_headerBox { position:relative; height:64px; line-height:64px; overflow:hidden; }
    .m_headerBox a img { display:block;width:100%; height:100%; }
    .m_headerBox a img { display:block; width:170px; height:19px; margin:22px auto 0 auto; }
    .m_menu { position:absolute; top:2px; right:0; width:60px; height:100%; text-align:center;}
    .m_menu,
    .m_menu span { display:inline-block; transition: all .4s; box-sizing:border-box; }
    .m_menu span { position:absolute; left:0; display:inline-block; width:21px; height:3px; margin-left:20px; background-color:#000; border-radius:3px; }
    .m_menu span:nth-of-type(1) { top:23px; }
    .m_menu span:nth-of-type(2) { top:30px; }
    .m_menu span:nth-of-type(3) { top:37px; }
    .m_menu.active span:nth-of-type(1) { -webkit-transform: translateY(7px) rotate(-45deg); transform: translateY(7px) rotate(-45deg); }
    .m_menu.active span:nth-of-type(2) { opacity: 0; }
    .m_menu.active span:nth-of-type(3) { -webkit-transform: translateY(-7px) rotate(45deg); transform: translateY(-7px) rotate(45deg); }
    .m_headerMenu { position:absolute; top:64px; left:0; width:100%; display:none; z-index:999;}
    .m_headerMenu ul li { height:45px; line-height:45px; background:#fafafa; border-top:1px solid #ebebeb; }
    .m_headerMenu ul li:first-child { border-top:1px solid #c9c9c9; }
    .m_headerMenu ul li a { display:block; width:100%; padding-left:20px;  line-height:45px; font-size:13px; color:#000; }
    .m_headerMenu ul li a:hover,
    .m_headerMenu ul li a:active { color:#7167bb; }
    .m_headerMenu ul li a:after { content:""; position:absolute; right:20px; display:inline-block; width:8px; height:45px; background:url(../images/m_menuBg.png)no-repeat center center; background-size:8px 16px;  }

    .contentWrap { width:100%; min-width:100%; }
    .contentWrap h2 { padding:45px 0 18px 0; font-size:23px; text-align:center; line-height:1.4; }
    .contentWrap p.subTxt { padding:0 20px; margin-bottom:20px; font-size:17px; color:#7f7f7f; text-align:center; line-height:1.6; }

    #section1 { position:relative; width:100%; height:436px; background: url(../images/mainImg.png)no-repeat 90% center; background-size:cover; }
    #section1 .contentWrap .mainImgTitle { padding-top:68px; margin-bottom:35px; text-align:center; font-size:20px; color:#fff; line-height:1.5; }
    #section1 .contentWrap .mainImg { width:221px; margin:0 auto 48px auto;  }
    #section1 .contentWrap .experienceBox { position:absolute; bottom:0; width:100%; height:130px; margin:0 auto; background:#f9f8f8; border-radius:0; }
    #section1 .contentWrap .experienceBox img { display:none; }
    #section1 .contentWrap .experienceBox p { padding:27px 0 0 0; text-align:center; font-size:16px; line-height:1;}
    #section1 .contentWrap .experienceBox button { display:block; position:static; width:300px; height:42px; margin:18px auto 0 auto; border-radius:5px; font-size:15px; color:#fff; background:#7167bb url(../images/phoneBtnBg.png)no-repeat 95% center; background-size:8px 15px; line-height:1; text-align:center; padding-left:0;}

    #section2 .visualSection { display:none; }
    #section2 .m_visualSection { display:block; width:100%; max-width:460px; margin:0 auto; }
    #section2 .m_visualSection .m_slide { width:100%; height: 780px; }
    #section2 .m_visualSection .m_slide img{display:block; width:100%; }
    #section2 .m_visualSection .m_slide div { width:100%; padding:0 0 20px 0; }
    #section2 .m_visualSection .m_slide div b { padding:15px 20px; color:#000; font-size:15px; font-weight:600; }
    #section2 .m_visualSection .m_slide div b span { color:#7167bb; }
    #section2 .m_visualSection .m_slide div p {padding:0 20px; font-size:12px; color:#6d6d6d; line-height:1.4; margin-top:10px;  }
    #section2 .m_visualSection .m_slide div ul {  padding:0 20px;margin-top:10px; }
    #section2 .m_visualSection .m_slide div ul li { list-style:square; font-size:12px; color:#6d6d6d; line-height:1.4;  }
    .slick-dots li button:before {font-size: 46px;}
    #section3 .explaineBox { padding:380px 0 30px 0; height:auto; background:url(../images/m_exPhoneBg.png) no-repeat center -20px; overflow:hidden; background-size:360px 378px;}
    .slick-prev, .slick-next { display:none !important; }
    .slick-next:hover, .slick-next:focus { display:none}
    .slick-prev:hover, .slick-prev:focus { display:none}

    #section3 .explaineBox .leftBox { margin:0 20px; float:none; }
    #section3 .explaineBox .leftBox ul { margin:0 auto; max-width:460px; }
    #section3 .explaineBox .leftBox ul li { width:100%; height:140px; margin:0 auto 15px auto; padding-left:30%; }
    #section3 .explaineBox .leftBox ul li .explainTxt h3 { font-size:14px; margin-bottom:18px; }
    #section3 .explaineBox .leftBox ul li .explainTxt .subTxt { font-size:11px; margin-right: 10px; }
    #section3 .explaineBox .rightBox { margin:0 20px; float:none; }
    #section3 .explaineBox .rightBox ul { margin:0 auto; max-width:460px; }
    #section3 .explaineBox .rightBox ul li { width:100%; height:140px; margin:0 auto 15px auto; padding-left:30%; }
    #section3 .explaineBox .rightBox ul li .explainTxt h3 { font-size:13px; margin-bottom:23px; }
    #section3 .explaineBox .rightBox ul li .explainTxt .subTxt { font-size:11px; margin-right: 20px;}
    .exList1 { background:url(../images/exListBg1.png)no-repeat 10% center; background-size:45px;  }
    .exList2 { background:url(../images/exListBg2.png)no-repeat 10% center; background-size:52px; }
    .exList3 { background:url(../images/exListBg3.png)no-repeat 10% center;  background-size:45px; }
    .exList4 { background:url(../images/exListBg4.png)no-repeat 10% center; background-size:45px; }

    #section4 .articleBox {width: 100%;}
    #section4 .articleBox .customerBg { display:none; }
    #section4 .articleBox .m_customerBg { display:block; width:100%; max-width:460px; padding:0 20px; }
    #section4 .articleBox .customerBox { width:100%; max-width:460px; margin:14px auto 0 auto; padding:0 20px; float:none;}
    #section4 .articleBox .customerBox .boldTxt, #section4 .articleBox .customerBox .boldTxt a { font-size:17px; margin-bottom:8px; }
    #section4 .articleBox .customerBox .smallTxt { font-size:10px; margin-bottom:45px;}

    #section5 .articleBox { width:100%; }
    #section5 .articleBox .videoBox { width:auto; height:auto; margin:0 20px;}
    #section5 .articleBox .videoBox p { display:none; }
    #section5 .articleBox .customerBox { padding:0 20px; margin-top: 17px;}
    #section5 .articleBox .customerBox .boldTxt { font-size:17px; margin-bottom:8px; }
    #section5 .articleBox .customerBox .smallTxt { font-size:10px; margin-bottom:45px;}
    .m_iframe { display:block; position:relative; width:100%; }

    #section6 .articleBox { width:100%; }
    #section6 .articleBox .contentBox { padding-bottom: 0}
    #section6 .articleBox .contentBox ul li { float:none; width:100%; max-width:460px; margin:0 auto; padding:0 20px;}
    #section6 .articleBox .contentBox ul li .siteTitle { font-weight: 600; margin: 20px 0 17px 0;font-size: 19px;}
    #section6 .articleBox .contentBox ul li .siteTxt { margin-bottom:55px; font-size:17px; line-height:1.8;}
    #section6 .articleBox .contentBox ul li:nth-child(1), #section6 .articleBox .contentBox ul li:nth-child(3) { margin:0 auto; }
    #section7 { padding:39px 0 0 0;}
    #section7 .articleTxt { padding:30px 0 40px 0; color: #fff; font-size:13px;}
    #section7 img { width:150px; }

    footer .footerNoticeBox { height: 35px; }
    footer .footerNoticeBox .contentBox { width:100%; padding:0 10px;}
    footer .footerNoticeBox .contentBox ul li { padding:0 5px; }
    footer .footerNoticeBox .contentBox ul li a { line-height:37px; font-size:12px; }
    footer .footerNoticeBox .contentBox .ftButtonBox { display: none; }
    footer .copyright { padding:20px 0; font-size:12px;}
    footer .addressBox .contentBox { width:100%; }
    footer .addressBox .contentBox .address { padding:17px 10px 10px 10px; }
    footer .addressBox .contentBox .address ul {margin: 2px 0;}
    footer .addressBox .contentBox .address ul li { font-size:13px; padding: 0 5px; line-height:1.4; }
    footer .addressBox .contentBox .ftButtonBox {display: block; text-align: center; padding-top: 15px;}
    footer .addressBox .contentBox .ftButtonBox button { width:100px; height: 35px; margin-left:3px; line-height:1; border-radius: 1px; font-size:12px; color: #949494; border: 1px solid #545454;}

    .containerWrap .exTitleBox { height:145px;background: url(../images/subTitleBg.png)no-repeat 33% center;  background-size: cover; }
    .containerWrap .exTitleBox h3 { padding:22px 0 10px 0; font-size: 20px;}
    .containerWrap .exTitleBox p { margin-bottom: 0; font-size: 15px; padding: 0 10px;}
    .customerInfoBox { width:100%; }
    .customerInfoBox .infoContentBox { width: 100%; margin: 17px auto 0 auto;}
    .customerInfoBox .infoContentBox img {display: none;}
    .subContentWrap { padding: 12px 10px 40px 10px;}
    .customerInfoBox .infoContentBox .leftBox { float:none; width:100%;}
    .customerInfoBox .infoContentBox .leftBox ul li { margin-bottom: 6px; }
    .customerInfoBox .infoContentBox .leftBox ul li label { float: left; width: 20%; height: 40px; margin-right:0; padding-left:0; line-height:40px; background: #f9f9f9; color: #000; font-size: 12px; text-align: center; }
    .customerInfoBox .infoContentBox .leftBox ul li label:after { content:"*"; margin-left:3px; }
    .customerInfoBox .infoContentBox .leftBox ul li input[type="text"] { float:right; width: 79%; height: 40px; padding-left:10px;font-size:12px;}
    .customerInfoBox .infoContentBox .leftBox ul li input[type="radio"] + label { width: 39%;height: 40px;margin-right: 0; padding: 0; font-size: 12px;margin-left: 1%;}
    .customerInfoBox h4 {font-size:17px;}
    .customerInfoBox .infoContentBox .leftBox ul li input[type="radio"]:checked + label { float:left; width:39%; height:40px; margin-right:0; padding:0; background:#fff; color:#000; font-size:12px; margin-left:1%; border:1px solid #000; text-align:center; }
    .agreeBox { width: 100%; }
    .agreeBox h4 { margin: 30px 0 17px 0; font-size: 17px;padding-right: 10%;}
    .agreeBox .agreeContentBox { width: 100%; height: 95px; margin: 0 auto; padding: 0px 20px 20px;}
    .agreeBox .agreeContentBox dl dd {font-size: 12px;}
    .agreeBox input[id="infoAgreeChk"] + label { font-size:15px;}
    .resultBtnbox .showResult { height:46px; font-size:15px;}
    .legalContainerWrap { padding:0 10px 50px 10px;}
    .legalContainerWrap h3 { width: 100%; margin: 0 auto; padding: 31px 0 17px 0;font-size: 15px;}
    .legalBox { width: 100%; margin: 0 auto; padding: 0px 20px 20px 20px;}
    .legalBox dl dt { margin:20px 0 5px 0;}
    .legalBox dl dd {font-size: 12px;}
    .legalBox table thead tr th { font-size:13px;}
    .legalBox table tbody tr td { padding: 2px; font-size: 12px;}
    .containerWrap .TitleBox { background:url(../images/subTitleBg.png)no-repeat 45% center;}
    .containerWrap .TitleBox  h3 { padding: 77px 0 23px 0; font-size: 20px;}
    .containerWrap .TitleBox p { margin-bottom: 0; font-size: 15px; padding: 0 10px; word-break: keep-all; }
    .containerWrap .customerNumBox { width: 100%;}
    .subContentWrap .questionBox { width:100%;  margin:23px auto 0 auto}
    .subContentWrap .questionBox h4 { font-size:14px; margin-bottom: 6px;}
    .subContentWrap .questionBox p { margin-bottom: 13px; font-size: 12px;}
    .subContentWrap .questionBox table thead th { font-size:13px; }
    .subContentWrap .questionBox table thead th:nth-child(2) { width:24.5% }
    .subContentWrap .questionBox table thead th:nth-child(2) { width:25.2% }
    .subContentWrap .questionBox table thead th:nth-child(3) { width:26.5% }
    .subContentWrap .questionBox table thead th:nth-child(4) { width:23.8% }
    .subContentWrap .questionBox table tbody th{ padding:0 3px; font-size:13px; line-height:1.2}
    .subContentWrap .questionBox table tbody td { padding:0 3px; font-size: 12px;}
    .containerWrap .locationTitleBox { background:url(../images/subTitleBg3.png)no-repeat 10% center; }
    .containerWrap .locationTitleBox h3 { padding: 77px 0 23px 0; font-size: 20px;}
    .containerWrap .locationTitleBox p{ margin-bottom: 0; font-size: 12px; padding: 0 10px;}
    .mapBox { width: 100%;}
    .mapBox .map { height: 300px;}
    .mapBox .locationBox { padding: 11px 0 19px 20px;}
    .mapBox .locationBox .inner { float: none; width: 100%;}
    .mapBox .locationBox .inner dl dt { margin-top: 13px; font-size: 14px;}
    .mapBox .locationBox .inner dl dd { font-size:12px; }

    .brSpan {display:none}
    .layerPop { width:300px; height:220px; z-index:999; }
    .layerPop .pu_title { height:40px; line-height:40px; font-size:16px;  }
    .layerPop .pu_container .pu_content { padding: 20px 0 16px 0; font-size: 14px; height: 100px;}
    .layerPop .pu_container .okBtn { height:35px; line-height:35px; font-size:14px; }
    .layerPop.again { width:300px; height:220px; z-index:999; }
    .layerPop.again .pu_title { height:40px; line-height:40px; font-size:16px;  }
    .layerPop.again .pu_container .pu_content { padding: 20px 0 16px 0; font-size: 14px;}
    .layerPop.again .pu_container .okBtn { height:35px; line-height:35px; font-size:14px; }

    .btnMobileAsk { left:20px; bottom:20px; width:70px; height:70px; padding-top:41px; background:#7a7a7a url(../images/askBg.png) no-repeat center 10px;  background-size:25px 25px;  }
    .btnMobileAsk .small { font-size:10px;margin-bottom: 3px; }
    .btnMobileAsk .b { font-size:10px; }
    .btnMobileScrenning { left:20px; bottom:20px;  width:70px; height:70px; padding-top:41px; background:#7a7a7a url(../images/screeningBg.png) no-repeat center 10px;  background-size:25px 25px;}
    .btnMobileScrenning .small { font-size:10px;margin-bottom: 3px; }
    .btnMobileScrenning .b { font-size:10px; }
    .btn_goTop {display: none; position: fixed;  right: 16px; bottom: 23px;  width: 60px; height: 60px;background: url(../images/gotopBtn.png) no-repeat center center; background-size: 57px; text-indent: -9999px; border: none;}
    a[href*="tel:"] { cursor:default; }

    /*자주묻는 질문_200715*/
    .faqContentWrap {
        margin: 20px 0 0 0;
        padding-bottom: 0;
    }
    .containerWrap .faqTitleBox { background: url(../images/bg_faq.jpg)no-repeat 33% center;  background-size: cover; }
    .containerWrap .faqTitleBox h3 { padding:55px 0 23px 0; font-size: 20px;}
    .containerWrap .faqTitleBox p { margin-bottom: 0; font-size: 15px; padding: 0 10px; word-break: keep-all; }
    .tab_faq .tab-li {
        width: 33.3%;
    }
    .tab_faq .tab-li:nth-child(3n) + .tab-li {
        border-left: 1px solid #333;
    }
    .tab_faq .tab-li:nth-child(3) ~ .tab-li {
        border-top: none;
    }
    .tab_faq .tab-li a {
        font-size: 16px;
    }
    .faq_start .title {
        grid-template-columns: 13% auto 9%;
    }
    .faq_start li .num {
        font-size: 15px;
        margin: 2px 3% 0 0;
        text-align: center;
    }
    .faq_start li a {
        font-size: 15px;
    }
    .faq_start li .answer_p {
        padding: 30px 5% 30px 5%;
        font-size: 15px;
    }
}


@media screen and (max-width: 320px) {

    #wrap { width:100%; min-width:auto;}
    #header { display:none;  }
    #m_header {  display:block; width:100%; }
    .m_headerBox { position:relative; height:64px; line-height:64px; overflow:hidden; }
    .m_headerBox a img { display:block;width:100%; height:100%; }
    .m_headerBox a img { display:block; width:170px; height:19px; margin:22px auto 0 auto; }
    .m_menu { position:absolute; top:2px; right:0; width:60px; height:100%; text-align:center;}
    .m_menu,
    .m_menu span { display:inline-block; transition: all .4s; box-sizing:border-box; }
    .m_menu span { position:absolute; left:0; display:inline-block; width:21px; height:3px; margin-left:20px; background-color:#000; border-radius:3px; }
    .m_menu span:nth-of-type(1) { top:23px; }
    .m_menu span:nth-of-type(2) { top:30px; }
    .m_menu span:nth-of-type(3) { top:37px; }
    .m_menu.active span:nth-of-type(1) { -webkit-transform: translateY(7px) rotate(-45deg); transform: translateY(7px) rotate(-45deg); }
    .m_menu.active span:nth-of-type(2) { opacity: 0; }
    .m_menu.active span:nth-of-type(3) { -webkit-transform: translateY(-7px) rotate(45deg); transform: translateY(-7px) rotate(45deg); }
    .m_headerMenu { position:absolute; top:64px; left:0; width:100%; display:none; z-index:999;}
    .m_headerMenu ul li { height:45px; line-height:45px; background:#fafafa; border-top:1px solid #ebebeb; }
    .m_headerMenu ul li:first-child { border-top:1px solid #c9c9c9; }
    .m_headerMenu ul li a { display:block; width:100%; padding-left:20px;  line-height:45px; font-size:13px; color:#000; }
    .m_headerMenu ul li a:hover,
    .m_headerMenu ul li a:active { color:#7167bb; }
    .m_headerMenu ul li a:after { content:""; position:absolute; right:20px; display:inline-block; width:8px; height:45px; background:url(../images/m_menuBg.png)no-repeat center center; background-size:8px 16px;  }

    .contentWrap { width:100%; min-width:100%; }
    .contentWrap h2 { padding:45px 0 18px 0; font-size:23px; text-align:center; line-height:1.4; }
    .contentWrap p.subTxt { padding:0 20px; margin-bottom:20px; font-size:17px; color:#7f7f7f; text-align:center; line-height:1.6; }

    #section1 { position:relative; width:100%; height:436px; background: url(../images/mainImg.png)no-repeat 90% center; background-size:cover; }
    #section1 .contentWrap .mainImgTitle { padding-top:68px; margin-bottom:35px; text-align:center; font-size:20px; color:#fff; line-height:1.5; }
    #section1 .contentWrap .mainImg { width:221px; margin:0 auto 48px auto;  }
    #section1 .contentWrap .experienceBox { position:absolute; bottom:0; width:100%; height:130px; margin:0 auto; background:#f9f8f8; border-radius:0; }
    #section1 .contentWrap .experienceBox img { display:none; }
    #section1 .contentWrap .experienceBox p { padding:27px 0 0 0; text-align:center; font-size:16px; line-height:1;}
    #section1 .contentWrap .experienceBox button { display:block; position:static; width:300px; height:42px; margin:18px auto 0 auto; border-radius:5px; font-size:15px; color:#fff; background:#7167bb url(../images/phoneBtnBg.png)no-repeat 95% center; background-size:8px 15px; line-height:1; text-align:center; padding-left:0;}

    #section2 .visualSection { display:none; }
    #section2 .m_visualSection { display:block; width:100%; max-width:460px; margin:0 auto; }
    #section2 .m_visualSection .m_slide { width:100%; }
    #section2 .m_visualSection .m_slide img{display:block; width:100%; }
    #section2 .m_visualSection .m_slide div { width:100%; padding:0 0 20px 0; }
    #section2 .m_visualSection .m_slide div b { padding:15px 20px; color:#000; font-size:15px; font-weight:600; }
    #section2 .m_visualSection .m_slide div b span { color:#7167bb; }
    #section2 .m_visualSection .m_slide div p {padding:0 20px; font-size:12px; color:#6d6d6d; line-height:1.4; margin-top:10px;  }
    #section2 .m_visualSection .m_slide div ul {  padding:0 20px;margin-top:10px; }
    #section2 .m_visualSection .m_slide div ul li { list-style:square; font-size:12px; color:#6d6d6d; line-height:1.4;  }
    .slick-dots li button:before {font-size: 46px;}
    #section3 .explaineBox { padding:380px 0 30px 0; height:auto; background:url(../images/m_exPhoneBg.png) no-repeat center -20px; overflow:hidden; background-size:360px 378px;}
    .slick-prev, .slick-next { display:none !important; }
    .slick-next:hover, .slick-next:focus { display:none}
    .slick-prev:hover, .slick-prev:focus { display:none}

    #section3 .explaineBox .leftBox { margin:0 20px; float:none; }
    #section3 .explaineBox .leftBox ul { margin:0 auto; max-width:460px; }
    #section3 .explaineBox .leftBox ul li { width:100%; height:140px; margin:0 auto 15px auto; padding-left:30%; }
    #section3 .explaineBox .leftBox ul li .explainTxt h3 { font-size:14px; margin-bottom:18px; }
    #section3 .explaineBox .leftBox ul li .explainTxt .subTxt { font-size:11px; margin-right: 10px; }
    #section3 .explaineBox .rightBox { margin:0 20px; float:none; }
    #section3 .explaineBox .rightBox ul { margin:0 auto; max-width:460px; }
    #section3 .explaineBox .rightBox ul li { width:100%; height:140px; margin:0 auto 15px auto; padding-left:30%; }
    #section3 .explaineBox .rightBox ul li .explainTxt h3 { font-size:13px; margin-bottom:23px; }
    #section3 .explaineBox .rightBox ul li .explainTxt .subTxt { font-size:11px; margin-right: 20px;}
    .exList1 { background:url(../images/exListBg1.png)no-repeat 10% center; background-size:45px;  }
    .exList2 { background:url(../images/exListBg2.png)no-repeat 10% center; background-size:52px; }
    .exList3 { background:url(../images/exListBg3.png)no-repeat 10% center;  background-size:45px; }
    .exList4 { background:url(../images/exListBg4.png)no-repeat 10% center; background-size:45px; }

    #section4 .articleBox {width: 100%;}
    #section4 .articleBox .customerBg { display:none; }
    #section4 .articleBox .m_customerBg { display:block; width:100%; max-width:460px; padding:0 20px; }
    #section4 .articleBox .customerBox { width:100%; max-width:460px; margin:14px auto 0 auto; padding:0 20px; float:none;}
    #section4 .articleBox .customerBox .boldTxt { font-size:17px; margin-bottom:8px; }
    #section4 .articleBox .customerBox .smallTxt { font-size:10px; margin-bottom:45px;}

    #section5 .articleBox { width:100%; }
    #section5 .articleBox .videoBox { width:auto; height:auto; margin:0 20px;}
    #section5 .articleBox .videoBox p { display:none; }
    #section5 .articleBox .customerBox { padding:0 20px; margin-top: 17px;}
    #section5 .articleBox .customerBox .boldTxt { font-size:17px; margin-bottom:8px; }
    #section5 .articleBox .customerBox .smallTxt { font-size:10px; margin-bottom:45px;}
    .m_iframe { display:block; position:relative; width:100%; }

    #section6 .articleBox { width:100%; }
    #section6 .articleBox .contentBox { padding-bottom: 0}
    #section6 .articleBox .contentBox ul li { float:none; width:100%; max-width:460px; margin:0 auto; padding:0 20px;}
    #section6 .articleBox .contentBox ul li .siteTitle { font-weight: 600; margin: 20px 0 17px 0;font-size: 19px;}
    #section6 .articleBox .contentBox ul li .siteTxt { margin-bottom:55px; font-size:17px; line-height:1.8;}
    #section6 .articleBox .contentBox ul li:nth-child(1), #section6 .articleBox .contentBox ul li:nth-child(3) { margin:0 auto; }
    #section7 { padding:39px 0 0 0;}
    #section7 .articleTxt { padding:30px 0 40px 0; color: #fff; font-size:11px;}
    #section7 img { width:150px; }

    footer .footerNoticeBox { height: 35px; }
    footer .footerNoticeBox .contentBox { width:100%; padding:0 10px;}
    footer .footerNoticeBox .contentBox ul li { padding:0 5px; }
    footer .footerNoticeBox .contentBox ul li a { line-height:37px; font-size:11px; }
    footer .footerNoticeBox .contentBox .ftButtonBox { display: none; }
    footer .copyright { padding:20px 0; font-size:11px;}
    footer .addressBox .contentBox { width:100%; }
    footer .addressBox .contentBox .address { padding:17px 10px 10px 10px; }
    footer .addressBox .contentBox .address ul {margin: 2px 0;}
    footer .addressBox .contentBox .address ul li { font-size:13px; padding: 0 5px; line-height:1.4; }
    footer .addressBox .contentBox .ftButtonBox {display: block; text-align: center; padding-top: 15px;}
    footer .addressBox .contentBox .ftButtonBox button { width:80px; height: 30px; margin-left:3px; line-height:1; border-radius: 1px; font-size:12px; color: #949494; border: 1px solid #545454;}

    .containerWrap .exTitleBox { height:120px;background: url(../images/subTitleBg.png)no-repeat 33% center;  background-size: cover; }
    .containerWrap .exTitleBox h3 { padding:18px 0 12px 0; font-size: 18px;}
    .containerWrap .exTitleBox p { margin-bottom: 0; font-size: 13px; padding: 0 10px;}
    .customerInfoBox { width:100%; }
    .customerInfoBox .infoContentBox { width: 100%; margin: 10px auto 0 auto;}
    .customerInfoBox .infoContentBox img {display: none;}
    .subContentWrap { padding: 10px 10px 40px 10px;}
    .customerInfoBox .infoContentBox .leftBox { float:none; width:100%;}
    .customerInfoBox .infoContentBox .leftBox ul li { margin-bottom: 3px; }
    .customerInfoBox .infoContentBox .leftBox ul li label { float: left; width: 20%; height: 40px; margin-right:0; padding-left:0; line-height:40px; background: #f9f9f9; color: #000; font-size: 12px; text-align: center; }
    .customerInfoBox .infoContentBox .leftBox ul li label:after { content:"*"; margin-left:3px; }
    .customerInfoBox .infoContentBox .leftBox ul li input[type="text"] { float:right; width: 79%; height: 40px; padding-left:10px;font-size:12px;}
    .customerInfoBox .infoContentBox .leftBox ul li input[type="radio"] + label { width: 39%;height: 40px;margin-right: 0; padding: 0; font-size: 12px;margin-left: 1%;}
    .customerInfoBox h4 {font-size:14px;}
    .customerInfoBox .infoContentBox .leftBox ul li input[type="radio"]:checked + label { float:left; width:39%; height:40px; margin-right:0; padding:0; background:#fff; color:#000; font-size:12px; margin-left:1%; border:1px solid #000; text-align:center; }
    .agreeBox { width: 100%; }
    .agreeBox h4 { margin: 30px 0 17px 0; font-size: 14px;padding-right: 10%;}
    .agreeBox .agreeContentBox { width: 100%; height: 88px; margin: 0 auto; padding: 0px 20px 20px;}
    .agreeBox .agreeContentBox dl dd {font-size: 12px;}
    .agreeBox input[id="infoAgreeChk"] + label { font-size:12px; margin: 15px 0;}
    .resultBtnbox .showResult { height:46px; font-size:15px;}
    .legalContainerWrap { padding:0 10px 50px 10px;}
    .legalContainerWrap h3 { width: 100%; margin: 0 auto; padding: 31px 0 17px 0;font-size: 15px;}
    .legalBox { width: 100%; margin: 0 auto; padding: 0px 20px 20px 20px;}
    .legalBox dl dt { margin:20px 0 5px 0;}
    .legalBox dl dd {font-size: 12px;}
    .legalBox table thead tr th { font-size:13px;}
    .legalBox table tbody tr td { padding: 2px; font-size: 12px;}
    .containerWrap .TitleBox { background:url(../images/subTitleBg.png)no-repeat 45% center;}
    .containerWrap .TitleBox  h3 { padding: 77px 0 23px 0; font-size: 20px;}
    .containerWrap .TitleBox p { margin-bottom: 0; font-size: 15px; padding: 0 10px; word-break: keep-all; }
    .containerWrap .customerNumBox { width: 100%;}
    .subContentWrap .questionBox { width:100%;  margin:23px auto 0 auto}
    .subContentWrap .questionBox h4 { font-size:14px; margin-bottom: 6px;}
    .subContentWrap .questionBox p { margin-bottom: 13px; font-size: 12px;}
    .subContentWrap .questionBox table thead th { font-size:13px; }
    .subContentWrap .questionBox table tbody th{ padding:0 3px; font-size:13px; line-height:1.2}
    .subContentWrap .questionBox table tbody td { padding:0 3px; font-size: 12px;}
    .containerWrap .locationTitleBox { background:url(../images/subTitleBg3.png)no-repeat 10% center; }
    .containerWrap .locationTitleBox h3 { padding: 77px 0 23px 0; font-size: 20px;}
    .containerWrap .locationTitleBox p{ margin-bottom: 0; font-size: 12px; padding: 0 10px;}
    .mapBox { width: 100%;}
    .mapBox .map { height: 300px;}
    .mapBox .locationBox { padding: 11px 0 19px 20px;}
    .mapBox .locationBox .inner { float: none; width: 100%;}
    .mapBox .locationBox .inner dl dt { margin-top: 13px; font-size: 14px;}
    .mapBox .locationBox .inner dl dd { font-size:12px; }

    .brSpan {display:none}
    .layerPop { width:300px; height:220px; z-index:999; }
    .layerPop .pu_title { height:40px; line-height:40px; font-size:16px;  }
    .layerPop .pu_container .pu_content { padding: 20px 0 16px 0; font-size: 14px; height: 100px;}
    .layerPop .pu_container .okBtn { height:35px; line-height:35px; font-size:14px; }
    .layerPop.again { width:300px; height:220px; z-index:999; }
    .layerPop.again .pu_title { height:40px; line-height:40px; font-size:16px;  }
    .layerPop.again .pu_container .pu_content { padding: 20px 0 16px 0; font-size: 14px;}
    .layerPop.again .pu_container .okBtn { height:35px; line-height:35px; font-size:14px; }

    .btnMobileAsk { left:20px; bottom:20px; width:70px; height:70px; padding-top:41px; background:#7a7a7a url(../images/askBg.png) no-repeat center 10px;  background-size:25px 25px;  }
    .btnMobileAsk .small { font-size:9px;margin-bottom: 3px; }
    .btnMobileAsk .b { font-size:9px; }
    .btnMobileScrenning { left:20px; bottom:20px;  width:70px; height:70px; padding-top:41px; background:#7a7a7a url(../images/screeningBg.png) no-repeat center 10px;  background-size:25px 25px;}
    .btnMobileScrenning .small { font-size:9px;margin-bottom: 3px; }
    .btnMobileScrenning .b { font-size:9px; }
    .btn_goTop {display: none; position: fixed;  right: 16px; bottom: 23px;  width: 60px; height: 60px;background: url(../images/gotopBtn.png) no-repeat center center; background-size: 57px; text-indent: -9999px; border: none;}

    a[href*="tel:"] { cursor:default; }

    .faqContentWrap {
        margin: 20px 0 0 0;
        padding-bottom: 0;
    }
    .containerWrap .faqTitleBox { background: url(../images/bg_faq.jpg)no-repeat 45% center;  background-size: cover; }
    .containerWrap .faqTitleBox h3 { padding:77px 0 23px 0; font-size: 20px;}
    .containerWrap .faqTitleBox p { margin-bottom: 0; font-size: 15px; padding: 0 10px; word-break: keep-all;}
    .tab_faq .tab-li {
        width: 33.3%;
    }
    .tab_faq .tab-li a {
        font-size: 16px;
    }
    .faq_start .title {
        grid-template-columns: 13% auto 9%;
    }
    .faq_start li .num {
        font-size: 15px;
        margin: 2px 3% 0 0;
        text-align: center;
    }
    .faq_start li a {
        font-size: 15px;
    }
    .faq_start li .answer_p {
        padding: 30px 5% 30px 5%;
        font-size: 15px;
    }
}











