@charset "utf-8";
/*
 * Name     : style.css
 * Version  : 1.0.4
 * Author   : onepixel studio
 * Date     : 2020-05-10
 ---------------------------------------------------
 Table of contents
 ---------------------------------------------------
    01. global section common
    02. main section common
    03. main hero
    04. main about section
    05. main parallax section
    06. main news section
    07. main product section
    08. sub section common
    09. sub hero
    10. nav section
    11. about visual section
    12. about summary section
    13. about team section
    14. history section
    15. location section
    16. business intro section
    17. business goal section
    18. business process section
    19. business field section
    20. business review section
    21. business strong section
    22. business partner section
    23. product section (html type)
    24. magnific popup customizing
    25. board common
    26. product section common (board type)
    27. product section (board type A)
    28. product section (board type B)
    29. customer - list type board
    30. customer - faq
    31. customer - qna
    32. contact
    33. member
    34. media queries
---------------------------------------------------
*/

/* ------------------------------
 * global section common
------------------------------ */
section.no-padding-top {padding-top:0 !important}
section.no-padding-bottom {padding-bottom:0 !important}
section.no-padding {padding-top:0 !important; padding-bottom:0 !important}
section.line-top {border-top:1px solid #e7e7e7}
section.line-bottom {border-bottom:1px solid #e7e7e7}
section.parallax-section {position:relative; background-size:cover; background-repeat:no-repeat; z-index:5}
section.parallax-section:before {content:''; position:absolute; display:block; top:0; left:0; bottom:0; right:0; background-color:#000; opacity:0.4; z-index:-1}
section.parallax-section .parallax-caption {display:table; height:100%}
section.parallax-section .parallax-caption-inner {display:table-cell; text-align:center; vertical-align:middle}
.margin-offset {margin-left:-15px; margin-right:-15px}

/* ------------------------------
 * main section common
------------------------------ */
.main-section {padding-top:100px; padding-bottom:100px}
.main-section .section-heading {position:relative; text-align:center; margin-bottom:50px}
.main-section .section-heading h2 {font-size:42px; font-weight:600; color:#222; line-height:1.35}
.main-section .section-heading p {color:#777; line-height:1.6; margin-top:10px}
.main-section .bottom-btn {text-align:center; padding-top:60px}

/* ------------------------------
 * main hero
------------------------------ */
#main-hero {height:900px}
#main-hero:before {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background-color:#e9e9e9; z-index:5; transition:opacity 0.3s, visibility 0.3s}
#main-hero:after {content:''; position:absolute; top:50%; left:50%; width:60px; height:60px; margin:-30px 0 0 -30px; border:3px solid rgba(0,0,0,0.15); border-left-color:var(--point-color); border-radius:50%; z-index:8; transition:opacity 0.3s, visibility 0.3s; animation:slider-load 1.2s infinite linear}
#main-hero.slick-initialized:before, #main-hero.slick-initialized:after {opacity:0; visibility:hidden}
@keyframes slider-load {
    from {transform:rotate(0deg)}
    to {transform:rotate(1turn)}
}
#main-hero .slick-list, #main-hero .slick-track {height:100%}
#main-hero .slide-item {background-size:cover; background-repeat:no-repeat; background-position:50% 50%}
#main-hero .slide-item {position:relative; z-index:5; outline:0}
/* #main-hero .slide-item:before {content:''; position:absolute; display:block; top:0; left:0; bottom:0; right:0; background-color:#000; opacity:0.3; z-index:-1} */
#main-hero .slick-slide .slide-caption {position:relative; display:table; height:100%; z-index:5}
#main-hero .slick-slide .slide-caption .caption-inner {display:table-cell; vertical-align:middle}
#main-hero .slick-slide .slide-caption span {display:block; font-size:20px; color:#fff; letter-spacing:2px; margin-bottom:5px}
#main-hero .slick-slide .slide-caption h2 {font-size:42px; font-weight:200; color:#fff; line-height:1.4}
#main-hero .slick-slide .slide-caption h2 strong {font-weight:normal}
#main-hero .slick-slide .slide-caption p {font-size:19px; color:#fff; line-height:1.6; margin-top:30px; opacity:0.8}
#main-hero .slick-slide .slide-caption a {margin-top:40px}
#main-hero .slick-dots {position:absolute; bottom:30px; left:0; right:0; text-align:center; z-index:5}
#main-hero .slick-dots li {display:inline-block; margin:0 8px}
#main-hero .slick-dots li button {display:block; text-indent:-9999em; padding:0; width:10px; height:10px; border:none; border-radius:50%; background-color:#fff; opacity:0.5; outline:0}
#main-hero .slick-dots li.slick-active button {background-color:var(--point-color); opacity:0.8}
#main-hero .slick-arrow {position:absolute; top:50%; width:80px; height:100px; font-size:36px; color:#fff; margin-top:-50px; padding:0; border:none; background-color:rgba(0,0,0,0.5); opacity:0; z-index:5; transition:opacity 0.3s, background-color 0.3s; outline:0}
#main-hero .slick-arrow i {transition:transform 0.3s ease}
#main-hero .slick-prev {left:0}
#main-hero .slick-next {right:0}
#main-hero:hover .slick-arrow {opacity:1}
#main-hero .slick-arrow:hover {background-color:rgba(0,0,0,0.75)}
#main-hero .slick-prev:hover i {transform:translateX(-6px)}
#main-hero .slick-next:hover i {transform:translateX(6px)}

/* ------------------------------
 * main about section
------------------------------ */
.main-about-section .col-about figure {position:relative; overflow:hidden}
.main-about-section .col-about figure:before {content:''; position:absolute; display:block; top:0; left:0; bottom:0; right:0; background-color:#000; opacity:0; z-index:10; transition:opacity 0.25s ease-in-out}
.main-about-section .col-about figure img {display:block; width:100%; transition:transform 0.25s ease-in-out}
.main-about-section .col-about:hover figure:before {opacity:0.2} 
.main-about-section .col-about:hover figure img {transform:scale(1.15)}
.main-about-section .col-about h4 {font-size:25px; font-weight:normal; color:#333; line-height:1.3; margin:20px 0 15px}
.main-about-section .col-about p {font-size:15px; color:#7a7a7a; line-height:1.7}
.main-about-section .col-about .btn {margin-top:30px}

/* ------------------------------
 * main parallax section
------------------------------ */
.main-parallax-section {height:500px}
.main-parallax-section h2 {font-size:62px; color:#fff}
.main-parallax-section p {font-size:17px; color:#fff; margin-top:15px; opacity:0.75}

/* ------------------------------
 * main news section
------------------------------ */
.main-news-section .article-list {width:100%; border-collapse:collapse; border-top:1px solid #eaeaea}
.main-news-section .article-list tbody, .main-news-section .article-list tr,.main-news-section .article-list td {display:block; width:100%}
.main-news-section .article-list td[width='1%'] {display:none}
.main-news-section .article-list tr {position:relative; padding:42px 2px; border-bottom:1px solid #eaeaea; transition:transform 0.3s}
.main-news-section .article-list tr:after {content:'\f119'; position:absolute; top:50%; right:18px; font-family:'Ionicons'; font-size:42px; color:#ccc; margin-top:-30px; transition:color 0.3s, transform 0.3s}
.main-news-section .article-list td a {font-size:24px; color:#6a6a6a; transition:color 0.3s}
.main-news-section .article-list td[align='center'] {font-size:15px; font-weight:700; color:#aaa; text-align:left; margin-top:8px; opacity:0.6}
.main-news-section .article-list tr:hover {transform:scale(1.01)}
.main-news-section .article-list tr:hover td a {color:#1b1b1b}
.main-news-section .article-list tr:hover:after {color:#1b1b1b; transform:translateX(10px)}

/* ------------------------------
 * main product section
------------------------------ */
.main-product-section {background-color:#f7f7f7}
.main-product-section .article-list {width:100%}
.main-product-section .article-list table, .main-product-section .article-list tbody, .main-product-section .article-list tr, .main-product-section .article-list td {display:block}
.main-product-section .article-list table {width:100%; background-color:#fff; box-shadow:0 40px 68px -14px rgba(0,0,0,0.09); transition:transform 0.25s ease-out}
.main-product-section .article-list table br {display:none}
.main-product-section .article-list > tbody > tr {margin-left:-15px; margin-right:-15px}
.main-product-section .article-list > tbody > tr:before, .main-product-section .article-list > tbody > tr:after {content:''; display:table}
.main-product-section .article-list > tbody > tr:after {clear:both}
.main-product-section .article-list > tbody > tr > td {float:left; width:33.333334%; padding-left:15px; padding-right:15px; overflow:visible !important}
.main-product-section .article-list .board_output_gallery_img a {position:relative; display:block; height:100%; overflow:hidden}
.main-product-section .article-list .board_output_gallery_img a:before {content:''; position:absolute; top:0; left:0; bottom:0; right:0; background-color:rgba(0,0,0,0.25); opacity:0; z-index:5; transition:opacity 0.25s ease-out}
.main-product-section .article-list .board_output_gallery_img a img {display:block; width:100%; height:auto; transition:transform 0.25s ease-out}
.main-product-section .article-list table tr:last-child {padding:35px 30px}
.main-product-section .article-list .board_output_gallery_subject {display:block; font-size:17px; font-weight:normal; color:#333; line-height:1.5; text-align:left}
.main-product-section .article-list .board_output_gallery_subject a {color:#333}
.main-product-section .article-list .board_output_gallery_description {display:block; margin-top:20px; font-size:14px; color:#333; line-height:1.75; text-align:left; word-break:keep-all; opacity:0.7}
.main-product-section .article-list table:hover {transform:translateY(-20px)}
.main-product-section .article-list table:hover .board_output_gallery_img img {transform:scale(1.12)}
.main-product-section .article-list table:hover .board_output_gallery_img a:before {opacity:1}

/* ------------------------------
 * sub section common
------------------------------ */
.sub-section {padding-top:100px; padding-bottom:100px}
.sub-section .main-heading {position:relative; text-align:center; margin-bottom:60px}
.sub-section .main-heading h2 {font-size:38px; font-weight:normal; color:#222; line-height:1.35}
.sub-section .main-heading p {color:#777; line-height:1.6; margin-top:15px}
.sub-section .section-heading {text-align:center; margin-bottom:50px}
.sub-section .section-heading h3 {font-size:28px; color:#333}
.sub-section .section-heading.light h3 {color:#fff}
.sub-section .section-heading p {margin-top:20px; font-size:15px; color:#7a7a7a; line-height:1.75}
.sub-section .bottom-btn {text-align:center; padding-top:60px}

/* ------------------------------
 * sub hero
------------------------------ */
#sub-hero {position:relative; height:400px; overflow:hidden}
#sub-hero .hero-bg {position:absolute; top:0; left:0; bottom:0; right:0; background-size:cover; background-position:50% 50%; background-repeat:no-repeat; transform:scale(1.1); transition:transform 5s ease}
#sub-hero.is-loaded .hero-bg {transform:scale(1)}
#sub-hero.hero-01 .hero-bg {background-image:url(../images/sub_hero_img1.jpg)}
#sub-hero.hero-02 .hero-bg {background-image:url(../images/sub_hero_img2.jpg)}
#sub-hero.hero-03 .hero-bg {background-image:url(../images/sub_hero_img3.jpg)}
#sub-hero.hero-04 .hero-bg {background-image:url(../images/sub_hero_img4.jpg)}
#sub-hero.hero-05 .hero-bg {background-image:url(../images/sub_hero_img5.jpg)}
#sub-hero.hero-06 .hero-bg {background-image:url(../images/sub_hero_img6.jpg)}
#sub-hero .hero-caption {position:relative; display:table; width:100%; height:100%; z-index:5}
#sub-hero .caption-cell {display:table-cell; text-align:center; padding-top:60px; vertical-align:middle}
#sub-hero .caption-cell h2 {font-size:36px; font-weight:normal; color:#fff}
#sub-hero .caption-cell p {font-size:15px; color:rgba(255,255,255,0.75); margin-top:15px}

/* ------------------------------
 * nav section
------------------------------ */
.dropdown-nav-section {border-bottom:1px solid #e9e9e9}
.dropdown-nav-section .link-home {float:left; height:60px; padding:0 20px; font-size:18px; color:#000; line-height:60px; border-left:1px solid #e9e9e9; border-right:1px solid #e9e9e9}
.dropdown-nav-section .dropdown-wrap {position:relative; float:left}
.dropdown-nav-section .dropdown-wrap > a {position:relative; display:block;  height:60px; padding:0 25px; font-size:15px; color:#7a7a7a; line-height:60px; border-right:1px solid #e9e9e9}
.dropdown-nav-section .dropdown-wrap > a:after {content:'\e941'; position:absolute; right:25px; font-family:'xeicon'; transition:transform 0.3s}
.dropdown-nav-section .dropdown-wrap > a[aria-expanded="true"]:after {transform:rotate(180deg)}
.dropdown-nav-section .dropdown-wrap > .dropdown {display:none; position:absolute; left:-1px; right:0; padding:15px 0; border-top:1px solid #e9e9e9; background-color:#fff; z-index:10; box-shadow:0 20px 50px -12px rgba(0,0,0,0.12)}
.dropdown-nav-section .dropdown-wrap > .dropdown li a {display:block; font-size:15px; color:#7a7a7a; padding:10px 20px}
.dropdown-nav-section .dropdown-wrap > .dropdown li a:hover {color:#333; background-color:#f8f8f8}
.dropdown-nav-section .dropdown-wrap > .dropdown li.is-active a {color:#fff; background-color:var(--point-color)}
.dropdown-nav-section .dropdown-02 > a {color:var(--point-color)}

/* ------------------------------
 * about visual section
------------------------------ */
.about-visual-section .about-visual {padding:160px 0; background-image:url(../images/about_visual_bg.jpg); background-size:cover; background-position:50% 50%; background-repeat:no-repeat}
.about-visual-section .about-visual h3 {font-size:28px; font-weight:300; color:#fff; line-height:1.4; text-align:center; margin-bottom:50px}
.about-visual-section .about-visual h3 strong {font-weight:normal}
.about-visual-section .about-visual .col-visual {position:relative; text-align:center; padding-top:50px; padding-bottom:50px; border-right:1px solid rgba(255,255,255,0.12)}
.about-visual-section .about-visual .col-visual:first-child {border-left:1px solid rgba(255,255,255,0.12)}
.about-visual-section .about-visual .col-visual .icon-wrap {font-size:48px; color:#fff}
.about-visual-section .about-visual .col-visual h4 {font-size:21px; font-weight:normal; color:#fff; margin:25px 0 15px}
.about-visual-section .about-visual .col-visual p {color:#fff; line-height:1.7; padding:0 10px; opacity:0.8}

/* ------------------------------
 * about summary section
------------------------------ */
.about-summary-section .summary-heading {margin-bottom:50px; font-size:17px; color:#555; line-height:1.75; text-align:center}
.about-summary-section .summarylist dt, .about-summary-section .summarylist dd {font-size:15px; line-height:1.6}
.about-summary-section .summarylist dt {font-weight:700; color:#222}
.about-summary-section .summarylist dd {color:#666; opacity:0.8}
.about-summary-section .summarylist .list-inner {padding:18px 15px; border-top:1px solid transparent}
.about-summary-section .summarylist dt .list-inner {border-color:#222}
.about-summary-section .summarylist dd .list-inner {border-color:#d9d9d9}

/* ------------------------------
 * about team section
------------------------------ */
.about-team-section {background-color:#f7f7f7}
.about-team-section .col-team {margin-bottom:40px}
.about-team-section .col-team .team-info {position:relative; margin-top:-40px; margin-left:20px; margin-right:20px; padding:30px; background-color:#fff; z-index:5}
.about-team-section .col-team .team-info h4 {font-size:17px; font-weight:700; color:var(--point-color)}
.about-team-section .col-team .team-info span {display:block; font-size:13px; color:#aaa; margin:3px 0 15px}
.about-team-section .col-team .team-info p {font-size:14px; color:#888; line-height:1.7}

/* ------------------------------
 * history section
------------------------------ */
.history-section .history-group {position:relative; padding:30px 0}
.history-section .history-group:before {content:''; position:absolute; top:0; bottom:0; left:50%; width:1px; margin-left:-0.5px; background-color:var(--point-color)}
.history-section .history-group .row + .row {margin-top:30px}
.history-section .col-history {text-align:right}
.history-section .col-history h4 {position:relative; font-size:42px; font-weight:700; color:#2b2b2b; margin-bottom:40px}
.history-section .col-history h4:before {content:''; position: absolute; top:50%; right:-112px; width:95px; height:3px; background-color:var(--point-color)}
.history-section .col-history h4:after {content:''; position:absolute; top:50%; right:-22px; width:12px; height:12px; margin-top:-4px; border-radius:50%; background-color:var(--point-color)}
.history-section .col-history ul li {position:relative; font-size:15px; color:#7a7a7a; line-height:1.65; padding-right:40px}
.history-section .col-history ul li + li {margin-top:5px}
.history-section .col-history ul li strong {position:absolute; top:0; right:0; color:var(--point-color)}
.history-section .col-history ul + img {margin-top:50px}
.history-section .col-sm-push-7 {text-align:left}
.history-section .col-sm-push-7 h4:before {left:-112px; right:auto}
.history-section .col-sm-push-7 h4:after {left:-22px; right:auto}
.history-section .col-sm-push-7 ul li {padding-left:40px; padding-right:0}
.history-section .col-sm-push-7 ul li strong {left:0; right:auto}

/* ------------------------------
 * location section
------------------------------ */
.location-section .map-container {position:relative; height:500px; margin-bottom:100px; background-color:#f4f4f4; box-shadow:60px 60px 80px -40px rgba(0,0,0,0.2); z-index:5}
.location-section .map-container iframe {width:100%; height:100%}
.location-section .col-heading h3 {font-size:38px; font-weight:300; color:#333; line-height:1.3; transition:color 0.2s}
.location-section .col-info dl {padding:40px 40px 32px; border-top:1px solid #555; border-bottom:1px solid #e5e5e5; transition:border-color 0.2s}
.location-section .col-info dl dt, .location-section .col-info dl dd {line-height:1.7; margin-bottom:8px; transition:color 0.2s}
.location-section .col-info dl dt {clear:left; float:left; min-width:110px; font-weight:normal; color:#333}
.location-section .col-info dl dt span {font-size:12px; font-weight:500}
.location-section .col-info dl dd {margin-left:120px; color:#777}
.location-section .col-info dl dd a {color:#777; transition:color 0.2s}

/* ------------------------------
 * business intro section
------------------------------ */
.business-intro-section .col-circle:first-child {transform:translateX(30px)}
.business-intro-section .col-circle:last-child {transform:translateX(-30px)}
.business-intro-section .col-circle .circle-outer {position:relative; padding-bottom:100%}
.business-intro-section .col-circle .circle-inner {position:absolute; top:0; left:0; width:100%; height:100%; padding:60px 80px; text-align:center; border-radius:50%; background-color:var(--point-color-bg)}
.business-intro-section .col-circle .vertical-sizer {position:relative; top:50%; transform:translateY(-50%)}
.business-intro-section .col-circle .icon-wrap i, .business-intro-section .col-circle .icon-wrap ion-icon {font-size:72px; color:var(--point-color)}
.business-intro-section .col-circle h4 {font-size:21px; font-weight:600; color:#2b2b2b; margin:25px 0 10px}
.business-intro-section .col-circle p {font-size:15px; color:#777; line-height:1.7}

/* ------------------------------
 * business goal section
------------------------------ */
.business-goal-section {background-image:url(../images/business_goal_bg.jpg); background-position:50% 50%; background-repeat:no-repeat; background-size:cover}
.business-goal-section .col-goal .goal-box .desc-box {position:relative; margin-top:-60px; margin-left:30px; margin-right:30px; padding:35px 30px; background-color:#fff}
.business-goal-section .col-goal .goal-box .desc-box h4 {font-size:17px; color:#333; margin-bottom:10px}
.business-goal-section .col-goal .goal-box .desc-box p {font-size:14px; color:#7a7a7a; line-height:1.7}

/* ------------------------------
 * business process section
------------------------------ */
.business-process-section .col-process {margin-bottom:30px}
.business-process-section .col-process .process-box {position:relative; padding:35px; height:100%; background-color:var(--point-color-bg)}
.business-process-section .col-process .process-box:before {content:''; position:absolute; display:block; top:11px; right:-3px; width:30px; height:1px; background-color:var(--point-color); opacity:0.5; transform:rotate(-45deg)}
.business-process-section .col-process .process-box .heading {margin-bottom:20px}
.business-process-section .col-process .process-box .heading .num {display:inline-block; font-size:34px; font-weight:700; color:var(--point-color)}
.business-process-section .col-process .process-box .heading span {font-size:14px; font-weight:700; color:#2b2b2b; margin-left:10px; vertical-align:top}
.business-process-section .col-process .process-box p {color:#333; line-height:1.5}

/* ------------------------------
 * business field section
------------------------------ */
.business-field-section .col-features {margin-bottom:30px}
.business-field-section .col-features .feature-box {height:100%; padding:45px 32px; text-align:center; border:1px solid #ced4e2; border-radius:5px; background-color:#fff}
.business-field-section .col-features .feature-box .icon-wrap i, .business-field-section .col-features .feature-box .icon-wrap ion-icon {font-size:60px; color:var(--point-color)}
.business-field-section .col-features .feature-box h4 {margin:25px 0 15px; font-size:16px; color:#000}
.business-field-section .col-features .feature-box p {font-size:14px; color:#333; line-height:1.6; opacity:0.6}

/* ------------------------------
 * business review section
------------------------------ */
.business-review-section {background-image:url(../images/business_review_bg.jpg); background-position:50% 50%; background-repeat:no-repeat; background-size:cover}
.business-review-section .review-slider .slide-item {text-align:center; outline:0}
.business-review-section .review-slider .slide-item p {font-size:32px; font-weight:300; color:#fff; line-height:1.5; padding:0 15%}
.business-review-section .review-slider .slide-item p:before, .business-review-section .review-slider .slide-item p:after {font-family:serif; opacity:0.35}
.business-review-section .review-slider .slide-item p:before {content:'“ '}
.business-review-section .review-slider .slide-item p:after {content:' ”'}
.business-review-section .review-slider .slide-item .customer {display:inline-block; margin-top:30px; font-size:14px; font-weight:700; color:#fff; opacity:0.6}
.business-review-section .review-slider .slick-arrow {position:absolute; top:25%; width:52px; height:30px; text-indent:-9999em; border:none; background-color:transparent; background-size:52px 30px; background-position:center; background-repeat:no-repeat; cursor:pointer; outline:0; z-index:5; transition:transform 0.3s}
.business-review-section .review-slider .slick-prev {left:0; background-image:url(../images/long_arrow_prev.svg); transform:translateX(15px)}
.business-review-section .review-slider .slick-next {right:0; background-image:url(../images/long_arrow_next.svg); transform:translateX(-15px)}
.business-review-section .review-slider .slick-arrow:hover {transform:translateX(0)}
.business-review-section .review-slider .slick-dots {font-size:0; text-align:center; padding-top:60px}
.business-review-section .review-slider .slick-dots li {display:inline-block; margin:0 8px}
.business-review-section .review-slider .slick-dots li button {display:block; width:10px; height:10px; text-indent:-9999em; padding:0; border:none; border-radius:50%; background-color:#fff; outline:0; opacity:0.5}
.business-review-section .review-slider .slick-dots li.slick-active button {background-color:var(--point-color); opacity:0.8}

/* ------------------------------
 * business strong section
------------------------------ */
.business-strong-section .row-group {padding-top:20px}
.business-strong-section .row-group .row {padding-top:20px; padding-bottom:30px; border-bottom:1px solid #ddd}
.business-strong-section .row-group .row:first-child {border-top:1px solid #ddd}
.business-strong-section .col-num {font-size:84px; font-weight:600; color:var(--point-color); line-height:1}
.business-strong-section .col-title h4 {font-size:28px; font-weight:700; color:#2b2b2b; line-height:1.3}
.business-strong-section .col-info {padding-top:20px}
.business-strong-section .col-info h5 {font-size:19px; font-weight:normal; color:#333; margin-bottom:10px}
.business-strong-section .col-info p {font-size:14px; color:#7a7a7a; line-height:1.75}

/* ------------------------------
 * business partner section
------------------------------ */
.business-partner-section {background-color:#f7f7f7}
.business-partner-section .col-partner {margin-bottom:30px}
.business-partner-section .partner-box {padding:10px; height:80px; text-align:center; background-color:#fff}
.business-partner-section .partner-box:before {content:''; display:inline-block; height:100%; vertical-align:middle}
.business-partner-section .partner-box img {max-width:95%; vertical-align:middle}

/* ------------------------------
 * product section (html type)
------------------------------ */
.justified-gallery > a > .caption, .justified-gallery > div > .caption, .justified-gallery > figure > .caption {display:block !important;font-family:inherit; font-size:13px; color:#fff; letter-spacing:0.05em; padding:12px 15px; opacity:0; transform:translateY(20px); transition:all 0.3s !important}
.justified-gallery > a > .caption.caption-visible, .justified-gallery > div > .caption.caption-visible, .justified-gallery > figure > .caption.caption-visible {transform:translateY(0)}

/* magnific popup customizing */
.mfp-figure {-webkit-animation-name: fade-in; -moz-animation-name: fade-in; -o-animation-name: fade-in; -ms-animation-name: fade-in; animation-name: fade-in; -webkit-animation-duration: .3s; -moz-animation-duration: .3s; -ms-animation-duration: .3s; -o-animation-duration: .3s; animation-duration: .3s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -ms-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; webkit-backface-visibility: hidden; -moz-backface-visibility:hidden;  -ms-backface-visibility:hidden}
.mfp-figure:after {box-shadow:20px 20px 80px -12px rgba(0, 0, 0, 0.5)}
.mfp-title {font-size:14px; line-height:1.7}
.mfp-arrow:before, .mfp-arrow:after {display:inline-block; position:static; margin-top:0; border:none}
.mfp-arrow:before {font-family:'Ionicons'; font-size:38px; color:#fff}
.mfp-arrow-left:before {content:'\f117'}
.mfp-arrow-right:before {content:'\f119'}

/* magnific popup custom effects (2019-05-28) */
/* fade effect */
.mfp-fade.mfp-bg {
    opacity: 0;

    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}
/* overlay animate in */
.mfp-fade.mfp-bg.mfp-ready {
    opacity: 0.8;
}
/* overlay animate out */
    .mfp-fade.mfp-bg.mfp-removing {
    opacity: 0;
}

/* content at start */
    .mfp-fade.mfp-wrap .mfp-content {
    opacity: 0;

    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}

/* content animate it */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
    opacity: 1;
}
/* content animate out */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
    opacity: 0;
}

@keyframes fade-in {
    from {opacity:0}
    to {opacity:1}
}

/* ------------------------------
 * board common
------------------------------ */
.bbsnewf5 .btn-default:hover {color:#333 !important}
.board, .bbsnewf5 {font-family:inherit !important}
.board-category {margin-bottom:60px}
.board-category table {display:none}
.board-category ul {font-size:0; text-align:center}
.board-category ul li {display:inline-block; font-size:15px; margin:0 6px}
.board-category ul li a {display:inline-block; color:#777; padding:8px 18px; border-radius:20px; background-color:#f7f7f7}
.board-category ul li a:hover {background-color:#f2f2f2}
.board-category ul li.is-active a {color:#fff; background-color:var(--point-color)}
.board-paging {padding-top:50px; font-size:0; text-align:center}
.board-paging b, .board-paging a {display:inline-block; font-size:14px; text-align:center; line-height:36px; width:36px; height:36px; margin:0 4px; border-radius:50%; vertical-align:middle}
.board-paging b {color:#fff; background-color:var(--point-color)}
.board-paging a {position:relative; color:#777; background-color:#f4f4f4}
.board-paging a img {position:absolute; top:11px; left:11px}
.board-write {padding-top:40px; text-align:right}
.board-search {padding-top:50px}
.board-search td {padding-right:5px}
.board-search select, .board-search input[type=text] {font-size:14px; color:#666; line-height:1.12; padding:4px 12px; height:38px; border:1px solid #dee2e6; border-radius:3px}
.board-search input[type=text] {width:160px}

.table-article-view {width:100%; border-top:1px solid #555}
.table-article-view * {font-family:inherit !important}
.table-article-view tr {height:auto}
.table-article-view tr td {font-size:15px; color:#777; padding:15px; border-bottom:1px solid #e9e9e9}
.table-article-view font {font-size:inherit !important}
.table-article-view .board_bgcolor {width:15%; background-color:#fff}
.table-article-view .board_description {padding:10px 0 20px}
#post_area {padding:0 !important; line-height:1.75}
#post_area img {height:auto !important}

.board-comment-write .board_comment_bgcolor {margin-top:40px; background-color:#fff}
.board-comment-write .comment_txt {padding:15px !important; font-size:14px; color:#777}
.board-comment-write .board_comment_bgcolor input[type=text], .board-comment-write .board_comment_bgcolor input[type=password], .board-comment-write .board_comment_bgcolor textarea {font-family:inherit !important; font-size:14px; color:#777; height:34px; padding:4px 12px; border:1px solid #ced4da; border-radius:3px}
.board-comment-write .board_comment_bgcolor textarea {width:calc(100% - 115px); height:auto}
.board-comment-write .btn-primary {height:70px}

.board-comment-list .board_comment_bgcolor {background-color:#fff}
.board-comment-list .board_comment_bgcolor table {width:100%}
.board-comment-list .board_comment_bgcolor table td {padding:0 15px}
.board-comment-list .comment_txt {font-size:13px; padding:10px 15px !important}
.board-comment-list .comment_txt font {display:inline-block; padding-bottom:10px}
.comment_name {font-size:13px !important}
.board-view-buttons {padding-top:50px}

.table-article-write {width:100%; margin-bottom:40px; border-top:1px solid #555}
.table-article-write * {font-family:inherit !important}
.table-article-write tr {height:auto}
.table-article-write tr td {font-size:15px; color:#777; padding:15px; border-bottom:1px solid #e9e9e9}
.table-article-write font {font-size:inherit !important}
.table-article-write .board_bgcolor {width:15%; background-color:#fff}
.table-article-write .board_bgcolor span {font-size:inherit !important}
.table-article-write .board_desc input[type=text], .table-article-write .board_desc input[type=password] {display:inline-block; max-width:100%; height:43px; padding:8px 12px; font-size:14px !important; color:#555; border:1px solid #dee2e6; border-radius:4px; outline:0}
.table-write-bottom {width:100%}
.table-write-bottom .text-center .btn-primary {margin-right:4px}

/* ------------------------------
 * product section common (board type)
------------------------------ */
.table-photo {margin-left:-15px; margin-right:-15px}
.table-photo * {font-family:inherit !important}
.table-photo, .table-photo table, .table-photo tbody, .table-photo tr, .table-photo td {display:block}
.table-photo > tbody > tr > td {float:left; margin-bottom:40px; padding-left:15px; padding-right:15px}
.table-photo > tbody > tr:before, .table-photo > tbody > tr:after {content:''; display:table}
.table-photo > tbody > tr:after {clear:both}
.table-photo .bbsnewf5 tr:first-child a {position:relative; display:block; height:270px; overflow:hidden}
.table-photo a img {display:block; width:100%; height:100%; transition:transform 0.3s ease-out; object-fit:cover; font-family:'object-fit: cover;'}
.table-photo > tbody > tr > td:hover a img {transform:scale(1.1)}
.table-photo br {display:none}

/* ------------------------------
 * product section (board type A)
------------------------------ */
.product-section .type-a-row .col-photo {margin-bottom:40px}
.product-section .type-a-row .col-photo figure {position:relative; height:270px; overflow:hidden}
.product-section .type-a-row .col-photo figure a {display:block; height:100%}
.product-section .type-a-row .col-photo figure a img {display:block; width:100%; height:100%; transition:transform 0.3s ease-out; object-fit:cover; font-family:'object-fit: cover;'}
.product-section .type-a-row .col-photo:hover figure a img {transform:scale(1.1)}
.product-section .type-a-row .col-photo .article-info {text-align:center; padding-top:20px}
.product-section .type-a-row .col-photo .article-info h4 {font-size:17px; font-weight:normal; color:#333; margin-bottom:5px}
.product-section .type-a-row .col-photo .article-info h4 a {color:#333}
.product-section .type-a-row .col-photo .article-info .category {font-size:14px; color:#8a8a8a}
.product-section .type-a-row .gallery_subject {padding-top:20px}
.product-section .type-a-row .gallery_title {display:inline-block; font-size:17px; font-weight:normal; color:#333; max-width:100%; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
.product-section .type-a-row .gallery_etc {font-size:14px; color:#8a8a8a}

/* ------------------------------
 * product section (board type B)
------------------------------ */
.product-section .type-b-row > .table-photo {margin-left:0; margin-right:0}
.product-section .type-b-row > .table-photo > tbody > tr > td {margin-bottom:0; padding-left:0; padding-right:0}
.product-section .type-b-row .bbsnewf5 .article-overlay {position:absolute; top:10px; left:10px; bottom:10px; right:10px; background-color:rgba(255,255,255,0.9); z-index:5; opacity:0; transform:scale(1.02); transition:opacity 0.3s ease, transform 0.3s ease}
.product-section .type-b-row .bbsnewf5 .article-info {display:table; width:100%; height:100%}
.product-section .type-b-row .bbsnewf5 .info-inner {display:table-cell; text-align:center; vertical-align:middle}
.product-section .type-b-row .bbsnewf5 .info-inner .category {font-size:14px; color:#222; opacity:0.75}
.product-section .type-b-row .bbsnewf5 .info-inner h4 {font-size:17px; font-weight:normal; color:#222}
.product-section .type-b-row .bbsnewf5 .info-inner h4:before {content:''; display:block; width:12px; height:2px; margin:15px auto; background-color:var(--point-color); transform:rotate(-45deg)}
.product-section .type-b-row.dark-mode .bbsnewf5 .article-overlay {background-color:rgba(26,26,30,0.9)}
.product-section .type-b-row.dark-mode .bbsnewf5 .info-inner .category {color:#fff}
.product-section .type-b-row.dark-mode .bbsnewf5 .info-inner h4 {color:#fff}
.product-section .type-b-row .bbsnewf5 a:hover .article-overlay {opacity:1; transform:scale(1)}

/* ------------------------------
 * customer - list type board
------------------------------ */
.table-board-list {border-top:1px solid #222}
.table-board-list .thead td, .table-board-list tbody td {padding:17px 15px !important; border-top:none; border-bottom:1px solid #e9e9e9; vertical-align:middle !important}
.table-board-list .thead td {position:relative; font-size:16px; font-weight:normal; color:#333; text-align:center; border-bottom-width:1px !important}
.table-board-list .thead td + td:before {content:''; position:absolute; top:50%; left:0; width:1px; height:14px; margin-top:-7px; background-color:#222}
.table-board-list .thead font {font-size:inherit !important}
.table-board-list tbody td {font-size:15px; color:#777}
.table-board-list tbody td a {color:#333}
.table-board-list tbody td a:hover {color:var(--point-color)}

/* ------------------------------
 * customer - faq
------------------------------ */
.faq-list thead {display:none}
.faq-list .faq-type {display:inline-block; width:45px; height:45px; font-size:16px; font-weight:700; color:#fff; text-align:center; line-height:45px; border-radius:50%; background-color:#495057}
.faq-list .board_bgcolor {font-family:inherit; width:75px; background-color:#fff}
.faq-list .board_bgcolor:before {content:'Q'; display:inline-block; width:45px; height:45px; font-size:16px; font-weight:700; color:#fff; text-align:center; line-height:45px; border-radius:50%; background-color:#495057}
.faq-list .board_bgcolor font {display:none}
.faq-list .bbsnewf5 {position:relative}
.faq-list .bbsnewf5:after {content:'\e943'; font-family:'xeicon'; font-size:18px; color:#999; position:absolute; right:15px}
.faq-list .bbsnewf5 a {font-size:19px; font-weight:300}
.faq-list .answer-row {background-color:#f8f8f8}
.faq-list .answer-row .faq-type {float:left; background-color:var(--point-color)}
.faq-list .answer-row .answer-container {margin-left:75px; color:#888; line-height:1.7}
.faq-list .is-open .bbsnewf5 a {color:var(--point-color)}
.faq-list .is-open .bbsnewf5:after {transform:rotate(180deg)}

/* ------------------------------
 * customer - qna
------------------------------ */
.qna-list .bbsnewf5 i {margin-right:5px}

/* ------------------------------
 * contact
------------------------------ */
.contact-section .contact-form table, .contact-section tbody, .contact-section .contact-form tr, .contact-section .contact-form td {display:block; width:100%; height:auto}
.contact-section .contact-form .formmail_title_bgcolor {margin-bottom:10px; padding:0 !important; font-family:inherit; text-align:left; background-color:transparent}
.contact-section .contact-form .formmail_title_bgcolor font {font-size:14px; font-weight:700; color:#333 !important}
.contact-section .contact-form .formmail_cell_bgcolor {font-family:inherit !important}
.contact-section .contact-form table th, .contact-section .contact-form table td {font-size:0; padding:0 0 15px !important; border:none}
.contact-section .contact-form table td input[type=text], .contact-section .contact-form table td input[type=password], .contact-section .contact-form table td select, .contact-section .contact-form table td textarea {display:block; width:100%; height:54px; font-family:inherit; font-size:14px; color:#777; line-height:1.42857143; padding:12px 16px !important; border:none; border-radius:4px; background-color:#f8f9fa; box-shadow:none !important; outline:0; transition:all 0.25s}
.contact-section .contact-form table td input[type=text]:focus, .contact-section .contact-form table td input[type=password]:focus, .contact-section .contact-form table td select:focus, .contact-section .contact-form table td textarea:focus {color:#333; background-color:#f1f3f5}
.contact-section .contact-form table td select {background-image:url(../images/select_arrow_down.png); background-size:12px 7px; background-position:right 16px center; background-repeat:no-repeat; -webkit-appearance:none}
.contact-section .contact-form .label-heading {font-size:14px; font-weight:700; color:#333; margin-bottom:10px}

/* ------------------------------
 * member
------------------------------ */
.login-section .bottom-links {padding-top:30px; font-size:0; text-align:center}
.login-section .bottom-links li {display:inline-block; font-size:15px}
.login-section .bottom-links li a {color:#555}
.login-section .bottom-links li + li:before {content:''; display:inline-block; width:1px; height:14px; margin:0 15px; background-color:#e5e5e5; vertical-align:-2px}
.register-section .register-steps {display:table; width:100%; margin-bottom:50px; table-layout:fixed}
.register-section .register-steps li {position:relative; display:table-cell; font-size:16px; color:#ccc; text-align:center; padding:20px 10px; border-bottom:3px solid #ccc}
.register-section .register-steps li + li:before {content:'\e940'; position:absolute; top:50%; left:-10px; font-family:'xeicon'; font-size:24px; color:#ccc; margin-top:-17px}
.register-section .register-steps li.active {color:#3e78ff; border-color:#3e78ff}
.register-section .register-steps li span {display:block}
.register-section .register-steps li span[lang="en"] {font-size:13px; font-weight:700; margin-bottom:2px}
.register-section .terms-group {margin-bottom:25px; border:1px solid #dee2e6; border-radius:6px; overflow:hidden}
.register-section .terms-group .heading {padding:16px 25px; font-size:17px; font-weight:normal; color:#333; border-bottom:1px solid #dee2e6}
.register-section .terms-group .body {padding:35px 25px}
.register-section .terms-group .footer {padding:16px 25px; border-top:1px solid #dee2e6}
.register-section .register-heading {font-size:21px; font-weight:normal; color:#3e78ff; margin-bottom:30px; padding-bottom:15px; border-bottom:1px solid #3e78ff}
.register-section .form-group table, .contact-section tbody, .register-section .form-group tr, .register-section .form-group td {display:block; width:100%; height:auto}
.register-section .form-group .member_td_bgcolor {margin-bottom:10px; padding:0 !important; font-family:inherit; font-size:14px; font-weight:700; color:#333 !important; text-align:left; background-color:transparent}
.register-section .form-group table td {font-family:inherit !important; font-size:14px; color:#666; padding:0 0 15px !important; border:none}
.register-section .form-group table td span {display:inline-block; font-size:13px; color:#8a8a8a; margin-top:10px}
.register-section .form-group table td input[type=text], .register-section .form-group table td input[type=password], .register-section .form-group table td select, .register-section .form-group table td textarea {display:block; width:100%; height:54px; font-family:inherit; font-size:14px; color:#777; line-height:1.42857143; padding:12px 16px !important; border:none; border-radius:4px; background-color:#f8f9fa; box-shadow:none !important; outline:0; transition:all 0.25s}
.register-section .form-group table td input[type=text]:disabled, .register-section .form-group table td input[type=password]:disabled, .register-section .form-group table td select:disabled, .register-section .form-group table td textarea:disabled {color:#adb5bd; background-color:#f1f3f5}
.register-section .form-group table td input[type=text]:focus, .register-section .form-group table td input[type=password]:focus, .register-section .form-group table td select:focus, .register-section .form-group table td textarea:focus {color:#333; background-color:#f1f3f5}
.register-section .form-group table td select {background-image:url(../images/select_arrow_down.png); background-size:12px 7px; background-position:right 16px center; background-repeat:no-repeat; -webkit-appearance:none}
.register-section .form-group input[name='m_id'] + a img {display:none}
.register-section .form-group input[name='m_id'] + a:before {content:'아이디 중복확인'; display:block; width:100%; margin:10px 0 5px; padding:14px 25px; font-size:15px; color:#fff; text-align:center; border:none; border-radius:4px; background-color:#868e96; transition:background-color 0.2s}
.register-section .form-group input[name='m_id'] + a:hover:before {background-color:#495057}
.register-section .form-group input[name^='fix_email'] {display:inline-block !important; width:calc(50% - 10px) !important}
.register-section .form-group select[name^='birthday'] {display:inline-block !important; width:calc(33% - 4px) !important}
.register-section .form-group select[name^='birthday'] + select {margin-left:5px}
.member_txt {font-family:inherit !important}
.member_txt td {display:inline-block !important; width:auto !important}
.member_txt td + td {margin-left:15px}
.member_txt td input {margin:0 5px 0}
.register-section .register-message {padding:42px 36px; border:1px solid #dee2e6; border-radius:6px}
.register-section .register-message h3 {font-size:21px; color:#333}
.register-section .register-message h3:after {content:''; display:block; width:30px; height:2px; margin:15px 0 20px; background-color:var(--point-color)}
.register-section .register-message p {font-size:15px; color:#666; line-height:1.6}
.register-section .register-message p strong {font-weight:700; color:#000}
.register-section .register-message p + p {margin-top:15px}
.register-section .register-message .btn {margin-top:30px}

.member-popup .form-control {border:1px solid #ced4da}
.member-popup .header {position:relative; padding:20px 25px; background-color:#212529}
.member-popup .header h1 {font-size:19px; color:#fff}
.member-popup .header .btn-close {position:absolute; top:50%; right:10px; width:48px; height:48px; font-size:24px; color:#fff; margin-top:-24px; padding:0; border:none; background-color:transparent; cursor:pointer; outline:0}
.member-popup .body {padding:25px}
.member-popup .body p {font-size:14px; color:#495057; line-height:1.7; margin-bottom:15px}
.member-popup .body .btn-link {font-weight:700}
.member-popup .table th, .member-popup .table td {font-size:13px}
.member-popup .table>tbody>tr>td, .member-popup .table>tbody>tr>th, .member-popup .table>tfoot>tr>td, .member-popup .table>tfoot>tr>th, .member-popup .table>thead>tr>td, .member-popup .table>thead>tr>th {padding:15px 12px}
.member-popup .label-heading {display:block; font-size:14px; font-weight:700; color:#212529; margin-bottom:10px}
.member-popup .warning-text {color:#fd7e14}
.member-popup .footer {text-align:right; padding:20px 25px; border-top:1px solid #e9ecef}

/* ------------------------------
 * media queries
------------------------------ */
@media (max-width:1199px) {
    .history-section .col-history h4:before {right:-97px}
    .history-section .col-sm-push-7 h4:before {left:-97px}
}

@media (max-width:991px) {
    .main-about-section .col-about {margin-bottom:50px}

    .history-section .col-history h4:before {right:-78px; width:50px}
    .history-section .col-history h4:after {right:-36px}
    .history-section .col-sm-push-7 h4:before {left:-78px}
    .history-section .col-sm-push-7 h4:after {left:-36px}

    .business-intro-section .col-circle:first-child {transform:translateX(0)}
    .business-intro-section .col-circle:last-child {transform:translateX(0)}
    .business-intro-section .col-circle + .col-circle {margin-top:50px}
    .business-intro-section .col-circle .circle-outer {padding-bottom:60%}
    .business-intro-section .col-circle .circle-inner {left:50%; width:60%; margin-left:-30%; padding:40px 50px}

    .business-goal-section .col-goal + .col-goal {margin-top:60px}

    .business-review-section .review-slider .slide-item p {font-size:24px}

    .business-strong-section .col-num {font-size:76px}
    .business-strong-section .col-title h4 {font-size:20px}
    .business-strong-section .col-info h5 {line-height:1.5}

    .table-photo .bbsnewf5 tr:first-child a {height:165px}
    .product-section .type-a-row .col-photo figure {height:165px}

    .product-section .type-b-row .col-photo figure {height:165px}
}

@media (min-width:768px) {
    section.parallax-section {background-attachment:fixed}

    .dropdown-nav-section .dropdown-wrap > a {min-width:200px}
}

@media (max-width:767px) {
    section.parallax-section {background-position:50% 50%}

    #main-hero {height:450px}
    #main-hero .slick-slide .slide-caption span {font-size:16px}
    #main-hero .slick-slide .slide-caption h2 {font-size:28px}
    #main-hero .slick-slide .slide-caption p {font-size:14px}
    #main-hero .slick-slide .slide-caption p br {display:none}
    #main-hero .slick-arrow {top:auto; bottom:0; width:50px; height:50px; font-size:20px; color:#000 !important; background-color:#fff !important; opacity:1}
    #main-hero .slick-arrow i {transform:none !important}
    #main-hero .slick-prev {left:auto; right:50px}
    #main-hero .slick-next:before {content:''; position:absolute; top:50%; left:-1px; width:1px; height:24px; margin-top:-12px; background-color:#e9e9e9}

    .main-section {padding-top:60px; padding-bottom:60px}
    .main-section .section-heading {margin-bottom:35px}
    .main-section .section-heading h2 {font-size:32px}
    .main-section .section-heading p {font-size:15px}
    .main-section .bottom-btn {padding-top:45px}

    .main-about-section .col-about {margin-bottom:0}
    .main-about-section .col-about + .col-about {margin-top:50px}
    .main-about-section .col-about h4 {font-size:18px}
    .main-about-section .col-about p {font-size:13px}
    .main-about-section .col-about .btn {margin-top:25px}

    .main-parallax-section {height:320px}
    .main-parallax-section h2 {font-size:36px}
    .main-parallax-section p {font-size:14px}

    .main-news-section .article-list tr {padding:25px 2px}
    .main-news-section .article-list tr:after {font-size:30px; margin-top:-24px}
    .main-news-section .article-list td a {display:inline-block; font-size:17px; max-width:calc(100% - 45px); text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
    .main-news-section .article-list td[align='center'] {font-size:13px; margin-top:0}

    .main-product-section {background-color:#f7f7f7}
    .main-product-section .article-list > tbody > tr > td {float:none; width:100%}
    .main-product-section .article-list > tbody > tr > td + td {margin-top:40px}
    .main-product-section .article-list table tr:last-child {padding:25px 20px}
    .main-product-section .article-list .board_output_gallery_subject {font-size:15px}
    .main-product-section .article-list .board_output_gallery_description {font-size:13px}
    .main-product-section .article-list table:hover {transform:none}
    
    .sub-section {padding-top:60px; padding-bottom:60px}
    .sub-section .main-heading {margin-bottom:40px}
    .sub-section .main-heading h2 {font-size:32px}
    .sub-section .main-heading p {font-size:15px}
    .sub-section .section-heading {text-align:center; margin-bottom:30px}
    .sub-section .section-heading h3 {font-size:20px}
    .sub-section .section-heading p {margin-top:15px; font-size:14px}
    .sub-section .bottom-btn {padding-top:45px}

    #sub-hero {height:250px}
    #sub-hero .caption-cell {padding-top:35px}
    #sub-hero .caption-cell h2 {font-size:28px}
    #sub-hero .caption-cell p {font-size:14px}

    .dropdown-nav-section .container {padding-left:0; padding-right:0}
    .dropdown-nav-section .link-home {display:none}
    .dropdown-nav-section .dropdown-wrap {width:50%}
    .dropdown-nav-section .dropdown-wrap > a {height:50px; font-size:14px; line-height:50px; border-right:none}
    .dropdown-nav-section .dropdown-wrap + .dropdown-wrap > a {border-left:1px solid #e9e9e9}
    .dropdown-nav-section .dropdown-wrap > .dropdown li a {font-size:14px}

    .about-visual-section .about-visual {padding:100px 0}
    .about-visual-section .about-visual h3 {font-size:20px}
    .about-visual-section .about-visual .col-visual {padding-top:20px; padding-bottom:20px; border-right:none}
    .about-visual-section .about-visual .col-visual:first-child {border-left:none}
    .about-visual-section .about-visual .col-visual .icon-wrap {font-size:42px}
    .about-visual-section .about-visual .col-visual h4 {font-size:17px}
    .about-visual-section .about-visual .col-visual p {font-size:13px}

    .about-summary-section .summary-heading {font-size:15px}
    .about-summary-section .summarylist dt, .about-summary-section .summarylist dd {font-size:13px}
    .about-summary-section .summarylist .list-inner {padding:15px}

    .about-team-section .col-team .team-info {padding:30px 25px}
    .about-team-section .col-team .team-info h4 {font-size:16px}
    .about-team-section .col-team .team-info span {font-size:12px}
    .about-team-section .col-team .team-info p {font-size:13px}

    .history-section .history-group .row + .row {margin-top:30px}
    .history-section .col-history {text-align:center; padding-top:20px; padding-bottom:20px; background-color:#fff}
    .history-section .col-history h4 {font-size:36px; margin-bottom:30px}
    .history-section .col-history h4:before {position:static; display:block; top:auto; left:auto; right:auto; width:12px; height:12px; margin:0 auto 10px; border:2px solid var(--point-color); border-radius:50%}
    .history-section .col-history h4:after {display:none}
    .history-section .col-history ul li {font-size:13px; color:#7a7a7a; line-height:1.65; padding-left:0; padding-right:0}
    .history-section .col-history ul li + li {margin-top:5px}
    .history-section .col-history ul li strong {position:static; top:auto; right:auto; left:auto; margin-right:10px}
    .history-section .col-history ul li p {display:inline-block}
    .history-section .col-history ul + img {margin-top:40px}

    .location-section .map-container {height:300px; margin-bottom:80px; box-shadow:30px 30px 50px -20px rgba(0,0,0,0.2)}
    .location-section .col-heading h3 {font-size:28px}
    .location-section .col-info {margin-top:40px}
    .location-section .col-info dl {padding:25px 25px 20px}
    .location-section .col-info dl dt, .location-section .col-info dl dd {font-size:14px}
    .location-section .col-info dl dt {min-width:80px}
    .location-section .col-info dl dd {margin-left:90px}

    .business-intro-section .col-circle + .col-circle {margin-top:40px}
    .business-intro-section .col-circle .circle-outer {padding-bottom:280px}
    .business-intro-section .col-circle .circle-inner {width:280px; margin-left:-140px; padding:40px 40px}
    .business-intro-section .col-circle .icon-wrap i, .business-intro-section .col-circle .icon-wrap ion-icon {font-size:56px}
    .business-intro-section .col-circle h4 {font-size:17px; margin:10px 0}
    .business-intro-section .col-circle p {font-size:13px}

    .business-goal-section .col-goal + .col-goal {margin-top:40px}
    .business-goal-section .col-goal .goal-box .desc-box {margin-top:-50px; margin-left:20px; margin-right:20px; padding:25px}
    .business-goal-section .col-goal .goal-box .desc-box h4 {font-size:15px}
    .business-goal-section .col-goal .goal-box .desc-box p {font-size:13px}

    .business-process-section .col-process {margin-bottom:0}
    .business-process-section .col-process + .col-process {margin-top:20px}
    .business-process-section .col-process .process-box {padding:30px}
    .business-process-section .col-process .process-box:before {top:6px; width:18px}
    .business-process-section .col-process .process-box .heading .num {font-size:32px}
    .business-process-section .col-process .process-box .heading span {display:inline-block; font-size:12px; padding-top:5px}
    .business-process-section .col-process .process-box p {font-size:14px}

    .business-field-section .col-features {margin-bottom:0}
    .business-field-section .col-features + .col-features {margin-top:20px}
    .business-field-section .col-features .feature-box {padding:35px 25px}
    .business-field-section .col-features .feature-box .icon-wrap i, .business-field-section .col-features .feature-box .icon-wrap ion-icon {font-size:52px}
    .business-field-section .col-features .feature-box h4 {margin:15px 0 10px; font-size:15px}
    .business-field-section .col-features .feature-box p {font-size:13px}

    .business-review-section .review-slider .slide-item p {font-size:17px; line-height:1.7; padding:0}
    .business-review-section .review-slider .slide-item .customer {margin-top:20px; font-size:12px}
    .business-review-section .review-slider .slick-arrow {display:none !important}
    .business-review-section .review-slider .slick-dots {padding-top:40px}

    .business-strong-section .col-num {font-size:56px}
    .business-strong-section .col-title h4 {font-size:18px; padding-top:5px}
    .business-strong-section .col-info h5 {font-size:16px}
    .business-strong-section .col-info p {font-size:13px}

    .table-photo > tbody > tr > td {float:none; width:100%; margin-bottom:30px}
    .table-photo .bbsnewf5 tr:first-child a {height:auto}

    .product-section .type-a-row .gallery_subject {padding-top:15px}
    .product-section .type-a-row .gallery_title {font-size:14px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
    .product-section .type-a-row .gallery_etc {font-size:12px}

    .product-section .type-b-row .bbsnewf5 .info-inner .category {font-size:12px}
    .product-section .type-b-row .bbsnewf5 .info-inner h4 {font-size:15px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}

    .board-category {margin-bottom:45px}
    .board-category ul {white-space:nowrap; overflow-y:auto}
    .board-category ul li {font-size:14px}
    .board-paging {padding-top:30px}
    .board-paging b, .board-paging a {font-size:13px}
    .board-write {padding-top:30px}
    .board-search {padding-top:40px}

    .table-article-view tr td {font-size:13px}
    .table-article-view .board_bgcolor {width:20%; min-width:80px}
    .board-view-thumbnails {margin-top:40px}
    .board-view-thumbnails > table {width:100%}
    .board-view-thumbnails > table table {width:33.333334%; margin-bottom:10px}
    .board-view-thumbnails > table table img {width:100%; height:auto !important}
	.table-article-write .board_desc input[type=text], .table-article-write .board_desc input[type=password], input[type=file] {width: 98%}

    .table-board-list .thead td, .table-board-list tbody td {padding:15px 12px !important}
    .table-board-list .thead td {font-size:14px}
    .table-board-list tbody td {font-size:13px; overflow:hidden; text-overflow:ellipsis}
    .table-board-list .bbsno {width:55px}
    .table-board-list .bbsetc_dateof_write {width:105px}
    .table-board-list td[rel='이벤트시작일'], .table-board-list td[rel='이벤트종료일'], .table-board-list .bbsetc_event_period_start, .table-board-list .bbsetc_event_period_finish {display:none}

    .faq-list .faq-type {width:32px; height:32px; font-size:15px; line-height:32px}
    .faq-list .board_bgcolor {text-align:left; width:60px}
    .faq-list .board_bgcolor:before {width:32px; height:32px; font-size:15px;line-height:32px}
    .faq-list .bbsnewf5:after {font-size:16px}
    .faq-list .bbsnewf5 a {font-size:16px}
    .faq-list .answer-row .answer-container {margin-left:60px; white-space:normal}

    .qna-list td[rel='작성일자'], .qna-list .bbsetc_dateof_write {display:none}

    .login-section .bottom-links {padding-top:20px}
    .login-section .bottom-links li {font-size:13px}
    .login-section .bottom-links li + li:before {height:12px; margin:0 10px}
    .register-section .register-steps {margin-bottom:40px}
    .register-section .register-steps li {font-size:14px; border-width:2px}
    .register-section .register-steps li + li:before {font-size:14px; margin-top:-8px}
    .register-section .register-steps li span[lang="en"] {font-size:11px}
    .register-section .terms-group {margin-bottom:25px; border:1px solid #dee2e6; border-radius:6px; overflow:hidden}
    .register-section .terms-group .heading {padding:16px 20px; font-size:16px}
    .register-section .terms-group .body {padding:25px 20px}
    .register-section .terms-group .footer {padding:16px 20px}
    .register-section .register-heading {font-size:19px}
    .register-section .form-group table td {font-size:13px}
    .register-section .form-group select[name^='birthday'] + select {margin-left:4px}
    .register-section .register-message {padding:32px 25px}
    .register-section .register-message h3 {font-size:18px}
    .register-section .register-message p {font-size:14px}
}