@charset "utf-8";
@import url('reset.css');
#wrapper {width:100%; min-width:299px;}
.return-top {right:20px; bottom:20px; position:fixed; z-index:999999; text-indent:-9999px; width:80px; height:80px; background:url('../images_new/btn_top.png') no-repeat; background-size:80px 80px; opacity:.8;}

/*** Header Styles ***/
#header_wrap {width:100%; height:167px; background-color:#fff; text-align:center; position:fixed; z-index:10; -webkit-box-shadow:0 4px 20px -5px rgba(0, 0, 0, 0.2); box-shadow:0 4px 20px -5px rgba(0, 0, 0, 0.2); box-sizing:border-box;}
#nav {display:block; width:100%; height:53px; position:absolute; top:0; background:url('../images_new/nav_bg.gif') repeat-x bottom center; background-size:1px 1px; box-sizing:border-box;}
#nav ul {display:inline-block; width:100%; max-width:1100px;}
#nav ul:after {content:""; display:block; clear:both;}
#nav li {float:left; width:25%; height:100%; line-height:50px; display:inline-block; font-family:'NanumSquare-ExtraBold'; font-size:18px;}
#nav li a {display:inline-block; width:100%; height:100%; line-height:44px; border:3px solid; border-left:0; box-sizing:border-box;}
#nav li a span, #nav li a.on span {display:inline-block; height:37px; background-repeat:no-repeat; background-position:right bottom; padding-top:3px; box-sizing:border-box;}
#nav li a.on span {color:#fff;}
#nav li a.on {cursor:default;}
#nav li:nth-child(1) a {color:#07a3a1; border-color:#07a3a1; border-left:3px solid !important;}
#nav li:nth-child(2) a {color:#d99694; border-color:#d99694;}
#nav li:nth-child(3) a {color:#b3a2c7; border-color:#b3a2c7;}
#nav li:nth-child(4) a {color:#989182; border-color:#989182;}
#nav li:nth-child(1) a span {background-image:url('../images_new/nav_01.png'); background-size:29px 29px; padding-right:33px;}
#nav li:nth-child(2) a span {background-image:url('../images_new/nav_02.png'); background-size:30px 29px; padding-right:34px;}
#nav li:nth-child(3) a span {background-image:url('../images_new/nav_03.png'); background-size:30px 29px; padding-right:34px;}
#nav li:nth-child(4) a span {background-image:url('../images_new/nav_04.png'); background-size:29px 29px; padding-right:33px;}
#nav li:nth-child(1) a.on {background-color:#07a3a1;}
#nav li:nth-child(2) a.on {background-color:#d99694;}
#nav li:nth-child(3) a.on {background-color:#b3a2c7;}
#nav li:nth-child(4) a.on {background-color:#989182;}
#nav li:nth-child(1) a.on span {background-image:url('../images_new/nav_01_on.png');}
#nav li:nth-child(2) a.on span {background-image:url('../images_new/nav_02_on.png');}
#nav li:nth-child(3) a.on span {background-image:url('../images_new/nav_03_on.png');}
#nav li:nth-child(4) a.on span {background-image:url('../images_new/nav_04_on.png');}
#wifine_02 #nav li:nth-child(1) a {border-right:0;}
#wifine_03 #nav li:nth-child(2) a {border-right:0;}
#wifine_04 #nav li:nth-child(3) a {border-right:0;}
#nav_m {display:none; width:100%;}
#nav_m ul:after {content:""; display:block; clear:both;}
#nav_m li {float:left; width:25%; height:100%; line-height:50px; display:inline-block; font-family:'NanumSquare-ExtraBold'; font-size:20px;}
#nav_m li a {display:inline-block; width:100%; height:100%; line-height:44px; border:3px solid; border-left:0px; box-sizing:border-box;}
#nav_m li {float:left; width:25%; height:100%; line-height:60px; display:inline-block; position:relative;}
#nav_m li a span, #nav_m li a.on span {display:inline-block; height:54px; line-height:54px; box-sizing:border-box;}
#nav_m li a.on span {color:#fff;}
#nav_m li a.on {cursor:default;}
#nav_m li:nth-child(1) a {color:#07a3a1; border-color:#07a3a1; border-left:2px solid !important;}
#nav_m li:nth-child(2) a {color:#d99694; border-color:#d99694;}
#nav_m li:nth-child(3) a {color:#b3a2c7; border-color:#b3a2c7;}
#nav_m li:nth-child(4) a {color:#989182; border-color:#989182;}
#nav_m li:nth-child(1) a.on {background-color:#07a3a1;}
#nav_m li:nth-child(2) a.on {background-color:#d99694;}
#nav_m li:nth-child(3) a.on {background-color:#b3a2c7;}
#nav_m li:nth-child(4) a.on {background-color:#989182;}
#nav_m li a .arrow {display:none; width:0; height:0; border-left:10px solid transparent; border-right:10px solid transparent; border-top:13px solid #fff; position:absolute; bottom:-50px; left:43%;}
#nav_m li a.on .arrow {display:inline-block;}
#nav_m li:nth-child(1) a.on .arrow {border-top-color:#07a3a1;}
#nav_m li:nth-child(2) a.on .arrow {border-top-color:#d99694;}
#nav_m li:nth-child(3) a.on .arrow {border-top-color:#b3a2c7;}
#nav_m li:nth-child(4) a.on .arrow {border-top-color:#989182;}
#wifine_02 #nav_m li:nth-child(1) a {border-right:0;}
#wifine_03 #nav_m li:nth-child(2) a {border-right:0;}
#wifine_04 #nav_m li:nth-child(3) a {border-right:0;}
#header {display:inline-block; width:100%; max-width:1140px; margin:78px auto 0; padding:0 20px; box-sizing:border-box;}
#header:after {content:""; display:block; clear:both;}
#header h1.logo {float:left;}
#header h1.logo a {background-repeat:no-repeat; background-position:left center; text-indent:-9999px; display:inline-block;}
#wifine_01 #header h1.logo a {width:213px; height:65px; background-image:url('../images_new/wifine_01_logo.png'); background-size:213px 65px;}
#wifine_02 #header h1.logo a {width:275px; height:65px; background-image:url('../images_new/wifine_02_logo.png'); background-size:275px 65px;}
#wifine_03 #header h1.logo a {width:275px; height:65px; background-image:url('../images_new/wifine_03_logo.png'); background-size:275px 65px;}
#wifine_04 #header h1.logo a {width:253px; height:65px; background-image:url('../images_new/wifine_04_logo.png'); background-size:253px 65px;}
#header .gnb {width:auto; height:35px; padding-top:30px; text-align:right; float:right;}
#header .gnb ul {display:inline-block;}
#header .gnb ul:after {content:""; display:block; clear:both;}
#header .gnb li {float:left; display:inline-block; padding-left:20px; margin-left:20px; background:url('../images_new/gnb_bar.png') no-repeat left center; background-size:2px 16px;}
#header .gnb li:first-child {padding-left:0; margin-left:0; background:none;}
#header .gnb li a {display:inline-block; font-family:'NanumSquare-Bold'; font-size:22px; line-height:normal; color:#3c382b;}
#header .gnb li a:hover {color:#edbc31;}

