/* ------------------------------------------------------------------ */
/* Common Styles
main : 0065ff     blue - company color
point : 71c4c7    sapphire
point : ff512e    orange
point : 4b709a   blue
point : 384a70   blue
'notokr', 'NotoSansKR', sans-serif, 'Gothic A1', 'FontAwesome', "Font Awesome 5 Free"

@media screen and (max-width: 768px) {
}
@media screen and (max-width: 640px) {
}
@media screen and (max-width: 480px) {
}
*/
/* ------------------------------------------------------------------ */
article {margin-bottom: 80px;}
article:last-child {margin-bottom: 0;}

hr {
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

/*---------------------------------------------------------
3. List
--------------------------------------------------------- */
ul, ol { margin-bottom: 0; margin-top: 0; }
ul { list-style: none outside; }
ol { list-style: decimal; }
ol, ul.square, ul.circle, ul.disc { margin-left: 30px; }
ul.square { list-style: square outside; }
ul.circle { list-style: circle outside; }
ul.disc { list-style: disc outside; }
ul ul, ul ol, ol ol, ol ul { margin: 0x; }
ul ul li, ul ol li, ol ol li, ol ul li { margin-bottom: 0; }
li { line-height: 18px; }
ul.large li { }
li p { }

/*---------------------------------------------------------
4. Images
--------------------------------------------------------- */
img { max-width: 100%; height: auto; vertical-align: top;}
img.pull-right { margin: 12px 0px 0px 18px; }
img.pull-left { margin: 12px 18px 0px 0px; }
i {font-style: normal;}
.cont-img {width: 100%;  margin:0 0 30px 0px;}
.cont-img img {width: 100% ; margin:0;}
.cont-ov-img {width: 100%;  margin:0 0 30px -30px;}
.cont-ov-img img {width: 100% ; margin:0;}

/*---------------------------------------------------------
5. page
--------------------------------------------------------- */
.page section { padding-top: 0px; padding-bottom: 12px; }
.content-img {width: 100%; margin-bottom: 30px;}
.page h1, .title-heading { line-height: 1.2; font-weight: 300; letter-spacing: -0.02em}
.page h1:after {background:#444; content:""; display:block; height:3px;width:70px;margin:20px 0 40px 0;}
.page h1 span {color: #1b2020; font-weight: 500;}
.page h2 {font-weight: 500;}
.page h3 {font-weight: 200;}
.page h3 span {font-weight: 600;}

.title-heading {font-size: 36px; line-height: 1.2; font-weight: 400; letter-spacing: -0.02em; margin-bottom: 30px;}
.title-heading span {font-weight: 700;color: #384a70;}

@media screen and (max-width:1024px) {
  .content-img {width: 100%;}
  .content-img img {width: 100%;}
}

@media screen and (max-width: 768px) {
  .page h1,  .title-heading { font-size: 32px; line-height: 42px;font-family: inherit; text-align: center;}
  .page h1:after {margin:10px auto 40px;}
  .page h1, .page p.lead { text-align: center; }
}


/* ------------------------------------------------------------------ */
/* About Styles
/* ------------------------------------------------------------------ */

.cont_about {font-weight: 100;}

.txt-point {font-size: 28px; text-align: center; }
.txt-point span {font-size: 36px;}
span.l-font1 {font-family: 'Gothic A1', sans-serif; font-size: 48px; text-align: center; color: #1b2020;}
span.l-font2 {font-family: 'Gothic A1', sans-serif; font-size: 36px; text-align: center; color: #6a6d87;}

@media screen and (max-width: 640px) {
  .txt-point {font-size: 24px;}
  .txt-point span {font-size: 28px;}
  span.l-font1 {font-size: 32px;}
  span.l-font2 {font-size: 28px;}

}

/* ------------------------------------------------------------------ */
/* Location Styles
/* ------------------------------------------------------------------ */
/* Location */
 h4.add {display:block; margin:20px 0 10px 5px; font-weight: 400; }
 .add_table {width:100%; border-top:2px solid #444; border-bottom: 1px solid #ccc; }
 .add_table td {padding: 8px 10px;border-bottom: 1px solid #e5e5e5}
 .add_table td.sub{font-weight:400; color: #222; background-color:#f5f5f5;}
 .map {display:block; margin-top: 20px; border: 0px solid #e5e5e5 }
 /* 카카오 맵 */
 .root_daum_roughmap {width: 100% !important; padding: 0 !important; border: none !important}
 .root_daum_roughmap .wrap_map {}
 .root_daum_roughmap .wrap_controllers {}

/* ------------------------------------------------------------------ */
/* Team Styles
/* ------------------------------------------------------------------ */

#team-wrapper { }
#team-wrapper .member { margin-bottom: 20px; margin-top: 10px; }
#team-wrapper img { margin-bottom: 12px; border-radius: 50%}
#team-wrapper h5 { font: 16px/24px "notokr", sans-serif; }
#team-wrapper span { position: relative; top: -6px; font-size: 13px; line-height: 18px; color: #ccc; }
#team-wrapper .member-social { font-size: 20px; font-weight: normal; line-height: 18px; color: #ccc; margin: -12px 0 0 0; padding: 0; }
#team-wrapper .member-social li { display: inline-block; margin-right: 15px; }
#team-wrapper .member-social li a { color: #ccc; }
#team-wrapper .member-social li a:hover { color: #f2da00; }


/* ------------------------------------------------------------------ */
/* History 1 Styles
/* ------------------------------------------------------------------ */
.history-wrap > ul { width:100%; padding:0 50px 0 180px; box-sizing: border-box; list-style: none;}
.history-wrap > ul > li { position:relative; padding: 23px 0 70px 45px; border-left: 1px solid #d9d9d9;}
.history-wrap > ul > li:last-child { padding-bottom: 0;}
.history-wrap .history-inner dt {
  position:absolute;
  left: -166px;
  top: 0;
  width: 170px;
  height: 70px;
  line-height: 70px;
  padding-right: 50px;
  text-align: right;
  box-sizing: border-box;
  background: #fff;
  font-family: 'Gothic A1', sans-serif;
  font-size: 36px;
  font-weight: 800;
  color: #111;
}
.history-wrap .history-inner dt:after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-top: -4px;
  border-radius: 4px;
  background: #444;
}

.history-wrap .month-wrap > ul { list-style: none; float: left}
.history-wrap .month-wrap > li { position: relative; padding-left: 60px; margin-top: 30px; font-size: 18px;}
.history-wrap .month-wrap > li:first-child { margin-top:0;}
.history-wrap .month-wrap > li > span.month {
  position: absolute;
  left: 0;
  top: 0;
  display: inline-block;
  width: 60px;
  font-weight: bold;
  color: #666;
}
.history-wrap .month-wrap > li li { width: 100%; margin-top: 20px; font-family: 'NotoSansKR', sans-serif; font-size: 14px;}
.history-wrap .month-wrap > li li:first-child { margin-top: 0;}
.history-wrap .imgArea {padding-top: 5px;}
.history-wrap .imgArea .poster {margin-bottom: 5px;}
.history-wrap .imgArea .poster img {max-width: 100%;}
.history-wrap .imgArea p strong {display: block; font-weight: normal; font-size: 24px; color: #000;}

@media all and (max-width:1024px) {
	.history-wrap > ul {padding: 0 10px 0 150px;}
}

@media all and (max-width:768px) {
	.history-wrap > ul {padding: 0 15px;}
	.history-wrap > ul > li {padding: 0 0 50px 30px;}
	.history-wrap .history-inner dt {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    height: 34px;
    margin-left: -34px;
    line-height: 34px;
    margin-bottom: 15px;
    padding: 0 0 0 35px;
    text-align: left;
    font-size: 30px;
  }
	.history-wrap .history-inner dt:after {right:auto; left:0;}
	.history-wrap .month-wrap > li {padding-left:0;}
	.history-wrap .month-wrap > li > span.month {
    position: static;
    left: auto;
    top: auto;
    display: block;
    width: auto;
    margin-bottom: 10px;
    font-size: 14px;
  }
	.history-wrap .month-wrap > li li { margin-top: 10px; font-size: 13px !important;}
	.history-wrap > ul > li:last-child { border-left: 0;}
	.history-wrap .imgArea p strong { font-size: 16px;}
}

/* ------------------------------------------------------------------ */
/* History 2 Styles
/* ------------------------------------------------------------------ */
/*-- GENERAL STYLES ------------------------------*/
.timeline { line-height: 1.4em; list-style: none; margin: 0; padding: 0; width: 100%; }
.timeline h1, .timeline h2, .timeline h3, .timeline h4, .timeline h5, .timeline h6 { line-height: inherit; }

/*----- TIMELINE ITEM -----*/
.timeline-item { padding-left: 40px; position: relative; }
.timeline-item:last-child { padding-bottom: 0; }
li.timeline-item {margin:0;}

/*----- TIMELINE INFO -----*/
.timeline-info { margin: 0 0 .5em 0; padding-top:2px; font-family: 'Gothic A1', sans-serif; font-size: 18px; font-weight: 800; line-height: 1.3; letter-spacing: 3px; text-transform: uppercase; white-space: nowrap; }

/*----- TIMELINE MARKER -----*/
.timeline-marker { position: absolute; top: 0; bottom: 0; left: 0; width: 15px; }
.timeline-marker:before { background: #71c4c7; border: 3px solid transparent; border-radius: 100%; content: ""; display: block; width: 15px; height: 15px; position: absolute; top: 4px; left: 0; transition: background 0.3s ease-in-out, border 0.3s ease-in-out; }
.timeline-marker::after { content: ""; width: 3px; background: #CCD5DB; display: block; position: absolute; top: 24px; bottom: 0; left: 6px; }
.timeline-item:last-child .timeline-marker:after { content: none; }
.timeline-item:not(.period):hover .timeline-marker:before { background: transparent; border: 3px solid #71c4c7; }

/*----- TIMELINE CONTENT -----*/
.timeline-content { padding-bottom: 20px; }
.timeline-content h3 {margin-bottom:10px;}
.timeline-content p {margin-top: -4px;padding-top:0; line-height: 1.8;font-size: 14px;letter-spacing: -0.03em;}
.timeline-content p span {display: inline-block; padding-right:10px; font-size: 16px; font-weight: bold; letter-spacing: 0; margin: 0 0 0 0; text-transform: uppercase; white-space: nowrap;}
.timeline-content p:last-child { margin-bottom: 0; }

/*----- TIMELINE PERIOD -----*/
.period { padding: 0; }
.period .timeline-info { display: none; }
.period .timeline-marker:before { background: transparent; content: ""; width: 15px; height: auto; border: none; border-radius: 0; top: 0; bottom: 30px; position: absolute; border-top: 3px solid #CCD5DB; border-bottom: 3px solid #CCD5DB; }
.period .timeline-marker:after { content: ""; height: 32px; top: auto; }
.period .timeline-content { padding: 40px 0 70px; }
.period .timeline-title { margin: 0; font-weight: 900; color: #ccc; text-align: left}
.period .timeline-title:after {display: none;}

/*--    MOD: MARKER OUTLINE
----------------------------------------------*/
.marker-outline .timeline-marker:before { background: transparent; border-color: #66b395; }
.marker-outline .timeline-item:hover .timeline-marker:before { background: #71c4c7; }

@media (min-width: 768px) {
  /* ------------------------------------------------------------------ */
  /* History Styles
  /* ------------------------------------------------------------------ */
  .timeline-2,
  .timeline-2 .timeline-item,
  .timeline-2 .timeline-info,
  .timeline-2 .timeline-marker,
  .timeline-2 .timeline-content { display: block; margin: 0; padding: 0; }
  .timeline-2 .timeline-item { padding-bottom: 40px; overflow: hidden; }
  .timeline-2 .timeline-marker { position: absolute; left: 80px; margin-left: -7.5px; }
  .timeline-2 .timeline-info{float: left; width:80px; padding-top:2px; padding-right: 20px; text-align:right;}
  .timeline-2 .timeline-content { float: left; width: auto; padding-left: 30px; text-align:left;}
  .timeline-2 > .timeline-item.period .timeline-content { float: none; padding: 0; width: 100%; text-align: left; }
  .timeline-2 .timeline-item.period { padding: 30px 0 60px; }
  .timeline-2 .period .timeline-marker:after { height: 30px; bottom: 0; top: auto; }
  .timeline-2 .period .timeline-title { left: auto;  }

	.timeline-centered,
	.timeline-centered .timeline-item,
	.timeline-centered .timeline-info,
	.timeline-centered .timeline-marker,
	.timeline-centered .timeline-content { display: block; margin: 0; padding: 0; }
	.timeline-centered .timeline-item { padding-bottom: 40px; overflow: hidden; }
	.timeline-centered .timeline-marker { position: absolute; left: 50%; margin-left: -7.5px; }
	.timeline-centered .timeline-info,
	.timeline-centered .timeline-content { width: 50%; }
  .timeline-centered .timeline-info {padding-top: 3px;}
	.timeline-centered > .timeline-item:nth-child(odd) .timeline-info { float: left; text-align: right; padding-right: 30px; }
	.timeline-centered > .timeline-item:nth-child(odd) .timeline-content { float: right; text-align: left; padding-left: 30px; }
	.timeline-centered > .timeline-item:nth-child(even) .timeline-info { float: right; text-align: left; padding-left: 30px; }
	.timeline-centered > .timeline-item:nth-child(even) .timeline-content { float: left; text-align: right; padding-right: 30px; }
	.timeline-centered > .timeline-item.period .timeline-content { float: none; padding: 0; width: 100%; text-align: center; }
	.timeline-centered .timeline-item.period { padding: 50px 0 90px; }
	.timeline-centered .period .timeline-marker:after { height: 30px; bottom: 0; top: auto; }
	.timeline-centered .period .timeline-title { left: auto; text-align: center;}
}

/* ------------------------------------------------------------------ */
/* product Styles
/* ------------------------------------------------------------------ */
.product article {margin-bottom: 0; padding: 80px 0; word-break: keep-all;}
.product article:first-child {padding-top: 0;}
.product span.point500 {color: #4b709a; font-weight: 500;}
.product span.point700 {color: #71c4c7; font-weight: 700;}
.product .content-img {text-align: center;}

.product .header-title {}
.product .header-title h1 {margin-bottom: 30px;color: #999; text-align: center; font-weight: 900; text-transform: uppercase;}
.product .header-title h1 span {color: #ccc;}
.product .header-title h1:after {display: none;}
.product .header-title h2 {margin-bottom: 30px; text-align: center; color: #222;}
.product .header-title p.head {text-align: center !important;}
.product .header-title hr {
    border: solid #999;
	border-width: 3px 0 0;
	width: 50px;
	margin: 30px auto 60px auto;
	height: 0;
	clear: both;
	text-align: left;
}
.product article:hover .header-title hr { border-color: #666; width: 180px; text-align: center;}

@media screen and (max-width: 480px) {
    .product article {padding: 40px 0;}
}

/*==================  sub01  =====================*/
.product .s00 .logo {width: 30%; margin: -50px auto 10px auto;}
.product .s00 .head {color: #888;}
@media screen and (max-width: 480px) {
    .product .s00 .logo {width: 40%; margin: -40px 0 0 auto;}
}

.product .s01 {padding: 60px 0; text-align: center; background: #ecf3f9;}
.product .s01 .header-title {margin-bottom: 60px;}
.product .s01 .cert_wrap {position: relative; width: 80%; margin: 0 auto 60px;padding: 20px; border: 2px solid #ccc;}
.product .s01 .cert_wrap p {display: block; margin-top: -44px; padding: 10px 30px; color: #fff; background: #384a70; border-radius: 15px}
.product .s01 .cert_wrap + h2 {margin-bottom: 30px;}
@media screen and (max-width: 480px) {
    .product .s01 .cert_wrap {width: 95%;}
    .product .s01 .cert_wrap p {padding: 10px;}
}

.product .s02 h1 {color: #0065ff; font-weight: 700;}

.product .s03 {border-top: 1px solid #e5e5e5;}
.product .s03 h1 {color: #ff512e; font-weight: 700;}
.product .s03 .graph h3 {margin-bottom: 20px; color: #4b709a; text-align: center; font-weight: 700;}
.product .s03 .graph img {padding: 10px; border: 1px solid #e5e5e5;}
.product .s03 .ace_list {text-align: center;}
.product .s03 .ace_list img {margin-bottom: 30px;}
.product .s03 .ace_list ol {}
.product .s03 .ace_list ol li {list-style: decimal outside; margin-bottom: 20px; font-size: 16px; line-height: 1.5; text-align: left; }

.product .s04 {border-top: 1px solid #e5e5e5;}
.product .s04 h1 {color: #0065ff; font-weight: 700;}

.product .s05 {padding: 40px;border: 1px solid #ccc; background: #f9f9f9;}

/*==================  sub02  =====================*/
.product.sub02 .s00 .logo {width: 20%; margin: 0 auto 20px auto;}
.product.sub02 .s00 .head {color: #888; text-align: left !important}

@media screen and (max-width: 480px) {
    .product.sub02 .s00 .logo {width: 30%; margin: -30px auto 10px auto;}
    .product.sub02 .s00 .head {text-align: center !important}
}


.product.sub02 .s01 {background: none; text-align: left}
.product.sub02 .s01 h1, .product.sub02 .s02 h1 {font-weight: 400; color: #999;}
.product.sub02 .s01 h1 span, .product.sub02 .s02 h1 span {color: #384a70;font-weight: 900;}

.product.sub02 .s02 {border-top: 1px solid #e5e5e5;}
.product.sub02 .s02 .head {color: #999;}
.product.sub02 .s02 .head + p {text-align: center; line-height: 1.5;}

.product.sub03 .s00 h1 {margin-bottom: 60px; font-weight: 400; color: #999;}
.product.sub03 .s00 h1 span {color: #e9262c;font-weight: 900;}
.product.sub03 .s00 h3 {margin-bottom: 30px;color: #222; font-weight: 700;}
.product.sub03 .s00 .head {text-align: left !important;}
.product.sub03 .s00 .head:first-child span {color: #e9262c;}




.buebchen {}
.buebchen h4 { margin-bottom: 30px; font-weight: 700; color: #666; text-transform: uppercase;}
.buebchen a { color: #cf1767;}
.buebchen a:hover,.buebchen a:focus,.buebchen a:active { color: #ffffff;}

.buebchen-list { max-width: 1280px; counter-reset: ctr; position: relative;}
.buebchen-list .item-buebchen { margin-bottom: 2.4rem; padding: 0 30px; min-height: 360px;}
.buebchen-list .item-buebchen:nth-child(8) {float: left;}

.buebchen-list .item-buebchen_content { border-top: 1px solid rgba(0, 0, 0, 0.1); padding-top: 30px;}
.buebchen-list .item-buebchen_content p {color: #666;}
.buebchen-list .item-buebchen_content::before {
  display: block;
  content: counter(ctr, decimal-leading-zero) ".";
  counter-increment: ctr;
  margin-bottom: 50px;
  font-weight: 700;
  font-size: 48px;
  line-height: 1;
  color: rgba(113,196,199,0.8);
}

@media screen and (max-width:1400px) {
  .buebchen-list .item-buebchen { padding: 0 20px;}
  .buebchen-list .item-buebchen_content::before { font-size: 7.2rem; }
}

@media screen and (max-width:1200px) {
  .buebchen-list { max-width: 1020px; }
  .buebchen-list .item-buebchen_content::before { font-size: 6.8rem; }
}

@media screen and (max-width:768px) {
  .buebchen {padding: 0px 0;}
  .buebchen-list { max-width: 600px; margin-top: 8rem;}
  .buebchen-list .item-buebchen { padding: 0 16px; min-height: 0; }
  .buebchen-list .item-buebchen:nth-child(8) {}
  .buebchen-list .item-buebchen_content::before { font-size: 36px;}
}

@media screen and (max-width:480px) {
  .buebchen-list .item-buebchen { text-align: center;}
  .buebchen-list .item-buebchen_content::before { margin-bottom: 20px; font-size: 28px;}
}


/*==================  sub03  =====================*/
.product.sub03 .s00 .logo {width: 80%; margin: 0 auto 20px auto; text-align: center;}
.product.sub03 .s00 .img {margin-top: 30px;}
.product.sub03 .s00 .img span {display: inline-block; width: 32%;border: 1px solid #e5e5e5}

.product.sub03 .s01 {border-top: 1px solid #e5e5e5; background: none;}
.product.sub03 .s01 .img {margin-top: 0px;}
.product.sub03 .s01 .img span {display: inline-block; width: 48%;border: 1px solid #e5e5e5}
/* ------------------------------------------------------------------ */
/* formmail Module Styles
/* ------------------------------------------------------------------ */
.formmail .formmail_title_bgcolor {background: none;}
.formmail .formmail_title_bgcolor font {display: block; width: 90%; margin: 5px; padding: 5px; font-family: 'NotoSansKR', sans-serif;; font-size: 14px; color: #666 !important; line-height: 24px;background: #e5e5e5 ; border-radius: 3px;}
.formmail .formmail_title_bgcolor, .formmail .formmail_cell_bgcolor {float:none !important;vertical-align: top; }
.formmail .btn-area {margin-top: 20px;}
.formmail .btn-area input {margin: 0;}
@media screen and (max-width: 640px) {
  .formmail .formmail_title_bgcolor font, .formmail .formmail_cell_bgcolor input, .formmail .formmail_cell_bgcolor select {font-size: 12px;}
}

/* ------------------------------------------------------------------ */
/* Board Module Styles
/* ------------------------------------------------------------------ */
/* Board Common */
.bbsnewf5 {font:inherit !important}
.bbsnewf5 a:hover {}
.bbsnewf5 input {margin: 0;}
.board {font-family:inherit !important}

.ico-board {width:100%; margin-bottom:20px; border-top:2px solid #444}
.ico-board .att_title, .ico-board .att_title font {text-align: center; color: #666 ; background: none;}
.ico-board input[type=file] {width:80%}
.ico-board input[type=text], .ico-board input[type=password] {width:80%; }
.ico-board tbody td { font-size:14px !important; padding:10px 5px; border-bottom:1px solid #999}
.ico-board tbody td font, .ico-board tbody td span, .ico-board tbody td a {font:inherit !important;}
.board_bgcolor, .board_bgcolor span {width:30% !important; font:inherit !important; color:#444 !important; background:#none !important}
#post_area {padding: 0;}
#post_area img {max-width:100%; height:auto !important}
.prvThumbList {margin-top:40px}
.prvThumbList > table td table {width:135px}
div.nneditor-container .seResize2 span {font-size:0 !important}
.brd_btngroup {margin-top:50px}
.brd_btngroup a {margin-top:2px; margin-bottom:2px}
#check_all {margin-left:5px; vertical-align:-5px}
.board_bottom {margin-top:50px}
.board_bottom > a {float:right}
.board_admin_bgcolor {vertical-align: top;}
#ext_search {float:none; margin-top: 10px;}
table#search_table {float: none; width: 370px !important; margin: 0 auto !important;}
table#search_table .est_keyword_cell input {width: 94% !important ;}
.est_btn_cell {vertical-align:middle;}
@media screen and (max-width: 640px) {
  .ico-board tbody td.bbsetc_dateof_write { font-size:12px !important}
}

.board_comment_bgcolor {padding-bottom:20px; background-color:#f9f9f9 !important}
.comment_txt {padding:10px 0 !important; word-break:}
.comment_txt:first-child {padding:20px !important}
.comment_txt textarea {width:60%; width:-webkit-calc(100% - 120px); width:-moz-calc(100% - 120px); width:calc(100% - 120px); height:50px; padding:10px; font:inherit !important; border:1px solid #e8e8e8; border-radius:3px}
.comment_txt > a.btn {margin:2px 0; padding:0 15px !important; height:30px !important; line-height:28px !important}
.comment_txt > font {display:block; margin-bottom:10px; color:#ccc !important}


/* Gallery Style */
.gallery { }
.gallery > table {float:left; display:block; width:30.89% !important; margin:0 1.219% 10px 1.219%}
.gallery > table.board {float: none; }
.gallery td.bbsnewf5 {position:relative; overflow:hidden; border: 1px solid #e5e5e5}
.gallery td.bbsnewf5:hover, .gallery td.bbsnewf5:focus {box-shadow: 0 2px 3px rgba(0, 0, 0, 0.05); cursor: pointer; }
.gallery td.bbsnewf5 > table td a {display: block; overflow: hidden}
.gallery td.bbsnewf5 a > img {display:block; width:100%; height:auto !important; transition:all .5s ease}
.gallery td.bbsnewf5 a:hover > img {transform:scale(1.1)}

.gallery .hoverBox {position:absolute; display:block; top:0; left:0; width:100%; height:100%; padding:32% 30px 0 30px; text-align:center; background:rgba(0,0,0,.8); opacity:0; transition:all .5s ease}
.gallery .hoverBox .inner {}
.gallery .hoverBox .inner h3 {font-size:24px; font-weight:600; color:#fff; line-height:1.2}
.gallery .hoverBox .inner h3:after {display:block; width:40px; height:1px; margin:20px auto; content:''; background:#fff; opacity:.5}
.gallery .hoverBox .inner p {display:-webkit-box; color:#fff; max-height:69px; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; text-overflow:ellipsis}
.gallery .bbsnewf5:hover .hoverBox {opacity:1}
.gallery .board_write {text-align: right;}
.brd_paging {margin-bottom: 10px; text-align:center}
.brd_paging > b, .brd_paging > a {display:inline-block; width:38px; height:38px; line-height:36px; text-align:center; margin:0 -2px; border:1px solid #e8e8e8}
.brd_paging > b {color:#fff; border-color:#666; background:#666}
.brd_paging > a {color:#666}
.brd_paging > a:hover {color:#555; border-color:#cdcdcd; background:#f4f4f4}

@media screen and (max-width: 1280px) {
    /* 제품소개 스타일 */
    .gallery .hoverBox {padding-top:20%}
    .gallery_inner .hoverBox .inner h3 {font-size:18px}
    .gallery_inner .hoverBox .inner p {font-size:12px; max-height:63px}
}

@media screen and (max-width: 768px) {
    /* 제품소개 스타일 */
    .gallery > table {width:46% !important; margin:0 2% 20px 2%;}
    .gallery .hoverBox {padding:25% 20px 0 20px}
    /* 게시판 읽기 */
    .ico-board tbody td {padding:12px 10px}
    .prvThumbList table td {padding:2px !important}
    .prvThumbList > table {width:100%}
    .prvThumbList > table td table {width:33%}
    .prvThumbList img {width:100%; height:auto}


}

@media screen and (max-width: 640px) {
    .gallery > table {width:100% !important; margin: 0 0 20px 0; }
    /* 게시판 - 공지사항 */
    .brd_notice .att_title {display:none}
    .brd_notice .att_title:nth-child(4) {display:none}
    .brd_notice .att_title:nth-child(5) {display:none}
    .brd_notice .bbsno {display:none}
    .brd_notice .bbswriter {display:none}
    .brd_notice .bbsetc_view_count  {display:none}
    /* 게시판 - QNA */
    .brd_qna .att_title:first-child {display:none}
    .brd_qna .att_title:nth-child(4) {display:none}
    .brd_qna .att_title:nth-child(5) {display:none}
    .brd_qna .att_title:nth-child(6) {display:none}
    .brd_qna .bbsno {display:none}
    .brd_qna .bbsetc_dateof_write {display:none}
    .brd_qna .bbspublic_ox {display:none}
    /* 게시판 공통 */
    #ext_search {display: none;}
    .brd_paging > b, .brd_paging > a {width: auto; height: auto; font-size: 12px; line-height: 1.2; border: none;}
    .comment_txt input {width:25% !important; text-align:left !important; padding:10px !important}
}