@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
*{margin:0px;padding:0px;font-size:12px;color:#666666;font-family:'Nanum Gothic',monospace;}
li{list-style:none;}
a{text-decoration:none;}
img{ display:block;  border:none;}
table{border-collapse:collapse;border-spacing:0px;}
address{font-style:normal;}
fieldset{border:none;}
legend{position:absolute;left:-999em;}
input[type=button], input[type=submit], input[type=reset], input[type=image], button{cursor:pointer;}

section{ min-width: 320px; width: 100%; height: auto; overflow: hidden; }

.main_title{ font-size: 30px; font-weight: bold; color: #0e0e0e; width: 100%; border-bottom: 1px solid #656565; margin-bottom: 20px; padding-bottom: 10px; }


/* 01 */
.intro{ width: 90%; height: 370px; margin: 0 auto; margin-top: 20px; background: url('../images/sub/intro_bg.png') no-repeat; background-position: bottom right; background-size: 30%; overflow: hidden; }
.intro p{ overflow: hidden; }
.blue_line{ border-top: 5px solid #318fd1; width: 46px; }
.blue_sub_title{ font-size: 30px; font-weight: bold; color: #0e0e0e; margin-bottom: 10%; }
.blue{ font-weight: bold; color: #318fd1; font-size: 16px; }
.intro p{ line-height: 18px; letter-spacing: -2px; }

.chart{ width: 100%; height: auto; margin: 10% 0; }
.chart h3{ margin-left: 5%; }
.chart div.blue_line{ margin-left: 5%; }
.blue_img01{ width: 100%; height: auto; margin-bottom: 5%; }
.blue_img01 img{ width: 90%; height: auto; margin: 0 auto; }

.survice{ width: 100%; height: auto; border-top: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; }
.survice img{ width: 90%; height: auto; margin: 10% auto; }

.client{ width: 100%; height: auto; margin: 10% 0; }
.client_img img{ width: 90%; height: auto; margin: 0 auto; }

.contact{ width: 100%; height: auto; background-color: #313131; padding: 10% 0; }
.contact a{ width: 40%; height: auto; display: block; margin: 5% auto; }
.contact a img{ width: 100%; height: auto; margin: 0 auto; }

.client_title{ font-size: 25px; font-weight: 400px; text-align: center; }
.client_title strong{ font-size: 25px; font-weight: bold; }
.client_txt{ text-align: center; line-height: 20px; margin-bottom: 5%; }

.contact_title{ font-size: 25px; color: #fff; font-weight: bold; text-align: center; }
.contact_txt{ text-align: center; color: #fff; line-height: 20px; margin-bottom: 5%; }



/* 02 */
.search_page_top{ width: 90%; height: auto; overflow: hidden; margin: 10% auto;}
.search_title{ font-size: 30px; font-weight: bold; color: #0e0e0e; border-bottom: 1px solid #656565; }
.search_txt{ font-size: 12px; line-height:20px; margin-top: 5%; color: #0e0e0e; }
.slider_wrap{ width: 100%;  height: auto; overflow: hidden; }
.sub_slider_bg{ width: 100%; height: auto; margin: 5% auto; }

.sub_middle{ width: 100%; height: auto; }
.sub_off_wrap{ width: 100%; height: auto; overflow: hidden; margin-left: 5%; margin-bottom: 10%; }
.sub_off_wrap div{ box-sizing: border-box; font-size: 0; padding: 0; width: 40%; font-size: 0; float: left; margin: 2.5%; box-shadow: 5px 5px 5px rgba(0,0,0,0.5); }
.sub_off_wrap div img{ width: 100%; height: auto; }

.sub_on_wrap01{ width: 100%; height: 165%; background-color: rgba(0,0,0,0.5); position: absolute; top: 20%; left: 0; z-index: 9999999; display: none; }
.sub_on_wrap01 > div{ width: 90%; height: auto; margin: 95% auto; }
.sub_on_wrap01 > div img{ width: 95%; margin: 0 auto; }
.sub_on_close_btn{ width: 10%; height: auto; display: block; position: absolute; top: 30%; right: 5.5%; }
.sub_on_close_btn img{ width: 100%; height: auto; }

.sub_on_wrap02{ width: 100%; height: 165%; background-color: rgba(0,0,0,0.5); position: absolute; top: 20%; left: 0; z-index: 9999999; display: none; }
.sub_on_wrap02 > div{ width: 90%; height: auto; margin: 95% auto; }
.sub_on_wrap02 > div > img{ width: 95%; margin: 0 auto; }

.sub_on_wrap03{ width: 100%; height: 165%; background-color: rgba(0,0,0,0.5); position: absolute; top: 20%; left: 0; z-index: 9999999; display: none; }
.sub_on_wrap03 > div{ width: 90%; height: auto; margin: 95% auto; }
.sub_on_wrap03 > div > img{ width: 95%; margin: 0 auto; }

.sub_on_wrap04{ width: 100%; height: 165%; background-color: rgba(0,0,0,0.5); position: absolute; top: 20%; left: 0; z-index: 9999999; display: none; }
.sub_on_wrap04 > div{ width: 90%; height: auto; margin: 95% auto; }
.sub_on_wrap04 > div > img{ width: 95%; margin: 0 auto; }


.sub_bottom{ width: 100%; height: auto; overflow: hidden; background-color: #f8f8f8; padding-top: 10%; padding-bottom: 10%; }
.partner_title{ font-size: 30px; font-weight: bold; text-align: center; color: #0e0e0e; }
.border_bottom{ border-bottom: 3px solid #0e0e0e; width: 50px; margin: 3% auto; }
.sub_bottom img{ width: 90%; margin: 0 auto; }


/* 03 */
.display{  width: 90%; height: auto; overflow: hidden; margin: 10% auto; }
.display_title{ font-size: 30px; font-weight: bold; color: #0e0e0e; border-bottom: 1px solid #656565; }
.display img{ width: 100%; height: auto; }

.sub03_off_wrap01{ background-color: #939393; width: 100%; height: auto; margin: 0 auto; overflow: hidden; padding: 10% 0; }
.sub03_off_wrap01 div{ width: 90%; height: auto; margin: 2.5% 0; }
.sub03_off_wrap01 div img{ width: 100%; height: auto; margin-left: 5%; }

.net{ width: 100%; height: auto; }
.net img{ width: 100%; height: auto; }

.sub03_off_wrap02{ background-color: #939393; width: 100%; height: auto; margin: 0 auto; overflow: hidden; padding: 10% 0; }
.sub03_off_wrap02 div{ width: 90%; height: auto; margin: 2.5% 0; }
.sub03_off_wrap02 div img{ width: 100%; height: auto; margin-left: 5%; }

.frend{ width: 100%; height: auto; }
.frend img{ width: 100%; height: auto; }

.sub03_on_wrap01{ width: 100%; height: 165%; background-color: rgba(0,0,0,0.5); position: absolute; top: 20%; left: 0; z-index: 9999999; display: none; }
.sub03_on_wrap01 > div{ width: 90%; height: auto; margin: 95% auto; }
.sub03_on_wrap01 > div img{ width: 95%; margin: 0 auto; }
.sub03_on_close_btn{ width: 10%; height: auto; display: block; position: absolute; top: 24%; right: 5.5%; }
.sub03_on_close_btn img{ width: 100%; height: auto; }

.sub03_on_wrap02{ width: 100%; height: 165%; background-color: rgba(0,0,0,0.5); position: absolute; top: 20%; left: 0; z-index: 9999999; display: none; }
.sub03_on_wrap02 > div{ width: 90%; height: auto; margin: 95% auto; }
.sub03_on_wrap02 > div > img{ width: 95%; margin: 0 auto; }

.sub03_on_wrap03{ width: 100%; height: 165%; background-color: rgba(0,0,0,0.5); position: absolute; top: 20%; left: 0; z-index: 9999999; display: none; }
.sub03_on_wrap03 > div{ width: 90%; height: auto; margin: 95% auto; }
.sub03_on_wrap03 > div > img{ width: 95%; margin: 0 auto; }

.sub03_on_wrap04{ width: 100%; height: 165%; background-color: rgba(0,0,0,0.5); position: absolute; top: 104%; left: 0; z-index: 9999999; display: none; }
.sub03_on_wrap04 > div{ width: 90%; height: auto; margin: 95% auto; }
.sub03_on_wrap04 > div > img{ width: 95%; margin: 0 auto; }

.sub03_on_wrap05{ width: 100%; height: 165%; background-color: rgba(0,0,0,0.5); position: absolute; top: 104%; left: 0; z-index: 9999999; display: none; }
.sub03_on_wrap05 > div{ width: 90%; height: auto; margin: 95% auto; }
.sub03_on_wrap05 > div > img{ width: 95%; margin: 0 auto; }

.sub03_on_wrap06{ width: 100%; height: 165%; background-color: rgba(0,0,0,0.5); position: absolute; top: 104%; left: 0; z-index: 9999999; display: none; }
.sub03_on_wrap06 > div{ width: 90%; height: auto; margin: 95% auto; }
.sub03_on_wrap06 > div > img{ width: 95%; margin: 0 auto; }

/* 04 */
section img{ width: 100%; height: auto; overflow: hidden; }
.virer{ width: 100%; height: auto; overflow: hidden; margin: 10% 0; }
.virer_title{ font-size: 30px; font-weight: bold; color: #0e0e0e; border-bottom: 1px solid #656565; width: 90%; margin: 0 auto; margin-bottom: 5%; padding-bottom: 2%; }
.virer_txt{ width: 90%; height: auto; margin: 0 auto; font-size: 12px; line-height: 20px; margin-bottom: 10%; color: #0e0e0e; }

.blog{ width: 100%; height: auto; overflow: hidden; }
.blog_title01{ width: 90%; margin: 0 auto; font-size: 20px; color: #0e0e0e; font-weight: bold; margin-bottom: 5%; text-align: left; }
.blog_title02{ width: 90%; margin: 5% auto; font-size: 20px; color: #0e0e0e; font-weight: bold; text-align: right; }
.blog_title03{ width: 90%; margin: 5% auto; font-size: 20px; color: #0e0e0e; font-weight: bold; text-align: left; }
.blog_title04{ width: 90%; margin: 5% auto; font-size: 20px; color: #0e0e0e; font-weight: bold; text-align: right; }
.blog_title05{ width: 90%; margin: 5% auto; font-size: 20px; color: #0e0e0e; font-weight: bold; text-align: left; }
.blog_title06{ width: 90%; margin: 5% auto; font-size: 20px; color: #0e0e0e; font-weight: bold; text-align: right; }
.blog_title07{ width: 90%; margin: 5% auto; font-size: 20px; color: #0e0e0e; font-weight: bold; text-align: left; }
.blog_txt01{ width: 90%; height: auto; margin: 0 auto; font-size: 12px; line-height: 20px; margin-bottom: 10%; color: #0e0e0e; word-spacing: -1px; }
.blog_txt02{ width: 90%; height: auto; margin: 0 auto; font-size: 12px; line-height: 20px; margin-bottom: 10%; color: #0e0e0e; word-spacing: -1px; text-align: right; }
.blog_txt03{ width: 90%; height: auto; margin: 0 auto; font-size: 12px; line-height: 20px; margin-bottom: 10%; color: #0e0e0e; word-spacing: -1px; }
.blog_txt04{ width: 90%; height: auto; margin: 0 auto; font-size: 12px; line-height: 20px; margin-bottom: 10%; color: #0e0e0e; word-spacing: -1px; text-align: right; }
.blog_txt05{ width: 90%; height: auto; margin: 0 auto; font-size: 12px; line-height: 20px; margin-bottom: 10%; color: #0e0e0e; word-spacing: -1px; }
.blog_txt06{ width: 90%; height: auto; margin: 0 auto; font-size: 12px; line-height: 20px; margin-bottom: 10%; color: #0e0e0e; word-spacing: -1px; text-align: right; }
.potal_list_title{ font-size: 20px; font-weight: 400; color: #0e0e0e; text-align: center; }
.potal_list_title strong{ font-size: 20px; font-weight: bold; color: #0e0e0e; }
.potal_list img{ margin-top: 5%; margin-bottom: 10%; }


/* 05 */
.sns_title{ font-size: 30px; font-weight: bold; color: #0e0e0e; border-bottom: 1px solid #656565; width: 90%; margin: 10% auto 5% auto; padding-bottom: 2%; }
.sns_txt{ width: 90%; height: auto; margin: 0 auto; font-size: 12px; line-height: 20px; margin-bottom: 10%; color: #0e0e0e; word-spacing: -2px; }

.brand_sns{ position: relative; }
.reading_btn{width: 15%; height: 5%; position: absolute; top: 7.9%; right: 3.5%;}
.line{ position: relative; }
.line_reading_btn{width: 17%; height: 5%; position: absolute; top: 10.5%; right: 3.5%;}

.sub05_on_wrap01{ width: 100%; height: 165%; background-color: rgba(0,0,0,0.5); position: absolute; top: 125%; left: 0; z-index: 9999999; display: none; }
.on_01_wrap{ width: 100%; height: auto; margin-top: 150%; }
.on_01_wrap > div{ width: 42%; height: auto; margin: 2.5% 2.5%; float: left; padding-left: 2.5%; }
.sub05_on_wrap01 > div img{ width: 100%; margin: 0 auto; }
.sub05_on_close_btn{ width: 10%; height: auto; display: block; position: absolute; top: 52%; right: 5.5%; }
.sub05_on_close_btn img{ width: 100%; height: auto; }

.sub05_on_wrap02{ width: 100%; height: 165%; background-color: rgba(0,0,0,0.5); position: absolute; top: 175%; left: 0; z-index: 9999999; display: none; }
.on_02_wrap{ width: 100%; height: auto; margin-top: 100%; }
.on_02_wrap > div{ width: 42%; height: auto; margin: 2.5% 2.5%; float: left; padding-left: 2.5%; }
.sub05_on_wrap02 > div img{ width: 100%; margin: 0 auto; }
.sub05_on_close_btn02{ width: 10%; height: auto; display: block; position: absolute; top: 32%; right: 5.5%; }
.sub05_on_close_btn02 img{ width: 100%; height: auto; }

/* 06 */
.marketing_title{ font-size: 30px; font-weight: bold; color: #0e0e0e; border-bottom: 1px solid #656565; width: 90%; margin: 10% auto 5% auto; padding-bottom: 2%; }
.marketing_p{ width: 90%; height: auto; margin: 0 auto; font-size: 12px; line-height: 20px; margin-bottom: 10%; color: #0e0e0e; word-spacing: -2px; }

/*our client 제휴업체*/
.client_wrap { height:510px; background:gold; border-top:1px solid #d7d7d7; background:#f8f8f8; position:relative;}
.client_title { width:100%; text-align:center;padding-top:60px; }
/* .client_title h3 { opacity:0;} */
.client_title h3 b { font-size:30px; font-weight:900; }
.client_title h3 span { font-size:30px; font-weight:200; }
.client_title p { font-size:12px; font-weight:300;}

/* 07 */

.marketing_wrap{ width: 90%; height: auto; margin: 0 auto; margin-top: 20px; }

.marketing_txt{  }
.marketing_txt_title{ font-size: 14px; color: #0e0e0e; font-weight: bold; }
.sub_title{ color: #0e0e0e; font-size: 16px; font-weight: bold; margin-bottom: 10px; margin-top: 20px; }
.sub_title img { float: left; margin: 6px 6px 0 0; }
.marketing_txt p{ font-size: 12px; color: #606060; font-weight: 400; }
.marketing_txt p span.yellow a{ font-size: 16px; font-weight: bold; color: #ffba00; }

.radios01{ width: 100%; height: auto; }
.radios01 input[type="radio"]+label{ font-size: 12px; font-weight: bold; color: #0e0e0e; display: block; height: 18px; line-height: 20px; }
.radios01 input[type="radio"]{ display: none; }
.radios01 input[type="radio"]+label::before{ content:''; display: inline-block; width: 16px; height: 16px; vertical-align: middle; margin: -2px 4px 0 10px; background: url('../images/sub/radio_on_off.png') }
.radios01 input[type="radio"]:checked+label::before{ background: url('../images/sub/radio_on_off.png'); background-position: 16px 0; }

.radios01 p{ margin-bottom: 5px; overflow: hidden; }
.radios01 p:nth-child(1){ float: left; margin-right: 5px; }
.radios01 p:nth-child(2){ float: left; margin-right: 5px; }
.radios01 p:nth-child(4){ float: left; margin-right: 16.5px; }
.radios01 p:nth-child(5){ float: left; margin-right: 5.5px; }

table{ width: 100%; height: auto; }
table tr th{ box-sizing: border-box; font-size: 12px; color: #0e0e0e; text-align: left; overflow: hidden; width: 17%; padding-bottom: 10px;}
table tr td{ box-sizing: border-box; font-size: 0px; color: #0e0e0e; overflow: hidden; width: 33%; padding-bottom: 10px; }
table tr td input{ width: 90%; border-radius: 5px; -webkit-appearance: none; }

span.star{ color: #ffba00; }

.txt_area_title{ font-size: 12px; color: #0e0e0e; text-align: left; font-weight: bold; margin-bottom: 5px; }
textarea{ width: 100%; height: auto; border-radius: 5px;  resize: none; margin-bottom: 5px; }

input[type="checkbox"]{ width: 16px; height: 16px; float: left; }
input[type="checkbox"]+label{ font-size: 12px; color: #8c8c8c; font-weight: 500; display: block; height: 16px; line-height: 18px; margin-left: 21px; }

input[type="button"]{ width: 37%; height: 30px; background: url('../images/sub/submit.png') center no-repeat; border: none; text-indent: -999em; margin: 5% 0 10% 30%;  }