@charset "utf-8";

/**********************************************************************************
	
Common Style
----------------------------
최초작성자 : 디비코아 기획개발 1팀 박현정
최초작성일 : 2015.11.05
	
************************************************************************************/

/** Common */

html, body	{ padding: 0; margin: 0; font-size: 13px; font-family:NBG,'나눔고딕','NanumGothic',Dotum,AppleSDGothicNeo,sans-serif; }
body		{  }
img			{ border: 0; vertical-align: middle; max-width: 100%; }
fieldset	{ border: none; margin: 0; paddinG: 0; }
ul, li		{ list-style: none; margin: 0; padding: 0; }
input		{ vertical-align: middle; }
button, input[type="button"], input[type="submit"] { cursor: pointer; }
label		{ cursor: pointer; }
caption		{ display: block; position: absolute; width: 0px; height: 0px; overflow: hidden; top: 0; left: 0; }
table		{ border-spacing: 0; border-collapse: collapse; }

h1			{ position: absolute; left:0; top: 0; width: 1px; height: 1px; overfloW: hidden; }

.offscreen {overflow:hidden;/*position:absolute*/;left:-9999em;width:1px;height:0px;margin:0;padding:0;border:0;text-indent:-9999em;background:none;font-size:1px;line-height:1px}

a			{ text-decoration: none; }
a:hover		{ text-decoration: underline; }

.bs-hidden	{ display: block; position: absolute; width: 1px; height: 1px; overflow: hidden; top: 0; left: 0; }

.wrap		{ position: relative; width: 100%; }
.wrap > *	{ max-width: 1260px; margin: 0 auto; }

h1	{ position: absolute; z-index: 9; top: 55px; }

button { border: none; cursor: pointer; overflow: visible; white-space: nowrap; margin: 0; padding: 0; vertical-align: middle; }

/** Background */
#wrap			{ position: relative; }
#wrap:before	{ content: ""; display: block; position: absolute; left: 0; right: 50%; top: 0; bottom: 0; background: #F5F5F5; z-index: -1; }

.responsejs body		{ min-width: 1280px; }

