@charset "utf-8";
@import "global.css";


/* layer popup */
.layer-outer {display:table; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: url(../../images/common/black_30.png) 0 0 repeat; z-index: 99;}
.layer-outer .layer_inner {display:table-cell; width: 100%; height: 100%; text-align: center; vertical-align: middle; position: relative; z-index: 999;}
.layer-outer .layer_inner .layer-popup {display:inline-block; overflow-y:auto; box-sizing:border-box; background: #ffffff; position: relative;}
.layer-popup.style1 {padding: 0 30px 25px 30px; border-top: 4px solid #0c9fff;}
.layer-popup.style1 .title-area {text-align: center; line-height: 77px; font-size: 26px; color: #000000; position: relative;}
.layer-popup.style1 .blue-text {padding: 15px 0; background: #e5f5ff; text-align: center;}
.layer-popup.style1 .blue-text .txt1 {font-size: 16px; color: #0099ff;}
.layer-popup.style1 .blue-text .txt2 {line-height: 28px; font-weight: 300; font-size: 16px; color: #7a8d99;}
.layer-popup.style1 .write-area {margin-top: 20px;}
.layer-popup.style1 .write-area input {margin-top: 10px; font-size: 14px; color: #999999;}
.layer-popup.style1 .write-area input:first-child {margin-top: 0;}
.layer-popup.style1 .write-area p {font-size: 14px; color: #999999; text-align: left;}
.layer-popup.style1 .write-area textarea {font-size: 14px; font-weight: 400;}
.layer-popup .btn-close {display: block; width: 20px; height: 20px; position: absolute; top: 30px; right: 30px; z-index: 999;}

.layer-popup.style2 {padding: 50px; border-top: 4px solid #0c9fff;}
.layer-popup .table-area .tit {padding: 10px 0; text-align: left; font-size: 22px; color: #000;}
.layer-popup .table-area table {border-top: 1px solid #d3d3d3 ;}
.layer-popup .table-area table th {border-bottom: 1px solid #d3d3d3; border-left: 1px solid #d3d3d3; text-align: center; padding: 20px 0; background: #f9f9f9; font-size: 18px; color: #000;}
.layer-popup .table-area table th:first-child {border-left: none;}
.layer-popup .table-area table td {border-bottom: 1px solid #d3d3d3; border-left: 1px solid #d3d3d3; padding: 20px 0; text-align: center; font-weight: 300; font-size: 18px; color: #333333;}

/* load motion */
.n-motion {filter:alpha(opacity=0); opacity:0; transition-property:all; transition-duration:0.6s;}

.n-delay1 {transition-delay:0.1s;}
.n-delay2 {transition-delay:0.2s;}
.n-delay3 {transition-delay:0.3s;}
.n-delay4 {transition-delay:0.4s;}
.n-delay5 {transition-delay:0.5s;}
.n-delay6 {transition-delay:0.6s;}
.n-delay7 {transition-delay:0.7s;}
.n-delay8 {transition-delay:0.8s;}
.n-delay9 {transition-delay:0.9s;}

.n-motion.n-left {transform:translateX(-50px);}
.n-motion.n-right {transform:translateX(50px);}
.n-motion.n-top {transform:translateY(-50px);}
.n-motion.n-bottom {transform:translateY(50px);}
.n-motion.n-spin {transform:rotate(180deg);}

.n-motion.n-active {filter:alpha(opacity=100); opacity:1;}

.n-motion.n-left.n-active {transform:translateX(0);}
.n-motion.n-right.n-active {transform:translateX(0);}
.n-motion.n-top.n-active {transform:translateY(0);}
.n-motion.n-bottom.n-active {transform:translateY(0);}
.n-motion.n-spin.n-active {transform:rotate(0deg);}

#wrap {width: 100%; min-width:1200px; box-sizing:border-box; min-height:100%; background: #ffffff; position: relative; overflow: hidden;}

#container {width: 100%;}

#header { position:relative; width:100%; height: 90px;}
#header .header-inner {width: 1200px; height: 90px; margin: 0 auto; box-sizing:border-box; position: relative;}
#header .header-inner .logo {position: absolute; top: 30px; left: 0;}
#header .header-inner .logo-old {position: absolute; top: 37px; left: 245px;}
#header .header-inner .gnb {position: absolute; right: 0; top: 0; overflow: hidden;}
#header .header-inner .gnb li {float: left;}
#header .header-inner .gnb li a {display: block; padding: 0 21px; line-height: 90px; font-size: 18px; color: #000;}

#pageTop {width: 1200px; margin: 0 auto;}
#pageTop .page-hgroup {width: 1200px; height: 240px; padding: 0 352px; margin: 0 -352px; text-align: center;}
#pageTop .page-hgroup.highmakeshop {background: url(../../images/common/page_top_visual1.jpg) 0 0 no-repeat;}
#pageTop .page-hgroup.suppport {background: url(../../images/common/page_top_visual2.jpg) 0 0 no-repeat;}
#pageTop .page-hgroup.startup {background: url(../../images/common/page_top_visual3.jpg) 0 0 no-repeat;}
#pageTop .page-hgroup.e-commerce {background: url(../../images/common/page_top_visual4.jpg) 0 0 no-repeat;}
#pageTop .page-hgroup.pay {background: url(../../images/common/page_top_visual5.jpg) 0 0 no-repeat;}
#pageTop .page-hgroup .txt {font-weight: 300; padding-top: 70px; font-size: 20px; color: #fff;}
#pageTop .page-hgroup h2 {font-size: 52px; color: #fff;}

.pageBot {width: 1200px; margin: 120px auto 0;}
.pageBot .pageBot-inner {width: 1200px; height: 486px; padding: 0 352px; margin: 0 -352px; text-align: center;}
.pageBot .pageBot-inner.highmakeshop {background: url(../../images/common/page_bottom_visual1.jpg) 0 0 no-repeat;}
.pageBot .pageBot-inner > div .txt1 {font-weight: 300; font-size: 18px; color: #bfbfbf;}
.pageBot .pageBot-inner > div .txt1 .blue {color: #0c9fff;}
.pageBot .pageBot-inner > div .txt2 {font-weight: 300; font-size: 42px; color: #fff;}
.pageBot .pageBot-inner > div .txt3 {font-weight: 300; font-size: 20px; color: #0c9fff;}

.tab-wrap {text-align: center;}
.tab-wrap ul {display: inline-block; width: 640px;}
.tab-wrap ul li {width: 50%; float: left;}
.tab-wrap ul li a {display: block; background: #ffffff; text-align: center; line-height: 53px; font-size: 18px; color: #999999; border-top: 1px solid #dddddd; border-bottom: 1px solid #dddddd; border-left: 1px solid #dddddd;}
.tab-wrap ul li:last-child a {border-right: 1px solid #dddddd;}
.tab-wrap ul li.on a {color: #000000;  background: #ffd31a; border-left: 1px solid #ffd31a; border-top: 1px solid #ffd31a; border-bottom: 1px solid #ffd31a;}
.tab-wrap ul li.on:last-child a {border-right: 1px solid #ffd31a;}

.blue {color: #0c9fff !important;}
.black {color: #000000 !important;}

.contents {width: 1200px; margin: 0 auto; padding: 48px 0 130px;}

.btn-wrap {width: 100%;}

.about-section {margin-top: 110px;}
.about-section .title-area {text-align: center;}
.about-section .title-area .e-tit {font-size: 18px; color: #666666;}
.about-section .title-area .tit {font-size: 42px; color: #000;}
.about-section .title-area .txt {margin-top: 20px; line-height: 28px; font-size: 18px; color: #333333;}
.about-section .benefit {width: 1197px; margin-top: 40px; overflow: hidden; border-right: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee;}
.about-section .benefit li {display:table; width: 398px; height: 257px; float: left; border-top: 1px solid #eeeeee; border-left: 1px solid #eeeeee; overflow: hidden; position: relative;}
.about-section .benefit li a {display: table-cell; vertical-align: middle; height: 100%; text-align: center;}
.about-section .benefit li a .name {display: block; margin-top: 20px; font-weight: 700; font-size: 24px; color: #000;}
.about-section .benefit li a .txt {display: block; font-weight: 300; line-height: 20px; font-size: 16px; color: #666666;}
.about-section .benefit li a.hover {width: 100%; height: 157px; padding: 50px 0; position: absolute; top: 258px; left: 0; background: #ffdb4c; opacity: 0; filter:alpha(opacity=0);}
.about-section .benefit li a.hover.on {opacity: 1; filter:alpha(opacity=100);}
.about-section .benefit li a.hover .name {color: #40360d;}
.about-section .benefit li a.hover .txt {margin-top: 20px; color: #806e26;}
.about-section .img-banner {position: relative;}
.about-section .img-banner p {position: absolute; top: 103px; left: 630px; text-align: center; line-height: 46px; font-weight: 700; font-size: 24px; color: #000; text-decoration:underline;}

.about-section .service-list {padding-left: 210px; overflow: hidden;}
.about-section ol {float: left;}
.about-section ol.right {margin-left: 20px;}
.about-section ol li {width: 421px; margin-top: 40px; padding-left: 63px; position: relative; font-weight: 300; font-size: 20px; color: #666666; line-height: 36px;}
.about-section ol li span {position: absolute; left: 0; font-size: 36px; color: #0c9fff; font-weight: 400;}

#footer {width: 100%; border-top: 4px solid #cccccc;}
#footer .footer-top {border-bottom: 1px solid #eeeeee;}
#footer .inner {width: 1200px; margin: 0 auto; overflow: hidden; position: relative; z-index: 1;}
#footer .footer-top .inner .ft-menu {display: inline-block;}
#footer .footer-top .inner .ft-menu li {float: left;}
#footer .footer-top .inner .ft-menu li a {padding: 0 14px; line-height: 64px; font-weight: 300; font-size: 15px; color: #333333;}
#footer .footer-top .inner select {width: 173px; padding: 0 20px; height: 34px; margin: 15px 0 15px 24px; font-size: 12px; color: #999999;}
#footer .footer-bottom .inner {display:table; overflow: hidden;}
#footer .footer-bottom .inner .left {display:table-cell; width: 260px; height: 126px; vertical-align: middle;}
#footer .footer-bottom .inner .left a {display: block;}
#footer .footer-bottom .inner .right {display:table-cell; width: auto; height: 126px; vertical-align: middle;}
#footer .footer-bottom .inner .right address {font-weight: 300; font-size: 14px; color: #666666; overflow: hidden;}
#footer .footer-bottom .inner .right address span {float: left; padding-left: 20px; position: relative;}
#footer .footer-bottom .inner .right address span:before {display: block; content:''; width: 1px; height: 13px; position: absolute; top: 5px; left: 10px; background: #666666;}
#footer .footer-bottom .inner .right address span:first-child {padding-left: 0;}
#footer .footer-bottom .inner .right address span:first-child:before {display: none;}
#footer .footer-bottom .inner .right .center {font-weight: 300; overflow: hidden; font-size: 14px; color: #666666;}
#footer .footer-bottom .inner .right .center span {float: left; padding-left: 20px; position: relative;}
#footer .footer-bottom .inner .right .center span:first-child {padding-left: 0;}
#footer .footer-bottom .inner .right .center span:before {display: block; content:''; width: 1px; height: 13px; position: absolute; top: 5px; left: 10px; background: #666666;}
#footer .footer-bottom .inner .right .center span:first-child:before {display: none;}
#footer .footer-bottom .inner .right .center span.copyright {padding-left: 10px;}
#footer .footer-bottom .inner .right .center span.copyright:before {display: none;}

.pagination	{margin-top: 50px; width: 100%; height: 30px; text-align: center; position: relative;}
.pagination .paging {display: inline-block;}
.pagination .paging > a {display: block; width: 30px; height: 30px; margin-left: 10px; float: left;}
.pagination .paging .page-next {background: url(../../images/common/page_next.png) center center no-repeat;}
.pagination .paging .page-last {background: url(../../images/common/page_last.png) center center no-repeat;}
.pagination .paging .page-first {background: url(../../images/common/page_first.png) center center no-repeat;} /* 18.07.20 추가 */
.pagination .paging .page-prev {background: url(../../images/common/page_prev.png) center center no-repeat;} /* 18.07.20 추가 */
.pagination .paging .page {display: block; float: left; padding: 0 30px;}
.pagination .paging .page a {width: 30px; height: 30px; padding: 6px 0; margin: 0 0 0 30px; font-size: 
12px; box-sizing: border-box; font-weight: 300; font-size: 16px; color: #999999; text-align: center; line-height: 30px;}
.pagination .paging .page a.on {color: #333333;}

.sub-hgroup {text-align: center; padding: 90px 0 12px;}
.sub-hgroup h3 {display: inline-block; position: relative; font-size: 42px; color: #000000; font-weight: 400;}
.sub-hgroup .line span {display: inline-block; width: 1px; height: 40px; margin-top: 20px; background: #cccccc;}
.sub-hgroup .e-tit {text-align: center; font-weight: 300; font-size: 18px; color: #666666;}

.board-search-wrap .box {display: inline-block; position: relative;}
.board-search-wrap .box input[type=submit] {width: 45px; height: 45px; position: absolute; top: 0; right: 0; display: block; border: none; border-radius:0; background: url(../../images/common/ico_btn_search.gif) center center no-repeat; text-indent:-9999px;}

.notice-list-wrap {margin-top: 25px;}
.notice-list-wrap .notice {border-top: 2px solid #333333;}
.notice-list-wrap .notice tr td {padding: 20px; text-align: center;}
.notice-list-wrap .notice thead td {font-size: 18px; color: #000; border-bottom: 1px solid #cccccc;}
.notice-list-wrap .notice tbody td {border-bottom: 1px solid #ccc; font-weight: 300; font-size: 16px; color: #333333;}
.notice-list-wrap .notice tbody td.title {text-align: left;}
.notice-list-wrap .notice tbody td a {display: block; padding-left: 30px;}
.notice-list-wrap .notice tbody .top td .new {padding-left: 5px;font-weight: 700; font-size: 16px; color: #25afff;}
.notice-list-wrap .notice tbody .top td {background: #f2f2f2;}

label {display: inline-block; position: relative; margin-left: 48px;}
label:first-child {margin-left: 0;}
label input[type=radio] {position: absolute; top: 0; left: 0; opacity: 0; filter:alpha(opacity=0);}
label input[type=checkbox] {position: absolute; top: 0; left: 0; opacity: 0; filter:alpha(opacity=0);}
label.rdo span {display: block; padding-left: 40px; line-height: 30px; font-weight: 300; font-size: 16px; color: #333333;}

label.rdo input[type=radio] + span:before {display: block; content:''; width: 30px; height: 30px; background: url(../../images/common/rdo_off.png) 0 0 no-repeat; position: absolute; top: 0; left: 0;}
label.rdo input[type=radio]:checked + span:before {background: url(../../images/common/rdo_on.png) 0 0 no-repeat;}

label.chk span {display: block; padding-left: 40px; line-height: 30px; font-size: 18px; color: #333333;}
label.chk input[type=checkbox] + span:before {display: block; content:''; width: 30px; height: 30px; background: url(../../images/common/chk_off.gif) 0 0 no-repeat; position: absolute; top: 0; left: 0;}
label.chk input[type=checkbox]:checked + span:before {background: url(../../images/common/chk_on.gif) 0 0 no-repeat;}
label.chk.big span {padding-left: 50px;}
label.chk.big input[type=checkbox] + span:before {width: 50px; height: 50px; background: url(../../images/common/chk_big_off.png) 0 0 no-repeat; position: absolute; top: 0; left: 0;}
label.chk.big input[type=checkbox]:checked + span:before {background: url(../../images/common/chk_big_on.png) 0 0 no-repeat;}

label.rdo-n-text {width: 30px; height: 30px; background: url(../../images/common/rdo_off.png) 0 0 no-repeat;}

.h-text-wrap {margin-bottom: 50px;}
.h-text-wrap p {font-weight: 300; font-size: 18px; color: #000000;}
.h-text-wrap p.red {color: #ff3333;}
.h-text-wrap.gray {padding: 30px 0; background: #f2f2f2;}
.h-text-wrap.gray p {color: #666666;}

.tab-wrap.tab3 ul {width: 958px;}
.tab-wrap.tab3 ul li {width: 318px;}

.tab-wrap.tab4 ul {width: 100%;}
.tab-wrap.tab4 ul li {width: 25%;}

.write-wrap .write-style1 {border-top: 2px solid #000;}
.write-wrap .write-style1 > tbody > tr > th {padding: 30px; text-align: left; font-weight: 400; font-size: 18px; color: #000000; border-bottom: 1px solid #dddddd; vertical-align: top;}
.write-wrap .write-style1 > tbody > tr > td {padding: 20px 0; border-bottom: 1px solid #dddddd;}
.write-wrap .write-style1 > tbody > tr > td .e-mail {overflow: hidden;}
.write-wrap .write-style1 > tbody > tr > td .e-mail * {float: left;}
.write-wrap .write-style1 > tbody > tr > td .e-mail span {display: inline-block; width: 30px; text-align: center; line-height: 45px;}
.write-wrap .write-style1 > tbody > tr > td .e-mail select {margin-left: 10px;}
.write-wrap .write-style1 > tbody > tr > td .phone {overflow: hidden;}
.write-wrap .write-style1 > tbody > tr > td .phone * {float: left;}
.write-wrap .write-style1 > tbody > tr > td .phone span {display: inline-block; width: 30px; text-align: center; 
line-height: 45px;}
.write-wrap .write-style1 td .terms {margin-top: 25px; height: 190px; padding: 30px; border: 1px solid #dddddd; font-weight: 300; font-size: 16px; color: #999999; overflow-y:auto;}

.seleted-list {padding: 50px 0 30px;}
.seleted-list ol {overflow: hidden;}
.seleted-list ol li {float: left; width: 461px; margin: 0 0 20px 75px; padding-left: 64px; position: relative;}
.seleted-list ol li .tit {position: absolute; top: 0; left: 0; font-weight: 700; line-height: 20px; font-size: 20px; color: #000;}
.seleted-list ol li .element span {display: inline-block; float: left; margin-left: 17px; font-size: 20px; color: #666666; line-height: 20px;}
.seleted-list ol li .element span:first-child {margin-left: 0;}
.seleted-list ol li .element span a {display: inline-block; margin-left: 7px;}
.seleted-list ol li .fc-blue {font-size: 20px; line-height: 20px; color: #0c9fff;}

.txt-c {text-align: center;}

.download {display: inline-block; padding-right: 35px; background: url(../../images/common/ico_download.png) right center no-repeat; color: #000;}

.btn80 {display: inline-block; line-height: 80px; text-align: center; font-size: 24px;}
.btn80.yellow {background: #ffd31a; color: #ffffff;}
.btn80.blue {background: #0c9fff; color: #ffffff !important;}
.btn60 {display: inline-block; line-height: 60px; text-align: center; font-size: 20px;}
.btn60.yellow {background: #ffd31a; color: #ffffff;}
.btn60.gray {background: #dddddd; color: #000000;} /* 18.07.20 추가 */
.btn60.blue {background: #0c9fff; color: #ffffff !important;}
.btn80.sky {background: #0c9fff; color: #ffffff;}
.btn45 {display: inline-block; line-height: 45px; text-align: center; font-size: 16px;}
.btn43 {display: inline-block; line-height: 43px; text-align: center; font-size: 14px;}
.btn43.border-blue {border: 1px solid #0c9fff; color: #0c9fff;}
.border-white {border: 2px solid #fff; color: #fff !important;}
.btn46 {display: inline-block; line-height: 46px; text-align: center; font-size: 16px;}
.btn46.sky {background: #0c9fff; color: #ffffff;}

.step-tab {margin-top: 40px;}
.step-tab ul {overflow: hidden;}
.step-tab ul li {width: 25%; float: left;}
.step-tab ul li a {display: block; text-align: center; line-height: 53px; border-bottom: 3px solid #dddddd; font-weight: 300; color: #999999; font-size: 16px;}
.step-tab ul li.on a {border-bottom: none; border-left: 3px solid #dddddd; border-right: 3px solid #dddddd; border-top: 3px solid #0c9fff; color: #0c9fff;}
.step-tab-con {border-bottom: 3px solid #dddddd;}
.step-tab-con > ul > li {display: table; width: 100%; padding: 40px 0; border-top: 1px solid #dddddd; overflow: hidden; position: relative;}
.step-tab-con > ul > li:first-child {border-top: none;}
.step-tab-con > ul > li .img {display:table-cell; width: 329px;}
.step-tab-con > ul > li .img img {width: 329px; height: 172px;}
.step-tab-con > ul > li .text {display:table-cell; vertical-align: middle; padding-left: 38px;}
.step-tab-con > ul > li .text .tit {font-weight: 700; font-size: 24px; color: #000;}
.step-tab-con > ul > li .text .tit-s {font-weight: 700; font-size: 16px; color: #666;}
.step-tab-con > ul > li .text ul li {padding-left: 8px; position: relative; line-height: 30px; font-size: 16px; font-weight: 300; color: #666666;}
.step-tab-con > ul > li .text ul li:before {display: block; content:'-'; position: absolute; top: 0; left: 0;}
.step-tab-con > ul > li .text ul li a.fc-blue {color: #0c9fff; text-decoration:underline;}
.step-tab-con > ul > li .text > ul.number > li {padding-left: 13px;}
.step-tab-con > ul > li .text > ul.number > li:before {display: none;}
.step-tab-con > ul > li .text > ul.number > li span {position: absolute; top: 0; left: 0;}
.step-tab-con > ul > li .text > ul.dot > li {padding-left: 13px;}
.step-tab-con > ul > li .text > ul.dot > li:before {content:''; width: 4px; height: 4px; background: #666666; border-radius:10px; top: 14px;}
.step-tab-con > ul > li .chk {position: absolute; top: 50%; right: 0; margin-top: -15px;}

/* 메인 */
#main-banner {width: 1200px; margin:90px auto 0; position: relative;}
#main-banner .inner {width: 1903px; margin: 0 -352px;}
.btns {position: absolute; top: 22px; right: 84px;}
.btns a {display: block; width: 180px; height: 46px; margin-top: 7px; border: 2px solid #fff;}
.btns a:first-child {margin-top: 0;}
.btns a span {display: block; height: 46px; padding-left: 57px; line-height: 46px; font-size: 16px; color: #fff;} /* 18.07.20 추가*/
.btns a span.kakao {background: url(../../images/main/ico_main_kakao.png) 22px center no-repeat;}
.btns a span.naver {background: url(../../images/main/ico_main_naver.png) 22px center no-repeat;}
.btns a span.on {background: #ffffff; color: #a0b6cd; position: relative;}/* 18.07.20 추가*/
.btns a span.on:before {display: block; content:'@'; position: absolute; top: 0; left: 22px;}/* 18.07.20 추가*/

#main-contens {width: 1200px; margin: 90px auto 0; overflow: hidden;}
#main-contens .section1 {width: 598px; float: left;}
#main-contens .section1 .banner-slider {height: 200px; position: relative;}
#main-contens .section1 .banner-slider .bx-pager { padding-top: 0; position: absolute; top: 10px; right: 15px; width: auto;}
#main-contens .section1 .banner-slider .bx-pager a {width: 14px; height: 14px; border-radius:50%;}
#main-contens .section1 .banner-slider .bx-pager a.active {background: #ffffff;}
#main-contens .section2 {width: 554px; float: right;}
#main-contens .section2 .notice {height: 200px;}
#main-contens .section2 .notice .hd {padding-bottom: 10px; overflow: hidden; border-bottom: 1px solid #e5e5e5;}
#main-contens .section2 .notice .hd h3 {float: left; font-size: 22px; color: #000;}
#main-contens .section2 .notice .hd a {display: inline-block; float: right; font-size: 15px; color: #999999;}
#main-contens .section2 .notice .list {padding-top: 10px;}
#main-contens .section2 .notice .list ul li {margin-top: 12px;}
#main-contens .section2 .notice .list ul li a {display: block; overflow: hidden;}
#main-contens .section2 .notice .list ul li a .title {float: left; font-size: 14px; color: #666666;}
#main-contens .section2 .notice .list ul li a .title em {padding-left: 5px; font-weight: 700; font-size: 14px; color: #25afff;}
#main-contens .section2 .notice .list ul li a .date {float: right; font-size: 14px; color: #999999;}
#main-contens .section3 {width: 100%; padding-top: 77px; overflow: hidden;}
#main-contens .section3 .side {width: 240px; float: left; position: relative;}
#main-contens .section3 .side .title {font-weight: 700; line-height: 34px; font-size: 26px; color: #000;}
#main-contens .section3 .side ul.swiper-pagination {margin-top: 35px; position: relative; bottom: 0; text-align: left;}
#main-contens .section3 .side ul.swiper-pagination li {display: block; width: 156px; height: 30px; background: #ffffff; padding-left: 13px; line-height: 30px; font-size: 14px; color: #666666; border-radius:0; opacity: 1; filter:alpha(opacity=100);}
#main-contens .section3 .side ul.swiper-pagination li.swiper-pagination-bullet-active {background: #25afff; color: #ffffff;}
#main-contens .section3 .slide {width: 958px; float: left; position: relative;}
#main-contens .section3 .slide ul li img {width: 100%}
#main-contens .section3 .slide .swiper-button-prev {width: 72px; height: 72px; margin-top: -36px; left: 0; background: url(../../images/main/program_slide_prev.png) 0 0 no-repeat; z-index: 999;}
#main-contens .section3 .slide .swiper-button-next {width: 72px; height: 72px; margin-top: -36px; right: 0; background: url(../../images/main/program_slide_next.png) 0 0 no-repeat; z-index: 999;}
#main-contens .section4 {width: 597px; float: left;}
#main-contens .section4 .video-wrap {position: relative;}
#main-contens .section4 .video-wrap video {width: 597px; height: 372px;}
#main-contens .section4 .video-wrap .title {width: 100%; height: 72px; background: url(../../images/common/black_20.png) 0 0 repeat;line-height: 72px; text-align: center; font-size: 20px; color: #fff; position: absolute; left: 0; bottom: 0;}
#main-contens .section5 {width: 556px; float: right;}
#main-contens .section5 .banner a {display: block; height: 95px;}
#main-contens .section5 .sns {margin-top: 62px; overflow: hidden;}
#main-contens .section5 .sns li {width: 50%; float: left; border-bottom: 1px solid #e6e6e6;}
#main-contens .section5 .sns li a {display: block; padding-left: 70px; line-height: 70px; font-size: 16px; color: #333333;}
#main-contens .section5 .sns li:last-child {width: 100%;}
#main-contens .section5 .sns li a.blog {background: url(../../images/main/ico_blog.png) 23px center no-repeat;}
#main-contens .section5 .sns li a.band {background: url(../../images/main/ico_band.png) 23px center no-repeat;}
#main-contens .section5 .sns li a.facebook {background: url(../../images/main/ico_facebook.png) 23px center no-repeat;}
#main-contens .section5 .sns li a.cafe {background: url(../../images/main/ico_cafe.png) 23px center no-repeat;}
#main-contens .section6 {width: 100%; padding: 110px 0 70px; overflow: hidden;}
#main-contens .section6 > div {margin-left: 55px;}
#main-contens .section6 > div:first-child {margin-left: 0;}
#main-contens .section6 .domain-search {width: 358px; float: left;}
#main-contens .section6 .domain-search > div {margin-top: 15px; height: 60px; padding: 25px 0; background: #f2f2f2; text-align: center;}
#main-contens .section6 .domain-search > div:first-child {margin-top: 0;}
#main-contens .section6 .domain-search > div .text {display: inline-block; padding-left: 76px; background: url(../../images/main/ico_domain.png) left center no-repeat;}
#main-contens .section6 .domain-search > div .text .txt1 {font-size: 22px; color: #333333;}
#main-contens .section6 .domain-search > div .text .txt2 {font-weight: 300; font-size: 14px; color: #666666;}
#main-contens .section6 .domain-search > div .box {display: inline-block; width: 254px;}
#main-contens .section6 .domain-search > div .box .search {position: relative;}
#main-contens .section6 .domain-search > div .box .search input[type=text] {width: 220px; border: 2px solid #999999; height: 32px; font-size: 12px; color: #999999;}
#main-contens .section6 .domain-search > div .box .search input[type=submit] {width: 35px; height: 32px; border: none; position: absolute; top: 0px; right: 0px; background: #999999 url(../../images/common/h36_search_black.png) center center no-repeat; background-size:20px 20px;}
#main-contens .section6 .domain-search > div .box a {display: block; margin-top: 5px; font-weight: 300; font-size: 14px; color: #666666;}
#main-contens .section6 .domain-search > div .box a span {font-weight: 400;}
#main-contens .section6 .info {width: 369px; float: left;}
#main-contens .section6 .info .hd {border-bottom: 1px solid #e5e5e5; line-height: 35px; font-weight: 700; font-size: 15px; color: #000000;}
#main-contens .section6 .info .tell {line-height: 90px; font-size: 30px; color: #25afff;}
#main-contens .section6 .info dl {padding-left: 33px; position: relative;}
#main-contens .section6 .info dl dt {position: absolute; top: 0; left: 0; font-weight: 700; font-size: 14px; color: #666666;}
#main-contens .section6 .info dl dd {font-weight: 300; font-size: 14px; color: #666666;}
#main-contens .section6 .info .mail {margin-top: 20px; padding-left: 32px; background: url(../../images/main/ico_mail.png) 0 5px no-repeat;}
#main-contens .section6 .info .mail p {line-height: 24px; font-weight: 300; font-size: 16px; color: #666666;}
#main-contens .section6 .promotion {width: 359px; float: left;}
#main-contens .section6 .promotion .title {line-height: 36px; font-weight: 700; font-size: 15px; color: #000000;}
#main-contens .section6 .promotion a {display: block; height: 210px;}

#shoppingmall {width: 1200px; margin:90px auto 0; position: relative;}
#shoppingmall .inner {width: 1903px; margin: 0 -352px; background: #f5f5f5;}
#shoppingmall .inner .title {padding-top: 53px; text-align: center; font-weight: 700; font-size: 30px; color: #000;}
#shoppingmall .inner .swiper-container {margin: 0 auto; margin-left: 8px; padding: 35px 0 55px; background: #f5f5f5;}
#shoppingmall .inner .swiper-container ul li a {display: table-cell; width: 160px; height: 160px; border: 3px solid #fcfcfc; 
background: #fcfcfc; border-radius:50%; text-align: center; vertical-align: middle;}
#shoppingmall .inner .swiper-container ul li.swiper-slide-active a {background: #ffffff; border: 3px solid #25afff;}
#shoppingmall .inner .swiper-container ul li a img {display: inline-block;}
#shoppingmall .swiper-button-prev {width: 20px; height: 36px; background: url(../../images/main/logo_slider_prev.png) 0 0 no-repeat; top: 220px; left: 485px; outline:none;}
#shoppingmall .swiper-button-next {width: 20px; height: 36px; background: url(../../images/main/logo_slider_next.png) 0 0 no-repeat; top: 220px; right: 485px; outline:none;}

#main-visual {width: 1200px; margin: 0 auto; position: relative;}
#main-visual .inner {width: 1903px; height: 456px; margin: 0 -352px;}

#main-visual .swiper-button-prev {left: 0; top: 333px; width: 35px; height: 35px; background: url(../../images/common/slider_prev.png) 0 0 no-repeat;}
#main-visual .swiper-button-next {left: 45px; top: 333px; width: 35px; height: 35px; background: url(../../images/common/slider_next.png) 0 0 no-repeat;}


#main-visual .login-box {width: 300px; position: absolute; top: 60px; right: 0; background: #ffffff; z-index: 5;}
#main-visual .login-box .tab ul {overflow: hidden;}
#main-visual .login-box .tab ul li {width: 50%; float: left;}
#main-visual .login-box .tab ul li a {display: block; text-align: center; line-height: 50px; background: url(../../images/common/black_20.png) 0 0 repeat; font-size: 14px; color: #ffffff;}
#main-visual .login-box .tab ul li.on a {background: #fff; opacity: 1; fliter:alpha(opacity=100); color: #000;}
#main-visual .login-box .content {padding: 25px 20px;}
#main-visual .login-box .content input[type=text] {height: 40px; line-height: 16px; font-size: 14px; color: #000;}
#main-visual .login-box .content input::placeholder {color: #999999;}
#main-visual .login-box .content input:-ms-input-placeholder {color: #999999;}
#main-visual .login-box .content input::-ms-input-placeholder {color: #999999;}
#main-visual .login-box .content form input {margin-top: 8px}
#main-visual .login-box .content form input:first-child {margin-top: 0;}
#main-visual .login-box .btn-wrap {margin-top: 14px;}
#main-visual .login-box .util {margin-top: 25px; overflow: hidden;}
#main-visual .login-box .util .chk {float: left; margin-left: 20px;}
#main-visual .login-box .util .chk span {padding-left: 20px; line-height: 14px; font-weight: 300; font-size: 14px; color: #666666;}
#main-visual .login-box .util .chk input[type=checkbox] {opacity: 1; filter:alpha(opacity=100);}
#main-visual .login-box .util .chk input[type=checkbox] + span:before {display: none;}
#main-visual .login-box .util a {margin-left: 30px; float: left; font-weight: 300; line-height: 14px; font-size: 14px; color: #666666;}

#main-visual .icon-menu {margin-top: -43px; z-index: 999; position: relative; background: #ffffff;}
#main-visual .icon-menu ul {display:table; width: 100%; padding: 23px 0 31px; overflow: hidden;}
#main-visual .icon-menu ul li {display:table-cell; width: 199px; height: 140px; vertical-align: middle; border-left: 1px solid #eeeeee;}
#main-visual .icon-menu ul li:first-child {border-left: none;}
#main-visual .icon-menu ul li a {display: block; text-align: center;}
#main-visual .icon-menu ul li a:hover img {transform:rotate(360deg); transition:all .5s;}
#main-visual .icon-menu ul li a span {display: block; margin-top: 25px; font-size: 16px; color: #546269;}
#main-visual .icon-menu .banner a {display: block;}

.sub-style1 {border-bottom: 1px solid #dddddd;}
.sub-style1 .section {overflow: hidden;}
.sub-style1 .section .title-area {width: 240px; padding: 20px; float: left; border-top: 1px solid #0c9fff;}
.sub-style1 .section .title-area p {font-weight: 700; font-size: 24px; color: #0c9fff;}
.sub-style1 .section .content-wrap {width: 920px; float: left; border-top: 1px solid #dddddd;}
.sub-style1 .section .content-wrap .inner {padding: 20px 25px;}
.sub-style1 .section .content-wrap .e-cont {overflow: hidden;}
.sub-style1 .section .content-wrap .tit {float: left; width: 140px; padding: 25px 20px;}
.sub-style1 .section .content-wrap .tit p {line-height: 32px; font-size: 18px; color: #000;}
.sub-style1 .section .content-wrap .cont {width: 727px; float: left; padding: 40px 0 80px;}
.sub-style1 .section .content-wrap .cont .text {line-height: 32px; font-size: 16px; color: #666666; font-weight: 300;}
.sub-style1 .section .content-wrap .cont .red {padding-left: 10px; color: #ff3333; position: relative; font-weight: 300;}
.sub-style1 .section .content-wrap .cont .red:before {display: block; content:'*'; position: absolute; top: 0; left: 0;}

.table-style1 thead th {background: #ccebff; line-height: 50px; font-weight: 700; font-size: 16px; color: #5b88a6;}
.table-style1 thead th:first-child {padding-left: 38px; text-align: left;}
.table-style1 thead th:last-child {text-align: left;}
.table-style1 tbody tr td {padding: 10px 0; background: #ffffff; font-weight: 300; font-size: 16px; color: #666666; text-align: center; line-height: 30px;}
.table-style1 tbody tr td:first-child {padding-left: 38px; text-align: left;}
.table-style1 tbody tr td:last-child {text-align: left;}
.table-style1 tbody tr td ul li {position: relative; padding-left: 10px;}
.table-style1 tbody tr td ul li:before {display: block; content:'-'; position: absolute; top: 0; left: 0;}
.table-style1 tbody tr.gray td {background: #f5f5f5;}

.step-st1 {overflow: hidden;}
.step-st1 li {width: 200px; margin-left: 40px; background: #eeeeee; border-radius:50%; vertical-align: middle; float: left; position: relative;}
.step-st1 li:first-child {margin-left: 0;}
.step-st1 li:first-child:before {display: none;}
.step-st1 li p {display:table-cell; width: 200px; height: 200px; vertical-align: middle; text-align: center; line-height: 24px; font-size: 18px; color: #000; font-weight: 300;}
.step-st1 li:before {display: block; content:''; width: 9px; height: 16px; background: url(../../images/common/ico_arr.png) 0 0 no-repeat; position: absolute; top: 92px; left: -23px;}

.benefit {overflow: hidden; border-bottom: 1px solid #eeeeee; border-right: 1px solid #eeeeee;}
.benefit li {float: left; width: 182px; height: 182px; border-top: 1px solid #eeeeee; border-left: 1px solid #eeeeee; position: relative;}
.benefit li p.txt1 {width: 100%; position: absolute; top: 25px; font-weight: 300; line-height: 28px; font-size: 17px; color: #666666; text-align: center;}
.benefit li p.txt2 {width: 100%; position: absolute; bottom: 20px; font-weight: 700; font-size: 20px; color: #000; text-align: center;}

.benefit-word {margin-top: 30px; text-align: center;}
.benefit-word > span {display: inline-block; padding: 0 43px 0 62px; position: relative; line-height: 45px;font-size: 28px; color: #000;}
.benefit-word > span .b-coin {position: absolute; top: 0; left: 0;}
.benefit-word > span .s-coin {position: absolute; right: 0; bottom: 0;}

.sub-style1 .section .content-wrap .cont .tell {display: inline-block; padding-left: 25px; background: url(../../images/common/ico_tell.png) left center no-repeat; font-size: 18px; color: #333333; line-height: 82px; font-weight: 300;}
.sub-style1 .section .content-wrap .cont .mail {display: inline-block; padding-left: 30px; background: url(../../images/common/ico_mail.png) left center no-repeat; font-size: 18px; color: #333333; line-height: 82px; font-weight: 300;}

ol li {padding-left: 15px; position: relative; line-height: 32px; font-weight: 300; font-size: 16px; color: #666666;}
ol li .num {display: inline-block; position: absolute; top: 0; left: 0;}
ol li .bold {font-weight: 400;}

.student-banner {display:table; width: 100%; height: 180px; background: #6dcfd6; position: relative;}
.student-banner p {display:table-cell; height: 180px; vertical-align: middle; text-align: center; line-height: 38px; font-size: 22px; color: #ffffff;}
.student-banner .student1 {position: absolute; bottom: 0; left: 34px;}
.student-banner .student2 {position: absolute; bottom: 0; right: 42px;}

.check-point {margin-top: 30px; padding: 25px 0; background: #f2faff; border: 1px solid #b6e2ff; text-align: center;}
.check-point .inner {display: inline-block; padding-left: 180px; position: relative;}
.check-point .inner .title {position: absolute; top: 0; left: 0; font-weight: 700; font-size: 18px; color: #0c9fff;}
.check-point .inner ol {text-align: left;}
.check-point .inner ol li {line-height: 28px; font-size: 16px; color: #26a8ff;}

.table-style2 {border-bottom: 1px solid #cccccc; border-right: 1px solid #cccccc;}
.table-style2 thead th {border-left: 1px solid #cccccc; border-top: 1px solid #cccccc; text-align: center; background: #f9f9f9; font-size: 18px; color: #333333; height: 60px;}
.table-style2 tr td {padding: 20px 35px; border-left: 1px solid #cccccc; border-top: 1px solid #cccccc; text-align: center; line-height: 26px; font-weight: 300; font-size: 18px; color: #333333;}
.table-style2 tr td.cnt {text-align: left; line-height: 36px; font-size: 16px;}

.red {color: #ff3f1a !important;}
.gray {color: #808080 !important;}

.gray-banner {margin-top: 30px; padding: 25px 0; background: #f2f2f2; text-align: center; font-size: 24px; font-weight: 300; color: #000;}
.gray-banner .red {padding-left: 25px; position: relative;}
.gray-banner .red:before {display: block; content:''; width: 158px; height: 11px; background: url(../../images/common/arr_line.png) 0 0 no-repeat; position: absolute; top: 10px; left: -146px;}

.blue-banner {padding: 30px 0; overflow: hidden; background: #91bbf2; position: relative;}
.blue-banner .left {width: 384px; height: 90px; display:table-cell; vertical-align: middle;}
.blue-banner .left p {text-align: center; font-size: 34px; color: #ffffff;}
.blue-banner .right {display:table-cell; height: 90px; width: 816px; vertical-align: middle;}
.blue-banner .right a {position: absolute; top: 50px; right: 83px;}
.blue-banner .right p.tel {padding-left: 35px; background: url(../../images/common/ico_tell_white.png) left center no-repeat; font-size: 28px; color: #ffffff;}
.blue-banner .right p.mail {padding-left: 35px; background: url(../../images/common/ico_mail_white.png) left center no-repeat; font-weight: 300; font-size: 20px; color: #ffffff;}

.q-a > ul {border-top: 2px solid #0c9fff;}
.q-a > ul > li {border-bottom: 1px solid #cccccc;}
.q-a > ul > li a {display: block; padding: 30px 200px 30px 80px; position: relative; font-weight: 700; font-size: 20px; color: #333333; background: url(../../images/common/arr_down.png) 1140px center no-repeat;}
.q-a > ul > li a:before {display: block; content:'Q'; position: absolute; top: 50%; left: 30px; font-weight: 700; font-size: 24px; color: #0c9fff; transform:translateY(-50%);}
.q-a > ul > li .answer {display: none; padding: 20px 75px; background: #f2f2f2; line-height: 32px; font-size: 18px; color: #333333;}
.q-a > ul > li.open a {background: url(../../images/common/arr_up.png) 1140px center no-repeat;}

.advice-banner {background: #99aaff; height: 160px; position: relative;}
.advice-banner .txt1 {position: absolute; top: 40px; left: 80px; font-size: 32px; color: #fffefe;}
.advice-banner .txt2 {position: absolute; top: 87px; left: 80px; font-weight: 300; font-size: 16px; color: #d9dfff;}
.advice-banner img {position: absolute; left: 628px; bottom: 0;}

.gallary-img-slider {overflow: hidden;}
.gallary-img-slider .main-img-area {width: 902px; float: left; position: relative;}
.gallary-img-slider .main-img-area ul li {float: left; width: 902px; height: 615px;}
.gallary-img-slider .main-img-area ul li img {width: 902px; height: 615px;}
.gallary-img-slider .main-img-area .swiper-button-prev {width: 70px; height: 80px; background: url(../../images/common/gallary_slider_prev.png) 0 0 no-repeat; left: 0;}
.gallary-img-slider .main-img-area .swiper-button-next {width: 70px; height: 80px; background: url(../../images/common/gallary_slider_next.png) 0 0 no-repeat; right: 0;}
.gallary-img-slider .thumbs-area {width: 256px; float: right;}
.gallary-img-slider .thumbs-area .inner {margin-top: 70px; height: 545px;}
.gallary-img-slider .thumbs-area .inner ul li {width: 256px; height: 175px; float: left; opacity: 0.35; filter:alpha(opacity=35); cursor:pointer; bottom: 0;}
.gallary-img-slider .thumbs-area .inner ul li img {width: 100%; height: 175px;}
.gallary-img-slider .thumbs-area .inner ul li.swiper-slide-active {opacity: 1; filter:alpha(opacity=100); position: relative;}
.gallary-img-slider .thumbs-area .inner ul li.swiper-slide-active:before {display: block; content:''; width: 248px; height: 167px; border: 4px solid #0c9fff; position: absolute; top: 0; left: 0;}

.gallary-img-tab {margin-top: 10px; position: absolute; top: 80px; left: 942px; z-index: 10;}
.gallary-img-tab ul {overflow: hidden;}
.gallary-img-tab ul li {margin-left: 20px; float: left;}
.gallary-img-tab ul li:first-child {margin-left: 0;}
.gallary-img-tab ul li a {display: block; line-height: 30px; font-size: 19px; font-weight: 700; color: #cccccc;}
.gallary-img-tab ul li.on a {color: #000;}

.step-st2 {margin-left: 30px;}
.step-st2 li {padding: 0px 0 80px 40px; position: relative; font-weight: 300; font-size: 18px; color: #333333; }
.step-st2 li:first-child {padding-top: 0;}
.step-st2 li:before {display: block; content:''; width: 2px; height: 100%; background: #eeeeee; position: absolute; top: 15px; left: 7px;}
.step-st2 li span {display: inline-block; width: 16px; height: 16px; background: #ffd31a; position: absolute;  top: 6px; left: 0; border-radius:50%;}
.step-st2 li:last-child:before {display: none;}

.facebook-btn-area {padding:20px 15px;}
.facebook-btn-area p {line-height: 28px; font-weight: 300; font-size: 16px; color: #666666;}
.facebook-btn-area p .blue {font-weight: 400; color: #0c9fff;}

.difference {overflow: hidden; padding-top: 10px;}
.difference > div {width: 554px;}
.difference .hd {padding: 10px 0; border-bottom: 2px solid #000; text-align: center; font-weight: 700; font-size: 24px; color: #000;}
.difference .cn {padding: 35px 40px; background: #f2f2f2;}
.difference .cn .text {margin-bottom: 40px; line-height: 32px; font-size: 17px; color: #000; font-weight: 300;}
.difference .cn table {border-bottom: 1px solid #cccccc;}
.difference .cn table th {padding: 20px 0; background: #f9f9f9; border-top: 1px solid #cccccc; border-left: 1px solid #cccccc; font-size: 18px; color: #333333;}
.difference .cn table th:first-child {border-left: none;}
.difference .cn table td {padding: 10px; text-align: center; border-top: 1px solid #cccccc; border-left: 1px solid #cccccc; font-size: 14px; color: #333333; background: #ffffff; font-weight: 300;}
.difference .cn table td:first-child {border-left: none;}
.difference .cn table td ul li {padding-left: 45px; position: relative;}
.difference .cn table td ul li .t {position: absolute; top: 0; left: 0;}

.books-introduce {display:table; border-top: 2px solid #333333; overflow: hidden;}
.books-introduce .tab-area {display:table-cell; width: 367px;}
.books-introduce .tab-area ul li {border-bottom: 1px solid #eeeeee; border-left: 1px solid #eeeeee;position: relative;}
.books-introduce .tab-area ul li a {display: block; padding: 30px 35px 30px 100px;}
.books-introduce .tab-area ul li a .book-img {position: absolute; top: 24px; left: 33px;}
.books-introduce .tab-area ul li a .book-img img {width: 43px; height: 59px;}
.books-introduce .tab-area ul li a .tit1 {display: block; font-size: 17px; color: #000;}
.books-introduce .tab-area ul li a .tit2 {display: block; font-weight: 700; font-size: 18px; color: #000;}
.books-introduce .tab-area ul li.on a {background: #d9f0ff;}
.books-introduce .tab-area ul li.on:before {display: block; content:''; background: url(../../images/common/arr_blue.png) 0 0 no-repeat; width: 18px; height: 36px; position: absolute; top: 35px; right: -18px;}
.books-introduce .book-area {width: 778px; padding: 30px; display:table-cell; border-left: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee; border-right: 1px solid #eeeeee; vertical-align: middle; }
.books-introduce .book-area .book-img {float: left; width: 380px; text-align: center; position: relative;}
.books-introduce .book-area .book-img img {width: 227px; height: 337px;}
.books-introduce .book-area ul {width: 380px; float: left;}
.books-introduce .book-area ul li {margin-top: 10px; padding-left: 20px; position: relative;}
.books-introduce .book-area ul li:first-child {margin-top: 0;}
.books-introduce .book-area ul li:before {display: block; content:''; width: 5px; height: 5px; background: #0c9fff; position: absolute; top: 13px; left: 0;}
.books-introduce .book-area ul li .tit {font-weight: 700; font-size: 20px; color: #333333;}
.books-introduce .book-area ul li .txt {line-height: 28px; font-size: 18px; color: #666666;}

.cafe-step {margin-top: 45px;}
.cafe-step ol {display: table; width: 100%; overflow: hidden; border-top: 2px solid #000; border-bottom: 1px solid #cccccc;}
.cafe-step ol li {display: table-cell; width: 20%; height: 235px; padding-left: 0; vertical-align: middle; text-align: center;}
.cafe-step ol li p {margin-top: 35px; font-weight: 700; font-size: 20px; color: #333;}
.cafe-step ol li p .number {color: #0c9fff;}

.e-commerce-banner {display: table; width: 100%; height: 90px; padding: 45px 0; background: #92db7f; position: relative;}
.e-commerce-banner .txt1 {padding-left: 60px; font-weight: 700; font-size: 42px; color: #ffffff;}
.e-commerce-banner .txt2 {padding-left: 60px; font-weight: 300; font-size: 18px; color: #ffffff;}
.e-commerce-banner img {position: absolute; bottom: 0; right: 60px;}

ul.dot1 li {padding-left: 20px; position: relative; line-height: 32px; font-weight: 300; font-size: 18px; color: #000;}
ul.dot1 li:before {display: block; content:''; position: absolute; top: 13px; left: 0; width: 4px; height: 4px; background: #0c9fff;}

.login-wrap {width: 460px; margin: 16px auto 0; padding: 80px 90px 57px; background: #ffffff;}
.login-wrap .btn-wrap {margin-top: 30px; padding-bottom: 50px; border-bottom: 1px solid #dddddd;}
.login-wrap .ta_c span {display: inline-block; padding: 20px 0; overflow: hidden;}
.login-wrap .ta_c span a {display: inline-block; float: left; margin-left: 40px; position: relative; font-size: 14px; color: #666666; font-weight: 300;}
.login-wrap .ta_c span a:first-child {margin-left: 0;}
.login-wrap .ta_c span a:before {display: block; content:''; width: 1px; height: 14px; background: #e4e4e4; position: absolute; top: 4px; left: -14px;}

.agree-check-area {margin-top: 45px; padding: 30px 50px 40px; background: #f7f7f7;}
.agree-check-area .total {padding-bottom: 20px; border-bottom: 1px solid #dddddd;}
.agree-check-area ul {overflow: hidden;}
.agree-check-area ul li {width: 50%; float: left; margin-top: 20px;}
.agree-check-area ul li label span {font-weight: 300; line-height: 30px; font-size: 18px; color: #333333;}
.agree-check-area ul li a {display: inline-block; width: 82px; margin-left: 15px; border: 1px solid #cccccc; line-height: 33px; text-align: center; font-size: 14px; color: #999999; background: #ffffff;}

.file {display: inline-block; width: 95px; height: 45px; margin-left: 10px; position: relative;}
.file input[type=file] {width: 97px; height: 45px; position: absolute; top: 0; left: 0; opacity: 0; filter:alpha(opacity=0);  z-index: 4;}
.file a {position: absolute; top: 0; left: 0;}
.write-caution {padding-left: 30px;}
.write-caution li {line-height: 28px; font-weight: 300; font-size: 16px; color: #999999;}

.pay-detail .top_btns {padding-bottom: 20px; overflow: hidden;}
.pay-detail .top_btns > div {overflow: hidden;}
.pay-detail .top_btns > div a {float: left; margin-left: 10px;}
.pay-detail .top_btns > div a:first-child {margin-left: 0;}
.pay-detail table {border-top: 2px solid #333333;}
.pay-detail table th {padding: 15px 0; background: #f7f7f7; border-bottom: 1px solid #cccccc; font-weight: 400; font-size: 18px; color: #000000;}
.pay-detail table td {padding: 20px 0; border-bottom: 1px solid #cccccc; text-align: center; font-weight: 300; font-size: 16px; color: #333333;}
.pay-detail .bot_btns {margin-top: 56px;}
.pay-detail .bot_btns ul {overflow: hidden;}
.pay-detail .bot_btns ul li {margin-left: 25px; float: left;}
.pay-detail .bot_btns ul li:first-child {margin-left: 0;}
.pay-detail .bot_btns ul li > a {text-align: left; font-size: 20px;}
.pay-detail .bot_btns ul li > a > span {display: block; padding-left: 35px; background: url(../../images/common/ico_download.png) 230px center no-repeat;}
.pay-detail .bot_btns ul li .list {display: none; background: #fffae5; border: 1px solid #ffd31a;}
.pay-detail .bot_btns ul li .list a {display: block; line-height: 80px;}
.pay-detail .bot_btns ul li .list a span {display: block; padding-left: 35px; background: url(../../.images/common/ico_download.png) 220px center no-repeat; font-size: 18px; color: #000;}

.pay-detail .bot_btns ul li.on > a > span {background: url(../../images/common/app_up_black.png) 220px center no-repeat;}

.estimate .top p {padding-bottom: 15px; font-size: 18px; color: #333333;}
.estimate .estimate-txt {margin-top: 35px; padding: 20px 0; text-align: center; font-size: 20px; color: #0c9fff;}
.table-style3 {border-top: 2px solid #333333;}
.table-style3 th {padding:20px 0 20px 30px; border-bottom: 1px solid #cccccc; text-align: left; font-size: 18px; color: #000;}
.table-style3 td {padding: 20px 0; border-bottom: 1px solid #cccccc; text-align: left; font-weight: 300; font-size: 18px; color: #333333;}

.gallary-img-slider {width: 100%; position: absolute; top: 0; left: -9999px;}
.gallary-img-slider.on {left: 0;}

.swiper-button-next, .swiper-button-prev {outline:none;}

.notice-view-wrap {margin-top: 25px;}
.notice-view-wrap .title-area {padding: 30px 50px; border-top: 1px solid #000; overflow: hidden;}
.notice-view-wrap .title-area p span {display: inline-block; float: left; margin-left: 35px; position: relative; font-size: 18px; color: #000;}
.notice-view-wrap .title-area p span:first-child {margin-left: 0;}
.notice-view-wrap .title-area p span:before {display: block; content:''; width: 1px; height: 20px; position: absolute;}
.notice-view-wrap .title-area p span:first-child:before {display: none;}
.notice-view-wrap .title-area .title {float: left;}
.notice-view-wrap .title-area .title span:before {background: #000; top: 5px; left: -20px;}
.notice-view-wrap .title-area .date {float: right;}
.notice-view-wrap .title-area .date span {color: #909090;}
.notice-view-wrap .title-area .date span:before {background: #909090; top: 5px; left: -20px;}
.notice-view-wrap .text-area {padding: 75px 80px; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; background: #f2f2f2; font-size: 16px; color: #333333;}

.layer-popup .rdo-select-box {padding: 40px 0; text-align: center; border: 1px solid #dddddd;}
.layer-popup .rdo-select-box ul {display: inline-block; overflow: hidden;}
.layer-popup .rdo-select-box ul li {float: left; margin-left: 65px;}
.layer-popup .rdo-select-box ul li:first-child {margin-left: 0;}
.layer-popup .list {padding: 35px 0; text-align: left;}
.layer-popup .list ul li {margin-top: 10px; padding-left: 10px; position: relative; font-size: 16px; font-weight: 300; color: #333333;}
.layer-popup .list ul li:before {display: block; content:''; position: absolute; top: 11px; left: 0; width: 2px; height: 2px; background: #858585;}
.layer-popup .list ul li:first-child {margin-top: 0;}
