@charset "utf-8";

*{margin:0; padding:0;}
html,body {width:100%; height:100%;}
body{overflow-y:scroll; overflow-x:hidden; background-color:#fff; color:#111}
ul,ol,dl {list-style-type:none;padding:0; margin:0}
TABLE,BODY,INPUT,SELECT,TEXTAREA,TD {font-size:14px; font-style:normal; line-height:1.5; margin:0; word-break:break-all;  border-collapse: collapse;}
body, select,li,a{font-family: 'NotoSansKr','NanumGothic','xeicon','돋움', sans-serif;  font-weight: 400; font-size:14px; color: #111; list-style:none; line-height:1.5;}
img{border:0px}
.blue1 { color: blue !importnat; }
.red1 { color: red !importnat; }
.light		{font-weight: 300}
.normal  {font-weight: 400}
.bold		{ font-weight: 500}
.bolder	{font-weight: 800}

h1, h2, h3, h4, h5, h6{
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: -1px;
}
h1, h2{margin: 0 0 30px;}

p {
    word-break:break-all;
    margin: 0 0 10px;
    font-size: 14px;
    line-height: 1.5;
	font-weight: 400;
	font-family: 'NotoSansKr','xeicon','돋움', sans-serif; 
}
b, strong{font-weight:500 !important }
a {
    color: #0080c6;
	text-decoration:none;
	transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;  
}
a:hover, a:focus { color: #006095; text-decoration:none}

a,.tp-caption a.btn:hover {
	color: #0080c6;
}

.container{
	width: 100% !important;
    max-width: 1200px;
	padding: 0 15px;
}

.label{
	display: inline;
    padding: .2em .6em .3em;
    font-weight: 500;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em;
}

.block{display:block !important}
.inlineblock{display:inline-block !important}

.xs_view{display:none}
.md_view{display:block}
span.md_view {display: inline;}
table th.md_view, table  td.md_view{ display: table-cell }
table tr.md_view {display: table-row;}

.tdleft_first td:first-child{text-align:left}

.enter{display:inline-block}
.word-k{word-break: keep-all; }


.tot_price {
	font-size: 30px;
	color: #E74D3D;
	font-weight: 500
}
.tot_price small {
	font-size: 14px;
	color: #aaa;
	font-weight: 200;
	margin-right: 10px
}

@media screen and (max-width:768px) {

	.container{
		padding: 0 10px;
	}

	.md_view{display:none !important}
	.enter{display:block}

	.sub_cover_8 .xs_view {display: block} 
	.xs_br {display: block}
	table th.xs_view, table  td.xs_view{ display: table-cell }
	table tr.xs_view {display: table-row;}

	/*#bxslider{top:70%}*/
}


/*반응형 */

.menu_mb{display:none}
.menu_pc{display:inline-block;}


.m_show{display:none}
.m_block{display:inline-block; margin-bottom:0}


@media (max-width: 768px){

   .m_show,
   .m_block{display:block;margin-bottom:5px}

   .menu_mb{display:inline-block;}
   .menu_pc{display:none}

   .mb100{width:100% !important}

}

/* ===========================
--- menu nav???
============================ */

.top-nav-collapse {
	background: #C71414;
}
.navbar-custom ul.nav ul.dropdown-menu li a:hover {
	color: #67b0d1;
}
.widget-avatar .avatar:hover {
    border: 5px solid #67b0d1;
}
form#contact-form input:focus,form#contact-form select:focus,form#contact-form textarea:focus {
	border-color: #67b0d1;
}

.navbar {
    margin-bottom: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .3);
}
.navbar-brand {
    font-weight: 500;
}
.navbar-brand {
    height: 40px;
    padding: 5px 15px;
    font-size: 18px;
    line-height: 1em;
}
.navbar-brand h1 {
    color: #fff;
    font-size: 20px;
    line-height: 40px;
}
.navbar-brand:focus {
    outline: 0;
}
.nav.navbar-nav {
    /*    background-color: rgba(255,255,255,.4);*/
}
.navbar-custom.top-nav-collapse .nav.navbar-nav {
    background-color: rgba(0, 0, 0, 0);
}
.navbar-custom ul.nav li a {
    font-size: 18px;
    letter-spacing: 1px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 500;
}
.navbar-custom.top-nav-collapse ul.nav li a {
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    color: #fff;
}
.navbar-custom ul.nav ul.dropdown-menu {
    border-radius: 0;
}
.navbar-custom ul.nav ul.dropdown-menu li {
    border-bottom: 1px solid #f5f5f5;
}
.navbar-custom ul.nav ul.dropdown-menu li:last-child {
    border-bottom: none;
}
.navbar-custom ul.nav ul.dropdown-menu li a {
    padding: 10px 20px;
}
.navbar-custom ul.nav ul.dropdown-menu li a:hover {
    background: #fefefe;
}
.navbar-custom.top-nav-collapse ul.nav ul.dropdown-menu li a {
    color: #666;
}
.navbar-custom .nav li a {
    -webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
}
.navbar-custom .nav li a:hover, .navbar-custom .nav li a:focus, .navbar-custom .nav li.active {
    outline: 0;
    background-color: rgba(255, 255, 255, .2);
}
.navbar-custom .nav li a:hover, .navbar-custom .nav li a:focus, .navbar-custom .nav li.active {
    outline: 0;
    background-color: rgba(255, 255, 255, .2);
}
.navbar-toggle {
    padding: 4px 6px;
    font-size: 20px;
    color: #fff;
}
.navbar-toggle:focus, .navbar-toggle:active {
    outline: 0;
}


/* ===========================
--- Loader
============================ */

	#preloader {
		background: #ffffff;
		bottom: 0;
		height: 100%;
		left: 0;
		position: fixed;
		right: 0;
		top: 0;
		width: 100%;
		z-index: 99999;
	}
	@keyframes shadowSpin {
		0% {
			box-shadow: 10px -10px #39CCCC, -10px 10px #a42384;
		}
		25% {
			box-shadow: 10px 10px #39CCCC, -10px -10px #a42384;
		}
		50% {
			box-shadow: -10px 10px #39CCCC, 10px -10px #a42384;
		}
		75% {
			box-shadow: -10px -10px #39CCCC, 10px 10px #a42384;
		}
		100% {
			box-shadow: 10px -10px #39CCCC, -10px 10px #a42384;
		}
	}
	#load {
		z-index: 9999;
		background-color: #fec313;
		opacity: 0.75;
		width: 10px;
		height: 10px;
		position: absolute;
		top: 50%;
		margin: -5px auto 0 auto;
		left: 0;
		right: 0;
		border-radius: 0px;
		border: 5px solid #fec313;
		box-shadow: 10px 0px #0080c6, 10px 0px #a42384;
		animation: shadowSpin 1s ease-in-out infinite;
	}

/* ===========================
--- margin
============================ */

	.mar-auto	{margin: auto}

	.mar-t0	{margin-top: 0 !important;}
	.mar-t5	{margin-top: 5px !important;}
	.mar-t10	{margin-top: 10px !important;}
	.mar-t15	{margin-top: 15px !important;}
	.mar-t20	{margin-top: 20px !important;}
	.mar-t25	{margin-top: 25px !important;}
	.mar-t30	{margin-top: 30px !important;}
	.mar-t35	{margin-top: 35px !important;}
	.mar-t40	{margin-top: 40px !important;}
	.mar-t50	{margin-top: 50px !important;}

	.mar-b0	{margin-bottom: 0 !important;}
	.mar-b5	{margin-bottom: 5px !important;}
	.mar-b10{margin-bottom: 10px !important;}
	.mar-b15{margin-bottom: 15px !important;}
	.mar-b20{margin-bottom: 20px !important;}
	.mar-b25{margin-bottom: 25px !important;}
	.mar-b30{margin-bottom: 30px !important;}
	.mar-b35{margin-bottom: 35px !important;}
	.mar-b40{margin-bottom: 40px !important;}
	.mar-b50{margin-bottom: 50px !important;}


	.mar-l10	{margin-left: 10px !important;}
	.mar-l15	{margin-left: 15px !important;}
	.mar-l20	{margin-left: 20px !important;}
	.mar-l25	{margin-left: 25px !important;}

	.mar-r10	{margin-right: 10px !important;}
	.mar-r15	{margin-right: 15px !important;}
	.mar-r20	{margin-right: 20px !important;}
	.mar-r25	{margin-right: 25px !important;}

/* ===========================
--- padding
============================ */

	.pad-t0	{padding-top: 0 !important;}
	.pad-t5	{padding-top: 5px !important;}
	.pad-t10	{padding-top: 10px !important;}
	.pad-t15	{padding-top: 15px !important;}
	.pad-t20	{padding-top: 20px !important;}
	.pad-t25	{padding-top: 25px !important;}
	.pad-t30	{padding-top: 30px !important;}
	.pad-t35	{padding-top: 35px !important;}
	.pad-t40	{padding-top: 40px !important;}
	.pad-t50	{padding-top: 50px !important;}

	.pad-b0	{padding-bottom: 0 !important;}
	.pad-b5	{padding-bottom: 5px !important;}
	.pad-b10{padding-bottom: 10px !important;}
	.pad-b15{padding-bottom: 15px !important;}
	.pad-b20{padding-bottom: 20px !important;}
	.pad-b25{padding-bottom: 25px !important;}
	.pad-b30{padding-bottom: 30px !important;}
	.pad-b35{padding-bottom: 35px !important;}
	.pad-b40{padding-bottom: 40px !important;}
	.pad-b50{padding-bottom: 50px !important;}

	.pad-l0	{padding-left: 0 !important;}
	.pad-l5	{padding-left: 5px !important;}
	.pad-l10	{padding-left: 10px !important;}
	.pad-l15	{padding-left: 15px !important;}
	.pad-l20	{padding-left: 20px !important;}
	.pad-l25	{padding-left: 25px !important;}
	.pad-l30	{padding-left: 30px !important;}
	.pad-l35	{padding-left: 35px !important;}
	.pad-l40	{padding-left: 40px !important;}
	.pad-l50	{padding-left: 50px !important;}

	.pad-r0	{padding-right: 0 !important;}
	.pad-r5	{padding-right: 5px !important;}
	.pad-r10{padding-right: 10px !important;}
	.pad-r15{padding-right: 15px !important;}
	.pad-r20{padding-right: 20px !important;}
	.pad-r25{padding-right: 25px !important;}
	.pad-r30{padding-right: 30px !important;}
	.pad-r35{padding-right: 35px !important;}
	.pad-r40{padding-right: 40px !important;}
	.pad-r50{padding-right: 50px !important;}

	.pad10{padding:10px !important;}
	.pad15{padding:15px !important;}
	.pad20{padding:20px !important;}
	.pad25{padding:25px !important;}

	.pad-v10{padding-left:10px !important; padding-right:10px !important;}
	.pad-v15{padding-left:15px !important; padding-right:15px !important;}
	.pad-v20{padding-left:20px !important; padding-right:20px !important;}
	.pad-v25{padding-left:25px !important; padding-right:25px !important;}

	.pad-h10{padding-top:10px !important; padding-bottom:10px !important;}
	.pad-h15{padding-top:15px !important; padding-bottom:15px !important;}
	.pad-h20{padding-top:20px !important; padding-bottom:20px !important;}
	.pad-h25{padding-top:25px !important; padding-bottom:25px !important;}
	.pad-h30{padding-top:30px !important; padding-bottom:30px !important;}


/* ===========================
--- padding
============================ */

	.wid100{width:100% !important}