/*** Footer Styles ***/
#footer_wrap {background:#3c382b; width:100%; color:#fff !important; opacity:1; font-family:'NanumSquare-Light'; padding:60px 0 30px; display:inline-block; text-align:center;}
#footer {display:inline-block; width:100%; max-width:1140px; height:100%; margin:0 auto; padding:0 20px; box-sizing:border-box;}
#footert:after {content:""; display:block; clear:both;}
#footer > h2 {font-family:'NanumSquare-Bold'; font-size:36px; line-height:normal; display:inline-block; float:left; padding-right:30px; margin:0 0 20px;}
#footer > h2 span {font-family:'NanumSquare-Light';}
address {display:inline-block; font-size:16px; line-height:22px; float:left; text-align:left;}
address:after {content:""; display:block; clear:both;}
address span {float:left; padding-right:14px; display:inline-block;}
address ol {display:inline-block;}
address ol:after {content:""; display:block; clear:both;}
address li {float:left; padding:0 14px; display:inline-block; background:url('../images_new/addr_bar.png') no-repeat left center; background-size:2px 14px;}
address strong {font-family:'NanumSquare-Bold';}
.copyright {display:block; opacity:.27; font-size:14px; line-height:normal; letter-spacing:normal; text-align:left;}

/*** Container Styles ***/
#container {width:100%; display:inline-block; padding-top:167px; box-sizing:border-box;}
.section {width:100%; display:inline-block; text-align:center; padding:60px 0;}
.section h3 {font-family:'NanumSquare-ExtraBold'; font-size:40px; line-height:normal; color:#3c382b; margin-bottom:30px; padding-bottom:30px; background:url('../images_new/tit_line.png') no-repeat center bottom; background-size:48px 4px;}
#service {padding:0;}
#service .pc, #service .mobile {display:inline-block; width:100%; background-position:top center; background-repeat:no-repeat;}
#service .pc {background-size:1920px 676px;}
#service .mobile {display:none; width:100%; background-size:cover;}
#wifine_01 #service .pc, #wifine_01 #service .mobile {background-color:#07a3a1;}
#wifine_01 #service .pc {background-image:url('../images_new/wifine_01_pc.jpg');}
#wifine_01 #service .mobile {background-image:url('../images_new/wifine_01_m.jpg');}
#wifine_02 #service .pc, #wifine_02 #service .mobile {background-color:#d99694;}
#wifine_02 #service .pc {background-image:url('../images_new/wifine_02_pc.jpg');}
#wifine_02 #service .mobile {background-image:url('../images_new/wifine_02_m.jpg');}
#wifine_03 #service .pc, #wifine_03 #service .mobile {background-color:#b3a2c7;}
#wifine_03 #service .pc {background-image:url('../images_new/wifine_03_pc.jpg');}
#wifine_03 #service .mobile {background-image:url('../images_new/wifine_03_m.jpg');}
#wifine_04 #service .pc, #wifine_04 #service .mobile {background-color:#989182;}
#wifine_04 #service .pc {background-image:url('../images_new/wifine_04_pc.jpg');}
#wifine_04 #service .mobile {background-image:url('../images_new/wifine_04_m.jpg');}
#about {background-color:#f5f3ec;}
#about .pc {display:inline-block; box-sizing:border-box;}
#about .mobile {display:none;}
#wifine_01 #guide {background-color:#fff;}
#wifine_01 #guide .swiper-container {max-width:1100px;}
#faq {background-color:#ededed;}
#faq .accordion_wrap {width:100%; max-width:900px; margin:0 auto; padding:0 20px 10px; box-sizing:border-box;}
#faq .accordion {width:100%; background-color:#fff; padding:10px 20px; box-sizing:border-box;}
#faq .accordion section {display:block; border-top:1px dashed #e6e6e6; box-sizing:border-box;}
#faq .accordion #one {border:none;}
#faq .accordion div, #faq .accordion p a {background-repeat:no-repeat; background-size:21px 26px;}
#faq .accordion div {position:relative; height:auto; display:none; padding:5px 20px 25px 60px; background-image:url('../images_new/wifine_faq_a.png'); background-position:30px 8px; font-size:14px; font-family:'notokr-regular'; line-height:20px; color:#666;}
#faq .accordion p {text-align:left;}
#faq .accordion p a {color:#3c382b; padding:15px 30px 10px 60px; display:block; position:relative; outline:0; text-decoration:none; line-height:26px; font-family:'NanumSquare-Bold'; font-size:18px; background-image:url('../images_new/wifine_faq_q.png'); background-position:30px center; box-sizing:border-box;}
#faq .accordion p a:hover, #faq .accordion p.active a {color:#07a3a1;}
#faq .accordion+p {font-family:'NanumSquare-Regular'; font-size:16px; line-height:20px; color:#282828; text-align:left; width:100%; margin:0 auto; padding:15px 53px 0; box-sizing:border-box;}
#contact {background-color:#989182;}
#contact input {display:block; margin-bottom:10px; outline:0; border:0; background-color:#fff; width:100%; padding:14px 20px; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; font-family:'NanumSquare-Bold'; font-size:18px; line-height:normal; box-sizing:border-box;}
#contact form {width:100%; max-width:900px; margin:0 auto; padding:10px 20px; box-sizing:border-box;}
#contact .btn_send {margin-top:45px; font-family:'NanumSquare-ExtraBold'; font-size:30px; line-height:normal; color:#fff; display:inline-block; padding:18px 45px 16px; background-color:#3c382b; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px;}
#contact .btn_send > span {color:#edbc31;}
#contact form div {display:block; margin-bottom:10px; background-color:#fff; width:100%; padding:14px 20px; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; font-family:'NanumSquare-Bold'; font-size:18px; line-height:normal; color:#afaeab; text-align:left; box-sizing:border-box;}
#contact textarea {height:220px; font-family:'NanumSquare-Regular'; font-size:14px; line-height:normal; outline:0; border:0; background-color:#fff; width:100%; padding:10px 0 0; resize:none; box-sizing:border-box;}
#contact ul {width:100%; padding-top:25px; box-sizing:border-box;}
#contact ul:after {content:""; display:block; clear:both;}
#contact li {float:left; width:32%; padding-left:2%; padding-top:15px; display:inline-block;}
#contact li:first-child {padding-left:0;}
#contact li dl {display:inline-block; width:100%; padding:27px 5px 30px 95px; background-repeat:no-repeat; background-size:63px 63px; background-position:18px center; box-sizing:border-box;}
#contact li:nth-child(1) dl {background-color:#645f36; background-image:url('../images_new/wifine_contact_img01.png');}
#contact li:nth-child(2) dl {background-color:#65b1ba; background-image:url('../images_new/wifine_contact_img02.png');}
#contact li:nth-child(3) dl {background-color:#edbc31; background-image:url('../images_new/wifine_contact_img03.png');}
#contact li dt, #contact li dd {text-align:left; color:#fff;}
#contact li dt {font-family:'NanumSquare-ExtraBold'; font-size:20px; padding-bottom:5px; box-sizing:border-box;}
#contact li dd {font-family:'NanumSquare-Bold'; font-size:14px; line-height:normal; padding-top:3px; box-sizing:border-box;}


@media screen and (max-width:918px) {
.return-top {right:10px; bottom:45px; width:55px; height:55px; background-size:55px 55px;}

/*** Header Styles ***/
#header_wrap {position:relative; height:auto !important; padding-bottom:15px;}
#header {width:100%; margin:0 auto; padding:0; text-align:center;}
#header h1 {width:100%; padding:30px 0 35px; display:block; text-align:center;}
#wifine_01 #header h1.logo a {margin-left:60px;}
#wifine_02 #header h1.logo a {margin-left:122px;}
#wifine_03 #header h1.logo a {margin-left:122px;}
#wifine_04 #header h1.logo a {margin-left:100px;}
#nav {display:none;}
#nav_m {display:block;}
#header .gnb {width:100%; text-align:center;}
#header .gnb ul {margin:0 auto;}
#header .gnb li a {font-size:20px; line-height:37px;}
#header .gnb li {text-align:center;}

/*** Footer Styles ***/
#footer_wrap {padding:40px 0 30px;}
#footer {text-align:center;}
#footer > h2 {padding-right:0; width:100%; text-align:center; font-size:30px; margin:0 0 10px;}
address {width:100%; text-align:center;}
address span {width:100%; text-align:center; font-size:14px; padding-right:0;}
address ol {width:auto;}
address li {font-size:14px;}
address li:first-child {background:none; padding-left:0;}
.copyright {font-size:12px; text-align:center;}

/*** Container Styles ***/
#container {padding-top:0;}
.section {padding:40px 0;}
#service .pc {display:none;}
#service .mobile {display:inline-block;}
#about .pc {display:none;}
#about .mobile {display:inline-block;}
#faq .accordion div {padding:5px 10px 25px 40px; background-position:10px 8px;}
#faq .accordion p a {padding:15px 10px 10px 40px; background-position:10px center;}
#contact li dl {padding:105px 5px 25px; background-position:center 25px;}
#contact li dt, #contact li dd {text-align:center;}
}

@media screen and (max-width:640px) {
/*** Header Styles ***/
#header_wrap {padding-bottom:0;}
#header h1 {padding:20px 0 20px;}
#wifine_01 #header h1.logo a {width:147px; height:45px; background-size:147px 45px; margin-left:42px;}
#wifine_02 #header h1.logo a {width:190px; height:45px; background-size:190px 45px; margin-left:85px;}
#wifine_03 #header h1.logo a {width:190px; height:45px; background-size:190px 45px; margin-left:85px;}
#wifine_04 #header h1.logo a {width:175px; height:45px; background-size:175px 45px; margin-left:70px;}
#nav_m li {font-size:16px;}
#nav_m li a span, #nav_m li a.on span {height:44px; line-height:44px;}
#nav_m li a .arrow {bottom:-37px;}
#header .gnb {padding-top:15px;}
#header .gnb li {padding-left:10px; margin-left:11px; background-size:1px 12px;}
#header .gnb li a {font-size:14px;}

/*** Container Styles ***/
.section {padding:30px 0;}
.section h3 {font-size:30px; margin-bottom:15px; padding-bottom:12px; background-size:30px 3px;}
#faq .accordion+p {text-align:center; padding:20px 25px 0; font-size:14px;}
#faq .accordion div, #faq .accordion p a {background-size:16px 20px;}
#faq .accordion div {padding:5px 10px 25px 35px;}
#faq .accordion p a {padding:15px 10px 10px 35px; background-position:10px 18px;}
#contact .btn_send {margin-top:30px; font-size:22px; padding:22px 35px 20x;}
#contact ul {padding-top:10px;}
#contact li {width:100%; padding-left:0; padding-top:10px;}
#contact li dl {display:inline-block; width:100%; padding:20px 5px 20px 120px; background-position:30px center; box-sizing:border-box;}
#contact li dt, #contact li dd {text-align:left;}
#faq .accordion p a, #contact input, #contact form div {font-size:16px;}
#contact li dt {font-size:18px; padding-bottom:0;}
#contact textarea {height:150px;}

/*** Footer Styles ***/
#footer_wrap {padding:25px 0 15px;}
address li {float:none; display:block; padding:0; background:none;}
address li:first-child {background:none;}
.copyright {padding-top:5px;}
}
@media screen and (max-width:380px) {
/*** Header Styles ***/
#header .gnb li {padding-left:5px; margin-left:6px;}
}