@charset "utf-8"; 

@import url('font.css'); 
@import url('basic.css'); 


/*-------------------
메인칼라:31b6f4
주텍스트:494949
서브텍스트:747474
흐린텍스트:909090
테두리:e5e5e5

테이블 위:797979
테이블 아래:b3b3b3
-------------------*/
.skip{overflow:hidden; position:absolute; top:0; left:0; z-index:1000; width:1px; height:1px; margin:0 -1px -1px 0; padding:0; font-size:0; line-height:0}
.skip:hover,.skip:active,.skip:focus{position:absolute; top:0; left:0; width:100%; height:19px; background:#45474d; text-indent:0; text-align:center;}

#content > section:after, #footer:after, #footer .foot_info dl:after, .main_post:after, .intro_visual:after, .intro_feature:after, .benefit_cont li:after, .vision_cont:after, .step:after,.cooper_link .cooper_image ul:after,
.board li:after, .board_view dt:after{content:''; clear:both; display:block;}

.main{background-color:#f7f7f7;}
#wrap{min-width:320px;}
#gnb ul, #content, .footer_static{margin:0 auto; width:1000px;}
#header{border-bottom:2px solid #31b6f4; background-color:#fff;}
#header h1{padding-top:25px; height:50px; text-align:center;}
#gnb{height:40px; border-top:1px solid #31b6f4;}
#gnb li{float:left; width:20%; font-size:15px; font-weight:bold; line-height:40px; text-align:center;}
#gnb li a{display:inline-block; height:38px; border-bottom:2px solid #fff; -webkit-transition:all .2s; transition:all .2s;}
#gnb li a:hover, #gnb li.on a{color:#23a4f0; border-bottom:2px solid #23a4f0;}
#content{padding-bottom:40px;}
#content > section{padding:0 20px;}
#footer{position:relative; padding:20px 0; color:#999; background-color:#5e5e5e;}
#footer .copyright{float:left;}
#footer .sns_link{float:right; margin-right:20px;}
#footer .foot_logo{float:left; margin:0 20px;}
#footer .foot_logo img{width:153px;}
#footer .foot_info{overflow:hidden;}
#footer .foot_info dt, #footer .foot_info dd{float:left; margin-right:3px; font-size:11px;}
#footer .foot_info dd{margin-right:10px;}
#footer .foot_info p{font-size:10px; text-transform:uppercase;}

/* main */
.spot{}
.spot_images{position:relative; overflow:hidden; height:450px; border-bottom:1px solid #ddd;}
.spot_images > div{position:absolute; top:0; left:0; z-index:500; width:100%; height:450px; text-align:center;}
.spot_image1{background:url(../images/main_img1.jpg) no-repeat 50% 0;}
.spot_image2{background:url(../images/main_img2.jpg) no-repeat 50% 0;}
.spot_image3{background:url(../images/main_img3.jpg) no-repeat 50% 0;}
.spot_image01{background:url(../images/main_img01.jpg) no-repeat 50% 0;}
.spot_image11{background:url(../images/main_img11.jpg) no-repeat 50% 0;}
.spot_image22{background:url(../images/main_img22.jpg) no-repeat 50% 0;}
.spot_image33{background:url(../images/main_img33.jpg) no-repeat 50% 0;}
.spot_page{padding:15px 0; text-align:center; background-color:#F7F7F7;}
.spot_page a{display:inline-block; margin:0 5px; width:16px; height:16px; text-indent:-9999px; background:url(../images/slide_page.png) no-repeat center 0;}
.spot_page a.active{background-position:center -20px;}

.main_post{border-right:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; background-color:#fff;}
.main_post li{float:left; width:50%; border-top:1px solid #e5e5e5;}
.main_post li a{display:block; color:#909090;}
.main_post li figure{float:left; overflow:hidden; position:relative; width:52.7%; background:#E5E5E5;}
.main_post li .post_cont{overflow:hidden; padding:0 5%; width:36.5%; height:100%; *background-color:#fff;}
.main_post li figure, .main_post li .post_cont{height:213px; border-left:1px solid #e5e5e5;}
.main_post li figure span{position:absolute; top:0; z-index:5; overflow:hidden; width:15px; height:100%;}
.main_post li figure img{width:100%; height:100%}
.main_post li.mask_l figure{border-left-color:#fff;}
.main_post li.mask_l figure span{left:0; background:url(../images/mask_l.png) no-repeat left center; background-size:auto 100%;}
.main_post li.mask_l .post_cont{}
.main_post li.mask_r figure span{right:0; background:url(../images/mask_r.png) no-repeat right 0; background-size:auto 100%;}
.main_post li.mask_r .post_cont{border-left-color:#fff;}
.main_post strong{margin:25px 0 10px; font-size:16px; color:#494949; max-height:43px; display:block; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; .display:block;}
.main_post p{margin-bottom:10px; font-size:13px; max-height:54px; display:block; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis}

.cooper_link{position:relative; margin-bottom:20px; height:47px; border:1px solid #e5e5e5; background-color:#fbfbfb;}/* height:53px*/
.cooper_link .dir{position:absolute; top:0; width:40px; height:100%; text-indent:-9999px;}
.cooper_link .dir.pre{left:0; background:url(../images/cooper_prev.png) no-repeat center center;}
.cooper_link .dir.next{right:0; background:url(../images/cooper_next.png) no-repeat center center;}
.cooper_link .cooper_image{overflow:hidden; margin:3px 38px 0;}
.cooper_link .cooper_image ul{position:relative;}
.cooper_link .cooper_image li{float:left; padding-right:10px; width:126px; font-size:12px;}
.cooper_link .cooper_image li a{overflow:hidden; display:inline-block; padding:3px 0; width:100px; text-align:center; vertical-align:middle;}
.cooper_link .cooper_image li.bar{background:url(../images/cooper_bar.gif) no-repeat 85% center;}
.cooper_link .cooper_image li.tc{text-align:center;}

/* sub */
.sub_title{margin-bottom:40px; padding:25px 0 12px; border-bottom:1px dashed #dedede;}
.sub_title h2{font-size:32px; letter-spacing:-1px;}
.sub_title p{margin-top:10px; padding-left:5px; width:95%; font-size:14px; color:#747474; line-height:1.6;}
.sub_title p br{display:none;}
.page .tit{margin-bottom:20px; font-size:18px; font-weight:bold; color:#31b6f4;}/*설명페이지*/
.page .tit.gab{margin-top:35px;}
.page .kinds{font-size:15px; color:#494949;}
.page p{margin:10px 0; color:#909090;}
.list_dot li{margin-bottom:5px; padding-left:12px; color:#909090; background:url(../images/i_dot.png) no-repeat left 8px;}
/* 이미지 우측이동 */
.img_r figure{float:right !important}
/* 강조색 */
.main_post li a:hover strong, .intro_visual .slogan h3 span, .benefit_cont li h3 span, 
.vision_cont h3 span, .board li .board_cont h3 a:hover{color:#31b6f4;}

.intro_visual{margin-bottom:40px; *zoom:1;}
.intro_visual .slogan{float:left; margin:100px 0 30px 50px; width:45%;}
.intro_visual .slogan h3{font-size:38px; text-indent:-15px; letter-spacing:-2px;}
.intro_visual .slogan p{width:74%; margin-top:10px; font-size:16px; color:#747474;}
.intro_visual figure{float:right;}
.intro_feature li{float:left; display:table; margin-bottom:2.5%; width:48.5%; color:#909090; line-height:1.5; border:1px solid #e5e5e5; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; -webkit-box-shadow:1px 1px rgba(0,0,0,0.08); -moz-box-shadow:1px 1px rgba(0,0,0,0.08); box-shadow:1px 1px rgba(0,0,0,0.08);}
.intro_feature li.fr{float:right;}
.intro_feature li h4{display:table-cell; vertical-align:middle; padding:7px 20px; width:120px; height:90px; font-size:16px; font-weight:bold; color:#2f5668; border-right:1px solid #d8dfe3; background-color:#f8f8f8; .float:left;}
.intro_feature li p{display:table-cell; vertical-align:middle; padding:7px 20px; .overflow:hidden;}
.intro_feature li h4 span{font-size:17px; text-decoration:underline;}

.benefit_cont li{margin-bottom:50px; *zoom:1;}
.benefit_cont li figure{float:left; margin-right:3%;}
.benefit_cont .img_r figure{margin-right:0; margin-left:25px;}
.benefit_cont .cont{overflow:hidden;}
.benefit_cont li h3{float:left; position:relative; margin-right:29px; padding-left:70px; width:38%; font-size:24px; font-weight:bold; line-height:1.4; letter-spacing:-1px; color:#5a5a5a;}
.benefit_cont li h3 .dot{padding-top:5px; background:url(../images/i_letter_dot2.png) no-repeat center top;}
.benefit_cont li h3 span .dot{background-image:url(../images/i_letter_dot1.png);}
.benefit_cont li h3 .num{position:absolute; top:-5px; left:0; font-size:40px; font-weight:bold; color:#31b6f4;}
.benefit_cont li h3 .num span{position:absolute; bottom:0; left:20%; right:20%; height:2px; background-color:#31b6f4;}
.benefit_cont li p{overflow:hidden; margin-bottom:10px; line-height:1.7; color:#909090; text-align:justify;}

.vison_visual{float:right; margin-left:50px; text-align:center;}
.vision_cont{overflow:hidden; margin-bottom:50px;}
.vision_cont li{margin-top:30px;}
.vision_cont h3{position:relative; margin-bottom:15px; font-size:22px; font-weight:bold; line-height:1.3; letter-spacing:-1px;}
.vision_cont h3 em{font-size:32px; color:#31b6f4; font-weight:normal;}
.vision_cont p{margin-bottom:10px; line-height:1.7; color:#909090; text-align:justify;}
.vision_cont li h3 .f_sm{display:block; font-size:15px; font-weight:normal; color:#797979; letter-spacing:0;}

.step li{float:left; position:relative; padding:0 3%; width:27%; text-align:center;}
.step li em{position:absolute; top:0; left:10%; font-size:24px; font-family:tahoma, verdana, sans-serif; color:#797979;}
.step li strong{display:block; margin-bottom:15px; padding-top:78px; height:46px; font-size:15px; color:#fff; line-height:1.2;}/*height:124*/
.step li.step1 strong{background:url(../images/member_step1.png) no-repeat center 0;}
.step li.step2 strong{background:url(../images/member_step2.png) no-repeat center 0;}
.step li.step3 strong{background:url(../images/member_step3.png) no-repeat center 0;}
.step li .arrow{position:absolute; top:20%; right:0; width:30px; height:47px; text-indent:-9999px; background:url(../images/stepArrow_r.png) no-repeat right center;}

.member_info dt{float:left;}
.member_table{margin-bottom:30px; border-top:2px solid #797979; border-bottom:1px solid #b3b3b3;}
.member_table th, .member_table td{padding:13px 13px; border-top:1px solid #e5e5e5;}
.member_table th{width:20%; border-right:1px solid #e5e5e5; background-color:#fafafa;}
.member_table td{width:80%; color:#909090;}
.member_table .first th, .member_table .first td{border-top:0;}

.contact li{float:left; width: 50%;min-height:60px; font-size:20px; line-height:1.2; font-weight:bold; text-align: center;}
.contact  img{ margin-left:8px; vertical-align:top;}
.contact  .tel span{display:inline-block; text-align: left;}
.contact  .tel strong{display:block;}
.contact  .tel a{font-size:26px; font-weight:bold; color:#31b6f4; letter-spacing:-1px; vertical-align:-2px}
.contact  .waring span{display:inline-block; text-align: left;}
.contact  .waring strong{display:block;}
.contact .waring a{display:block; color:#909090; line-height:60px;}

.board li{margin-bottom:20px; padding-right:50px; *zoom:1;}
.board li figure{float:left; overflow:hidden; margin-right:40px; width:23%; border:1px solid #e5e5e5;}
.board li figure img{width:100%;}
.board li .board_cont{overflow:hidden;}
.board li .board_cont h3, .board_view dt .col.tit{font-size:18px;}
.board li .board_cont .date{display:block; margin:3px 0 15px; font-size:12px; color:#999;}
.board li .board_cont p{line-height:1.6; color:#909090; max-height:38px; display:block; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis}

.board_view{border:1px solid #e5e5e5; border-top:2px solid #797979;}
.board_view dt{display:table; width:100%; background-color:#fafafa; border-bottom:1px solid #e5e5e5; .display:block; .padding:15px 0}
.board_view dt .col{display:table-cell; vertical-align:top; padding:15px 30px; height:55px;}
.board_view dd{padding:30px; color:#797979; line-height:1.7;}

.board_preview{margin-top:30px; border:1px solid #e5e5e5; border-bottom:0;}
.board_preview dt, .board_preview dd{height:50px; line-height:50px; font-size:15px; border-bottom:1px solid #e5e5e5;}
.board_preview dt{float:left; width:150px; text-align:center; white-space:nowrap; border-right:1px solid #e5e5e5;}
.board_preview dt.prev{background:#f9f9f9 url(../images/i_board_bullet.png) no-repeat 75% 23px;}
.board_preview dt.next{background:#f9f9f9 url(../images/i_board_bullet.png) no-repeat 75% -28px;}
.board_preview dd{overflow:hidden; padding-left:30px; text-overflow:ellipsis; white-space:nowrap;}
.board_preview dd a:hover{text-decoration:underline;}

.paging{margin:35px 0 0; text-align:center;}
.paging a{display:inline-block; width:33px; height:33px; line-height:33px; color:#909090; vertical-align:middle; border:1px solid #e5e5e5;}
.paging a:hover{color:#494949; font-weight:bold;}
.paging .prev, .paging .next{text-indent:-9999px; background:url(../images/i_paging.png) no-repeat center 0;}
.paging .prev.first{background-position:center -66px;}
.paging .next{background-position:center -33px;}
.paging .next.last{background-position:center -99px;}
.paging .prev:hover, .paging .next:hover{background-image:url(../images/i_paging_on.png);}

.btn_wrap{margin-top:20px; text-align:right;}
.button{display:inline-block; padding:0 18px; height:35px; line-height:35px; color:#fff; background-color:#31b6f4;}/*31b6f4 7e7e7e*/
.button.line{font-size:14px; font-weight:bold; color:#31b6f4; border:2px solid #31b6f4; background-color:#fff;}
.go_top{display:none; position:absolute; top:14px; right:15px; padding-top:13px; width:36px; height:23px; border:1px solid #fff; opacity:0.7; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%;}
.go_top a{display:block; font-size:10px; color:#fff; text-transform:uppercase;}
.go_top:after{content:''; display:block; position:absolute; top:7px; left:50%; margin-left:-4px; width:0; height:0; border-style:solid; border-width:0 5px 5px 5px; border-color:transparent transparent #ffffff transparent;}

@media only screen and (max-width :1024px){
	#gnb ul, #content, .footer_static{width:100%;}
	.main #content{padding-bottom:0;}
	#footer .foot_info dt.hide + dd{float:none;}
	.spot_image01{background:url(../images/main_img01.jpg) no-repeat 50% 0; -webkit-background-size:cover; background-size:cover;}
	.spot_image11{background:url(../images/main_img11.jpg) no-repeat 50% 0; -webkit-background-size:cover; background-size:cover;}
	.spot_image22{background:url(../images/main_img22.jpg) no-repeat 50% 0; -webkit-background-size:cover; background-size:cover;}
	.spot_image33{background:url(../images/main_img33.jpg) no-repeat 50% 0; -webkit-background-size:cover; background-size:cover;}
	.main_post{border-bottom:0;}
	.intro_visual .slogan{float:none; margin:0; width:auto; text-align:center;}
	.intro_visual .slogan p{margin:15px auto; font-size:15px;}
	.intro_visual figure{float:none; text-align:center;}
	.intro_feature li h4{display:block; width:auto; height:auto; border-right:0; border-bottom:1px solid #d8dfe3;}
	.intro_feature li  p{display:block;}
	.intro_feature li h4 br{display:none;}
	.benefit_cont li p{width:auto;}
}
@media only screen and (min-width :768px) and (max-width :1024px){
	#header h1 img{width:195px;}
	.intro_feature li{height:130px;}
}
@media only screen and (min-width:500px) and (max-width:767px){
	.main_post li figure{width:32%;}
	.main_post li .post_cont{width:61%;}
}
@media only screen and (min-width:320px) and (max-width:430px){
	.sub_title p br{display:inline;}
	.benefit_cont li figure{float:none !important; margin:0 auto 5% !important; text-align:center;}
	.benefit_cont li p{padding-left:0 !important}
	.member_table th{width:24%;}
}
@media only screen and (min-width:320px) and (max-width:767px){
	#header h1{padding-top:10px; height:35px;}
	#header h1 img{width:140px;}
	#gnb li{font-size:13px;}
	#gnb li a{display:block;}
	#footer{padding:15px 0 10px; text-align:center;}
	#footer .foot_logo, #footer .foot_info dl{display:none;}
	#footer .copyright, #footer .sns_link{float:none;}
	#footer .sns_link{margin-bottom:8px;}
	#footer .sns_link a{margin:0 1%;}
	.go_top{display:block;}

	img{max-width:100%;}

	.main_post li{float:none; width:100%; font-size:12px;}
	.main_post li figure, .main_post li .post_cont{height:170px;}
	.main_post li .post_cont{padding:0 3%;}
	.main_post strong{margin-top:20px; font-size:14px;}

	.sub_title{margin-bottom:20px;}
	.sub_title h2{font-size:24px; font-weight:bold; text-align:center;}
	.sub_title p{margin-top:20px; text-align:center;}
	.page .tit{font-size:17px;}

	.intro_visual .slogan h3{font-size:28px; text-indent:0;}
	.intro_feature li{float:none !important; display:block; width:auto; height:auto}
	.intro_feature li h4{display:block; padding:2% 3%}
	.intro_feature li p{padding:2% 3%}
	.benefit_cont li{padding-top:5%; margin-bottom:0;}
	.benefit_cont li figure{width:28%;}
	.benefit_cont li h3{float:none; margin:0; padding:0 0 20px 42px; width:auto; font-size:20px; font-weight:bold; line-height:1.4;}
	.benefit_cont li h3 .num{font-size:26px;}
	.benefit_cont li h3 br{display:none;}
	.benefit_cont li p{padding-left:42px;}
	.vison_visual{float:none; margin-left:0;}
	.step li{float:none; padding:0 0 70px 0; width:100%;}
	.step li.last{padding-bottom:0;}
	.step li .button{margin-top:20px;}
	.step li .arrow{top:auto; bottom:8%; left:50%; margin-left:-15px; width:47px; height:30px; background-image:url(../images/stepArrow_b.png);}
	.step p{margin:0 auto; width:80%;}
	.member_table th{width:28%;}
	.contact li{float:none; margin:0 0 5px; width:auto;padding:10px; text-align: left;border:1px solid #e5e5e5;}
	.contact li img{float: right;}
	.board li{padding:0 0 15px; border-bottom:1px solid #e5e5e5;}
	.board li figure{margin-right:5%; width:40%;}
	.board li .board_cont h3{font-size:14px; font-weight:bold;}
	.board li .board_cont{overflow:visible ;}
	.board li .board_cont .date{text-align:right;}
	.board_view dt, .board_view dd{display:block; padding:15px 20px; width:auto;}
	.board_view dt .col{display:block; padding:0; height:auto;}
	.board_view dt .col.tit{font-size:15px;}
	.board_view dt .col.date{text-align:right; font-size:12px; color:#909090;}
	.board_preview dt{width:30px; text-indent:9999px; overflow:hidden;}
	.board_preview dt.prev{background-position:center 23px}
	.board_preview dt.next{background-position:center -28px}
	.board_preview dd{padding-left:15px}
	.paging a{display:none;}
	.paging .prev, .paging .next{display:inline-block;}
}

@media only screen and  (min-device-width:480px) and (max-device-width:800px) and (orientation:landscape){
/* 	.main_post li figure{width:35%;}
	.main_post li .post_cont{width:58%; background-color:red;} ipad mini */
	.page .tit{text-align:center;}
	.member_table th{width:25%;}
}
@media only screen and  (min-device-width:480px) and (max-device-width:570px) and (orientation:landscape){
	.main_post li figure{width:43%;}
	.main_post li .post_cont{width:50%;}
}

.youtubeWrap {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
}
.youtubeWrap iframe {
  position: absolute;
  width: 100%;
  height: 100%;
}

a#link1{
    display: block;
    overflow: hidden;
    position: relative;   
    background: transparent;
    text-indent: -9999px; 
}
#link1 {
	margin-top: 250px;
    margin-left: 500px;
    width: 400px;
    height: 170px;

}