#area_main{display:block; overflow:hidden; position:relative; width:100%; height:630px; /* background:url(../img/app/main_bg.jpg)no-repeat center; background-size:cover;*/}
#area_main .main_bg{position:absolute; top:0; left:0; right:0; bottom:0; animation: imagescale 6s ease-in-out infinite alternate; -webkit-animation: imagescale 10s ease-in-out infinite alternate; -moz-animation: imagescale 10s ease-in-out infinite alternate; -o-webkit-animation: imagescale 10s ease-in-out infinite alternate; }
#area_main .inr{height:100%;}
#area_main .area_txt{position:relative; height:100%; z-index:1;}
#area_main .area_txt span{display:inline-block; font-size:22px; font-weight:400; color:#fff;}
#area_main .area_txt .tabs{margin:125px 0 25px; display:inline-block; background:rgba(255,255,255,1); border-radius:50px;}
#area_main .area_txt .tabs > li{display:inline-block; font-size:0; padding:13px 20px; cursor:pointer; line-height:1.8em; }
#area_main .area_txt .tabs > li:nth-child(1){padding:13px 13px 13px 27px;}
#area_main .area_txt .tabs > li:nth-child(2){padding:13px 27px 13px 13px;}
#area_main .area_txt .tabs > li.active{background:#283f70; box-sizing:border-box; border-radius:50px;}
#area_main .area_txt .tabs > li span{position:relative; font-size:17px; font-weight:600; line-height:1.5em; color:#333; transition:all 0.3s ease;}
#area_main .area_txt .tabs > li span:before{content:''; position:absolute; left:0; display:none; width:17px; height:19px;}
#area_main .area_txt .tabs > li:nth-child(1) span:before{top:5px; background:url(../img/app/icon_tab01.svg)no-repeat center; background-size:100% 100%;}
#area_main .area_txt .tabs > li:nth-child(2) span:before{top:5px; background:url(../img/app/icon_tab02.svg)no-repeat center; background-size:100% 100%;}
#area_main .area_txt .tabs > li:nth-child(1).active,
#area_main .area_txt .tabs > li:nth-child(2).active{padding:13px 20px;}
#area_main .area_txt .tabs > li.active span{padding:0 0 0 22px; color:#fff;}
#area_main .area_txt .tabs > li.active span:before{display:block;}
#area_main .area_txt .tab_container{}
#area_main .area_txt .tab_container .txt{width:50%;}
#area_main .area_txt .tab_container span{display:inline-block; margin:0 0 15px; font-size:22px; font-weight:400; color:#222; line-height:1.4em; word-break:keep-all;}
#area_main .area_txt .tab_container #tab2 span{margin:15px 0 0;}
#area_main .area_txt .tab_container h3{display:block; font-size:44px; font-weight:600; color:#222; line-height:1.2em; word-break:keep-all;}
#area_main .area_txt .tab_container h3.m{display:none;}
#area_main .area_img{position:absolute; top:50%; left:0; transform:translateY(-50%); width:60%; margin-left:40%; display: flex;justify-content: flex-end;align-items: center;}

#area_main .area_img .imb_box01{display:block; width:569px; height:370px; border-radius:12px; box-sizing:border-box; overflow:hidden;  box-shadow: 0px 10px 16px 4px rgba(166, 201, 211, 0.3);}
#area_main .area_img .imb_box01 img,
#area_main .area_img .imb_box02 img{width:auto; height:auto;}
#area_main .area_img .imb_box02{position:absolute; left:108px; bottom:-50px; z-index:2; width:200px; height:170px; border-radius:10px; box-shadow: 0px 5px 9px 1px rgba(166, 201, 211, 0.16); box-sizing:border-box; overflow:hidden;}