/* paginate */
.paginate { margin:30px 0 20px; text-align:center; font-family:Tahoma, Geneva, '돋움', Dotum, sans-serif; font-size:1em; }
.paginate a,
.paginate strong { display:inline-block; padding:0 10px; height:25px; line-height:25px; color:#555; }
.paginate strong { color:#000}
.paginate button { width:35px; height:35px; border:1px solid #c8cacf; background:url('../images/paginate.png') no-repeat}
.paginate button.pgFirst { background-position: center 12px; }
.paginate button.pgPrev { background-position: center -51px;}
.paginate button.pgNext { background-position: center -115px;}
.paginate button.pgEnd { background-position: center -178px;}
.paginate button span {position:absolute; left:-9999px; width:0; height:0; overflow:hidden; font-size:0; line-height:0; z-index:-1;}
.paginate span { display:inline-block; width:35px; height:35px; }
.paginate span:hover, .paginate span:active, .paginate span:focus { background:#f5f6f8}

.img_comn, .fq_box li a, .foot_menus ul li a {background-image:url(../../images/common/img_comn.png);background-repeat:no-repeat}


/**************************************************************************************
	Header Style
***************************************************************************************/

/** Header */
#header	{ background: #fff; }
.inner { max-width: 1260px; margin: 0 auto; } 
.headerother { height:40px; background:url(../images/headerotherbg.png) repeat-x; border-bottom:solid 1px #cbd3f1; clear:both; }
.othersite {position:relative; bottom:0; float:left; margin-top:3px; height:38px;}
.othersite li{ float:left;height:32px;width:123px; margin-top:6px;}
.othersite li:nth-child(1){background:url(../images/othersitetab1.png) no-repeat; position:relative; margin-top:0px;width:129px;height:32px; z-index:4; padding-top:6px; line-height:32px;}
.othersite li:nth-child(1) a {color:#2e2f6c; background:url(../images/othersiteicon1.png) no-repeat 15px 50%; padding-left:35px; }
.othersite li:nth-child(2){background:url(../images/othersitetab2.png) no-repeat; position:relative;  z-index:3; margin-left:-20px;line-height:32px;}
.othersite li:nth-child(2) a {color:#fff; background:url(../images/othersiteicon2.png) no-repeat 15px 50%; padding-left:35px; }
.othersite li:nth-child(3){background:url(../images/othersitetab3.png) no-repeat; position:relative;  z-index:2; margin-left:-20px;line-height:32px;}
.othersite li:nth-child(3) a {color:#fff; background:url(../images/othersiteicon3.png) no-repeat 15px 50%; padding-left:35px; }
.othersite li:nth-child(4){background:url(../images/othersitetab4.png) no-repeat; position:relative;  z-index:1; margin-left:-20px;line-height:32px;}
.othersite li:nth-child(4) a {color:#fff; background:url(../images/othersiteicon4.png) no-repeat 15px 50%; padding-left:35px; }

.othercon { float:right; margin-top:7px;}
.othercon li{ float:left; margin-left:2px;}


/**검색영역 Search Bar */
#top_search			{ max-width: 1260px; margin: 0 auto; clear: both; }
#top_search #logo	{ display: block; float: left; width:33.7%; line-height: 90px; box-sizing: border-box; padding-right: 20px; }
#top_search:after	{ content: ""; display: block; position: relative; clear: both; }

#top_search_bar							{ position: relative; width: 38.7%; height: 44px; float: left; box-sizing: border-box; margin: 25px 0; border:5px solid #16A8B9;  }
#top_search_bar label					{ display: block; position: absolute; left: 0; right: 0; width: 1px; height: 1px; overflow: hidden; }
#top_search select {width:120px;/* *width:100px */;height:34px;/* *height:24px;*margin-top:5px; */padding:8px 0 7px 10px;border:0;background:none;font-size:1.153em;line-height:100%;outline:0}
#top_search option {padding:3px 10px}
#top_search_bar input[type="text"]		{ position: absolute; /*right: 62px;*/ top: 0; box-sizing: border-box; width: 60%; height: 32px; padding-left: 8px;  line-height: 32px; border: none; }
#top_search_bar input[type="submit"]	{ position: absolute; right: 0; top: 0; bottom: 0; width:50px; line-height: 90px; border: none; background:#16A8B9 url(../images/btn_search.png) no-repeat; color: #fff; line-height: 1.0em; }
#top_search_bar #btn_open_keyword		{ display: block; position: absolute; top:45%; right: 70px; width: 0; height: 0; border: 5px solid transparent; border-top-color: #a1a1a1; overflow: hidden; }

#relative_search_keyword ul				{ display: none; }
#relative_search_keyword.on ul			{ display: block; }
#relative_search_keyword ul				{ position: absolute; border: 1px solid #5672ba; background: #fff; z-index: 9; top: 42px; left: -1px; right: 69px; padding: 15px; box-sizing: border-box; }
#relative_search_keyword a				{ line-height: 20px; }
#relative_search_keyword a em			{ font-style: normal; color: #e63333; }

#etc_search						{ width: 27.6%; float: left; }
#etc_search > div				{ float: left; margin-top: 25px; padding: 0 20px; line-height: 40px; }

#top_inner_check				{ position: relative; }
#top_inner_check:after			{ content: ""; display: block; position: absolute; top: 50%; right: 0px; margin-top: -5px; height: 13px; width: 1px; background: #aeb0b4; }

/* 상세검색 */
#top_detail_search_open > a			{ display: block; position: relative; padding-right:20px; color: #555555; font-weight: 800; }
#top_detail_search_open > a:after	{ content: ""; display: block; position: absolute; top: 50%; right: 0px; width: 0; height: 0; border: 4px solid transparent; border-top-color: #a9adb4; overflow: hidden; }
#top_detail_search_open > a:before	{ content: ""; display: block; position: absolute; top: 50%; right: 2px; width: 0; height: 0; border: 2px solid transparent; border-top-color: #fff; overflow: hidden; z-index: 1; }

#top_detail_search_box					{ position: relative; }
#top_detail_search_box > div > a		{ display: block; position: absolute; top: 0; left: 50%; margin-left: 550px; height: 42px; width: 80px; background: #787b83; color: #fff; line-height: 42px; text-align: center; font-weight: bold; }

@media (max-width: 1280px) { 
	#top_detail_search_box > div > a { margin-left : 0px; left: auto; right: 0; } 
}

#top_detail_search_box.on > div			{ display: block; }
#top_detail_search_box > div			{ display: none; position: relative; line-height: 1.0em; border-top: 1px solid #16A8B9; background: #16A8B9; z-index: 9; padding-bottom: 20px; color:#fff; }
#top_detail_search_box .title			{ display: block; margin: 0; padding: 0; border-bottom: 1px solid #16A8B9; background: #f6f6f7; overflow:hidden; height: 42px; overflow: hidden; margin-bottom: 20px; }
#top_detail_search_box .title p			{ max-width: 1260px; margin: 0px auto; }
#top_detail_search_box .title p strong	{ display: block; floaT: left; padding: 15px 25px; background: #16A8B9; color: #fff; }
#top_detail_search_box .title p span	{ display: block; float: left; padding: 15px 25px; color: #222222; font-weight: bold; }
#top_detail_search_box fieldset			{ position: relative; max-width: 1260px; margin: 10px auto; padding: 0 20px 0 100px; box-sizing: border-box; }

#top_detail_search_box fieldset > label,
#top_detail_search_box fieldset > legend			{ display: block; position: absolute; padding-left: 10px; font-weight: 800; margin-right: 20px; line-height: 30px; left: 20px; }
#top_detail_search_box fieldset > label:before,
#top_detail_search_box fieldset > legend:before		{ content: ""; display: block; position: absolute; left: 0; top: 50%; margin-top: -3px; width: 0; height: 0; border: 3px solid transparent; border-left-color: #fff; }
#top_detail_search_box fieldset select				{ line-height: 30px; border-radius: 8px; border: 1px solid #ccc; width: 140px; height: 30px; padding: 0 5px; box-sizing: border-box; }
#top_detail_search_box fieldset p					{ float: left; margin: 0; line-height: 30px; }
#top_detail_search_box fieldset p label				{ line-height: 30px; margin-right: 10px; }
#top_detail_search_box fieldset input[type="text"]	{ width: 80px; height: 30px; border: 1px solid #ccc; border-radius: 5px; }

#open_menu { display: none; }

/** Main Menu GNB */
#gnb_wrap {position:relative;height:58px;background:#414286 url(../images/gnbbg.jpg) center top repeat;}
#gnb_wrap .inner { /* position:relative*/ }
#gnb_wrap ul { overflow: hidden; }
#gnb {position:relative}
#gnb a {display:block}

/* 1 Depth */
#gnb > li {float:left;width: 8%; background:url(../images/bul_gnb1.png) no-repeat 0 50%;}
#gnb > li.gnb_field, #bp_lg #gnb > li.gnb_field, #gnb > li.gnb_fev, #bp_lg #gnb > li.gnb_fev, #gnb > li.gnb_sns, #bp_lg #gnb > li.gnb_sns {width:107px}
#gnb > li > a {height:58px;color:#fff;font-size:1.308em;line-height:58px;text-align:center;text-decoration:none}
#gnb > li.active > a {height:53px;border-bottom:5px solid #d5517c}
#gnb > li > a > img {vertical-align:-7px}
#gnb > li > a > img.new_win {margin-left:3px;vertical-align:-1px}
#gnb > li.gnb_allmenu > a {background:#253c73}
#gnb > li.gnb_search > a {background:#25c6d9}
#gnb > li.gnb_fev.active > a, #gnb > li.gnb_sns.active > a {height:58px;border-bottom:0}

#gnb > li:nth-child(1) { background:none;}
#gnb > li:nth-child(2) { }
#gnb > li:nth-child(3) { }
#gnb > li:nth-child(4) { }
#gnb > li:nth-child(5) { }
#gnb > li:nth-child(6) { }
#gnb > li:nth-child(7) { }





@media (max-width: 1280px) { #search_help { margin-left : 0px; left: auto; right: 0; } }




/**************************************************************************************
	Footer Style
***************************************************************************************/
#footer { background: #fff;/* min-height: 200px;*/ border-top: 1px solid #d0d2d6; }
#foot_util {height:45px;border-bottom:1px solid #525252; background:#7a7a7a}
#foot_util .inner {position:relative}
.foot_util {float:left}
.foot_util li {float:left; text-align:center; height:23px; padding:11px 0; background:url(../images/bul_fnb1.png) no-repeat 0 50% ;}
.foot_util li:first-child {background:none;}
.foot_util li a {display:block; height: 23px; line-height: 23px; padding:0 14px;color:#fff;text-decoration:none;transition:background .3s, color .3s; vertical-align: middle; }
.foot_util li:first-child a {}
.foot_util li a:hover, .foot_util li a:active, .foot_util li a:focus {background:#1a1b1c;color:#ccc}
.foot_count {float:right}
.foot_count li { background-position:28px -640px;float:left;height:45px;padding:0 15px;border-right:1px solid #525252;background-color:#5f5f5f; color:#fff;font-size:0.923em;line-height:45px}
.foot_count li:first-child {border-left:1px solid #525252;}
/*qr코드 추가*/
.qrcode { float: right; }
#foot_info {padding:26px 0 40px;background:#5f5f5f;color:#cfcfcf;font-size:0.923em;line-height:1.667}
#foot_info .inner {position:relative}
address { font-style: normal; } 
.foot_logo {width:96px;height:42px;margin:14px 56px 0 24px; float:left;}
.copyright {margin-top:6px;color:#a7a7a7}



/**************************************************************************************
	Body Style
***************************************************************************************/
#body			{ position: relative; max-width: 1260px; margin: 0 auto; min-height: 700px; }
#body:after		{ content: ""; display: block; clear: both; }

#section		{ width: 75%; float: left; background: #f1f2f4; }
#section:before	{ content: ""; display: block; position: absolute; top: 0; bottom: 0; width: 75%; background: #f1f2f4; z-index: -1; }

#side			{ width: 25%; float: left; background: #fff; }
#side:before	{ content: ""; display: block; position: absolute; top: 0; bottom: 0; width: 1px; background: #d0d2d6; }

#section > div		{ padding: 30px 10px; box-sizing: border-box; }

.bs-mobile	{ display: none !important; }

.content-box				{ position: relative; padding: 20px; background: #fff; margin-bottom: 10px; border: 1px solid #e3e5e7; box-sizing: border-box; border-radius:5px; }
.content-box:after			{ content: ""; display: block; clear: both; }
.content-box h2				{ margin: 0; font-size: 17px; }
.content-box h2 strong		{ color: #4749D1; margin-right: 10px; background:#FFEC77; }
.content-box h2 em			{ font-style: normal; color: #e63333; }
.content-box h2 span		{ font-weight: 400; font-size: 13px; color: #666; margin-left: 10px; }

.content-box h3 a			{ text-decoration: underline; }

.content-box hr				{ display: block; clear: both; height: 1px; background: #dddddd; margin: 20px 0; border: none; padding: 0; }

.content-box .webzine li				{ position: relative; }
.content-box .webzine li h3				{ font-size: 13px; margin-top: 30px; margin-bottom: 8px; }
.content-box .webzine li h3 a			{ color: #0000cc; text-decoration: underline; }
.content-box .webzine li h3 span		{ font-weight: 400; color: #777777; font-size: 8.5pt; margin-left: 15px; }
.content-box .webzine li div			{ margin-bottom: 8px; }
.content-box .webzine li a				{ color: #009000; }
.content-box .webzine li.has-thumb		{ padding-left: 140px; min-height: 80px; }
.content-box .webzine li.has-thumb img	{ position: absolute; left: 0; top: 0; width: 120px; height: 80px; border: solid 1px #d0d3dc;}

.content-box .gallery li				{ display: block; position: relative; width: 20%; float: left; box-sizing: border-box; }
.content-box .gallery li a				{ display: block; position: relative; }
.content-box .gallery li img			{ display: block; clear: both; width: 150px; max-width: 95%; height: 100px; margin: 0 auto; }
.content-box .gallery li em				{ display: block; position: relative; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 10px 20px 10px 10px; font-style: normal; color: #0000cc; }
.content-box .gallery li a em			{ text-decoration: underline; }
.content-box .gallery li span			{ display: block; position: relative; clear: both; color: #000000; margin: 0 20px 5px 10px; }

.content-box .board h3					{ font-weight: 400; font-size: 14px; margin-top: 30px; padding-left: 25px; background: url(../images/icon_hwp.png) left 50% no-repeat; }
.content-box .board a { display: block; color: #4DA469; padding-top: 10px; } 
.content-box .board h3 a				{ display: inline; padding: 0; color: #0000CC }
.content-box .board h3 span				{ font-weight: 400; font-size: 13px; color: #787878; margin-left: 10px; }
.content-box .board div					{ line-height: 1.5em; }

.content-box table						{ width: 100%; border-top: 1px solid #60646d; margin-top: 20px; }
.content-box table thead th				{ background: #F8F8F8; padding: 12px; border-bottom: 1px solid #C0C0C0; }
.content-box table tbody td				{ border-bottom: 1px solid #C0C0C0; padding: 20px 15px; text-align: center; line-height: 1.6em; }
.content-box table tbody td.txt-left	{ text-align: left; }
.content-box table tbody td.name a { text-decoration: underline!important; }
.content-box table tbody td.part a { text-decoration: underline!important; color: #10906d; }
.content-box .link-site					{ margin-top: 30px; }
.content-box .link-site li				{ margin-bottom: 15px; clear: both; overflow: hidden; }
.content-box .link-site li h3			{ float: left; margin: 0 20px 0 0; }
.content-box .link-site li h3 > a		{ color: #0300cd; font-size: 13px; }
.content-box .link-site li a			{ float: left; color: #009102; }
.content-box .link-site li.has-thumb	{ position: relative; width: 50%; float: left; clear: none; box-sizing: border-box; padding-left: 135px; min-height: 42px; margin-top: 10px; margin-bottom: 0; }
.content-box .link-site li em			{ display: block; position: absolute; width: 120px; height: 40px; overflow: hidden; left: 0; top: 0; border: 1px solid #ccc; }
.content-box .link-site li em img		{ width: 100%; height: 100%; }
.content-box .link-site li.has-thumb h3	{ font-weight: 400; padding: 5px 0; }

.content-box .link-site.type2 h3		{ margin-bottom: 5px; }
.content-box .link-site.type2 li		{ margin-bottom: 0; margin-top: 15px; }

.content-box .tab-sns					{ position: relative; margin-top: 30px; min-height: 300px; }
.content-box .tab-sns > li				{ float: left; }
.content-box .tab-sns > li > h3				{ height: 40px; line-height: 40px; color: #58595d; background: #e3e4e6; font-size: 13px; margin: 0 2px 0 0; background-repeat: no-repeat; background-position: 15px 50%; }
.content-box .tab-sns > li > h3 > a			{ display: block; padding-left: 40px; padding-right: 17px; text-decoration: none; color: #58595d; }
.content-box .tab-sns > li.on > h3			{ background-color: #3a589e; }
.content-box .tab-sns > li.on > h3 > a		{ color: #fff; }
.content-box .tab-sns > li > div			{ display: none; position: absolute; top: 40px; left: 0; right: 0; height: 260px; border-top: 1px solid #dddddd; padding: 20px 0; box-sizing: border-box; }
.content-box .tab-sns > li.on > div			{ display: block; }
.content-box .tab-sns > li div.content-box	{ padding: 0; border: none; }
.content-box .tab-sns > li div.content-box li:first-child h3 { margin-top: 0; }

.content-box .tab-sns li h3#sns_facebook	{ background-image: url('../images/ico_facebook_off.png'); }
.content-box .tab-sns li h3#sns_twitter		{ background-image: url('../images/ico_twitter_off.png'); }
.content-box .tab-sns li h3#sns_blog		{ background-image: url('../images/ico_blog_off.png'); }
.content-box .tab-sns li.on h3#sns_facebook	{ background-image: url('../images/ico_facebook_on.png'); }
.content-box .tab-sns li.on h3#sns_twitter	{ background-image: url('../images/ico_twitter_on.png'); }
.content-box .tab-sns li.on h3#sns_blog		{ background-image: url('../images/ico_blog_on.png'); }

.content-box .btn-more					{ display: block; position: relative; float: right; margin-top: 10px; color: #0000cc; padding-right: 0px; margin-right: 0px; text-decoration:underline; }
.content-box .btn-more:after			{ content: ""; display: block; position: absolute; width: 0; height: 0; top: 50%; right: 0;  }
.content-box .btn-more:before			{ content: ""; display: block; position: absolute; width: 0; height: 0; top: 50%; right: 0;  }

.list-box					{ padding: 15px 0; border-bottom: 1px solid #e7e7e7; }
.list-box h2				{ position: relative; color: #212121; font-size: 15px; padding-left: 20px;  }
.list-box h2:before			{ content: ""; display: block; position: absolute; left: 0; top: 50%; margin-top: -3px; width: 12px; height: 6px; /*background: #e7e7e7;*/ }

.order-list ul				{ margin-top: 16px; padding: 0 20px;}
.order-list li				{ position: relative; padding: 0px 0px 0px 28px; margin-bottom: 8px; line-height: 20px;}
.order-list li:before		{ content: attr(data-order); display: block; position: absolute; left: 0; top: 0; font-weight: 800; font-size: 8.5pt; color: #fff; background: #E55384; border: 1px solid #D74274; width: 18px; line-height: 18px; text-align: center; }
.order-list li a			{ font-weight: 400; color: #010101; vertical-align: middle; }

.list-box .tab-box						{ position: relative; margin-top: 30px; min-height: 340px; padding: 0 20px; }
.list-box .tab-box > div				{ float: left; width: 33%; }
.list-box .tab-box > div h3				{ margin: 0 -1px 0 0; line-height: 28px; background: #f5f5f5; color: #777777; box-sizing: border-box; border: 1px solid #d0d3dc; text-align: center; }
.list-box .tab-box > div h3 a			{ display: block; font-size: 13px; color: #777777; }
.list-box .tab-box > div.on h3			{ background: #fff; border-color: #d0d3dc; }
.list-box .tab-box > div.on h3 a		{ color: #000; }
.list-box .tab-box > div ul				{ display: none; position: absolute; top: 30px; left: 0; right: 0; }
.list-box .tab-box > div.on ul			{ display: block; }
.list-box .update-list li.new:after	{ content: "NEW"; display: block; position: absolute; right: 5px; top: 0; color: #e6332f; font-weight: 800; font-size: 7pt; width: 40px; text-align: center; }
.list-box .update-list li.up:after	{ content: attr(data-update); display: block; position: absolute; top:0; right: 5px; color: #898989; font-size: 8pt; padding-left: 10px; background: url('../images/ico_up.png') no-repeat 0 50%; height: 20px; line-height: 22px; width: 25px; }
.list-box .update-list li.down:after	{ content: attr(data-update); display: block; position: absolute; top:0; right: 5px; color: #898989; font-size: 8pt; padding-left: 10px; background: url('../images/ico_down.png') no-repeat 0 50%; height: 20px; line-height: 22px; width: 25px; }
.list-box .update-list li.none:after	{ content: "-";  display: block; position: absolute; top:0; right: 5px; color: #898989; font-size: 8pt; width: 20px; text-align: center; }
.list-box .update-list li a				{ display: block; padding-right: 50px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.list-box .time-list li span			{ position: absolute; right: 0; top: 0; color: #767676; font-size: 8pt; }
.list-box .time-list li a				{ display: block; padding-right: 50px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.delete-list li a.btn-del	{ display: inline-block; margin-left: 10px; border: 1px solid #dadee1; border-radius: 2px; width: 15px; height: 15px; color: #6f7279; overflow: hidden; text-indent: -999px; }
.delete-list li a.btn-del:before	{ content: "X"; display: block; text-align: center; line-height: 15px; font-size: 8.5pt; text-indent: 0px; }



/** Title */
#search_result					{ border-width: 2px; border-color: #16A8B9; }
#search_result dl				{ display: block; position: relative; margin: 20px 0; border: 1px solid #dddddd; border-width: 1px 0px 1px 0px; padding: 15px 0 15px 100px; }
#search_result dt				{ display: block; position: absolute; width: 90px; top: 20px; left: 0; box-sizing: border-box; padding-left: 10px; font-weight: 800; }
#search_result dt:before		{ content: ""; display: block; position: absolute; left: 0; top: 50%; margin-top: -3px; width: 0px; height: 0px; border: 3px solid transparent; border-left-color: #5672ba;  }
#search_result dt:after			{ content: ""; display: block; position: absolute; right: 0; top: 50%; margin-top: -6px; width: 1px; height: 12px; background: #aeb0b4; }
#search_result dd				{ margin-left: 0; }
#search_result dd:after			{ content: ""; display: block; clear: both; }
#search_result dd a				{ display: block; position: relative; floaT: left; color: #0000cc; margin: 5px 12px; }
#search_result p				{ line-height: 25px; margin: 0; }
#search_result .ui-btn			{ display: block; position: relative; float: left; padding: 0 25px 0 15px; background: #16A8B9; color: #fff; font-weight: 800; border-radius: 3px; margin-right: 10px; }
#search_result .ui-btn:before	{ content: ""; display: block; position: absolute; left: 88%; top: 50%; margin-top: -3px; width: 0; height: 0; border: 3px solid transparent; border-left-color: #fff; }
#search_result p strong			{ padding: 0 10px; color: #0000cc; font-size: 15px; text-decoration: underline; }
#search_result p a				{ color: #16A8B9; }



/** Non Page */
#no_result					{ border-width: 2px; border-color: #16A8B9; padding: 0 0 40px 0; position: relative; }
#no_result h2				{ background: #16A8B9; padding: 20px 0; color: #fff; text-align: center; font-size: 17px; }
#no_result h2 strong		{ font-size:17px; }
#no_result i				{ display: block; position: absolute; top: 30px; left: 30px; width: 149px; height: 149px; }
#no_result ul				{ margin: 40px 50px 40px 217px; }
#no_result li				{ margin: 8px 0; padding-left: 10px; position: relative; }
#no_result li:before		{ content: ""; display: block; position: absolute; top: 3px; left: 0; border: 3px solid transparent; border-left-color: #16A8B9; }
#no_result hr				{ margin: 38px 20px; background: none; border-bottom: 1px dashed #bdbdbd; }
#no_result p				{ margin: 5px 50px; }
#no_result p strong			{ color: #ea4748; }
#no_result p em				{ font-style: normal; font-weight: 800; }



/**************************************************************************************
	Tablet Style
***************************************************************************************/

@media (max-width: 1000px) { 
	#gnb_wrap ul { 
		height: 50px;
		padding-right: 240px;
	}

	#open_menu	{ display: block; position: absolute; width: 60px; height: 60px; overflow: hidden; text-indent: -999px; right: 140px; top: 0; background: url('../images/btn_open_menu.png') no-repeat 50% 50%; margin: 0; }
	#open_menu a	{ display: block; width: 100%; height: 100%; }

	#gnb_wrap.on ul			{ position: relative; height: auto; padding-right: 0; }
	#gnb_wrap.on li			{ width: 20%; float: left; }
	#gnb_wrap.on li a			{ text-align: center; }
	#gnb_wrap.on li:after		{ content: ""; position: absolute; top: 10px; bottom: 10px; width: 1px; background: #edeff1; }
	#gnb_wrap.on #search_help	{ display: none; }
	#gnb_wrap.on #open_menu	{ position: relative; right: 0; text-indent: 0; background: #f6f6f7; border-top: 1px solid #d0d2d6; width: auto; height: 40px; }
	#gnb_wrap.on #open_menu a	{ float: right; width: auto; color: #fff; line-height: 40px; font-weight: 800; background: url('../images/ico_menu_close.png') no-repeat 17px 50% #787b83; padding-left: 40px; padding-right: 20px; margin-right: 10px; }
	
	#section,
	#section:before { width: 70%; }
	#side			{ width: 30%; }

	.content-box .gallery li	{ width: 25%; }
	.content-box .gallery li+li+li+li+li { display: none; }
}






/**************************************************************************************
	Tablet Style
***************************************************************************************/

@media (max-width: 980px) { 
	
	.bs-pc	{ display: none !important; }
	.bs-mobile	{ display: block !important; }
	
	#top_search			{ padding-left: 120px; padding-right: 50px; }
	#top_search #logo	{ position: absolute; left: 0; width: 120px; margin-top: 27px; }
	#top_search #logo img	{ margin: 0 auto; }

	#top_search_bar	{ width: 100%; margin: 20px 0 10px; background: #fff; }

	#tnb_area_wrap { display: none; }
	#top_search	{ background: #16A8B9; }
	#etc_search	{ width: 100%; clear: both; }
	#etc_search > div { margin-top: 0px; margin-bottom: 15px; line-height: 25px; }
	#etc_search label	{ color: #fff; }
	#top_inner_check:after		{ height: 8px; }
	#top_detail_search_open > a	{ color: #fff; } 
	#top_detail_search_open > a:before	{ border-top-color: #16A8B9; top: 10px; }
	#top_detail_search_open > a:after	{ border-top-color: #ffffff; top: 10px; }
	#top_detail_search_box > div		{ border-top: 1px solid #16A8B9; }

	#top_detail_search_box fieldset p span	{ display: inline-block; }
	/*#top_detail_search_box	{ display: none; }*/

	#search_help	{ display: none; }
	
	#gnb_wrap ul	{ padding-right: 60px; }
	#gnb_wrap ul li	 { width: 16.6%; }
	#open_menu	{ right: 0; }
 	.othercon { display: none; }
	
	#gnb_wrap.on #search_help	{ display: block; right: auto; left: 0; height: 40px; top: auto; bottom: 0; line-height: 40px; border: none; background: none; }
	
	.content-box .gallery li	{ width: 33.3%; }
	.content-box .gallery li+li+li+li { display: none; }

	.content-box .link-site li.has-thumb	{ width: 100%; }

	.content-box table,
	.content-box table *			{ display: block; position: relative; width: 100%\9; float: left\9; box-sizing: border-box; }
	.content-box table tbody tr		{ border-bottom: 1px solid #ccc; padding: 10px 0; }
	.content-box table tbody td		{ padding: 0; text-align: left; border-bottom: none; }
	.content-box table tbody td.name	{ font-weight: bold; float: left; line-height: 1.8em; width: auto; }	
	.content-box table tbody td.part	{ width: auto; float: left; color: #555; font-size: 8.5pt; margin-left: 10px; line-height: 1.8em; }
	.content-box table tbody td.txt-left	{ clear: both; padding: 10px; margin: 5px 0; background: #f1f1f1; }
	.content-box table tbody	{ display: block; }
	.content-box table thead,
	.content-box table thead * { display: none; }
	
	.list-box .tab-box			{ min-height: 370px; }
	.list-box .tab-box > div	{ width: 50%; margin-bottom: 3px; }
	.list-box .tab-box > div ul	{ top: 60px; }

	#no_result i			{ top: 66px; width: 100px; height: 100px; }
	#no_result ul			{ margin: 30px 30px 30px 150px; }
}






/**************************************************************************************
	Mobile Style
***************************************************************************************/

@media (max-width: 640px) { 
	#top_search				{ padding-left: 90px; padding-right: 20px; }
	#top_search #logo		{ width: 90px; padding-left: 10px; }

		
	#search_result dl			{ padding-left: 0; }
	#search_result dt			{ position: relative; top: 0; margin-bottom: 10px; }
	#search_result dt:after		{ display: none; }
	
	#section	{ width: 100%; }
	#side	{ width: 100%; position: relative; padding: 0 15px; box-sizing: border-box; }
	#side:before	{ top: 0; left: 0; right: 0; width: 100%; height: 1px; }
	
	.content-box .webzine li.has-thumb		{ padding-left: 0px; }
	.content-box .webzine li.has-thumb img { width: 90px; height: 70px; }
	.content-box .webzine li h3 span		{ margin-left: 0; display: block; }

	.content-box .webzine li.has-thumb h3,
	.content-box .webzine li.has-thumb div	{ margin-left: 110px; }

	.order-list ul,
	.list-box .tab-box	{ padding: 0 5px; }
	
	
	.qrcode { display: none; }	
	.foot_logo { display: none; }

	.list-box .tab-box > div		{ width: 33%; }
	.list-box .tab-box > div ul		{ top: 40px; }

	.content-box .gallery li	{ width: 50%; }
	.content-box .gallery li+li+li	{ display: none; }
}

@media (max-width: 480px) { 
	#no_result				{ padding-bottom: 20px; }
	#no_result i			{ display: none; }
	#no_result ul			{ margin: 20px; }
	#no_result hr			{ margin: 20px; }
	#no_result p			{ margin: 5px 20px; }
	
	#top_search				{ position: relative; height: 110px; }
	#etc_search				{ position: absolute; left: 0; right: 0; bottom: 0px; text-align: center; }
	#etc_search > div		{ display: inline-block; float: none; }
	
	.headerother { display: none; }
	
	#gnb_wrap ul li { width: 25%; }
	#gnb_wrap ul li a { font-size: 13px; } 
	
	#top_search { padding: 0; height: 90px; }
	#top_search #logo { display:none; } 
	#top_search select { width: 30%; }
	#top_search_bar { margin: 5px 0 5px; }
	#top_search_bar input[type="text"] { width: 50%; }


}

@media (max-width: 410px) { 

	#top_detail_search_box .title p span	{ display: none; }
	#top_detail_search_box fieldset	{ padding-lefT: 20px; padding-bottom: 10px; }
	#top_detail_search_box fieldset > label, #top_detail_search_box fieldset > legend	 { position: relative; left: 0; clear: both; width: 60px; }
	

}