/* ===========================
--- font-color
============================ */
  .font-red1{color:#ff0000 !important}
  .font-red2{color:#ac0000 !important}

  .font-blue1{color:#0090ff !important}
  .font-blue2{color:#0080c6 !important}

  .font-yellow1{color:#ffbf00 !important}
  .font-yellow2{color:#ea9c00 !important}

  .font-white{color:#fff !important}

  .font-gray1{color:#f0f0f0 !important}
  .font-gray2{color:#ddd !important}
  .font-gray3{color:#aaa !important}
  .font-gray4{color:#888 !important}

/* ===========================
--- background-color
============================ */
  .bg-red1{background-color:#ff8989 !important}
  .bg-red2{background-color:#ff0000 !important}

  .bg-blue1{background-color:#b0dfe8 !important}
  .bg-blue2{background-color:#0090ff !important}

  .bg-yellow1{background-color:#ffed89 !important}
  .bg-yellow2{background-color:#ffbf00 !important}

  .bg-white{background-color:#fff !important}

  .bg-gray1{background-color:#f0f0f0 !important}
  .bg-gray2{background-color:#eee !important}
  .bg-gray3{background-color:#ddd !important}


  /* ===========================
--- size
============================ */
  .size16{font-size:16px !important}
  .size18{font-size:18px !important}
  .size20{font-size:20px !important}
  .size22{font-size:22px !important}
  .size26{font-size:26px !important}


/* ===========================
--- background-color
============================ */
	.border{border:1px solid #ddd}
	.border2{border:2px solid #ddd}

/* ===========================
--- calendar 달력
============================ */

	.calendar {
		width: 100%;
		margin: 0 auto;
		background: #fafafa;
	}
	.calendar th, .calendar td {
		width: 14.28%;
		height: 45px;
		text-align: center;
	}
	.calendar .mp, .calendar .mn, .calendar .month {
		vertical-align: middle;
		text-align: center;
		color: #333333;
		opacity: 1;
		display: inline-block;
	}
	.calendar .month {
		width: 140px;
		margin: 0;
		font-size: 28px
	}
	.calendar th {
		border-bottom: 1px solid #333 !important;
		background: #ebebeb !important
	}
	.calendar td {
		font-weight: 500;
		font-size: 16px;
		min-height:100px;
		height:100px
	}
	.calendar td div{display:block; text-align:right}
	.calendar td p{margin:0; line-height:1.3; margin:3px 0}
	.calendar td p:before{content:'- '}
	.calendar td p.Cred{color:#ff0000 !important; }
	.calendar td p.Cblue{color:#0090ff  !important;}
	.calendar td span{display:block; padding-left:10px}
	.calendar .week, .calendar .sun, .calendar .sat {border: 1px solid #dddddd;}
	.calendar tbody tr:first-child td {background: #fff}
	.calendar .pb {
		opacity: 1;
		background:#FFFFFF; 
		cursor:pointer !important; 
		vertical-align: top; 
		text-align: left  !important; 
		padding:5px;
	}
	.calendar .week, .calendar .week a{	color: #333333;	}
	.calendar .sun, .calendar .sun a	{	color: #e12f3f;	}
	.calendar .sat, .calendar .sat a		{	color: #199cfe;	}

	@media screen and (max-width: 768px) {
		.calendar.td_block tr{border-bottom:0 !important; border:0 !important }
		.calendar.td_block tr:first-child{display:block}
		.calendar.td_block tr:first-child td{text-align:center}
		.calendar.td_block td:first-child{background-color:#fff; border-bottom:1px solid #ddd}
		.calendar.td_block td:empty{min-height:36px}
		.calendar td{min-height:36px; height:100% !important}
		.calendar td.pb div{position:absolute; left:0; top:0; height:36px; line-height:36px; padding:0 5px 0 0; width:50px}
		.calendar td.pb {padding: 5px 10px 5px 60px !important}
		.calendar td span{display:inline-block; padding-left:5px}

		.calendar td.pb div:after{font-size: 11px; font-weight:400; padding-left:3px}
		.calendar td.pb:nth-child(1) div:after{content:' (일)'}
		.calendar td.pb:nth-child(2) div:after{content:' (월)'}
		.calendar td.pb:nth-child(3) div:after{content:' (화)'}
		.calendar td.pb:nth-child(4) div:after{content:' (수)'}
		.calendar td.pb:nth-child(5) div:after{content:' (목)'}
		.calendar td.pb:nth-child(6) div:after{content:' (금)'}
		.calendar td.pb:nth-child(7) div:after{content:' (토)'}
	
	}

	/*.digital {
		font-size: 18px;
		font-weight: 400;
		line-height: 1.1em;
		border-top: 1px solid #ccc;
		padding-top: 20px;
		margin-top: 20px
	}
	.digital .item {
		font-size: 22px;
		font-weight: 500;
		display: inline-block;
		padding: 15px 10px 10px 10px;
		background: #fff;
		border: 1px solid #ccc;
		background: #fff;
		border-radius: 5px;
		margin: 0 5px
	}
	.digital .item.big {
		width: 80px;
		text-align: right
	}*/

	.icon_circle {
		background-color: #fff;
		margin: 0 auto 10px auto;
		border-radius: 50%;
		border: 6px solid #0080c6;
		width: 120px;
		height: 120px;
		line-height: 120px;
		font-size: 50px;
		vertical-align: middle;
		transition: all 0.5s ease;
	}

/* ===========================
--- Main 메인
============================ */
.home-section {
	padding-top: 65px;
	padding-bottom: 65px;
	display: block;
	position: relative;
	z-index: 120;
}
.home-section .txt {
	font-size: 20px;
	margin-bottom: 10px
}
.section-heading { margin-bottom:50px }

.section-heading h2 {
	font-size: 40px; color:#5d5c5c;
	margin-bottom: 2px;
}
.section-heading h2 span{
	font-weight: 100;
}
.section-heading .subtitle {
	font-size: 24px; color: #000000
}
.bg-white {
	background: #fff;
}
.bg-gray {
	background-color: #f3f3f3;
}

/* 메인배너 슬라이딩 ============*/
.de01 .carousel-inner .item {
	height: 260px; /* 높이값 조절 */
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}
.de01 #myCarousel .carousel-control {
	z-index: 11;
	width: 7%;
}
.de01 #myCarousel .carousel-control .glyphicon-menu-left {
	position: absolute;
	top: 50%;
	left: 30%;
	z-index: 5;
	margin-top: -30px;
	display: inline-block;
	font-size: 30px;
	background-color: rgba(10, 10, 10, 0.3);
	border-radius: 2px;
	text-shadow: none;
	padding: 10px;
	color: #fff;
}
.de01 #myCarousel .carousel-control .glyphicon-menu-right {
	position: absolute;
	top: 50%;
	right: 30%;
	z-index: 5;
	margin-top: -30px;
	display: inline-block;
	font-size: 30px;
	background-color: rgba(10, 10, 10, 0.3);
	border-radius: 2px;
	text-shadow: none;
	padding: 10px;
	color: #fff;
}
.de01 #myCarousel .carousel-indicators li {
	width: 13px;
	height: 13px;
	background-color: rgba(255, 255, 255, 0.5);
	border: 0px solid #fff;
	border-radius: 0px;
}
.de01 #myCarousel .carousel-indicators li.active {
	width: 13px;
	height: 13px;
	background-color: rgba(255, 255, 255, 0.9);
	border: 0px solid #fff;
}
.carousel-indicators {bottom:0px}

/* 메인 배너 슬라이딩 내용 ============*/
.de01 .box {padding: 35px 30px 0 30px;}
.de01 .box h2 {
	position: relative;
	letter-spacing: -1px;
	text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.6);
	font-size: 2em;
	font-weight: 500;
	color: #fff;
	padding-top: 20px;
	margin-top: 50px;
	margin-bottom: 0; padding-bottom: 5px
}
.de01 .box p {
	padding:  0;
	line-height: 110%;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
	font-size: 18px;
	font-weight: 500;
	color: #83cbec
}
.de01 .box small {
	display: inline-block;
	background-color: #000;
	border: 0px solid #000;
	font-size: 0.8em;
	color: #ccc;
	padding: 3px 5px; margin-top: 5px
}

@media screen and (max-width:768px) {
	.de01 .box h2{font-size: 26px}
	.de01 .box p{ font-size:14px}

}

@media screen and (max-width: 768px) {
	.bbs_re table,.bbs_re tbody,.bbs_re thead,.bbs_re tfoot,.bbs_re tr,.bbs_re th,.bbs_re td {display: block; width: 100%; height: auto}
	.bbs_re td.re_name { display: block; width: 100%}
	.bbs_re td.re_con {display: block; width: 100%}
	.bbs_re td.re_de1 {display: block; width: 100%}
	.bbs_re td.re_de2 {display: block; width: 100%}
	.bbs_re tr {border-bottom: 2px solid #aaa}
}

@media screen and (max-width: 768px) {

    .de01 .carousel-inner .item {
        height: 300px;
    }
    .de01 .carousel-caption {
        padding: 0 50px;
    }
    .de01 .carousel-caption .box h2 {
        font-size: 2.0em;
        line-height: 110%;
    }
    .de01 .carousel-caption .box p {
        font-size: 1.0em;
        line-height: 110%;
    }
    .de01 #myCarousel .carousel-control .glyphicon-menu-left {
        left: 1%;
        padding: 5px;
    }
    .de01 #myCarousel .carousel-control .glyphicon-menu-right {
        right: 1%;
        padding: 5px;
    }

}


/*****************************************************************
메인 : 게시판 
*****************************************************************/

	.bbs_title {text-align:left !important;}
	.bbs_title h5 { font-size: 24px !important; color: #5d5c5c; padding:0; margin:35px 0 25px 0}
	.bbs_title h5 span {font-weight: 200; color:#ccc; display:inline-block; padding-left:5px}
	.bbs_title .btn { position: absolute; right: 15px; top: 2px}
	.bbs_list { padding-left: 0; border-top: 1px solid #B7B7B7}
	.bbs_list li {margin-left: 0; border-bottom: 1px solid #B7B7B7; line-height: 1.4em; padding: 16px 0}
	.bbs_list li > a {display: block;
		text-overflow:ellipsis;
		white-space:nowrap;
		word-wrap:normal;
		width:100px;
		overflow:hidden;
		position: relative; padding-right: 30px; width: 100%;
		height: 20px; line-height: 20px
	}
	.bbs_list li > a > span {color:#333; cursor:pointer}
	.bbs_list li > a:hover > span { color:#999}
	.bbs_list li > a > .glyphicon { font-size: 0.8em; text-align: center; line-height: 18px; position: absolute; right: 5px; top: 0; color: #63A6E3; border: 1px solid #63A6E3; border-radius: 50%; width:20px; height: 20px;}



	.btn_go_01 .icon_circle{background:url('/gumigx/images/icon_1.png') 0 0 no-repeat;}
	.btn_go_02 .icon_circle{background:url('/gumigx/images/icon_2.png') 0 0 no-repeat;}
	.btn_go_03 .icon_circle{background:url('/gumigx/images/icon_3.png') 0 0 no-repeat;}
	.btn_go_04 .icon_circle{background:url('/gumigx/images/icon_4.png') 0 0 no-repeat;}
	.btn_go_05 .icon_circle{background:url('/gumigx/images/icon_5.png') 0 0 no-repeat;}
	.btn_go_06 .icon_circle{background:url('/gumigx/images/icon_6.png') 0 0 no-repeat;}

	#banner { padding-bottom: 40px}
	#banner .icon_circle img { margin-top: 15px !important}
	.banner_go { cursor: pointer;}
	.banner_go .inner h5 { font-size: 20px; margin: 15px 0 0 0}
	.banner_go .inner .subtitle {font-size: 14px; font-weight: 200; color:#999; margin-bottom: 35px}
	.banner_go:hover{}
	.banner_go:hover .icon_circle { border-color:#28b145; background-position:0 -108px}
	.banner_go:active .icon_circle {background-color:#28b145; border-color:#28b145; background-position:0 -216px}
	.banner_go:hover h5 { color:#28b145}
	.banner_go:active h5 { color:#28b145}
	.banner_go:hover .subtitle {color: #777;}

	@media screen and (max-width: 1200px) {
		.banner_go .inner h5 { font-size: 18px;}
		.banner_go .inner .subtitle{font-size:12px}
	}

/* ===========================
--- table 테이블
============================ */

	.table { 
		width:100%;
		max-width:100%;
		border-top: 2px solid #000 !important ; 
		border-bottom: 1px solid #999 ; 
		margin-bottom:0;
		border-spacing: 0;
		border-collapse: collapse;
	}
	.table .re { color: #ccc ; font-weight: 100; font-size: 0.8em}
	.table th {text-align: center;  word-break: keep-all; background: #f9f9f9; font-size:15px; font-weight:500 }
	.table td{ text-align:center}
	.table  p{margin-bottom:0}
	.table img{width:100%}

	/* table option */
	.td_left td {text-align: left}
	.td_center td {text-align: center}
	.td_first tr td:first-child{background-color:#f9f9f9}
	.table.priceS span:before{content:'/';}
	
	.wordkeep table *{word-break: keep-all; }

	/* scroll table ================= */
	.scrolltb-box{ width: 100%; overflow:auto}
	.scrolltb-box table{}

	.data_none{text-align:center; padding:15px 0 }
	.data_none p{margin:0}


	.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th { vertical-align: middle}
	
	/* End = table option */


	/* ====================
	   Responsive table 768  
	  ==================== */

	
	@media (max-width: 768px){
		
	   .td_block {
		   border: 0 !important;
	   }
	   .td_block td, .td_block th{
			display: block;
			width: 100%;
			height:36px;
			line-height:36px !important;
			padding:0 10px !important;
			font-size:14px;
			text-align: left;
			position:relative;
			border-top:0 !important;
			border-left:0 !important;
			border-right:0 !important;
		}
		.td_block td.twoline {
			display: inline-block;
			width:50%;
	   }
	   .td_block tr:first-child {
		   display: none;
	   }
	   .td_block tr {
		   font-size:0;
		   display: block;
		   position:relative;
		   border-top:2px solid #aaa !important;
		   border-bottom:10px solid #fff !important;
		}
		.td_block tr:after{
			position: absolute;
			top:0;left:0;
			line-height: 37px;
			color:#111;
			font-size:14px;
			padding:0 5px;
			text-align:center;
		}
		.td_block td:first-child{background-color:#eee}
		.td_block td:empty{min-height:37px} td높이
		
		.td_block td.col2{min-height:calc(37px * 2); line-height: calc(37px * 1.5);}
		.td_block td.col3{min-height:calc(37px * 3); line-height: calc(37px * 2.5);}
		.td_block td.col4{min-height:calc(37px * 4); line-height: calc(37px * 3.5);}
		.td_block td.col5{min-height:calc(37px * 5); line-height: calc(37px * 4.5);}

		.td_block.td_firstB tr{border-bottom:0 !important; border-top:0 !important}
		.td_block.td_firstB tr:first-child{display:block; border-top:1px solid #ddd !important}
		.td_block.td_firstB tr:first-child td:not(:first-child){display:none}
		.td_block.td_firstB tr:nth-child(odd) td{background-color:#f0f0f0 !important}
		.td_block.td_firstB tr td:first-child{background-color:#fff; }

		/* program > swim > table - swimtb01 ================= */
		.swimtb01 td:first-child{border-left-color:#eee !important;}
		.swimtb01 td, .swimtb01 th{border-left: 80px solid #f8f8f8 !important;}
		.swimtb01 tr:after{
			content: '시\2003\2003간 초\2003\2003급 중\2003\2003급 상\2003\2003급 자유수영 비\2003\2003고';
			width: 80px;
		}

		/* == program > swim > table - swimtb02  ================= */
		.swimtb02 td:first-child{border-left-color:#eee !important;}
		.swimtb02 td, .swimtb02 th{border-left: 80px solid #f8f8f8 !important;}
		.swimtb02 tr:after{
			content: '반\2003\2003명 지도내용';
			width: 80px;
		}


		/* == RESUKANG > SUKANG  ================= */
		.classlist td{padding:0 0 0 28% !important; border-bottom:1px solid #f0f0f0 ; }
		.classlist tr:not(.data_none):after{	width: 76px;}
		.classlist td:before{width:25%; padding:0 10px; position:absolute; left:0;  text-align:center; background-color: rgb(200,200,200,0.2); font-size:13px}
		.classlist td:nth-child(1):before{content:'NO.'}
		.classlist td:nth-child(2):before{content:'종\2003\2003류'}
		.classlist td:nth-child(3):before{content:'수강반명'}
		.classlist td:nth-child(4):before{content:'수강기간';}
		.classlist td:nth-child(5):before{content:'수강기간'}
		.classlist td:nth-child(6):before{content:'수강상태'; }
		
		.classlist td:nth-child(6):before{content:'재 수 강'; }

		.classlist .text-overflow{white-space: normal;line-height: 1.3; display:inline-block; font-size:13px;  vertical-align:middle; }
		.classlist td:before{font-size:13px}
		.classlist td:nth-child(3){font-size:0}
		.classlist td:nth-child(3),
		.classlist td:nth-child(3):before{min-height: 60px;line-height:60px !important}


		/* == OnlineCulture> SUKANG  ================= */
		.culturelist td{padding:0 0 0 28% !important; border-bottom:1px solid #f0f0f0 ; }
		.culturelist tr:not(.data_none):after{width: 76px;	}
		
		.culturelist td:before{width:25%; padding:0 10px; position:absolute; left:0;  text-align:center; background-color: rgb(200,200,200,0.2); font-size:13px}
		.culturelist td:nth-child(1):before{content:'NO.'}
		.culturelist td:nth-child(2):before{content:'강좌반명'}
		.culturelist td:nth-child(3):before{content:'강좌기간'}
		.culturelist td:nth-child(4):before{content:'금액';}
		.culturelist td:nth-child(5):before{content:'할인금액'}
		.culturelist td:nth-child(6):before{content:'결제금액'; }

		.culturelist .text-overflow{white-space: normal;line-height: 1.3; display:inline-block; font-size:13px;  vertical-align:middle; }
		.culturelist td:before{font-size:13px}
		.culturelist td:nth-child(2){font-size:0}
		.culturelist td:nth-child(2),
		.culturelist td:nth-child(2):before{min-height: 60px;line-height:60px !important}




		/* == adult > adult-academy  ================= */
		.academy tr{position:relative}
		.academy td{padding:0 0 0 28% !important; border-bottom:1px solid #f0f0f0 ; }
		.academy td a.btn{vertical-align:top}
		.academy td p{display:inline-block; vertical-align:middle; margin:0; line-height:1.3; word-break: keep-all;}
		.academy td:before{width:25%; padding:0 10px; position:absolute; left:0;  text-align:center; background-color: rgb(200,200,200,0.2); font-size:13px}

		.academy td:nth-child(1):before{content:'강\2002좌\2002 명'}
		.academy td:nth-child(2):before{content:'시\2003\2003간'}
		.academy td:nth-child(3):before{content:'강의내용'}
		.academy td:nth-child(4):before{content:'교\2002재\2002비 재\2002료\2002비'; min-height: 40px;line-height:1.5}
		.academy td:nth-child(5):before{content:'정\2003\2003원'}
		.academy td:nth-child(6):before{content:'수강료'; font-size: 12px; padding:0 2px !important}

		.academy td:nth-child(3), 
		.academy td:nth-child(4){font-size:0}

		.academy td:nth-child(3),
		.academy td:nth-child(3):before{min-height: 60px;line-height:60px !important}
		.academy td:nth-child(4){min-height: 40px;line-height:40px !important}

		.academy td:nth-child(7){padding: 0 !important; position: absolute; top:0; right:0; width:20%}
		.academy td:nth-child(7) a{width:100%; height:100%; border-radius: 0 !important}
		.academy td br{display:none}


		/* == adult > special-academy  ================= */
		.ACspecial tr{position:relative}
		.ACspecial td{padding:0 0 0 28% !important; border-bottom:1px solid #f0f0f0; word-break: keep-all;}
		.ACspecial td p{display:inline-block; vertical-align:middle; margin:0; line-height:1.3}
		.ACspecial td span{display:inline-block}
		.ACspecial td:before{width:25%; padding:0 10px; position:absolute; left:0;  text-align:center; background-color: rgb(200,200,200,0.2); font-size:13px}

		.ACspecial td:nth-child(1):before{content:'강\2002좌\2002 명'}
		.ACspecial td:nth-child(2):before{content:'내\2003\2003용'}
		.ACspecial td:nth-child(3):before{content:'교육일시'}
		.ACspecial td:nth-child(4):before{content:'재\2002료\2002비'}
		.ACspecial td:nth-child(5):before{content:'강의실(정원)'; font-size: 12px; padding:0 2px !important}

		.ACspecial td:nth-child(2), 
		.ACspecial td:nth-child(3){font-size:0}

		.ACspecial td:nth-child(2),
		.ACspecial td:nth-child(2):before{min-height: 60px;line-height:60px !important}
		.ACspecial td:nth-child(3),
		.ACspecial td:nth-child(3):before{min-height: 40px;line-height:40px !important}

		.ACspecial td:nth-child(6){padding: 0 !important; }
		.ACspecial td:nth-child(6) a{width:100%; height:100%; border-radius: 0 !important; vertical-align:top}
		.ACspecial td:not(:nth-child(3)) br{display:none}


		.ACstate td{padding:0 0 0 28% !important; border-bottom:1px solid #f0f0f0; word-break: keep-all;}
		.ACstate td p{display:inline-block; vertical-align:middle; margin:0; line-height:1.3}
		.ACstate td span{display:inline-block}
		.ACstate td:before{width:25%; padding:0 10px; position:absolute; left:0;  text-align:center; background-color: rgb(200,200,200,0.2); font-size:13px}

		.ACstate td:nth-child(1):before{content:'강\2002의\2002실'}
		.ACstate td:nth-child(2):before{content:'면\2003\2003적'}
		.ACstate td:nth-child(3):before{content:'구비용품'}
	

		/* == QNA > qna_list  ================= */
		.qnalist tr.emptycontent {border-bottom:0 !important}
		.qnalist tr.emptycontent td{background-color:#fff !important; text-align:center !important; }
		.qnalist td:first-child{border-left: 0 solid #eee !important;}
		.qnalist td, .qnalist th{border-left: 0 solid #f8f8f8 !important;}
		.qnalist .text-overflow{padding-left:15px; width:80%; display:inline-block; vertical-align:middle;padding-left:0}
		.qnalist td{vertical-align:middle}

		.qnalist tr:not(.emptycontent) td:nth-child(1):before{content:'No. '}
		.qnalist td:nth-child(2):before{content:'제\2003목 : '}

		.qnalist td:nth-child(n + 3){ font-size:12px; display:inline-block;  background-color:#f8f8f8; border:1px solid #eee !important; border-right:0  !important; padding-right:2px !important}
		.qnalist td:nth-child(3){width:35%}
		.qnalist td:nth-child(4){width:40%}
		.qnalist td:nth-child(5){width:25%; border-right:1px solid #eee !important}
		.qnalist td:nth-child(3):before{content:'작성자 : '}
		.qnalist td:nth-child(4):before{content:'등록일 : '}
		.qnalist td:nth-child(5):before{content:'조회수 : '}





	.RevList tr td{border-bottom:1px solid #eaeff2}
	.RevList tr td:nth-child(n + 3){padding-left:90px !important; vertical-align:middle;}
	.RevList tr td:first-child{
		width: 80px;  
		background: #ff7231;   
		text-align: center;
		padding:0px 10px !important;
		height: 42px;
		line-height:42px;
		color:#fff;
		position:absolute;
		left:0;
		top:0;
		z-index:1;
		vertical-align:middle;
	}
	.RevList tr td:nth-child(2){
		padding:5px 10px 5px 90px !important;
		background-color:  #ff7231; 
		color:#fff; 
		width: 100%; 
		word-break: keep-all;
		display: table;  
		word-spacing: 0;  
		letter-spacing: 0; 
		border-bottom: 0;
		font-size:13px;
		height:41px;
     }
	.RevList tr td:not(:first-child):before{
		width: 80px;  
		background: #eaeff2;  
		display: inline-block;   
		text-align: center;
		padding:8px 10px;
		height:37px; 
		margin-bottom: 1px;
		position:absolute;
		left:0;
		top:0;
		vertical-align:middle;
	}
	.RevList tr td p{
		display: table-cell;
		color: #fff;
		font-size: 13px;
		vertical-align: middle;
		padding: 0 0 0 90px;
	}
	.RevList tr td:nth-child(1):before{content:'No.';margin-right:10px;}
	.RevList tr td:nth-child(2):before{content: '수강반명';  }
	.RevList tr td:nth-child(3):before{content: '수강기간';  }
	.RevList tr td:nth-child(4):before{content: '금\00a0\00a0\00a0\00a0\00a0\00a0\00a0액';  }
	.RevList tr td:nth-child(5):before{content: '할인금액';  }
	.RevList tr td:nth-child(6):before{content: '결제금액';  color:#111; }


		.reservlist tr{position:relative}
		.reservlist td{padding:0 0 0 25% !important; border-bottom:1px solid #f0f0f0; word-break: keep-all;}
		.reservlist td p{display:inline-block; vertical-align:middle; margin:0; line-height:1.3; padding: 0 2px;word-break: keep-all;}
		.reservlist td span{display:inline-block}
		.reservlist td:before{width:23%; padding:0 10px; position:absolute; left:0;  text-align:center; background-color: rgb(200,200,200,0.2); font-size:13px}
		.reservlist p.text-overflow{padding-left:15px; width:60%; display:inline-block; vertical-align:middle;padding-left:0}

		.reservlist tr td:nth-child(1):before{content:'No. '}
		.reservlist tr td:nth-child(2):before{content: '수강반명';  }
		.reservlist tr td:nth-child(3):before{content: '수강기간';  }
		.reservlist tr td:nth-child(4):before{content: '금\00a0\00a0\00a0\00a0\00a0\00a0\00a0액';  }
		.reservlist tr td:nth-child(5):before{content: '할인금액';  }
		.reservlist tr td:nth-child(6):before{content: '결제금액';  color:#111; }

		.reservlist td:nth-child(2){font-size:0}

		.reservlist td:nth-child(2),
		.reservlist td:nth-child(2):before{min-height: 60px;line-height:60px !important}

		.reservlist tr td:before{font-weight:500}


		/* span enter (price) ================= */
		.table.priceS span{display:block}
		.table.priceS span:before{content:'';}

		td.data_none{text-align:center  !important; background-color:#fff !important}


		.nsukang table tr:first-child th{font-size: 16px !important; font-weight:500 !important ; padding: 12px 10px;}
		.nsukang table .btn-right{margin: 10px auto 0 ; width:60%;  padding:3px 10px;position: relative;display: block;}
		.nsukang th, .nsukang td{font-size:12px !important; line-height: 1.2 !important;}
		.nsukang table tr td{padding:6px 5px !important}

	}/* 768 END */

		.nsukang{border-top:0 !important ; border-bottom:0 !important; margin-bottom:20px}
		.nsukang tr > td{border-top:0 !important; vertical-align:  top; padding:0 !important}
		.nsukang > tr td{padding:10px 0 0 0 !important; }
		.nsukang table{margin:0 0 10px}
		.nsukang table tr:first-child th{ background-color:#fd6d6d; padding: 12px 5px ; word-break:keep-all; font-size:20px; font-weight:700; color:#fff}
		.nsukang table td{padding:8px !important; text-align:left}
		.nsukang table {border:2px solid #fd6d6d; border-bottom:2px solid #fd6d6d !important}


		.nsukang  table.colorD{border:1px solid #ddd;  border-bottom:1px solid #ddd !important}
		.nsukang  table.colorD tr:first-child th{background-color:#f0f0f0; color:#aaa; font-size:16px}
		.nsukang  table.colorD tr:not(:first-child) th{ color:#bbb}
		.nsukang  table.colorD tr td{color:#bbb; }

		.nsukang  table.colorD tr td:hover,
		.nsukang  table.colorD tr:hover td{background-color:#fff   !important}

		.nsukang  table.colorD .btn-right{padding:5px 20px}

		.nsukang  table.colorE {border:2px solid #a2db69; border-bottom:2px solid #a2db69 !important}
		.nsukang  table.colorE tr:first-child th{background-color:#a2db69; color:#fff;}


		.classlist .text-overflow{max-width:450px}

	/* == adult > adult-academy  ================= */
	.academy p,
	.ACspecial p{margin:0}
	.academy th:nth-child(1),
	.academy th:nth-child(2){width:17%}
	.academy th:nth-child(4){width:12%}
	.academy th:nth-child(5){width:2%}
	.academy th:nth-child(6),
	.academy th:nth-child(7){width:5%}

	.ACspecial td span{display:block}
	.ACspecial th:nth-child(1),
	.ACspecial th:nth-child(3){width:17%}
	.ACspecial th:nth-child(4){width:12%}
	.ACspecial th:nth-child(5){width:2%}
	.ACspecial th:nth-child(6){width:5%}


	#info {
		padding-top: 0px;
		margin-top: -50px
	}

/* ===========================
--- header 
============================ */

	#header {
		height: 95px;
	}
	#header .gnb:before {
		content: "";
		height: 6px;
		position: absolute;
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1795d4+0,5ab952+100 */
		background: #0080c6;
		/* Old browsers */
		background: -moz-linear-gradient(left, #0080c6 0%, #25b146 100%);
		/* FF3.6-15 */
		background: -webkit-linear-gradient(left, #0080c6 0%, #25b146 100%);
		/* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, #0080c6 0%, #25b146 100%);
		/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0080c6', endColorstr='#25b146', GradientType=1);
		/* IE6-9 */
		left: 0;
		bottom: -6px;
		width: 100%;
	}
	#header .gnb {
		-webkit-transition: all 0.2s ease-out;
		transition: all 0.2s ease-out;
		width: 100%;
		opacity: 1;
		position: fixed;
		top: 0px;
		z-index: 299;
		background-color: #fff;
		/**/
		border-bottom: 0px solid #fff;
	}
	#header .gnb.on {
		background-color: #fff;
		border-bottom: 0px solid #ddd;
		margin-top: -40px;
		box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.1);
	}
	#header .language li {
		float: left;
		font-size: 16px;
		height: 16px;
		line-height: 16px
	}
	#header .language li.bar {
		padding-right: 10px;
		padding-left: 10px;
	}
	#header .language ul {
		width: auto;
		position: absolute;
		right: 61px;
		top: 35px;
	}
	
	@media screen and (max-width: 768px) {
		#header {
			height: 100px;
		}
		#header .gnb {
			background-color: #fff;
		}
	}
/*****************************************************************
상단영역
*****************************************************************/

/* 상단영역 */

	.topArea {
		width: 90%;
		max-width: 1300px;
		position: relative;
		margin: 0 auto;
		padding: 5px 15px 0;
		height: 40px;
		font-size: 0.875em;
		border: 0px solid #aaa;
	}
	.topArea_inner {
		float: right;
	}
	@media screen and (max-width: 768px) {
		.topArea {
			width: 100%;
			/**/
			padding: 5px 0px 0;
		}
	}

	.topArea .nt_quick {
		position: relative;
		float: left;
		margin-right: 10px;
	}
	.topArea .nt_quick p {
		width: 130px;
		height: 30px;
		line-height: 30px;
		text-align: center;
		cursor: pointer;
		color: #666;
		-webkit-transition: all 0.2s ease-out;
		transition: all 0.2s ease-out;
	}
	.topArea .nt_quick:hover p {
		color: #666;
	}
	.topArea .nt_quick ul {
		z-index: 100;
		position: absolute;
		top: 30px;
		left: 0;
		background-color: #fff;
		border: 1px solid #ccc;
		width: 130px;
		display: none;
	}
	.topArea .nt_quick ul li {}
	.topArea .nt_quick ul li a {
		display: block;
		line-height: 35px;
		border-bottom: 1px solid #ddd;
		text-align: center;
		font-weight: 400;
		font-size: 1.0em;
		-webkit-transition: all 0.2s ease-out;
		transition: all 0.2s ease-out;
	}
	.topArea .nt_quick ul li:hover a {
		position: relative;
		padding-left: 10px;
		color: #666;
	}
	.topArea .nt_quick ul li:hover a:before {
		position: absolute;
		top: 19px;
		left: 5px;
		content: '';
		background-color: #333;
		width: 10px;
		height: 1px;
	}
	.topArea .nt_quick ul li:last-child a {
		border-bottom: none;
	}
	@media screen and (max-width: 768px) {
		.nt_quick {
			display: none;
		}
	}
/* language : 언어 */

	.topArea .language {
		float: left;
		margin-right: 10px;
	}
	.topArea .language ul {
		overflow: hidden;
		float: right;
	}
	.topArea .language li {
		float: left;
		margin-left: 1px;
		margin-top: 5px;
		opacity: 0.6;
	}
	.topArea .language li:hover, .topArea .language li.on {
		opacity: 1.0;
	}
	@media screen and (max-width: 768px) {
		.language {
			display: block;
			position: fixed;
			top: -8px;
			z-index: 2;
			right: 0px;
			width: 200px;
		}
	}
/* sns :소셜아이콘 */

	.topArea .nt_sns {
		float: left;
		margin-right: 10px;
	}
	.topArea .nt_sns ul {
		overflow: hidden;
		float: right;
	}
	.topArea .nt_sns li {
		float: left;
		margin-left: -3px;
		margin-top: 4px;
		font-size: 0;
	}
	.topArea .nt_sns li img {
		border: 0px;
		width: 80%;
		opacity: 0.8;
		-webkit-transition: all 0.2s ease-out;
		transition: all 0.2s ease-out;
	}
	.topArea .nt_sns li img.on {
		opacity: 1.0;
		transform: rotate(30deg);
		-webkit-transition: all 0.2s ease-out;
		transition: all 0.2s ease-out;
	}
	@media screen and (max-width: 768px) {
		.nt_sns {
			display: none;
		}
	}
	@media screen and (max-width: 768px) {
		.topArea .nt_login {
			margin-right: 5px;
		}
	}

/*****************************************************************
상단영역 > 사이트맵 : sitemap
*****************************************************************/
	.nt_sitemap {
		display: block;
		/* none, block */
		position: absolute;
		top: 43px;
		right: 0;
		float: left;
		opacity: 1;
		transition: all 0.4s ease-out;
		transform: translate(-1px, 10px);
		cursor: pointer;
	}
	.nt_sitemap.on {}
	.nt_sitemap a {
		width: 30px;
		height: 30px;
		padding: 4px 0 0 1px;
		overflow: hidden;
		background-color: #111;
		border-radius: 2px;
		display: inline-block;
		text-align: center;
		color: #aaa;
		font-size: 1.1em;
	}
	.nt_sitemap a:hover {
		color: #fff;
	}
	@media screen and (max-width: 768px) {
		.nt_sitemap {
			display: none;
		}
	}
	.sitemap {
		position: fixed;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.9);
		z-index: 300;
		padding-top: 20px
	}
	.close_box {
		position: absolute;
		width: 36px;
		height: 36px;
		line-height: 1em;
		background: #000;
		color: #fff;
		font-size: 24px;
		right: 10px;
		top: 20px;
		padding: 6px;
		border-radius: 4px;
	}
	.sitemap ul li {
		float: left;
		width: 18%;
		font-size: 18px;
		font-weight: 500;
		text-align: center;
		height: 50px;
		line-height: 50px;
	}
	.sitemap li>a {
		height: 90px;
		display:block;
		font-size: 25px;
		color: #fff;
		line-height: 90px
	}
	.sitemap ul {
		margin: auto
	}


	.submenu_site a {
		display: block;
		color: #fff;
		font-weight: 300;
		font-size: 18px

	}


	.submenu_site a:link, .submenu_site a:visited {
		display: block;
		color: #fff
	}
	.submenu_site a:hover, .submenu_site a:active {
		display: block;
		color: #B1F4FA
	}
	@media screen and (max-width: 992px) {
		.sitemap li>a {
			height: 70px;
			font-size: 20px;
			color: #fff;
			line-height: 70px;
			letter-spacing: -1px
		}
		.sitemap .submenu_site a {
			font-size: 16px;
		}

	}


/*****************************************************************
영역나누기 : 로고영역 & 메뉴영역
*****************************************************************/

	#header .gnb .nav {
		width: 100%;
		max-width: 1200px;
		margin: 0px auto;
		padding: 0px 15px;
	}
	#header .gnb .nav .logoArea {
		height: 95px;
		float: left;
		margin: 0px 0;
		display: block;
		background-color: transparent;
		position: relative;
	}
	#header .gnb .nav .menuArea {
	   
		position: relative;
	}
	@media screen and (max-width: 768px) {
		#header .gnb .nav {
			width: 100%;
			background-color: transparent;
			/**/
			padding: 0px 0px;
		}
		#header .gnb .nav .logoArea {
			width: 100%;
			height: 60px;
		}
		#header .gnb .nav .menuArea {
			width: 100%;
			float:right;
		}
	}
/*****************************************************************
상단영역 : 로고, 카테고리메뉴 : (모바일공통)
*****************************************************************/

/* 로고 */
	.logoArea .logo {
		vertical-align: top;
		text-align: left;
		cursor: pointer;
		width:175px;
		padding-top:16px
	}
	.logoArea .logo a {
		display: block;
		max-width: 153px;
		width:100%;
		position: relative;
		background-color: transparent;
	}
	.logoArea .logo .logo_off {
		-webkit-transition: all 0.2s ease-out;
		transition: all 0.2s ease-out;
		opacity: 1;
	}
	.logoArea .logo a:hover .logo_off {
		transform: translate(20px, 0px);
		opacity: 0;
	}
	.logoArea .logo .logo_on {
		-webkit-transition: all 0.2s ease-out;
		transition: all 0.2s ease-out;
		transform: translate(20px, 0px);
		opacity: 0;
		position: absolute;
		top: 0px;
		left: 0px;
	}
	.logoArea .logo a:hover .logo_on {
		transform: translate(0px, 0px);
		opacity: 1;
	}
	.logoArea span { 
		font-size: 17px;
		font-weight: 400;
		color: #444;
		position:relative;
		padding-left:15px;
		letter-spacing:-1px;
		top:-12px;
	}
	/* 햄버거메뉴 버튼 */
	.logoArea .button {
		display: none;
		width: 40px;
		height: 40px;
		margin-right: 0px;
		padding-top: 10px;
		text-align: center;
		background-color: #111;
		color: #fff;
		cursor: pointer;
	}
	.logoArea .button.on {
		background-color: #b14295;
		color: #fff;
	}
	@media all and (max-width: 1260px) {}
	@media (max-width:1020px) {
		.logoArea span { top: 20px; position:absolute; right:0 ; font-size:15px}
		.logoArea .logo{padding-top:8px ; width: 240px;}
		.logoArea .logo a{max-width:105px}
	}
	@media screen and (max-width: 768px) {
		.logoArea .logo {
			text-align: left;
			width:152px;
			padding: 12px 5px 18px;
		}
		.logoArea .logo a{max-width:95px; position: absolute; top: 14px;}
		.logoArea span {left: 82px;  right: auto; }
		
		#header .gnb .nav .logoArea .button {
			display: block;
			position: absolute;
			top: 10px;
			right: 10px;
			border-radius: 2px;
		}
	}

	/* 메뉴 로그인 회원가입 부분 */
	.topmenu {position: absolute; top:10px; right:10px}
	.topmenu li { float: left; font-size: 14px ;font-weight: 200; margin-left:5px}
	.topmenu .bar { margin: 0 10px}

	@media screen and (max-width: 768px) {
		.topmenu {
			position: absolute;
			top: -51px;
			right: 60px;
		}

		.mb_topmenu{ background-color:#444 !important; padding:0px 10px  !important; text-align:right; line-height:50px;}
		.mb_topmenu span{vertical-align: middle; display:inline-block; color:#fff;}
		.mb_topmenu span.mb_line{font-size:10px; line-height:50px;}
		.mb_topmenu span a{color:#ff79dd !important; padding:0 10px; line-height:50px; height:50px; display:block}

	}




/* 1차메뉴 영역 */
	.mainmenu {
		-webkit-transition: all 0.4s ease-out;
		transition: all 0.4s ease-out;
		margin: 0 auto;
		border: 0px solid #f00;
		padding-right: 150px;
	}
	.mainmenu>ul {
		position: absolute;
		right: 45px;
		top: 50px;
		padding: 0 !important;
	}
	@media all and (max-width:992px) {
		.mainmenu > ul> li {padding:0 9px !important;}
		.mainmenu > ul> li > a{font-size: 15px !important; }
	}
	@media all and (max-width:768px) {
		.mainmenu>ul>li {
			font-size: 1em;
			padding: 0 !important;
		}
		.mainmenu>ul {right: 0; left: 0}
		.sitemap {
			display: none !important
		}
	}
	/* 1차메뉴 배경색상 */
	.mainmenu>ul>li {
		position: relative;
		float: left;
		border-left: 0px solid #fff;
		background-color: transparent;
		padding: 0 20px;
	}
	.mainmenu>ul>li:first-child {
		border: none;
	}
	/* 1차메뉴 배경색상 : 마우스오버시 */
	.mainmenu>ul>li:hover {
		background-color: transparent;
	}
	/* 1차메뉴 색상 */
	.mainmenu>ul>li>a {
		-webkit-transition: all 0.1s ease-out;
		transition: all 0.1s ease-out;
		display: block;
		height: 45px;
		line-height: 40px;
		text-align: center;
		margin: 0px 0 0;
		background-color: transparent;
		border-right: 0px solid #444;
		font-size:17px;
		font-weight: 400;
		color: #333;
	}
	.mainmenu>ul>li:hover>a {
		background-color: transparent;
		font-weight: 500;
		color: #0080c6;
	}
	.mainmenu>ul>li:last-child>a {
		border-right: none;
	}
	/* 2차메뉴 > 배경색상,갯수 */
	.submenu {
		display: none;
		position: absolute;
		left: 0;
		width: 100%;
		min-width: 100px;
		border-bottom: 1px solid #ddd;
		box-sizing: border-box;
		padding-top: 0;
		background-color: transparent;
		font-family: 'MalgunGothic','NanumGothic','돋움', sans-serif;
		letter-spacing: -1px
	}
	.submenu.big{min-width:170px !important; padding:0px}
	.submenu a {
		display: block;
		text-align: center;
		padding: 0 10px;
		height: 50px;
		line-height: 50px;
		border: 1px solid #ddd;
		border-width: 0 1px 0px;
		border-top: 1px solid #ddd;
		background-color: #fff;
		font-size: 14px;
		font-weight: 400;
		color: #555;
		position: relative;
	}
	.submenu a.twoline {line-height:1.3; padding:6px 0}

	.submenu a:hover {
		background-color: #ddd;
		font-weight: 500;
		color: #0080c6;
	}
	.submenu a:first-child {
		border-top: 0px solid #fff;
	}

/*****************************************************************
메인 : program
*****************************************************************/
	#program { position: relative;}
	#program .program_bg { position: absolute; width: 100%; top: 320px ;bottom: 0;left: 0;right: 0; background-image: url('/gumigx/images/mid_bg.jpg'); background-position: center; background-repeat: no-repeat; background-size: cover}

	.program_box { width: 250px; height: 400px ;margin:17px auto; background-color: #fff; position: relative; text-align: left;padding: 20px; cursor:pointer;}
	.text_box h5 { position: relative; padding-top: 10px ;color: #000; font-size: 17px; font-weight: 400; margin: 10px 0}
	.text_box p { display: block; font-size: 13px; color: #666; line-height: 1.3em}

	.text_box h5:before { position: absolute; top: 0; content: ""; width: 35px; height: 5px; background: #3c72be; }
	.program_box .bg { position: relative;background-image: url('/images/mid_1.jpg');background-size: cover; height: 230px; margin:-20px -20px 0 -20px }
	.program_box:hover:before  { content: "";position: absolute;width: 100%; height: 100%; background: rgba(0,0,0,0.5);z-index: 5; left: 0; top: 0}

	.program_box_1 .bg {background-image: url('/gumigx/images/mid_1.jpg');}
	.program_box_2 .bg {background-image: url('/gumigx/images/mid_2.jpg');}
	.program_box_3 .bg {background-image: url('/gumigx/images/mid_3.jpg');}
	.program_box_4 .bg {background-image: url('/gumigx/images/mid_5.jpg');}
	.program_box_5 .bg {background-image: url('/gumigx/images/mid_4.jpg');}
	.program_box_6 .bg {background-image: url('/gumigx/images/mid_6.jpg');}
	.program_box_7 .bg {background-image: url('/gumigx/images/mid_7.jpg');}
	.program_box_8 .bg {background-image: url('/gumigx/images/mid_8.jpg');}

	.program_box .bg:after {     content: "";
	position: absolute;
	bottom: 0;
	/* width: 100%; */
	z-index: 2;
	background-image: url('/gumigx/images/mid_cover.png');
	width: 100%;
	height: 44px;
	left: 0;
	background-size: 100% 44px
	}

	#program .program_box{height:470px}
	.program_box_8 .text_box p{line-height:1.6em; margin-bottom:8px}


/*****************************************************************
모바일 : 768px이하 > 카테고리메뉴
*****************************************************************/

@media screen and (max-width: 768px) {
    /* 1차메뉴 */
    #header .gnb .nav .mainmenu {
        position: absolute;
        width: 100%;
        padding-top: 0px;
        opacity: 0.95;
        right: 0px;top: -50px;
    }
    #header .gnb .nav .mainmenu>ul {
		display: none;
        overflow: auto;
        margin-top: 0px;
		width:100%;
    }
    #header .gnb .nav .mainmenu>ul>li {
        width: 100%;
        border-top: 1px solid #444;
		padding:0;
    }
    #header .gnb .nav .mainmenu>ul>li:last-child {
        border-bottom: 1px solid #444;
    }
    #header .gnb .nav .mainmenu>ul>li>a {
        display: block;
        background-color: #333;
        /**/
        height: 50px;
        line-height: 50px;
        margin: 0px 0 0;
        /**/
        color: #fff;
    }
    #header .gnb .nav .mainmenu>ul>li.s_on>a {
        background-color: #111;
        /**/
    }
    #header .gnb .nav .mainmenu>ul>li>.submenu {
        position: relative;
        top: 0px;
        left: 0px;
        padding: 0;
    }
    /* 2차메뉴 */
    #header .gnb .nav .mainmenu>ul>li.s_on .submenu {
        border: none;
    }
    #header .gnb .nav .mainmenu>ul>li.s_on .submenu a {
        /*        font-weight: 500;*/
        /*        color: #333;*/
    }
    #header .gnb .mainmenu {
        -webkit-transition: none;
        transition: none;
    }
    #header .gnb .mainmenu.on {
        padding-right: 0px;
        -webkit-transition: none;
        transition: none;
    }
}
@media screen and (min-width: 768px) {
    #header .gnb .nav .mainmenu {
        display: block !important;
        position: relative;
    }
}

/* ===========================
--- search
============================ */

#search .table td .row {
    margin: 0 -3px
}
#search .table td .row .col-xs-3, #search .table td .row .col-xs-4 {
    padding: 0 3px
}
#search .table th {
    vertical-align: middle;
    background: #f9f9f9
}
/* ===========================
--- Footer
============================ */

footer {
	padding: 30px 0 20px 0;
	position: relative;
	background-color: #4b4b4b;
}
footer * { font-family:'돋움'; color: #f8f8f8;  font-size: 12px;}
footer .info {
    position: absolute;
    right: 15px;
    text-align: right;
    padding: 10px;
    background-color: #000;
    top: 12px;
    z-index: 3;
	color:#fff;
}
footer span.bar {margin:0 3px; opacity: 0.5; font-weight: 100}
footer a span ,footer a b{color:#fff}
footer a:hover span,footer a:hover b {color:#eee}
footer .quicklink {margin:0px 0 10px 0}
footer .address li {padding: 1px 0}
footer .address .xs_view {     
	border-top: 1px solid #999;
    padding-top: 15px;
    width: 100%;
    margin: 15px auto;
	}
footer .logo_footer { float:left ; margin-left: 20px; margin-right: 40px;padding:25px 0; max-width:130px}
footer .logo_footer img{width:100%}
footer .container { position: relative;}


@media screen and (min-width:768px) and (max-width: 1200px) {
	footer .info {  display: none}
}
@media all and (max-width: 768px) {
	footer {font-size: 11px; padding:0px 0 80px;}
	footer .container {padding:0}
	footer .text-left {text-align: center !important}
	footer .address{padding-top:15px} 
	footer .logo_footer{display:block; float:none; text-align: center;padding:15px 0 ; margin:0 auto}
	footer .quicklink{margin:0 ; padding:10px 0; background-color:#555}
	footer .info {
		display: block;
		position:initial;
		width: 276px;
		font-size: 11px;
		margin: 3px auto ;

	}
	footer .copyright{margin-top:10px;}
	footer .copyright span{display:block}
}


/* ===========================
--- Elements
============================ */

@-webkit-keyframes pulse {
    0 {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}
@-moz-keyframes pulse {
    0 {
        -moz-transform: scale(1);
        transform: scale(1);
    }
    50% {
        -moz-transform: scale(1.2);
        transform: scale(1.2);
    }
    100% {
        -moz-transform: scale(1);
        transform: scale(1);
    }
}


/*****************************************************************
로그인 / 회원가입 
*****************************************************************/

/* 로그인 */
.menu_8 .title_box{ display: none }

.member_box { width: 100%;  margin: auto; }
.member_box h3 { padding-top: 0; margin-bottom: -10px; text-align: center}
.member_box h3 img {height: 48px;   padding-bottom: 1px;}
.member_box .member { border: 1px solid #ddd; padding:15px 15px 10px 15px; margin: 0 auto 20px; max-width:1000px; background: #f9f9f9 }
.member_box .member .input-group { margin-bottom: 15px }
.member_box .btn .pull-right {color: #aaa;padding-top: 4px}
.member_box .btn {margin-bottom: 15px;}
.divider { height: 1px; background: #ddd; margin: 0  0 25px 0}
small { display: block;}

.member_box .btn , .form-control[type="text"] , .form-control[type="password"], .input-group-addon { border-radius: 0 !important }

/* 회원가입 */
.member h4 { padding-top: 5px !important; margin-bottom: 20px}
.rules_box iframe { border: 1px solid #aaa; border-top: 2px solid #666; background: #fff; width: 100%; height: 300px; }
.rules_box iframe div{font-size:14px;}
.joincontent{word-break: keep-all; line-height:1.8}

.checkbox-lg label { font-size: 15px;   padding-top: 9px !important;}
.checkbox3.checkbox-lg label { padding: 11px 0 11px 40px !important}
.btn-primary .pull-right { color:#fff; position: absolute;top: 50%; right:10px ;margin-top: -0.6em}



input[type="checkbox"]{width:20px !important; height:20px !important; margin:0; line-height:20px !important; vertical-align: middle; position:relative}
input[type="checkbox"]:before {
	content: '';
	border-width: 0 8.5px;
    border-color: #fff;
    border-style: solid;
    width: 17px;
    height: 16px;
	line-height: 1;
	border-radius: 2px;
	position: absolute;
	top: 1.5px;
	left: 1px;
}

input[type= "checkbox" ]:checked:after {
font-family: 'xeicon';
    content: '\e929';
    display: block;
    color: #444d58;
    font-size: 18px;
    z-index: 100;
    position: absolute;
    line-height: 18px;
    left: 0;
    top: 0;
    background: white;
    border: 1px SOLID #084aff;
    BORDER-RADIUS: 3PX;
}
.newb{margin-top:20px;}
.newb label{font-weight:500 !important; margin-bottom:0; position: relative;
    top: 2px; left: 4px;}

.newb2{margin-top:10px; float:right;}
.newb3{margin-top:10px; display:flex; justify-content: space-between;}
/*****************************************************************
아이디, 비밀번호 찾기
*****************************************************************/
.find_wrap {width:600px; height:320px; position:relative;}
.find_title_bar {width:100%; height:46px; background:#0089e0; padding:12px 20px;}
.find_title {width:548px; font-size:17px; font-weight:bold; color:#fff; float:left}
.find_tab_box {width:560px; margin:12px auto; border-bottom:1px solid #0089e0; position:relative; border-left:1px solid #ddd}
.find_tab {
	width:120px;
	height:40px; 
	cursor:pointer; 
	text-align:center; 
	line-height:40px; 
	color:#777; 
	background:#fff; 
	display:inline-block; 
	border-top:solid 1px #ddd; 
	border-right:solid 1px #ddd;
}
.find_tab.act{color:#fff;background-color:#0089e0;font-weight:700; }



.find_box {width:560px; margin:0 auto;}
.find_list {width:20%; font-size:13px; color:#323232; border-right:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9; text-align:left;}
.find_guide_box {width:558px; height:68px; border:1px solid #abd1ea; margin-top:13px;}
.find_guide {font-size:13px; color:#323232; line-height:22px; list-style:url('/gumigx/images/bullet_gray_small_round.gif'); margin:12px 14px;}
.find_pw_btn {width: 100%;
    position: absolute;
    right: 0;
    bottom: 22px;
    text-align: center;}
.find_id_btn {width: 100%;
    position: absolute;
    right: 0;
    bottom: 22px;
    text-align: center;}

.apply_form {border-top:2px solid #c9c9c9;}
.app_list {font-size:13px; color:#323232; border-right:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9; padding:0 0 0 15px; width:120px; height:63px; font-weight:bold;}

.app_text {font-size:11px; border-bottom:1px solid #d9d9d9; padding:0 0 0 15px; }
.app_input {width:138px; height:28px; border:1px solid #a1a1a1}
.app_text_blue {font-size:11px; font-family:'굴림','gulim'; letter-spacing:0.1px; color:#007ac8}
.app_text_red {font-size:11px; font-family:'굴림','gulim'; letter-spacing:0.1px; color:#e60000}
.app_text_gary {font-size:11px; font-family:'굴림','gulim'; letter-spacing:0.1px; color:#aaa}
.app_select {width:60px; height:28px; border:1px solid #a1a1a1}
.app_num {width:50px; height:28px; border:1px solid #a1a1a1}


/* 아이디, 비밀번호 찾기 결과 */
.re_text {font-size:12px; color:#333; text-align:center; line-height:20px; margin-top:40px;}
.fi_bt {width:250px; height:40px; margin:45px auto;border:0px solid #1a5bad; text-align:center;padding:15px 0 0 0}


.btn_find{ color: #ffffff!important; background-color: #0089e0; border:1px solid #0089e0; font-size:15px; padding:8px; font-size:13px; font-weight:bold;}
.btn_find:hover, .btn_find:focus, .btn_dark:active, .btn_dark.active { color: #ffffff!important; }





/*****************************************************************
버튼 btn
*****************************************************************/

button:focus, button:active {outline: none !important;box-shadow: none !important}


.btn {position: relative;}
.btn-default { border-radius: 2px; text-align: left;color: #111; border-color: #aaa; z-index: 6;}
.btn-buy {	font-size: 22px;	padding: 13px 10px;}
.btn-big { font-size: 22px; padding: 13px 15px !important;	font-weight:500}
.b-big{font-size:22px; padding: 13px 40px !important; font-weight:500 }
.btn-half{width:50%; display:block; margin:0 auto}

.btn-wprimary {background-color: #fff; border-color: #0080c6; color: #0080c6}
.btn-wprimary:hover, .btn-wprimary:active, .btn-wprimary:focus{border:2px solid #0080c6; color:#006095}
.btn-primary {background-color: #0080c6; border-color: #006095}
.btn-primary.active, .btn-primary.focus, .btn-primary:active, .btn-primary:focus, .btn-primary:hover, .open>.dropdown-toggle.btn-primary {
	background-color: #006095; border-color:  #006095
}
.btn-primary.disabled, .btn-primary.disabled.active, .btn-primary.disabled.focus, .btn-primary.disabled:active, .btn-primary.disabled:focus, 
.btn-primary.disabled:hover, .btn-primary[disabled], .btn-primary[disabled].active, .btn-primary[disabled].focus, .btn-primary[disabled]:active, 
.btn-primary[disabled]:focus, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary, fieldset[disabled] .btn-primary.active, fieldset[disabled] 
.btn-primary.focus, fieldset[disabled] .btn-primary:active, fieldset[disabled] .btn-primary:focus, fieldset[disabled] 
.btn-primary:hover{background-color: #67b0d1; border-color:  #67b0d1} 

.price {background: rgba(0, 0, 0, 0.5);padding: 3px 10px 2px 0;	margin: 5px 0 -10px 0;	border-radius: 10px;	text-align: right}


/*우측정렬버튼*/
.btn-right{background-color:#d90000; position:absolute; right:5px; top:5px; margin: 0;line-height: 1.7; color: #fff; font-weight:500 ;border-radius: 5px !important; padding:8px 20px; }
.btn-left{background-color:#ffbc35; position:absolute; right:5px; top:5px; margin: 0;line-height: 1.7; color: #fff;  font-weight:500; border-radius: 5px !important; padding:8px 20px; }
.btn-right:hover, .btn-left:hover{color:#fff !important; background-color:#8b0101}
.btn-bottom{background-color:#d90000; margin: 10px auto 0 ; width:60%; display:block; line-height: 1.7; color: #fff; font-weight:500 ;border-radius: 5px !important; padding:3px 10px;}

@media all and (max-width: 768px) {
	.btn-big,
	.btn-buy{font-size:20px}
	.btn-half{width:100%;}
}



.w100 {width: 100px !important}
.w60 {width: 60px !important}
.form-horizontal .control-label {    padding-top: 3px; font-weight:500}
.form-group > label.required:before {
    content: '*';
    color: red; margin-right: 5px
}
.form-group .row .input-group,.form-group .row .input-group .btn { margin-bottom: 0}

.form-group .row {
    margin-right: -5px;
    margin-left: -5px;
}
.select_design select.form-control {
	position: absolute;
    z-index: 2;
    min-width: 100px;
    opacity: 0;
    border: none;
    box-shadow: none;
    top: 0;
    left: 0;
}
.select_design {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
	text-align: left
}
.select_design:after {
    font-size: 1.2em;
    line-height: 18px;
    position: absolute;
    top: 50%;
    right: 8px;
    width: 12px;
    height: 18px;
    margin-top: -9px;
    content: '▾';
    text-align: center;
    color: #7e7e7e;
    background: none;
}

/*faq*/
span.form-control {border-radius: 0}
.form-group .row div[class|="col"] { padding-right: 5px;    padding-left: 5px; }
.help-block { font-size: 0.8em;line-height: 1.1em; margin-bottom: 0}
.form-group .row .form-control.text-center {padding-left: 0; padding-right: 0}
.faq_search_box { border: 3px solid #0080c6;
    padding: 15px 20px;
    margin-bottom: 25px;
}
.faq_search_box .form-group{margin: 0}
.faq_search_box label {font-weight: 400}
.faq_search_box input.form-control { border:2px solid #999; border-right:none}


/*강사현황*/
.trainer-box{font-size:0}
.trainer-box .trainer {
	border: 1px solid #ddd;
	padding: 0;
	font-size: 0;
	margin-bottom: 15px;
	width:23.5%;
	margin-right:2%;
	display:inline-block;
	box-shadow: 0px 2px 5px rgba(100, 100, 100, 0.2);
}

.trainer-box .trainer> div{display:inline-block; vertical-align:top; text-align:left; width: 100%;}
.trainer-box .trainer label{font-size:15px; font-weight:500; line-height:1; vertical-align:top; }

.trainer-box .trainer.health .trainer-head label:first-child {  background-color: #e66a12; border: 1px solid #e46710;}
.trainer-box .trainer.health .trai-content label:before{border:3px solid #e66a12}

.trainer-box .trainer-head {padding:8px 10px;  border-bottom: 1px solid #ddd; }
.trainer-box .trainer-head label{margin-bottom: 0; line-height:21px}
.trainer-box .trainer-head label:first-child {
    border: 1px solid #0070ad;
    padding: 2px 5px;
    border-radius: 3px;
    background-color: #0080c6;
    line-height: 1;
    margin-right: 8px;
    color: #fff;
}

.trainer-box .trai-fixed{font-size:0; padding:10px; background-color:#f8f8f8}
.trainer-box .trai-fixed div{
	width:120px; height:120px; 
	overflow:hidden; border-radius:50%; 
	margin:0 auto; 
	border:2px solid #ddd;
	background:url('/Y/noimg.gif') no-repeat;
	background-size:105% !important;
	background-position:-3px -3px  !important;
}
.trainer-box .trai-content{ padding: 0 10px 10px; border-top:1px solid #ddd}
.trainer-box .trai-content label{margin:10px 0 0; border:1px solid #ddd; border-bottom:0; width:100%; padding:5px}
.trainer-box .trai-content label:before{content:''; display:inline-block;  margin-right:5px; width:11px; height:11px; border-radius:50%; border:3px solid #0080c6}

.trainer-box .trai-content ul{font-size:0; display:inline-block; background-color:#f1f1f1; vertical-align:top; border:1px solid #ddd; width:100%; height:65px; overflow:auto; padding:5px}
.trainer-box .trai-content ul li{font-size: 13px; }


	@media all and (min-width:993px) {.trainer-box .trainer:nth-child(4n){margin:0}}
	@media all and (min-width:769px) and (max-width:992px) {
	.trainer-box .trainer {width:32%}
	.trainer-box .trainer:nth-child(3n){margin:0}
	}
	@media  all and (max-width:768px) {
		.trainer-box .trainer {width:100%; margin: 0 0 20px !important}
		.trainer-box .trai-content ul{height:auto; min-height:50px}

	}
/* Media queries */

	@media(min-width:767px) {
		.navbar {
			padding: 20px 0;
			border-bottom: 0;
			letter-spacing: 1px;
			background: 0 0;
			-webkit-transition: background .5s ease-in-out, padding .5s ease-in-out;
			-moz-transition: background .5s ease-in-out, padding .5s ease-in-out;
			transition: background .5s ease-in-out, padding .5s ease-in-out;
		}
		.top-nav-collapse {
			padding: 0;
			background-color: #000;
		}
		.navbar-custom.top-nav-collapse {
			border-bottom: 1px solid rgba(255, 255, 255, .3);
		}
		.brand-heading {
			font-size: 100px;
		}
		.intro-text {
			font-size: 25px;
		}
	}
	@media (max-width:991px) {

		.digital {
			font-size: 14px;
			font-weight: 400;
			line-height: 1.1em;
			border-top: 1px solid #ccc;
			padding-top: 10px;
			margin-top: 10px
		}
		.digital .item {
			font-size: 16px;
			font-weight: 500;
			display: inline-block;
			padding: 12px 6px 8px 6px;
			background: #fff;
			border: 1px solid #ccc;
			background: #fff;
			border-radius: 3px;
			margin: 0 2px
		}
		.digital .item.big {
			width: 60px;
			text-align: right
		}
	}
	@media (max-width:768px) {
		.xs_bt_10 {margin-bottom: 10px}
		.rules_box iframe { height: 200px}
		.member_box .member { padding:15px; margin-bottom: 50px;background: #f9f9f9}
		.hp_no {width:28%}
		.team.boxed-grey {
			margin-bottom: 30px;
		}
		.boxed-grey {
			margin-bottom: 30px;
		}
		.navbar-brand h1 {
			width: 40px;
			height: 40px;
			background-position: top;
			background-size: 100%;
			margin-top: 2px;
			position: relative;
		}
		.navbar-brand h1:after {
			content: "PLAY BOX";
			font-family: 'Hind';
			font-weight: 500;
			font-size: 28px;
			color: #fff;
			position: absolute;
			left: 50px;
			top: 1px;
			width: 160px;
		}
		.collapse {
			background: #000
		}
		.intro .slogan .logo {
			background: url(../img/logo_b.png) no-repeat top center;
			background-size: contain;
			height: 220px;
			margin: auto
		}
		.intro .slogan .txt {
			font-size: 40px;
			color: #fff
		}
		.section-heading h2 {
			font-size: 26px;
		}
		.intro .slogan .txt.type2 {
			font-size: 22px;
			color: #fff;
			padding-top: 10px
		}
		.md_br {
			display: block;
			margin-top: 10px
		}

	}
	@media (max-width:480px) {
		.col-xx-12 {width: 100% !important}
		.navbar-custom .nav.navbar-nav {
			background-color: transparent;
		}
		.navbar.navbar-custom.navbar-fixed-top {
			margin-bottom: 30px;
		}
		.tp-banner-container {
			padding-top: 40px;
		}
		.page-scroll a.btn-circle {
			width: 40px;
			height: 40px;
			margin-top: 10px;
			padding: 7px 0;
			border: 2px solid #fff;
			border-radius: 50%;
			font-size: 20px;
		}
		.btn_in {
			font-size: 12px;
			letter-spacing: -1px;
			line-height: 19px;
			padding-left: 0;
			padding-right: 0;
		}
		#day .txt {
			font-size: 13px
		}

	}
	@media (max-height:380px) {
		.intro:before {
			background-size: cover;
		}
	}
	@media ( max-width:660px) {
		#search table.table th {
			display: none !important
		}
	}
/*컨텐츠*/
	.content_body {min-height: 300px; padding-bottom: 50px}
	.img img {
		margin: auto;
		max-width: 100%;
		display: block;
	}
	.img img.full {
		width: 100%
	}
	.title_box h2 {
		font-size: 29px;
		color: #000;
		position: relative;
		padding-top: 30px;
	}
	.title_box h2:after {
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		width: 30px;
		height: 3px;
		background-color: #0080c6;
	}
	.sub_cover_text{
		padding:36px 0 0 30px;
		text-align: left;
		font-size: 30px;
		font-weight: 500;
		color: #fff;
		text-shadow: 0 0 5px rgba(0,0,0,0.5)
	}
	.sub_cover_box { 
		height:160px; background-image:url(/gumigx/images/sub_0.jpg);  
		background-position: center center;
		background-size: cover;
		background-repeat: no-repeat; 
		background-color: #000;
	}

	.sub_cover_1 {  background-image:url(/gumigx/images/sub_1.jpg) }
	.sub_cover_2 {  background-image:url(/gumigx/images/sub_2.jpg) }
	.sub_cover_3 {  background-image:url(/gumigx/images/sub_3.jpg) }
	.sub_cover_4 {  background-image:url(/gumigx/images/sub_4.jpg) }
	.sub_cover_5 {  background-image:url(/gumigx/images/sub_5.jpg) }
	.sub_cover_6 {  background-image:url(/gumigx/images/sub_0.jpg) }
	.sub_cover_7 {  background-image:url(/gumigx/images/sub_0.jpg) }


	/*****************************************************************
	서브페이지 > 페이지메뉴 공통
	*****************************************************************/

	/*서브메뉴  */
	.sub_menu_box{margin:0 auto; max-width:1200px; padding:0 15px; width:100%}
	.pageMenu {
		max-width: 230px;
		margin: 0px 0px;
		text-align: center;
		overflow: hidden;
		display: none
	}
	.pageMenu h2 {
		width: 100%;
		height: 80px;
		line-height: 80px;
		margin-bottom: 1px;
		font-size: 1.125em;
		font-weight: 500;
		color: #000;
	}
	.pageMenu ul {
		overflow: hidden;
		width: 100%;
		border-top: 1px solid #ddd;padding: 0
	}
	.pageMenu ul li, .pageMenu #leftoff, .pageMenu #lefton {
		width: 100%;
		padding: 0px !important;
	}
	.pageMenu ul li a, .pageMenu #leftoff a, .pageMenu #lefton a {
		-webkit-transition: all 0.1s ease-out;
		transition: all 0.1s ease-out;
		display: block;
		height: 50px;
		padding: 0 10px;
		background-color: #fff;
		border: 1px solid #ddd;
		border-width: 0px 1px 1px 1px;
		box-sizing: border-box;
		font-size: 15em;
		color: #333;
	}
	.pageMenu ul li:hover a, .pageMenu #leftoff:hover a {
		border-top: 4px solid #0080c6 !important;
		background-color: #f9f9f9 !important;
		color: #000;
	}
	.pageMenu ul li.on a, .pageMenu #lefton a {
		border-top: 4px solid #0080c6 !important;
		box-sizing: border-box;
		color: #111;
		background-color: #fff !important;
		font-weight: 500;
		font-size:15px;
		position: relative;
		line-height: 44px;
	}
	.pageMenu ul li,
	.pageMenu #leftoff,
	.pageMenu #lefton {
	    width: 100%;
	    padding: 0px !important;
	}
	.pageMenu ul li a,
	.pageMenu #leftoff a,
	.pageMenu #lefton a {
	    -webkit-transition: all 0.1s ease-out;
	    transition: all 0.1s ease-out;
	    display: block;
	    height: 50px;
	    line-height: 50px;
	    padding: 0 10px;
	    background-color: #fff;
	    border: 1px solid #ddd;
	    border-width: 0px 1px 1px 1px;
	    box-sizing: border-box;
	    font-size: 15px;
	    color: #333;
	}
	.pageMenu ul li:hover a,
	.pageMenu #leftoff:hover a {
	    background-color: #eee;
	    color: #000;
		 font-size: 14px;
	}
	.pageMenu.wide {
	    max-width: 100% !important;
	    margin: 10px 0 30px;
	    text-align: center;
	    overflow: hidden;
	    border: 0px solid #f00;
	}
	.pageMenu.wide h2 {
	    width: 20%;
	    height: 50px;
	    line-height: 50px;
	    float: left;
	    background: #0080c6;
	    color: #fff;
	}
	.pageMenu.wide ul {
	    width: 80%;
	    border: none;
	}
	.pageMenu.wide ul li,
	.pageMenu.wide #leftoff,
	.pageMenu.wide #lefton {
	    float: left;
	    width: 10.5%;
	}

	.pageMenu.wide ul li a,
	.pageMenu.wide #leftoff a,
	.pageMenu.wide #lefton a {
	    border: 1px solid #0080c6;
		border-right:1px solid #CDCDCD;
	    border-width: 1px 1px 1px 0px;
	    width: 100%;
	    display: inline-block;
	    float: left;
	}
	.pageMenu.wide li:last-child a { 	border-right:1px solid #0080c6;	}
	
	.pageMenu1.wide ul li{ width: 16.666%;}
	.pageMenu1.wide ul li a{padding:0 4px}
	.pageMenu2.wide ul li{ width: 25%;}
	.pageMenu3.wide ul li{ width: 33.3%;}
	.pageMenu4.wide ul li{ width: 20%;	}
	.pageMenu5.wide ul li{ width: 33.333%;}
	.pageMenu6.wide ul li{width: 25%;}
	.pageMenu7.wide ul li{	width: 25%;}
	.pageMenu9.wide ul li{ width: 25%;}
	.pageMenu10.wide ul li{width: 16.666%;	}
	.pageMenu10.wide ul li a{	padding: 0 4px !important	}
	/*서브메뉴 END*/

	/* 서브페이지 컨텐츠부분*/
	.content_body h3 { color:#0080c6; font-size: 22px; display: block; margin-top:30px; margin-bottom: 10px; line-height: 1.3; word-break:keep-all; font-weight: 900;}
	.content_body h4 { color:#000; font-size: 18px; padding-top: 10px; display: block;}
	.content_body h3.strong {font-size: 38px; }

	.content_body  .desc { font-size: 20px; margin: 20px 0 }
	.content_body  small {font-size: 14px}

	.text-right {text-align: right !important}
	.text-left {text-align: left !important}
	.text-center {text-align: center !important}

	/* 서브텍스트라인 */
	.way{padding-left:15px}
	.way li, .way2 li{list-style-type:inherit !important; line-height:1.5;margin-bottom:8px;position:relative}
	.way li:before, .way2 li:before{line-height:1.5; font-weight:500;left:-15px;top:2px;position: absolute; }

	.way2{padding-left:15px; margin:12px;}


	.w-num{list-style-type:decimal !important; padding-left:20px}
	.w-num li:before{content:'' !important;}
	.w-dot{list-style-type:disc !important;}


	.w-circle{padding-left:20px;}
	.w-circle li:before{content:'●'; font-size:10px; line-height:21px; }
	.w-wcircle li:before{content:'○'; font-size:10px; line-height:21px;}
	.w-square li:before{content:'\ea41 ';}
	.w-plus li:before{content:'\e914 ';;}
	.w-line li:before{content:'- '; left:-10px;}
	.w-qa{padding-left:30px;}
	.w-qa li:nth-child(even){padding-left:15px;margin-bottom:35px}
	.w-qa li:before{ left:-20px;}
	.w-qa li:nth-child(odd):before{content:'Q. '; color:#0080c6}
	.w-qa li:nth-child(even):before{content:'A. ';padding-left:15px;  color:#f04d4d}

	/* 탭 */
	.smallcate{border-bottom:2px solid #ddd;}
	.smallcate ul{font-size:0; border:1px solid #ddd;  border-bottom:0; position:relative;}
	.smallcate ul li{
		display:inline-block; 
	    width:25%;
		line-height:50px;
		vertical-align: top; 
		font-size:16px; 
		color:#777;
		border-left: 1px solid #ddd;
		background-color:#f8f8f8; 
		position:relative; 
		top:0;
		text-align:center;
		cursor:pointer;
		transition: top .2s ease-in-out;
	}
	.smallcate ul li:first-child{border-left:0}
	.smallcate ul li.act{background-color:#fff; color:#0080c6;  top:3px;  font-weight:500; border-left:0;}
	.smallcate ul li:hover{background-color:#fff}
	.smallcate ul li.twoline{word-break: keep-all; }

	.subbox{display:none;}
	.subbox.sub0{display:block; }

	
	@media screen and (max-width: 768px) {
		.pageMenu ul li.on a, .pageMenu #lefton a{
			color:#0080c6;
			border:3px solid #0080c6 !important;
			background-color:#d4e7f3 !important;
			line-height:44px 
		}
		.smallcate ul{ width:100% !important;}
		.smallcate ul li{font-size:14px; height:56px; padding:10px 5px; line-height:36px}
		
		.smallcate ul li.act{font-size:15px}
	}
	@media screen and (max-width: 425px) {
		.smallcate ul li.twoline{ line-height:18px; letter-spacing:-1px; padding: 10px 14px;}
	}

	.smallchart{ font-size:0; background-color:#f8f8f8; border:1px solid #ddd; padding:10px; margin-top:10px }
	.smallchart li{display:inline-block; padding: 0 5px; cursor:pointer}
	.smallchart li:not(:first-child):before{content:'|'; padding-right:5px }
	.smallchart li:hover{color:#0080c6}
	.smallchart li:hover:before{color:#111}

	/*강조박스*/

	.emphbox{font-size:20px; font-weight:500; padding:15px; margin-bottom:20px; text-align:center; color:#fff; word-break:keep-all}
	.embox-blue{background-color:#0080c6; border:1px solid #0080c6;}
	.embox-red{background-color:#d9534f; border:1px solid #d9534f;}


	.emphbox b{ font-weight:700 !important; color:#ffdc19} 
	@media screen and (max-width: 768px) {
		.emphbox{font-size:17px}
	}


	.totalbox{text-align:right; font-size:18px; font-weight:500; padding:10px; border:1px solid #ddd;margin:20px 0}
	.totalbox h2{display:inline-block; color:#0080c6; margin: 0 0 0 10px}

/*****************************************************************
서브 : 01 = center 문화센터소개
*****************************************************************/

	.history{}
	.history > ul{}
	.history ul > li{ font-size: 18px; line-height:2; font-weight:500}
	.history ul li ul{padding:0 25px 15px}
	.history ul li ul > li{font-size:16px; font-weight:300}
	.history ul > li:before{content:"\e9c6"; }
	.history ul li ul > li:before{content:"\e9c6" ; font-size:10px}
	.history ul li:before{color:#0080c6; font-weight:800;margin-right:5px;  }


/*****************************************************************
서브 : 02 = info 이용안내
*****************************************************************/

	.libraryimgbox{font-size:0; padding:0}
	.libraryimgbox img{ width:49%; margin: 5px 0 }
	.libraryimgbox img:nth-child(2n-3){margin-right: 2% }

	@media screen and (max-width: 768px) {
		
	}

/*****************************************************************
서브 : 03 = program 생활체육강좌
*****************************************************************/

/******************* 수영 / 헬스 ********************/
	.pro-imagesbox{padding:15px 0; font-size:0;}
	.pro-imagesbox img{width:49%; margin-bottom:20px; margin-right:2%}
	.pro-imagesbox img:nth-child(even){margin-right:0}

	@media screen and (max-width: 768px) {
		.pro-imagesbox img{width:100%; margin-right:0}
	}


/******************* 어린이수영방학특강 ********************/
	.swim-vacation h4{font-size:16px !important; padding:0; margin:0 ; line-height: 1.6}



/******************* 헬스 ********************/
	@media screen and (max-width: 768px) {
		.health01 td{height:100%}
	}

	



/*****************************************************************
서브 : 04 = adult 문화교육강좌
*****************************************************************/
	
	.academy h3{font-size:28px; margin:0 0 15px; font-weight:500}
	.ac-label{font-size:16px}
	.ac-label:after{content:' : '}

	.academy_pop h4{position: relative;  padding: 12px 5px;  border-bottom: 5px solid #0080c6; margin-bottom:0px}
	.academy_pop h4 span{position: absolute;  left: 96px;  bottom: 21px;  font-size: 16px; font-weight:400}
	.academy_pop h4 img{max-width:85px}
	.academy_pop table{border-top:1px solid #999 !important}
	.academy_pop a.btn{width:42%}


	.lectureplan h4{position: relative;  padding: 12px 5px;  border-bottom: 5px solid #0080c6; margin-bottom:0px}
	.lectureplan h4 span{position: absolute;  left: 96px;  bottom: 21px;  font-size: 16px; font-weight:400}
	.lectureplan h4 img{max-width:85px}
	.lectureplan a.btn{width:50%}
	.lectureplan table{width:100% !important;  border-collapse: collapse;}
	.lectureplan table tr td{border:1px solid #ddd}
	.lectureplan table tr td > p{margin-bottom:0; font-size:0}
	.lectureplan table tr td > p span{font-size: 20px; line-height:1; margin-bottom:15px; display:inline-block}
	.lectureplan table tr td > p span br{display:none}
	.lectureplan table tr td > p span:empty{display:none}

	.lectureplan table table th,
	.lectureplan table table td{padding:5px; height:35px; width:auto}
	.lectureplan table table p,
	.lectureplan table table span{margin:0 !important; font-size:13px !important; line-height:1.5 !important}

	.ACfacilities,
	.ACfacilities td{border:0 !important;} 
	.ACfacilities p{font-size:18px; padding:3px 0; background-color:#ddd}

	.newicon{display:inline-block; color:#ec0000}
	
	@media screen and (max-width: 768px) {
	
		.academy li{font-size:13px}
		.ac-label{display:block}
		.ac-label:after{content:''}

		.ACfacilities td{display:block;} 
		
	}

	
/*****************************************************************
서브 : 05 = newSukang 온라인수강신청
*****************************************************************/
	
	.newsukang .depthhalf{font-size:0}
	.newsukang .depthhalf li{display:inline-block; width:49%; margin-right:2%;}
	.newsukang .depthhalf li:nth-child(even){margin-right:0}
	.newsukang .depth {
		position: relative;
		padding: 15px 20px 0;
		border: 1px solid #ddd;
		border-top: 2px solid #aaa;
		background-color:#f9f9f9;
		height: 246px;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
	.newsukang .depth .btn {
		display: block;
		text-align: left;
		border-radius:5px;
		margin-bottom: 10px;
		line-height: 35px;
		color:#fff;
	}
	.newsukang .depth .btn:before{
		content:'\e92c'; 
		color: #fff; 
		font-size:30px; 
		vertical-align: middle; 
		margin-right:10px;
		opacity: 0.5;
		-webkit-transition: opacity 0.2s ease-out;
		-moz-transition: opacity 0.2s ease-out;
		-o-transition: opacity 0.2s ease-out;
		transition: opacity 0.2s ease-out;
	}
	.newsukang .depth .btn:after{
		content:'\e93f';
		color: #fff;
		position: absolute;
		font-size:20px;
		top: 50%;
		right: 10px;
		line-height:1;
		margin-top:-10px;
	}
	.newsukang .depth .btn.active:before{opacity: 1;	}

	.newsukang .depth .step-1{background-color:#36a8e6; border-color:#218dc8}
	.newsukang .depth .step-2{background-color:#0080c6; border-color:#0069a2}
	.newsukang .depth .step-3{background-color:#1ab148; border-color:#0d8e34}

	.newsukang .depth .step-1.active{background-color:#ff953a; border-color:#ff7d26}
	.newsukang .depth .step-2.active{background-color:#ff7d26; border-color:#ee5f00}
	.newsukang .depth .step-3.active{background-color:#ea594a; border-color:#ca3424}
	
	.newsukang .label-primary {	background: #0080c6;}
	.newsukang .label {	padding: 5px 10px;}

	@media screen and (max-width: 768px) {
		.newsukang{padding:0 10px;}
		.newsukang .depthhalf li{display:block; width:100%; margin-right:0}

		.newsukang .depth .step-3{
			line-height: 1.3;
			padding: 6px 15px 6px 15px;
			word-break: keep-all;
			white-space: normal;
		}
		.newsukang .depth .step-3:before{display:block; text-align:center; font-size:20px}
		.newsukang .depth .step-3:after{content:'';}




	}

	  

/*****************************************************************
서브 : 08 =  공지사항
*****************************************************************/
	
/*검색*/
.bbs_search_outer {
	position: relative;
	text-align: center
}
.bbs_search_box {
display:inline-block;
}
.bbs_search_box .bbs_search_select {
	width: 105px;
	margin-right: 3px;
	float: left;
}
.bbs_search_box .bbs_search {
	width: 250px;
	float: left
}
.text-overflow {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


/* table*/
.table_bbs {table-layout:fixed}
.table_bbs tr.notice { background:#edf9ff } 
.table_bbs .bbs_title a{font-weight: 500;color:#333}
.table_bbs .bbs_title a:link,.table_bbs .bbs_title a:visited{color:#333}
.table_bbs .bbs_title a:hover,.table_bbs .bbs_title a:active{color:#67B0D6}
.bbs_no,.bbs_writer { text-align: center;width: 80px}
.bbs_date { text-align: center;width: 100px}
.bbs_title .label {;padding:0.1em 0.6em 0.2em 0.6em}
.bbs_btn{padding:20px 0; text-align:right}

/*view*/
.bbs_view {border-bottom: 1px solid #ccc !important; margin-bottom: 0}
.bbs_content {min-height:300px; padding:15px; border-bottom:1px solid #ccc; margin-bottom:15px ;background-color:#f9f9f9}
.bbs_content img{width:100%; max-width:max-content}
@media screen and (max-width: 768px) {

	.bbs_content img{width:100% !important}

	.bbs_view.td_block {border-bottom: 1px solid #ccc !important; background-color:#f8f8f8}
	.bbs_view.td_block tr{border-bottom:0  solid #ddd !important}
	.bbs_view.td_block td{}
	.bbs_view.td_block tr:nth-child(2) td:nth-child(1){border:1px solid #ddd !important;border-radius:5px;width: 20%; max-width:60px;position:absolute;padding: 3px !important;text-align:center;left:8px;top:10px;line-height: 27px !important;background-color:#fff;z-index:10;}
	.bbs_view.td_block tr:nth-child(2) td:nth-child(2){width:100%;padding-top: 45px !important;background-color:#f0f0f0;font-weight:500;/* font-size:16px; */word-break:keep-all;height: auto;}
	.bbs_view.td_block tr:nth-child(2) td:nth-child(3):before{content:'작성자 : '; }
	.bbs_view.td_block tr:nth-child(2) td:nth-child(4):before{content:'등록일 : '; }

/*
.bbs_view.td_block {border-bottom: 1px solid #ccc !important; background-color:#f8f8f8}
.bbs_view.td_block tr{border-bottom:0  solid #ddd !important}
.bbs_view.td_block td{}
.bbs_view.td_block tr:nth-child(2) td:nth-child(1){border:1px solid #ddd !important; border-radius:5px; width:15%; position:absolute; padding:3px; text-align:center;  left:8px; top:10px; background-color:#fff; z-index:10}
.bbs_view.td_block tr:nth-child(2) td:nth-child(2){width:100%; padding-top:45px; background-color:#f0f0f0; font-weight:500; font-size:16px; word-break:keep-all}
.bbs_view.td_block tr:nth-child(2) td:nth-child(3):before{content:'작성자 : '; }
.bbs_view.td_block tr:nth-child(2) td:nth-child(3){display:inline}
.bbs_view.td_block tr:nth-child(2) td:nth-child(4){width:65%; display:inline-block}
.bbs_view.td_block tr:nth-child(2) td:nth-child(4):before{content:'등록일 : '; }
.bbs_view.td_block tr:nth-child(3){border-top:1px solid #ddd !important}
.bbs_view.td_block tr:nth-child(3) td:first-child{display:none}
.bbs_view.td_block tr:nth-child(3) td:before{content:'첨부파일 : '; display:block}
*/
}


/*?*/
.gallery_body .program_box { border: 1px solid #ccc ; cursor: default; height: 330px;}
.gallery_box .bg { overflow: hidden; background: #ccc}
.gallery_box .text_box h5 { font-size: 14px;	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;padding-bottom: 4px; }
.gallery_box:hover:before  { display: none ;}
.gallery_box .bg img{ min-width: 100%; max-height: 230px; position: absolute;top:0;}


/*****************************************************************
서브 : 09 =  대관신청
*****************************************************************/
 .daegwanlist b{display:block; text-align:right; width:100%}




/*****************************************************************/
.hand {cursor:pointer}





h5 > .label {    padding: 0.3em 0.6em 0.2em 0.6em;}

.tag_box { display:block; margin: -5px ;margin-bottom:15px;}
.tag_box .tag {display: block; float:left; padding:3px 16px 5px; background: #67B0D1;  border-radius: 20px ;margin:5px; }
.tag_box .tag a{color:rgba(255,255,255,.8)}
.tag_box .active {background: #0080c6; }
.tag_box .active a{color:#fff}

.accordion {border-top: 2px solid #000; border-bottom: 1px solid #999; line-height: 1.6em}
.accordion .label {text-align: center; display: inline-block; border-radius: 15px;}
.content_accordion { border-bottom: 1px solid #ddd}
.accordion_title {     position: relative; cursor: pointer;
    padding: 8px 30px 8px 8px;}
.accordion .accordion_body {
	padding:8px 8px 8px 30px;
    display: none;
    background-color: #f9f9f9;
    border-top: 1px solid #eee;
    font-size: 14px;
    color: #494949;}
.icon_accordion { position: absolute;right: 8px;top:6px}
.icon_position { position: relative; padding-left:30px }
.icon_position span.label { display: block; position: absolute;left: 0px ;top: 4px}

.bg-danger { padding: 10px 15px}
ul.dot li {   list-style: disc;
    margin: 5px 0 5px -20px;
    color: #F6641D;
    line-height: 1.4em; }
ul.dot li span{ color: #494949}


@media screen and (max-width: 768px) {
	/*모바일*/
	h1, h2, h3, h4, h5, h6 {
		margin: 0 0 20px;
	}
	.content_body div.body {   
		font-size: 14px;
		color: #424242;
		line-height: 22px;
		padding: 10px 0px 15px 0px ;
	}

	.content_body div img{   
		   max-width: 100%;
	}
	#sub{position:relative}
	.sub_cover_box {height: 100px;}
	.sub_menu_box{padding:0}
	.pageMenu.wide{ margin-top:0}
	.pageMenu.wide h2{
		background-color: rgba(0, 128, 198, 0.75);
		width: 100%;
		position: absolute;
		cursor: pointer;
		height: 100px;
		top: 0;
		left: 0;
		font-size: 25px;
		line-height: 100px;
	}
	.pageMenu.wide h2:after{content:'\e942'; position:absolute; right:15px; top:3px}
	.pageMenu.wide h2.fold:after{content:'\e945'}
	.pageMenu.wide ul{width:100%; padding: 10px; background-color: #f4f4f4; border-bottom: 1px solid #ddd;}
	.pageMenu.wide ul li{width:100% !important; margin-bottom:5px}
	.pageMenu.wide ul li a{border-right:1px solid #0080c6; border-width: 1px 1px 1px 1px;}

	.title_box {text-align: left;	margin-top: 30px;}		
	.title_box h2 { font-size: 24px;   padding-top: 20px; margin-bottom: 20px}

	.content_body h4 { font-size: 17px; padding-top: 20px; display: block;}
	.content_body h3.strong {font-size: 20px; padding-top: 20px}
	.content_body .desc { font-size: 16px}
	
	#header {height: 60px;}
	
	.bbs_search_box .bbs_search {width:175px}
}

@media screen and (min-width: 767px) {
	.de01 .carousel-caption {
		padding: 0 100px;
	}
}
@media screen and (min-width: 1500px) {
	.de01 .carousel-caption {
		padding: 0 15px;
	}
}

@media screen and (min-width: 600px) and (max-width:768px) {
	#program .col-xs-12{ width: 50%}
}


.smalltable{width:100%; border:1px solid #ddd}
.smalltable th, .smalltable td{padding:5px 10px; border-bottom:1px solid #ddd; text-align:center; border-right:1px solid #ddd}
.smalltable th{background-color:#f8f8f8}

/*****************************************************************
기타 > 스크롤 탑 (우측하단)
*****************************************************************/

.scrollToTop {
				-webkit-transition: all 0.1s ease-out;
				transition: all 0.1s ease-out;
				text-align: center;
				position: fixed;
				z-index: 100;
				bottom: 20px;
				right: 20px;
				display: none;
				background-color: #111;
				border-radius: 2px;
				z-index: 299
}
.scrollToTop:hover {
				bottom: 25px;
}
.scrollToTop a {
				-webkit-transition: all 0.1s ease-out;
				transition: all 0.1s ease-out;
				display: block;
				width: 40px;
				height: 40px;
				font-size: 1.0em;
				padding-top: 7px;
				color: #aaa;
}
.scrollToTop a:hover {
				color: #fff;
}

/*****************************************************************
기타 > 페이징
******************************************************************/

.img_click {cursor:pointer}

.pagingbox{text-align:center; margin:15px 0 15px 0;}
.paging { display:inline-block; border-right:1px solid #ddd}

.paging span{
	position:relative;
	display:inline-block;
	width:28px;
	height:27px;
	line-height:27px;
	border:1px solid #ddd;
	border-right:0px;
	background-color:#fff;
	font-size:12px;
	color:#000;
	text-align:center;
	z-index:1; 
	font-weight:500;
	cursor: pointer
}

.current:hover,
.next:hover,
.next_hand:hover{
	color:#fff;
	background-color:#0080c6;
	border:1px solid #0080c6; 
	font-weight:400;
}
span.current_nowpage{
	border:1px solid #0080c6;
	background-color:#0080c6;
	color:#fff;
}

.next i,.next_hand i{font-size:10px; font-weight:700 !important}
.next i{letter-spacing:-3px }

/******************************************************************/

.error{background-color:#f8f8f8; overflow:hidden}
.error .errorbox{width:40%; margin:0 auto; text-align: center; padding-top:150px}
.error .errorbox .errorcontent{margin-top:30px; border:1px solid #ddd; background-color:#fff; padding:30px; border-radius: 15px; box-shadow: 0 5px 7px rgba(0,0,0,0.1)}
.error h1{font-weight:800}
.error h1,
.error h2,
.error p{margin-bottom:10px;}
.error .btn{margin-top:20px; background-color:#aaa; border:1px soild #aaa; width: 50%; color:#fff}


.bigpayingB{background-color:#0080c6; width: 60%; line-height:80px; color:#fff; font-size: 35px;}
.bigpayingB:hover{background-color:#006095; color:#fff}


.introtb{}
.in768{margin-left:15px}
@media (max-width: 768px){

	.introtb tr, .introtb td{display:block; width:100%; text-align:left}

	.in768{display:block; margin-left:0; line-height:1.5}
}

.greeting-box{background-color:#f4f8fb; border-radius:10px; padding:35px 40px; margin-top:10px}
.greeting-box p{line-height:2; margin-bottom:20px}
.greeting-box p:last-of-type{margin-bottom:25px}
@media screen and (max-width:768px){
	.greeting-box{padding:20px 20px}
	.greeting-box p{line-height:1.8}
}

.content_body h3.intro-title{font-weight:400}



/* 20211213추가 */

  .list_new {border: 1px solid #ccc; border-collapse: collapse; margin: 0; padding: 0; width: 100%;
           table-layout: fixed;background-clip:padding-box;}
  .list_new tr {background-color: #ffffff; border: 1px solid #ddd; /* padding: .35em; */}
  .list_new th,
  .list_new td {padding: .625em; text-align: center;}
  .list_new th {text-transform: uppercase; background-color: #f5f5f5; border-top: 2px solid #000; border-bottom: 1px solid #ddd; height:50px;}

@media screen and (max-width: 768px) {
  .list_new { border: 0;}
  .list_new thead { border: none;clip: rect(0 0 0 0); height: 1px; margin: -1px;overflow: hidden;padding: 0;position: absolute; width: 1px;}
  .list_new tr {border-bottom: 1px solid #ddd; display: block; margin-bottom: .625em; } 
  .list_new td {
    background-clip:padding-box; background-size: contain;
    background: url(../images/bgbg.jpg) no-repeat 0px 0px; word-break:break-all; border-bottom: 1px solid #ddd; display: block;text-align: left;}
   .list_new td:nth-child(2){ display: block; word-break:break-all; text-align: right;  padding-right:10px; }

  .list_new td::before {
    content: attr(data-label); float: left; display: block; width: 20%; text-align: left; line-height:  20px; padding-right: 10px; 
	font-weight: 500; text-transform: uppercase;}
  .list_new td::after {content: "";  background: url(../images/bgbg.jpg) no-repeat 0px 0px;   display: block;}
  .list_new td:last-child {border-bottom: 0;}
}


/* 20211213추가 */
  .list_new2 {border: 1px solid #ccc; border-collapse: collapse; margin: 0; padding: 0; width: 100%; table-layout: fixed; background-clip:padding-box;}
  .list_new2 tr {background-color: #ffffff; border: 1px solid #ddd;/*   padding: .35em; */}
  .list_new2 th,
  .list_new2 td {padding: .625em; text-align: center;}
  .list_new2 th {text-transform: uppercase; background-color: #f5f5f5; border-top: 2px solid #000; border-bottom: 1px solid #ddd; height:50px;}

@media screen and (max-width: 768px) {
  .list_new2 {border: 0;}
  .list_new2 thead {position: absolute; width: 1px; border: none; clip: rect(0 0 0 0);margin: -1px; overflow: hidden; padding: 0;}
  .list_new2 tr {display: block; border-bottom: 1px solid #ddd; margin-bottom: .625em;}
  .list_new2 td {
    background-clip:padding-box; background-size: contain; background: url(../images/bgbg.jpg) no-repeat 0px 0px;   word-break:break-all;
    border-bottom: 1px solid #ddd; display: block; text-align: left;}
  .list_new2 td::before {
    content: attr(data-label);  float: left;  display: block; width: 23%;  text-align: left;
    line-height:  20px; padding-right: 10px; font-weight: 500; text-transform: uppercase; font-weight:500;}
  .list_new2 td::after {content: ""; background: url(../images/bgbg.jpg) no-repeat 0px 0px;  display: block;}
  .list_new2 td:last-child {border-bottom: 0;}
  .list_new2 td:first-child {border-top: 2px solid #555;}
  }


/* 20211213추가 */
	.pro-imagesbox2{padding:0px 0; font-size:0;}
	.pro-imagesbox2 img{width:65%; margin-bottom:20px; margin-right:2%}
	.pro-imagesbox2 img:nth-child(even){margin-right:0}

	@media screen and (max-width: 768px) {
		.pro-imagesbox2 img{width:100%; margin-right:0}
	}


/* 20221021 추가 */
 .padbox{margin:5px; padding:10px;}
 .uesbox {margin: 5px; padding: 16px; display: flex; flex-direction: row;}
 .uesbox p{padding:12px 20px; border:1px solid #ccc;  background-color: #f5f5f5;}
 .uesbox span{height: 50px;line-height: 40px; padding: 0 10px;}
 .uesbox span:after{content:"▶"}

    @media screen and (max-width: 768px){
	 .uesbox { padding: 16px; display: flex; flex-direction: column; text-align: center;}
	 .uesbox span{height: 30px;line-height: 20px; }
	 .uesbox span:after{content:"▼"}
	}

/* 가로스크롤 왼쪽고정 */
.table-scroll {
	position:relative;
	max-width:100%;
	margin:auto;
	overflow:hidden;
	font-size:0.95em;
}
.table-wrap {
	width:100%;
	overflow:auto;
}
.table-scroll table {
	width:100%;
	margin:auto;
	border-collapse: collapse;
	border-spacing:0;

}
.table-scroll th{text-align:center;}
.table-scroll th, .table-scroll td {
	padding:10px 10px;
	border:1px solid #ddd;
	background:#fff;
	white-space:nowrap;
	vertical-align:middle;

}
.table-scroll th{
	background:#f9f9f9;
}

.table-scroll thead th{
	border-top:2px solid #000;
}
.table-scroll thead, .table-scroll tfoot {
	background:#f9f9f9;
}
.clone {
	position:absolute;
	top:0;
	left:0;
	pointer-events:none;
}
.clone th, .clone td {
	visibility:hidden
}
.clone td, .clone th {
	border-color:transparent
}
.clone tbody th {
	visibility:visible;

}
.clone .fixed-side {
	border:1px solid #ddd;
	background:#f9f9f9;
	visibility:visible;
}
.clone thead, .clone tfoot{background:transparent;}

/* 2300201 */
.sw_t01{
    font-size: 15px;
    color: #014dd8;
    margin-bottom: 10px;
    font-weight: bold;
	padding-left:10px;
}
.sw_t02{
    font-size: 15px;
    color: #d80101;
    margin-bottom: 10px;
    font-weight: bold;
	padding-left:10px;
}
.sw_sp01{font-size: 15px; color: #014dd8;}
.sw_sp02{font-size: 15px; color: #d60101;}

.sw_td01{background-color: #dcecff;}
.sw_td02{background-color: #ffdcdc;}
.sw_td03{background-color: #fcf5cd;}
.sw_td04{background-color: #e1fccd;}

.payback_bt{
    background-color: #0080c6;
    border-color: #006095;
	font-size:15px;
	padding:10px 30px;
	color:#fff;
    border-radius: 5px;
}

.payback_bt2{
    background-color: #4e5b62;
    border-color: #39474e;
	font-size:15px;
	padding:10px 30px;
	color:#fff;
    border-radius: 5px;
}
.payback_bt:hover{color:#fff !important;background-color: #045988;}

.bxs-top{
	padding: 10px 30px 12px 30px;
    width: 100%;
    background:#7d89a2e0;
    color: #fff;
    text-align: left;
    display: flex;
    border-radius: 8px 8px 0 0;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
	align-items: center;
}

.bxs-left li{display:inline-block; color:#fff;}


.bxs-left li:nth-child(1){position: relative; top: 2px;} 
.bxs-left li:nth-child(2){font-size:26px; font-weight:800; padding-left:5px; }
.bxs-right li{display:block; color:#fff; text-align:right; letter-spacing: .5px;}

.bxs-lv1{color:#004cf5;}/*좋음*/
.bxs-lv2{color:#69ff0f;}/*보통*/
.bxs-lv3{color:#fdff00;}/*나쁨*/
.bxs-lv4{color:red;}/*매우나쁨*/

/* 타임 */
.time_a{
    width:97%;
	margin:0 auto;
	background-color:#fff; 
	padding:10px; 
	/* border-radius: 4px;  */
	 border: 1px solid #cccfdb;  
	font-weight:bold;
	font-size:22px;
	text-align:center;
	font-family:'NanumGothic'!important;
	border-bottom:5px solid #4AA71B;
	}

.time_a p{color:#fd6720; padding:10px; margin:0;}



/* 작은도서관 유의사항 */
	/* 메인 컨테이너 */
        .container_n {
   /*          max-width: 800px;
            margin: 40px auto;
            background: #ffffff;
            padding: 40px;
            border-radius: 12px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05); */
        }

        /* 헤더 섹션 */
        .header_n {
	      text-align: center;
		  border-top: 1px solid #cbcbcb;
		  border-bottom: 1px solid #cbcbcb;
		  padding-bottom: 25px;
		  margin-bottom: 35px;
		  margin-top: 20px;
        }
        .header_n h1 {
            margin-top: 30px;
			color: #1e3a8a;
			font-size: 22px;
			font-weight: 700;
			margin-bottom: 12px;
        }
        .header_n p {
            color: #4b5563;
            font-size: 16px;
            word-break: keep-all;
        }

        /* 이용수칙 섹션 공통 */
        .section_n {
            margin-bottom: 35px;
        }
        .section_n h2 {
		    font-size: 18px;
			color: #0080c6;
			/* border-left: 4px solid #0080c6; */
			padding-left: 12px;
			margin-bottom: 18px;
			/* font-weight: bold; */
			font-weight: 600;
		}

        /* 리스트 스타일 */
        .list_n {
            list-style: none;
        }
        .list_n li {
            position: relative;
            padding-left: 20px;
            margin-bottom: 12px;
            font-size: 15px;
        }
        .list_n li::before {
            content: "•";
            color: #3b82f6; /* 라이트 블루 */
            font-weight: bold;
            position: absolute;
            left: 0;
            top: 0;
        }
        .list_n strong {
            color: #1e293b;
            display: inline-block;
            margin-right: 4px;
        }

        /* 하단 푸터/안내 문구 */
        .footer_n {
            background-color: #eff6ff; /* 아주 연한 블루 */
            border-top: 3px solid #3b82f6;
            padding: 25px;
            /* border-radius: 8px; */
            text-align: center;
            margin-top: 40px;
        }
        .footer_n .highlight_n {
            color: #1d4ed8;
            font-weight: 500;
            font-size: 16px;
            margin-bottom: 8px;
        }
        .footer_n .info_n {
            color: #64748b;
            font-size: 14px;
        }

        /* 반응형 미디어 쿼리 (모바일 대응) */
        @media (max-width: 768px) {

            .container_n {margin: 10px auto;}
			.header_n{text-align: left;}
            .header_n h1 {font-size: 18px;}
            .header_n p {font-size: 14px;}
            .section_n h2 {font-size: 18px;}
            .list_n li {font-size: 14px;margin-bottom: 10px;}
            .footer_n {padding: 20px;}
            .footer_n .highlight_n {font-size: 14px;}
            .footer_n .info_n {font-size: 13px;}
        }