#area_main .area_img .swiper{position:absolute; width:684px; right:-9%; bottom:65px; width:100%; height:660px;}
#area_main .area_img .swiper-slide{opacity:0;}
#area_main .area_img .swiper-slide-active{opacity:1;}
.main_sch{position:relative; width:380px; height:59px; display:block; margin:20px 0 20px; background:#fff; border-radius:10px; box-sizing:border-box; box-shadow: 4.096px 2.868px 16px 4px rgba(0, 0, 0, 0.03);}
.main_sch input[type=text]{display:block; width:calc(100% - 26px); height:100%; border:none; padding:14px 15px; box-sizing:border-box; background:none; font-size:19px; color:#333;}
.main_sch input[type=text]::placeholder{color:#999;}
.main_sch input:-webkit-autofill,
.main_sch input:-webkit-autofill:hover,
.main_sch input:-webkit-autofill:focus,
.main_sch input:-webkit-autofill:active  {transition: background-color 5000s; -webkit-text-fill-color: #fff !important; }
.main_sch button{position:absolute; top:50%; right:15px; width:26px; height:26px; border:none; background:url(../img/app/icon_msch.svg)no-repeat center; background-size:contain; transform:translateY(-50%);}
.btn_main{display:inline-block; position:relative; font-size:17px; font-weight:400; color:#222 !important;}
.btn_main:before{content:''; position:absolute; left:0; right:0; bottom:-3px; width:100%; height:2px; background:#222; transition:all 0.3s ease;}
.btn_main:hover:before{opacity:1;}
#content{margin:80px 0 0; min-height:700px;}
#area_main .swiper-button-prev,
#area_main .swiper-button-next{width:55px; height:55px; background:rgba(255,255,255,0.2); border-radius:50px;}
#area_main .swiper-button-prev{left:-5%;}
#area_main .swiper-button-next{right:-5%;}
#area_main .swiper-button-prev:after{content:''; background:url(../img/app/icon_marrow.svg)no-repeat center; width:8px; height:12px; background-size:contain;}
#area_main .swiper-button-next:after{content:''; background:url(../img/app/icon_marrow.svg)no-repeat center; width:8px; height:12px; background-size:contain; transform:rotate(-180deg);}


/*이번주 인기 Q&A*/
#helpme{display:block; position:relative; margin:0 0 58px; }
#helpme > h3{display:block; font-size:24px; font-weight:bold; color:#111;}
#helpme .swiper_wrap{margin:30px 0 0;}
#helpme .list_help{position:relative; overflow:hidden; background:#fff; border-radius:10px; border:1px solid #eee; box-sizing:border-box; padding:20px;  box-shadow: 0px 5px 12.75px 2.25px rgba(22, 98, 191, 0.03);}
#helpme .list_help a{display:block; width:100%; height:100%;}
#helpme .list_help i.number{position:absolute; top:0; left:0; padding:7px 10px 6px; width:40px; text-align:center; border-radius:0 0 8px 0; background-image: -moz-linear-gradient( 45deg, rgb(47,194,231) 1%, rgb(89,83,251) 100%); background-image: -webkit-linear-gradient( 45deg, rgb(47,194,231) 1%, rgb(89,83,251) 100%); background-image: -ms-linear-gradient( 45deg, rgb(47,194,231) 1%, rgb(89,83,251) 100%); color:#fff; font-weight:600; font-size:18px; line-height:1.2em;}
#helpme .list_help a > h3{display:block; margin:30px 0 10px; font-size: 17px; font-weight: 500; color: #222; word-break: keep-all; line-height: 1.4em; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
#helpme .list_help a > span{display:block; font-size: 15px; font-weight:400; color: #555; word-break: keep-all; min-height:42px; line-height: 1.4em; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
#helpme.new .list_help a > span{min-height:63px;}
#helpme .list_help a .info{position:relative; margin:20px 0 0;}
#helpme .list_info{line-height:1em;}
#helpme .list_info span{position:relative; display:inline-block; font-size:13px; font-weight:400; color:#999; margin:0 10px;}
#helpme .list_info span:first-child{margin:0 10px 0 0;}
#helpme .list_info span:before{content:''; position:absolute; top:5px; right:-12px; width:3px; height:3px; border-radius:50%; background:#999;}
#helpme .list_info span:last-child:before{display:none;}
#helpme .list_info span.reply em{color:#275dd7;}
#helpme .thums{position:absolute; bottom:-6px; right:0;}
#helpme .thums > li{display:inline-block; margin:0 0 0 13px;}
#helpme .thums > li span{display:inline-block; padding:0 0 0 5px; font-size:13px; font-weight:400; color:#999;}
#helpme .thums > li i{margin:0; cursor:pointer; position:relative; top:2px; transition:all 0.3s ease;}
#helpme .thums > li.good i{display:inline-block; width:15px; height:15px; background:url(../img/app/icon_thumsup.svg)no-repeat center; background-size:contain; opacity:0.4;}
#helpme .swiper-button-prev,
#helpme .swiper-button-next{margin-top:0; width:45px; height:45px; background:#fff; border:1px solid #eee; box-sizing:border-box; border-radius:50px; opacity:1; }
#helpme .swiper-button-prev{left:-6%;}
#helpme .swiper-button-next{right:-6%;}
#helpme .swiper-button-prev:after{content:''; background:url(../img/app/icon_marrow_bk.svg)no-repeat center; width:8px; height:12px; background-size:contain;}
#helpme .swiper-button-next:after{content:''; background:url(../img/app/icon_marrow_bk.svg)no-repeat center; width:8px; height:12px; background-size:contain; transform:rotate(-180deg);}
#helpme .list{margin:30px 0 0;}
#helpme .list:after{ display:block; content:""; clear:both;}

#helpme .list.company .list_help{padding:0;}
#helpme .list_help .title{padding:12px 20px; border-bottom: 1px solid #eee;}
#helpme .list_help .title em{display:block; margin:0 0 3px; min-height:22px; font-size:11px; font-weight:600; color:#3568da; word-break:keep-all; line-height:1em;}
#helpme .list_help .title h3{padding:0; margin:0; font-size:17px; color:#222; line-height:1.2em; line-height: 1.2em; word-break: keep-all; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
#helpme .list_help .title h3:before{display:none;}

#helpme .list_help .cont{position:relative; display:block; padding:12px 20px;}
#helpme .list_help .cont .list_wrap{width:80%;}
#helpme .list_help .cont .area_detail{position:absolute; top:50%; right:20px; width:74px; transform:translateY(-50%); text-align:center;}
#helpme .list_help .cont .area_detail a{display:block; padding:15px 10px 13px; background:#275dd7; line-height:1.3em; color:#fff; font-size:15px; font-weight:400; border-radius:5px;}
#helpme .list_help .cont .list_text li{line-height:1.5em;}
#helpme .list_help .cont .list_text li:after{ display:block; content:""; clear:both;}
#helpme .list_help .cont .list_text em{float:left; width:45px; display:inline-block; margin:0 7px 0 0; text-transform:uppercase; font-size:13px; font-weight:600; color:#333; word-break:keep-all;}
#helpme .list_help .cont .list_text span{display:inline-block; font-size:13px; font-weight:500; color:#555; word-break:keep-all; line-height:1.2em;}
#helpme .list_help .cont .list_text .text span{float:left; width:calc(100% - 53px); line-height:1.5em; word-break: keep-all; text-overflow:ellipsis; white-space: nowrap; overflow: hidden;}
#helpme .list_help .cont .list_text li.period span{line-height:1.1em; font-size:11px; font-weight:600; border-radius:50px; margin:8px 0 5px; padding:3px 8px; box-sizing:border-box; background:#eaf5ff; border:1px solid #5d89eb; color:#5d89eb;}
#helpme .list.company .list_info{margin:7px 0 0;}


/*최신 Q&A*/
#helpme.new .list .list_help{float:left; margin:0 30px 0 0; width:calc((100% / 4) - 23px);}
#helpme.new .list.company .list_help{margin:0 30px 30px 0 ;}
#helpme.new .list .list_help:nth-child(4n){margin:0;}
#helpme.new .list .list_help:nth-child(n+5){margin-bottom:0;}

#helpme.new .list_help a > h3{margin:0 0 10px;}
#helpme.new .list_help a > span{-webkit-line-clamp: 3;}

/*배너*/
#area_bn{position:relative; display:block; margin:65px 0 140px; box-sizing:border-box; background:url(../img/app/bg_bn.jpg)no-repeat center; background-size:cover;}
#area_bn .inr{height:100%;}
#area_bn .txt{padding:80px 0;}
#area_bn .txt > h2{display:block; font-size:47px; font-weight:500; color:#fff; line-height:1.4em; word-break:keep-all;}
#area_bn .txt > span{margin:10px 0 0; display:block; font-size:18px; font-weight:300; color:#fff; line-height:1.5em; word-break:keep-all; opacity:0.95;}
#area_bn .txt .area_btn{font-size:15px; color:#fff;}
#area_bn .txt .area_btn em{display:inline-block; margin:0 5px;}
#area_bn .txt .area_btn a{margin:30px 0 0; display:inline-block; background:#fff; border-radius:50px; padding:13px 24px; box-sizing:border-box; font-size:17px; font-weight:500; color:#333; line-height:1.3em; transition:all 0.3s ease;}
#area_bn .txt .area_btn a:hover{background-image: -moz-linear-gradient( 45deg, rgb(47,194,231) 1%, rgb(89,83,251) 100%); background-image: -webkit-linear-gradient(45deg, rgb(47,194,231) 1%, rgb(89,83,251) 100%); background-image: -ms-linear-gradient( 45deg, rgb(47,194,231) 1%, rgb(89,83,251) 100%); color:#fff;}
#area_bn .obj{position:absolute; top:50%; right:0; transform:translateY(-50%);}

/* 기업리스트 */
#helpme.company{text-align:center;}
#helpme.company > h3{text-align:left;}
#helpme.company .list_help{text-align:center;}
#helpme.company div.nodata{text-align:center; width:100%; padding:50px 0;}
#helpme.company .area_logo{position:relative; width:100%; height:110px; margin:0 0 20px; overflow:hidden;}
#helpme.company .area_logo img{position:absolute; top:50%; left:50%; max-width:90%; max-height:90%; width:auto; height:auto; transform:translate(-50%, -50%);}
#helpme.company .area_name{border-top:1px solid #eee;}
#helpme.company .area_name h4{display:block; padding:18px 0 0; font-size:17px; color:#222;}

#helpme .btn_more{position:absolute; top:-3px; right:0; padding:2px 10px; box-sizing:border-box; border:1px solid #eee; border-radius:5px; font-size:14px; color:#333; background:#fff; box-shadow:0px 5px 12.75px 2.25px rgb(22 98 191 / 3%);}
#helpme .btn_more:hover{font-weight:bold; letter-spacing:0.1px;}
#helpme .btn_more02{display:none; font-size:15px; padding: 7px 15px;border-radius: 5px; text-align: center;border: 3px solid #3568da;margin:15px 0; background: #3568da;font-weight: 500; color:#fff;}

/* 공지사항 */
#area_notice{margin:20px 0 0; padding:32px 20px; display:inline-block; width:100%; background:#fff; border:1px solid #eee; border-radius:10px; box-sizing:border-box; box-shadow: 0px 5px 12.75px 2.25px rgba(22, 98, 191, 0.03);}
#area_notice:after{ display:block; content:""; clear:both;}
#area_notice h3{float:left; width:160px; text-align:center; font-size:18px; color:#222; font-weight:600;}
#area_notice .list{position:relative; float:left; width:calc(100% - 160px);}
#area_notice .list > a{display:block;}
#area_notice .list > a span{display:block; width:calc(100% - 150px); font-size:16px; font-weight:400; color:#333; word-break: keep-all; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
#area_notice .list > a em{position:absolute; top:50%; right:40px; display:inline-block; font-size:15px; font-weight:300; color:#555; transform:translateY(-50%);}

/* 공지사항 */
#area_youtube{margin:20px 0 0; padding:32px 20px; display:inline-block; width:100%; background:#fff;  box-sizing:border-box;}
#area_youtube div.iframe {    position: relative;    padding-top: 56%;    width: 100%;    height: 0;}
#area_youtube div.iframe > iframe {    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;}


@keyframes imagescale {
  0% {
    transform: scale(1)  rotate(.001deg);;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
  }

  100% {
    transform: scale(1.3)  rotate(.001deg);;
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -o-transform: scale(1.3);
  }
}

@media screen and (max-width:1500px) {
	#helpme .swiper-button-prev{left:-5%;}
	#helpme .swiper-button-next{right:-5%;}
}
@media screen and (max-width:1400px) {
	#area_main .swiper-button-prev,
	#area_main .swiper-button-next{display:none;}

	#area_main .area_img .imb_box01{width:75%; height:330px;}
	#area_main .area_img .imb_box01 img,
	#area_main .area_img .imb_box02 img{width:100%; height:100%;}
	#area_main .area_img .imb_box02{left:13%; width:170px; height:150px;}

	#helpme .swiper-button-prev,
	#helpme .swiper-button-next{display:none;}

	#helpme.new .list .list_help{margin:0 20px 0 0; width:calc((100% / 4) - 15px);}
	#helpme.new .list.company .list_help{margin:0 20px 20px 0 ;}
	#helpme.new .list.company .list_help:nth-child(4n){margin:0;}
	#area_bn{margin:65px 1.5% 140px;}
	#area_bn .obj{right:0;}
}
@media screen and (max-width:1300px) {
	#helpme .list_help .title em{min-height:18px;}
	#helpme.new .list.company .list_help{min-height:194px;}
	#area_main .area_txt .tab_container h3{font-size:40px;}
}
@media screen and (max-width:1200px) {
	#area_main .area_img .swiper{height:auto; bottom:28px;}
	#area_main .area_img .swiper-slide img{width:100%;}
	#area_main:before{height:55px; bottom:0;}
	#area_main .area_txt .tab_container h3{font-size:36px;}

	#helpme .list_help i.number{padding:5px 10px 4px;}
	#helpme .list_help a > h3{margin:22px 0 10px;}

	#area_bn .txt > h2{font-size:42px; line-height:1.3em;}
	#area_bn .obj{width:500px}
	#area_bn .obj img{width:100%; height:auto;}
	#area_bn .txt .area_btn a{padding:12px 20px;}
}
@media screen and (max-width:1100px){
	#area_main .area_img .imb_box01{height:280px;}
	#area_main .area_img .imb_box02{left:10%; width:130px; height:110px;}


	#area_bn .txt{width:50%;}
	#area_bn .txt > h2{font-size:37px;}
	#area_bn .txt > span{font-size:17px;}
	#area_bn .obj{width:50%;}
}
@media screen and (max-width:1024px){
	#area_main{height:600px;}
	#area_main .area_txt .tabs{margin:105px 0 25px;}
	#area_main .area_txt .tabs > li span{font-size:16px;}
	#area_main .area_txt .tab_container h3{font-size:42px;}
	#area_main .area_txt .tab_container span{font-size:20px;}
	.main_sch{width:300px;}
	#content{margin:80px 0 130px;}
	#helpme > h3{font-size:22px;}
	#area_bn{margin:40px 1.5% 100px;}
}
@media screen and (max-width:950px){
	#helpme.new .list .list_help{width:calc((100% / 3) - 15px);}
	#helpme.new .list .list_help:nth-child(4){display:none;}
	#helpme.new .list.company .list_help:nth-child(4n){margin:0 20px 20px 0;}
	#helpme.new .list.company .list_help:nth-child(4){display:block;}
	#helpme.new .list.company .list_help:nth-child(n+4){margin-bottom:0;}
	#helpme.new .list .list_help:nth-child(3n){margin:0;}
	#helpme.new .list .list_help:nth-child(7),
	#helpme.new .list .list_help:nth-child(8){display:none;}

}
@media screen and (max-width:900px){
	#area_main{height:450px;}
	#area_main .area_txt .tabs > li span{font-size:15px;}
	#area_main .area_txt .tab_container h3{font-size:30px;}
	#area_main .area_txt .tab_container span{font-size:20px;}
	#area_bn .txt{padding:50px 0;}
	#area_bn .txt > h2{font-size:34px;}
	#area_bn .txt .area_btn a{margin:15px 0 0; font-size:15px;  padding:10px 15px;}
	#area_bn .obj{right:-2%;}
}
@media screen and (max-width:850px){
	#area_bn .txt > h2{font-size:30px;}
	#area_notice{padding:30px 20px;}
	#area_notice h3{width:100px;}
	#area_notice .list{width:calc(100% - 100px);}
	#area_notice .list > a span{width:calc(100% - 100px);}
	#area_notice .list > a em{right:0;}
}
@media screen and (max-width:768px){
	#area_main{height:460px;}
	#area_main .area_txt{top:46%; left:0; width:100%; height:auto; text-align:center; transform:translateY(-50%);}
	#area_main .area_img{display:none;}
	#area_main:before{height:37px;}
	#area_main .area_txt .tabs{margin:0 0 20px;}
	#area_main .area_txt .tabs > li span{font-size:15px;}
	#area_main .area_txt .tabs > li.active span{padding:0 0 0 20px;}
	#area_main .area_txt .tabs > li span:before{width:15px; height:17px;}
	#area_main .area_txt .tabs > li:nth-child(1) span:before,
	#area_main .area_txt .tabs > li:nth-child(2) span:before{top:4px;}
	#area_main .area_txt .tabs > li:nth-child(1).active,
	#area_main .area_txt .tabs > li:nth-child(2).active{padding:11px 15px;}
	#area_main .area_txt .tabs > li:nth-child(1){padding:11px 11px 11px 18px;}
	#area_main .area_txt .tabs > li:nth-child(2){padding:11px 18px 11px 11px;}
	#area_main .area_txt .tab_container .txt{margin:0 auto; width:80%;}
	#area_main .area_txt .tab_container span{margin:0 0 10px;}
	#area_main .area_txt .tab_container #tab2 span{margin:10px 0 0;}
	#area_main .area_txt .tab_container h3.w{display:none;}
	#area_main .area_txt .tab_container h3.m{display:block;}
	#area_main .area_txt .tab_container .txt .btn_box{text-align:center;}
	#area_main .area_txt .tab_container .txt .btn_box .btn_main{margin:0 0 0 6px;}
	.main_sch{height:55px; width:340px; margin:20px auto;}
	.btn_main:before{opacity:0.8;}

	#content{margin:45px 0 130px;}
	#helpme{margin:0 0 40px;}
	#helpme > h3{font-size:20px;}
	#helpme .list_help i.number{font-size:17px;}
	#helpme .list_help a > h3{margin:20px 0 7px;}
	#helpme .list_help a .info{margin:15px 0 0;}
	#helpme .swiper_wrap,
	#helpme .list{margin:20px 0 0;}

	#helpme.new .list .list_help{margin:0 15px 15px 0; width:calc((100% / 2) - 7.5px);}
	#helpme.new .list .list_help:nth-child(4n){margin:0 15px 15px 0;}
	#helpme.new .list .list_help:nth-child(3n){margin:0 15px 15px 0;}
	#helpme.new .list .list_help:nth-child(2n){margin:0;}
	#helpme.new .list .list_help:nth-child(4){display:block;}

	#helpme.new .list.company .list_help{margin:0 15px 15px 0;}
	#helpme.new .list.company .list_help:nth-child(4n){margin:0 15px 15px 0;}
	#helpme.new .list.company .list_help:nth-child(2n){margin:0;}


	#helpme .list_help .title{padding:12px 15px;}
	#helpme .list_help .cont{padding:12px 15px;}

	#area_bn{margin:20px 0% 60px; border-radius:0;}
	#area_bn .txt{padding:30px 0; width:65%;}
	#area_bn .txt > h2{font-size:27px;}
	#area_bn .txt > span{font-size:16px;}
	#area_bn .txt > span br{display:none;}
	#area_bn .txt .area_btn a{margin:10px 0 0; font-size:14px; padding:8px 12px;}
	#area_bn .txt .area_btn em{font-size:13px; margin:0 3px; }
	#area_bn .obj{width:35%;}
	#area_notice{margin:0;}
}
@media screen and (max-width:550px){
	#area_main{height:400px;}
	#area_main .area_txt{top:47%;}
	#area_main .area_txt .tab_container span{font-size:17px; margin:0 0 5px;}
	#area_main .area_txt .tabs > li:nth-child(1).active,
	#area_main .area_txt .tabs > li:nth-child(2).active{padding:9px 14px;}
	#area_main .area_txt .tabs > li:nth-child(1){padding:9px 9px 9px 17px;}
	#area_main .area_txt .tabs > li:nth-child(2){padding:9px 17px 9px 9px;}
	#area_main .area_txt .tab_container .txt{width:90%;}
	.main_sch{margin:15px auto; height:50px; width:300px;}
	.main_sch input[type=text]{padding:10px; font-size:17px;}
	.main_sch button{width:20px; right:10px;}
	#area_main:before{height:26px;}
	#area_main .area_txt .tab_container .txt .btn_box .btn_main{margin:0 0 0 2px;}
	#area_main .area_txt .tab_container #tab2 span{margin:5px 0 0;}
	.btn_main{padding:0 5px; font-size:15px;}
	.btn_main:before{bottom:-9px;}

	#content{margin:35px 0 110px;}
	#helpme{margin:0 0 30px;}
	#helpme > h3{font-size:18px;}
	#helpme .swiper_wrap,
	#helpme .list{margin:10px 0 0;}
	#helpme .list_help i.number{font-size:14px; width:35px; padding:4px 0 3px;}
	#helpme .list_help{padding:15px;}
	#helpme .list_help a > h3{margin:15px 0 5px; font-size:16px;}
	#helpme .list_help a > span{font-size:14px; min-height:38px;}
	#helpme.new .list_help a > span{min-height:57px;}
	#helpme .list_help a .info{margin:12px 0 0;}
	#helpme .list_help .title h3{font-size:15px;}

	#helpme.new .list .list_help{margin:0 10px 10px 0; width:calc((100% / 2) - 5px);}
	#helpme.new .list .list_help:nth-child(4n){margin:0 10px 10px 0;}
	#helpme.new .list .list_help:nth-child(3n){margin:0 10px 10px 0;}
	#helpme.new .list .list_help:nth-child(2n){margin:0;}
	#helpme.new .list_help a > h3{margin:0 0 5px;}

	#helpme.new .list.company .list_help{margin:0 10px 10px 0;}
	#helpme.new .list.company .list_help:nth-child(4n){margin:0 10px 10px 0;}
	#helpme.new .list.company .list_help:nth-child(2n){margin:0;}

	#helpme .list_help .cont .list_text li.period span{font-size:11px; margin:5px 0; padding:2px 6px; }

	#area_bn{margin:10px 0 40px;}
	#area_bn .txt{width:100%; text-align:center;}
	#area_bn .obj{display:none;}
	#area_bn .txt > h2{font-size:22px;}
	#area_bn .txt > span{margin:5px 0 0; font-size:15px; line-height:1.3em;}
	#area_bn .txt > span br{display:block;}
	#area_bn .txt .area_btn a{padding:10px 15px;}


	#helpme.company{margin:0 0 20px;}
	#helpme.company .area_logo{height:90px;}
	#helpme.company .area_name h4{padding:13px 0 0; font-size:16px;}
	#helpme.company .area_logo{margin:0 0 15px; }

	#area_notice{padding:20px;}
	#area_notice h3{font-size:16px; width:70px; text-align:left;}
	#area_notice .list{width:calc(100% - 70px);}
	#area_notice .list > a span{width:100%; font-size:15px;}
	#area_notice .list > a em{display:none;}
}

@media screen and (max-width:500px){
	#helpme .btn_more{display:none;}
	#helpme .btn_more02{display:block; margin:10px 0;}
}
@media screen and (max-width:450px){
	#area_main .area_txt .tab_container span{font-size:16px;}
	#area_main .area_txt .tab_container h3{font-size:24px;}
	.main_sch{margin:12px auto;}
	#area_main:before{height:22px;}
	#helpme .list_help a > h3{font-size:15px;}

	#helpme.new .list .list_help{margin:0 0 10px; width:100%;}
	#helpme.new .list .list_help:nth-child(2n){margin:0 0 10px;}
	#helpme.new .list .list_help:nth-child(n+5){margin-bottom:10px;}
	#helpme.new .list .list_help:nth-child(6){margin:0;}

	#helpme.new .list.company .list_help{min-height:auto;}
	#helpme.new .list.company .list_help,
	#helpme.new .list.company .list_help:nth-child(2n){margin:0 0 10px;}
	#helpme.new .list.company .list_help:nth-child(n+4){margin:0 0 10px;}
	#helpme.new .list.company .list_help:nth-child(6){margin:0;}

	#area_bn .txt > h2{font-size:20px;}
	#area_bn .txt > span{font-size:14px}
	#area_bn .txt .area_btn a{padding:8px 10px; font-size:13px;}

	#helpme.company .area_name h4{font-size:15px;}

	#area_notice{padding:18px 15px;}
	#area_notice h3{font-size:15px; width:65px;}
	#area_notice .list{width:calc(100% - 65px);}
	#area_notice .list > a span{font-size:14px;}

	#helpme.new .list_help a > span{min-height:auto;}
	#helpme .list_help .title em{min-height:auto;}
	#area_main .area_txt .tab_container .txt{width:100%;}

}
@media screen and (max-width:400px){
	#area_main{height:360px;}
	#area_main .area_txt .tabs > li span{font-size:14px;}
	#area_main .area_txt .tab_container span{font-size:17px;}
	#area_main .area_txt .tab_container h3{font-size:26px;}
	.main_sch{width:250px; height:46px;}

	#area_bn .txt > h2{font-size:18px;}
	#area_bn .txt > span{font-size:14px}
	#area_bn .txt .area_btn a{line-height:1.1em;}
	#helpme.company .area_name h4{font-size:14px;}
}
/* 협력업체 */
.area_partner ul{}
.area_partner ul:after{ display:block; content:""; clear:both;}
.area_partner ul > li{position:relative; float:left; padding:20px 10px; width:calc(100% / 4); width:-webkit-calc(100% / 4); border:1px solid #eee; border-right:none; box-sizing:border-box; border-right:none; transition:all 0.3s ease; text-align:center; overflow:hidden;}
.area_partner ul > li:hover{box-shadow: 0px 5px 12.75px 2.25px rgba(0, 159, 255, 0.07);}
.area_partner ul > li:nth-child(4n){border-right:1px solid #eee;}
.area_partner ul > li:nth-child(n+5){border-top:none;}
.area_partner ul > li:before,
.area_partner ul > li:after{content:''; display:block; width:100%; height:64px; box-sizing:border-box; position:absolute; transition:all 0.3s ease 0s;}
body.ie .area_partner ul > li:after{height:65px;}
/*.area_partner ul > li:before{top:0px; left:0px; border:1px solid #eee;}*/
.area_partner ul > li:after{top:0px; left:0px;  border:2px solid #0f74da;  transform:scale(1.1,1.1); transition:all 0.2s ease 0s;}
.area_partner ul > li:hover:after{transform:scale(1,1);}
.area_partner ul > li > a{font-size:16px; font-weight:300; color:#111;}


#area_category{position:relative; width:100%;}
#area_category > ul{}
#area_category > ul:after{content:""; display:block; clear:both;}
#area_category > ul > li{position:relative; float:left; width:calc((100% / 7) - 1px); width:-webkit-calc(100% / 7); height:50px; border-bottom:1px solid #eee; border-left:1px solid #eee; box-sizing:border-box; text-align:center; overflow:hidden; transition:all 0.3s ease;}
#area_category > ul > li:nth-child(-n+7){border-top:1px solid #eee; height:51px;}
#area_category > ul > li:nth-child(7n),
#area_category > ul > li:last-child{border-right:1px solid #eee;}
#area_category > ul > li > a{display:block; width:100%; height:100%; padding:12px 5px; font-size:15px; color:#333; line-height:1.7em;}
body.ie .area_category > ul > li > a{letter-spacing:-1px;}
#area_category > ul > li:before,
#area_category > ul > li:after{content:''; display:block; width:100%; height:49px; box-sizing:border-box; position:absolute; transition:all 0.3s ease 0s;}
#area_category > ul > li:after{top:0px; left:0px;  border:2px solid #0f74da;  transform:scale(1.1,1.1); transition:all 0.2s ease 0s;}
#area_category > ul > li:hover:after{transform:scale(1,1);}
#area_category > ul > li:hover{box-shadow: 0px 5px 12.75px 2.25px rgb(0 159 255 / 7%);}

@media screen and (max-width:1300px) {
	#area_category > ul > li{width:calc(100% / 6); width:-webkit-calc(100% / 6);}
	#area_category > ul > li:nth-child(7n){border-right:none;}
	#area_category > ul > li:nth-child(6n),
	#area_category > ul > li:last-child{border-right:1px solid #eee;}
	#area_category > ul > li:nth-child(-n+6){border-top:1px solid #eee; height:51px;}
	#area_category > ul > li:nth-child(7){border-top:none; height:50px;}
}
@media screen and (max-width:1024px) {
	#area_category > ul > li{width:calc(100% / 4); width:-webkit-calc(100% / 4);}
	#area_category > ul > li:nth-child(6n),
	#area_category > ul > li:nth-child(7n){border-right:none;}
	#area_category > ul > li:nth-child(4n),
	#area_category > ul > li:last-child{border-right:1px solid #eee;}
	#area_category > ul > li:nth-child(-n+4){border-top:1px solid #eee; height:51px;}
	#area_category > ul > li:nth-child(5),
	#area_category > ul > li:nth-child(6){border-top:none; height:50px;}
}
@media screen and (max-width:768px){
	.area_partner ul > li{width:calc(100% / 2); width:-webkit-calc(100% / 2);}
	.area_partner ul > li:nth-child(2n){border-right:1px solid #eee;}
	.area_partner ul > li:nth-child(n+3){border-top:none;}
}
@media screen and (max-width:650px) {
	#area_category > ul > li{width:calc(100% / 3); width:-webkit-calc(100% / 3); height:35px !important;}
	#area_category > ul > li:nth-child(4n),
	#area_category > ul > li:nth-child(6n),
	#area_category > ul > li:nth-child(7n){border-right:none;}
	#area_category > ul > li:nth-child(3n),
	#area_category > ul > li:last-child{border-right:1px solid #eee;}
	#area_category > ul > li:nth-child(-n+3){border-top:1px solid #eee; height:51px;}
	#area_category > ul > li:nth-child(4){border-top:none; height:50px;}
	#area_category ul > li > a{font-size:13px; letter-spacing:-1px; line-height:1.9em;}
	#area_category > ul > li:before,
	#area_category > ul > li:after{display:none;}
	#area_category ul > li > a{padding:5px;}
	#area_category > ul > li:hover > a{color:#0f74da; font-weight:bold;}
}
@media screen and (max-width:550px){
	.area_partner ul > li{padding:12px 10px;}
	.area_partner ul > li > a{font-size:15px;}
	.area_partner ul > li:before,
	.area_partner ul > li:after{height:49px;}
}

@media screen and (max-width:400px) {

	#area_category > ul > li{width:calc(100% / 2); width:-webkit-calc(100% / 2);}
	#area_category > ul > li:nth-child(3n){border-right:none;}
	#area_category > ul > li:nth-child(2n),
	#area_category > ul > li:last-child{border-right:1px solid #eee;}
	#area_category > ul > li:nth-child(-n+2){border-top:1px solid #eee; height:51px;}
	#area_category > ul > li:nth-child(3){border-top:none; height:50px;}
}

/* 광고 */
.area_ad{position:relative; width:100%; margin:30px 0;}
.area_adbn{width:100%; margin:30px 0;}
.area_adbn .swiper-slide{height:218px;}
.area_adbn img{width:100%; height:100%;}
.area_bn{width:100%;}
.area_bn img{width:100%; border-radius:10px;}
#mbanner{ width:90%; margin:50px auto; border-radius:8px !important; overflow:hidden !important; box-shadow:0px 2px 4px rgba(0,0,0,0.2);}
#mbanner img{ width:100%;}
#mbanner .swiper-container { width: 100%; height: 100%;}
#mbanner .swiper-slide {/* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
#mbanner .swiper-container-horizontal>.swiper-pagination-bullets, #mbanner .swiper-pagination-custom, #mbanner .swiper-pagination-fraction{ width:auto; left:auto; right:10px; bottom:auto; top:10px;}
#mbanner .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{ margin:0 3px;}
#mbanner .swiper-pagination-bullet{ background:#fff;}
#mbanner .swiper-pagination-bullet-active{ background:#fff; opacity:1;}
@media screen and (min-width:1024px) {
#mbanner{ width:100%; margin:0px auto; border-radius:0px !important;box-shadow:none; background:#2482d9;}
.mbanner_box{ width:1200px; margin:0 auto}
}

/* 상품 */
.area_product{}
.area_product > ul:after{ display:block; content:""; clear:both;}
.area_product > ul > li{float:left; margin:0 25px 30px 0; width:calc((100% / 4) - 20px); width:-webkit-calc((100% / 4) - 20px);}
.area_product > ul > li:nth-child(4n){margin:0;}
.area_product > ul > li > a{display:block; width:100%; height:auto;}
.area_product > ul > li > a .area_img{position:relative; width:100%; height:240px; border-radius:20px; overflow:hidden;}
.area_product > ul > li > a .area_img > img{position:absolute; top:50%; left:50%; width:100%; height:100%; border-radius:20px; transform:translate(-50%, -50%); transition:all 0.3s ease;}
.area_product > ul > li:hover > a .area_img > img{transform:translate(-50%, -50%) scale(1.1 , 1.1);}
.area_product > ul > li > a .area_txt{margin:10px 0 0;}
.area_product > ul > li > a .area_txt h3{display:block; font-size:15px; color:#111; line-height:1.5em; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden;}
.area_product > ul > li > a .area_txt span{display:block; font-size:15px; font-weight:200; color:#444; line-height:1.5em; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; overflow: hidden;}
.area_product > ul > li > a .area_txt em{display:block; margin:5px 0 0; font-size:17px; font-weight:bold; color:#ff0012; line-height:1.5em;}
.area_product > ul.col5 > li{width:calc((100% / 5) - 20px); width:-webkit-calc((100% / 5) - 20px);}
.area_product > ul.col5 > li:nth-child(4n){margin:0 25px 30px 0;}
.area_product > ul.col5 > li:nth-child(5n){margin:0;}
.area_product > ul.col5 > li > a .area_img{height:200px;}
.area_product > ul.col5 > li.nodata{width:100%; text-align:center;}
.area_product > ul.col5 > li p{font-size:16px; padding:20px; box-sizing:border-box; color:#555;}


@media screen and (max-width:1250px) {
	.area_product > ul > li > a .area_img,
	.area_product > ul.col5 > li > a .area_img{height:0; padding-bottom:95%;}
}
@media screen and (max-width:1024px) {
	.area_product > ul.col5 > li{width:calc((100% / 4) - 19px); width:-webkit-calc((100% / 4) - 19px);}
	.area_product > ul.col5 > li:nth-child(4n){margin:0;}
	.area_product > ul.col5 > li:nth-child(5n){margin:0 25px 30px 0;}
}
@media screen and (max-width:768px){

	.area_product > ul > li{width:100%; margin:0; border-bottom:1px solid #eee;}
	.area_product > ul > li:first-child{border-top:1px solid #eee;}
	.area_product > ul.col5 > li:first-child{border-top:none;}

	.area_product > ul > li > a{padding:20px 0;}
	.area_product > ul > li > a:after{ display:block; content:""; clear:both;}
	.area_product > ul > li > a .area_img{display:inline-block; width:120px; height:120px; padding-bottom:0; vertical-align:middle;}
	.area_product > ul > li > a .area_txt{display:inline-block; margin:0 0 0 10px; width:calc(100% - 154px); vertical-align:middle;}
	.area_product > ul.col5 > li{margin:0 25px 30px 0; border-bottom:none; width:calc((100% / 2) - 13px); width:-webkit-calc((100% / 2) - 13px);}
	.area_product > ul.col5 > li:nth-child(2n){margin:0;}
	.area_product > ul.col5 > li:nth-child(5n){}
	.area_product > ul.col5 > li > a{padding:0;}
	.area_product > ul.col5 > li > a .area_img{display:block; margin:0; width:100%; height:0; padding-bottom:95%;}
	.area_product > ul.col5 > li > a .area_txt{display:block; width:100%; margin:10px 0 0;}
	.area_adbn{margin:10px 0;}
}
@media screen and (max-width:550px){
	.area_product > ul.col5 > li{margin:0 12px 20px 0; width:calc((100% / 2) - 6px); width:-webkit-calc((100% / 2) - 6px);}
	.area_product > ul.col5 > li:nth-child(2n){margin:0;}
	.area_product > ul.col5 > li:nth-child(5n){margin:0 12px 20px 0;}

}
.area_notice{margin:70px 0;}
.area_notice .lt{border:1px solid #ddd; box-shadow: 0px 5px 9px 1px rgba(0, 0, 0, 0.03); border-radius:10px; box-sizing:border-box; padding:26px 0;}
.area_notice .lt:after{ display:block; content:""; clear:both;}
.area_notice .lt .lt_title{float:left; display:block; width:120px;}
.area_notice .lt > a > h3{text-align:center; font-size:16px; font-weight:bold; line-height:1.5em; color:#111;}
body.ie .area_notice .lt > a > h3{line-height:1.9em;}
.area_notice .lt > ul{margin:0; float:left; width:calc(100% - 120px); width:-webkit-calc(100% - 120px);}
.area_notice .lt > ul > li{position:relative;}
.area_notice .lt > ul > li a{display:block; width:85%; padding:0; font-family: 'GmarketSansLight'; font-weight:normal; font-size:15px; color:#555; line-height:1.7em;     text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;}
.area_notice .lt > ul > li a strong{position:relative; top:3px;}
.area_notice .lt > ul > li span{position:absolute; top:50%; right:20px; transform:translateY(-50%); font-weight:bold; font-size:14px;}
body.ie .area_notice .lt > ul > li span{top:53%;}

@media screen and (max-width:768px){
	.area_notice{margin:40px 0; display:none;}
	.area_notice .lt{padding:20px 0;}
}
@media screen and (max-width:550px){
	.area_notice .lt .lt_title{width:85px;}
	.area_notice .lt > a > h3{font-size:15px;}
	.area_notice .lt > ul > li a{font-size:14px;}
	.area_notice .lt > ul > li span{display:none;}
	.area_notice .lt > ul > li a strong{top:4px;}
	.area_notice .lt > ul{width:calc(100% - 85px); width:-webkit-calc(100% - 85px);}

	#main.area_adbn .swiper-slide{height:89px;}
}


#area_appstore{margin:100px 0 0; padding:45px 0 0; background:#fff; text-align:center;}
#area_appstore .inr{width:100%; height:100%;}
#area_appstore .inr > div{display:inline-block;}
#area_appstore .area_txt{vertical-align:middle; margin:0 0 0 50px; text-align:left;}
#area_appstore .area_txt > h3{display:block; font-size:35px; font-weight:600; color:#222; line-height:1.5em; word-break:keep-all;}
#area_appstore .area_txt .list_link{margin:20px 0 0;}
#area_appstore .area_txt .list_link > li{display:inline-block; margin:0 7px 0 0; background:#000; border-radius:5px;}
#area_appstore .area_txt .list_link > li > a{display:block; padding:5px;}


@media screen and (max-width:1024px){
	 #area_appstore{display:none;}
}
