@charset "euc-kr";


/**********************************************
* ½ºÅÄ´Ùµå¹ÝÀÀÇü SD001 ÄÁÅÙÃ÷ css
* ¹öÀü : 1.6
* ¸±¸®Áî : 2017-10-26
* º» cssÀÇ ÀúÀÛ±ÇÀº µµÆ®ÇǾƿ¡ ÀÖ½À´Ï´Ù.
**********************************************/
/*------------------ ¸ÞÀÎÆäÀÌÁö ½ºÅ¸ÀÏ ------------------ */
/* Å°ºñÁÖ¾ó */
#keyVisual {
    position: relative;
    height: 900px;
    overflow: hidden
}


#keyVisual .bx-wrapper {
    height: 100%;
    border: none;
    background: transparent
}


#keyVisual .bx-wrapper .bx-viewport {
    height: 100% !important
}


#keyVisual .slides {
    position: relative;
    height: 100%
}


#keyVisual .slides>li {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover !important
}


#keyVisual .slides>li.slide-1 {
    background: url(../../img/keyvisual1.jpg) center top no-repeat
}


#keyVisual .slides>li.slide-2 {
    background: url(../../img/keyvisual2.jpg) center top no-repeat
}


#keyVisual .slides>li.slide-3 {
    background: url(../../img/keyvisual3.jpg) center top no-repeat
}


#keyVisual .slides>li .text {
    position: relative;
    top: 50%;
    max-width: 1200px;
    margin: -156px auto 0;
    color: #1a1a1a
}


#keyVisual .slides>li .text span {
    display: block;
    font-size: 18px
}


#keyVisual .slides>li .text h2 {
    font-size: 84px;
    font-weight: 300;
    margin: 15px 0 25px
}


#keyVisual .slides>li .text p {
    font-size: 22px;
    font-weight: 300;
    line-height: 1.5;
    margin-bottom: 15px
}


#keyVisual .slides>li .text .btn-arrow:hover {
    box-shadow: 0 2px 20px 10px rgba(0, 0, 0, 0.055)
}


#keyVisual .bx-controls-direction {
    opacity: 0;
    transition: opacity 0.3s
}


#keyVisual:hover .bx-controls-direction {
    opacity: 1
}


#keyVisual .bx-controls-direction a {
    position: absolute;
    top: 50%;
    width: 80px;
    height: 100px;
    font-size: 28px;
    text-align: center;
    line-height: 100px;
    color: #fff !important;
    text-indent: inherit;
    margin-top: -50px;
    background: rgba(0, 0, 0, 0.5);
    z-index: 30 !important
}


#keyVisual .bx-prev {
    left: 0
}


#keyVisual .bx-next {
    right: 0
}


#keyVisual .bx-pager {
    position: absolute;
    bottom: 50px;
    left: 0;
    width: 100%
}


#keyVisual .bx-pager .bx-pager-item {
    display: inline-block;
    margin: 0 4px
}


#keyVisual .bx-pager .bx-pager-item a {
    display: block;
    width: 20px;
    height: 5px;
    text-indent: -9999em;
    margin: 0;
    border-radius: 0;
    background: #fff;
    opacity: 0.5;
    transition: all 0.35s ease-in-out
}


#keyVisual .bx-pager .bx-pager-item a.active {
    width: 40px;
    background: #8f9598;
    opacity: 1
}


/* ¼½¼Ç °øÅë */
#mainContainer {
    position: relative;
    overflow: hidden
}


#mainContainer .main-section {
    position: relative;
    padding: 100px 0
}


#mainContainer .main-section:before,
#mainContainer .main-section:after {
    content: '';
    display: block
}


#mainContainer .main-section:after {
    clear: both
}


#mainContainer .main-section .main-title {
    margin-bottom: 40px;
    text-align: center
}


#mainContainer .main-section .main-title h2 {
    font-size: 42px;
    font-weight: 500;
    color: #222;
    letter-spacing: 2px;
    margin-bottom: 10px
}


#mainContainer .main-section .main-title h2:before {
    content: '';
    display: block;
    margin: 0 auto 15px;
    width: 1px;
    height: 40px;
    background: #dedede
}


#mainContainer .main-section .main-title p {
    font-size: 18px;
    color: #333
}


#mainContainer .main-section>.container {
    position: relative;
    max-width: 1200px;
    margin: auto
}


#mainContainer .main-section>.container:before,
#mainContainer .main-section>.container:after {
    content: '';
    display: block
}


#mainContainer .main-section>.container:after {
    clear: both
}


#mainContainer .main-section .btn-bottom {
    clear: both;
    margin-top: 50px;
    text-align: center
}


/* ¸ÞÀÎ ¼½¼Ç - OUR BUSINESS */
#mainContainer #section1 {}


#mainContainer #section1 .business-grid>li {
    text-align: center
}


#mainContainer #section1 .business-grid>li .imgBox {
    position: relative;
    overflow: hidden
}


#mainContainer #section1 .business-grid>li .imgBox:before {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0;
    transition: opacity 0.25s ease-in-out;
    z-index: 10
}


#mainContainer #section1 .business-grid>li .imgBox img {
    display: block;
    width: 100%;
    transition: transform 0.25s ease-in-out
}


#mainContainer #section1 .business-grid>li:hover .imgBox:before {
    opacity: 0.2
}


#mainContainer #section1 .business-grid>li:hover .imgBox img {
    transform: scale(1.15)
}


#mainContainer #section1 .business-grid>li .title {
    font-size: 32px;
    font-weight: 300;
    color: #333;
    line-height: 1.25;
    margin: 15px 0
}


#mainContainer #section1 .business-grid>li p {
    font-size: 15px;
    font-weight: 300;
    color: #7b7b7b;
    line-height: 1.45;
    word-break: keep-all;
    margin-bottom: 20px
}


/* ¸ÞÀÎ ¼½¼Ç - Æз²·¢½º À̹ÌÁö */
#mainContainer #section2 {
    padding: 250px 0
}


#mainContainer #section2:before {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .25;
    z-index: 5
}


#mainContainer #section2 .text {
    position: relative;
    text-align: center;
    z-index: 10
}


#mainContainer #section2 .text h2 {
    font-size: 36px;
    font-weight: 300;
    color: #fff
}


#mainContainer #section2 .text h3 {
    font-size: 18px;
    font-weight: 300;
    color: #fff
}




/* ¸ÞÀÎ ¼½¼Ç - contact us*/
#container .about-main1 {
    padding: 150px 0;
    background: url(../../img/about_main_bg1.jpg) center top no-repeat;
    background-size: cover
}


#container .about-main1 h3 {
    font-size: 24px;
    font-weight: normal;
    color: #fff;
    text-align: center;
    line-height: 1.6;
    margin-bottom: 80px
}


#container .about-main1 .company-info {
    display: table;
    width: 100%;
    max-width: 1200px;
    margin: auto;
    table-layout: fixed
}


#container .about-main1 .company-info>li {
    display: table-cell;
    padding: 50px 20px;
    color: #fff;
    text-align: center;
    border-right: 1px solid rgba(255, 255, 255, 0.25)
}


#container .about-main1 .company-info>li:first-child {
    border-left: 1px solid rgba(255, 255, 255, 0.25)
}


#container .about-main1 .company-info>li i {
    display: inline-block;
    font-size: 48px;
    height: 60px
}


#container .about-main1 .company-info>li h4 {
    font-size: 18px;
    font-weight: 600;
    margin: 10px 0 15px
}


#container .about-main1 .company-info>li p {
    font-size: 16px;
    line-height: 1.35
}


/* ¸ÞÀÎ ¼½¼Ç - WORKS */
#mainContainer #section4 {
    background: #f4f4f4
}


#mainContainer #section4 .photo-grid>table {
    position: relative;
    box-shadow: 0 30px 40px -20px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease
}


#mainContainer #section4 .photo-grid>table td {
    background: #fff
}


#mainContainer #section4 .photo-grid>table .board_output_gallery_img {
    position: relative;
    overflow: hidden
}


#mainContainer #section4 .photo-grid>table .board_output_gallery_img img {
    display: block;
    width: 100%;
    height: auto !important;
    transition: transform .3s
}


#mainContainer #section4 .photo-grid>table br {
    display: none
}


#mainContainer #section4 .photo-grid>table .board_output_gallery_img a:before {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0;
    z-index: 5;
    transition: opacity .3s
}


#mainContainer #section4 .photo-grid>table tr:last-child td {
    position: relative;
    margin-top: 10px;
    padding: 30px;
    vertical-align: top
}


#mainContainer #section4 .photo-grid>table tr span {
    text-align: left !important
}


#mainContainer #section4 .photo-grid>table .board_output_gallery_subject {
    display: block;
    margin-bottom: 20px
}


#mainContainer #section4 .photo-grid>table .board_output_gallery_subject a {
    font-size: 18px;
    font-weight: 300;
    color: #2b2b2b;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}


#mainContainer #section4 .photo-grid>table .board_output_gallery_description {
    display: -webkit-box;
    font-size: 14px;
    color: #9a9a9a;
    line-height: 1.5;
    max-height: 63px;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
}


/*
#mainContainer #section4 .photo-grid > table .board_output_gallery_description:before {position:absolute; bottom:30px; left:30px; content:'read more'; color:#666}
#mainContainer #section4 .photo-grid > table .board_output_gallery_description:after {position:absolute; bottom:29px; left:105px; content:'\e907'; font-family:'xeicon'; color:#666; transition:left 0.3s}
#mainContainer #section4 .photo-grid > table:hover .board_output_gallery_description:before, #mainContainer #section4 .photo-grid > table:hover .board_output_gallery_description:after {color:#77a180}
#mainContainer #section4 .photo-grid > table:hover .board_output_gallery_description:after {left:110px}
*/
#mainContainer #section4 .photo-grid>table:hover .board_output_gallery_img a img {
    transform: scale(1.125)
}


#mainContainer #section4 .photo-grid>table:hover .board_output_gallery_img a:before {
    opacity: 0.25
}


/*------------------ ¼­ºêÆäÀÌÁö ½ºÅ¸ÀÏ ------------------ */
/* ¼­ºêºñÁÖ¾ó */
#subVisual {
    position: relative;
    height: 480px;
    overflow: hidden
}


#subVisual>.visual_img {
    position: absolute;
    display: block;
    top: -50px;
    left: 50%;
    margin-left: -1250px;
    transform: scale(1.15);
    transition: transform 5s ease
}


#subVisual>.title {
    position: relative;
    display: table;
    max-width: 1200px;
    width: 100%;
    height: 100%;
    margin: auto
}


#subVisual>.title h2 {
    display: table-cell;
    height: 100%;
    font-family: 'Abel', 'Noto Sans KR';
    font-size: 48px;
    font-weight: normal;
    color: #fff;
    text-align: center;
    letter-spacing: 3px;
    padding-top: 35px;
    vertical-align: middle;
    opacity: 0;
    text-shadow: 0 3px 8px rgba(0, 0, 0, 0.15);
    transform: translateY(30px);
    transition: all 0.8s ease;
    transition-delay: 2s
}


#subVisual.load>.visual_img {
    transform: scale(1.0)
}


#subVisual.load>.title h2 {
    opacity: 1;
    transform: translateY(0)
}


/* ÆäÀÌÁö ³»ºñ°ÔÀÌ¼Ç */
#breadcrumbs {
    border-bottom: 1px solid #e2e2e2
}


#breadcrumbs>.container {
    max-width: 1200px;
    margin: auto
}


#breadcrumbs>.container>.home {
    float: left;
    width: 55px;
    height: 55px;
    font-size: 18px;
    color: #000;
    text-align: center;
    line-height: 55px;
    border-left: 1px solid #e2e2e2;
    border-right: 1px solid #e2e2e2
}


#breadcrumbs>.container>div {
    float: left;
    position: relative;
    width: 240px
}


#breadcrumbs>.container>div>a {
    position: relative;
    display: block;
    width: 100%;
    height: 55px;
    padding: 0 20px;
    font-size: 16px;
    color: #333;
    line-height: 55px;
    border-right: 1px solid #e2e2e2
}


#breadcrumbs>.container>div>a.current {
    font-weight: 600;
    color: #1f465f
}


#breadcrumbs>.container>div>a:after {
    position: absolute;
    right: 20px;
    content: '\e936';
    font-family: 'xeicon';
    font-size: 14px;
    color: #000;
    transition: transform 0.3s ease-in-out
}


#breadcrumbs>.container>div>ul {
    position: absolute;
    display: none;
    top: 55px;
    left: -1px;
    right: 0;
    padding: 25px 30px;
    border: 1px solid #dedede;
    background: #f9f9f9;
    z-index: 20
}


#breadcrumbs>.container>div>ul li a {
    font-size: 16px;
    color: #555;
    line-height: 2.2
}


#breadcrumbs>.container>div.open>a:after {
    transform: rotate(180deg)
}


/* ¼½¼Ç °øÅë */
#container {
    position: relative;
    overflow: hidden
}


#container img {
    max-width: 100%
}


#container .container-inner {
    position: relative;
    max-width: 1200px;
    margin: auto
}


#container .container-inner:before,
#container .container-inner:after,
#container .container-fluid:before,
#container .container-fluid:after,
#container section.sub-section:before,
#container section.sub-section:after {
    content: '';
    display: block
}


#container .container-inner:after,
#container .container-fluid:after,
#container section.sub-section:after {
    clear: both
}


#container section.sub-section {
    position: relative;
    padding: 80px 0
}


#container .main-title {
    padding: 50px 0;
    text-align: center
}


#container .main-title.innerTitle {
    padding-top: 0
}


#container .main-title h2 {
    font-size: 36px;
    font-weight: 300;
    color: #2b2b2b
}


#container .main-title p {
    font-size: 16px;
    font-weight: 300;
    color: #555;
    line-height: 1.6;
    margin-top: 25px
}


#container .main-title p strong {
    font-weight: 600;
    color: #77a180
}


#container .bottom-btn {
    padding-top: 60px;
    text-align: center
}


/* COMPANY - ȸ»ç¼Ò°³ */
#container .about-main {
    padding: 150px 0;
    background: url(../../img/about_main_bg.jpg) center top no-repeat;
    background-size: cover;
    overflow: hidden;
}


#container .about-main h3 {
    font-size: 24px;
    font-weight: normal;
    color: #fff;
    text-align: center;
    line-height: 1.6;
    margin-bottom: 80px
}


#container .about-main h4 {
    font-size: 30px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    line-height: 1.6;
}


#container .about-main h4 span {
    display: block;
}


#container .about-main h4 span:nth-child(odd) {
    font-size: 20px;
    font-weight: normal;
}


#container .about-main .company-info {
    display: table;
    width: 100%;
    max-width: 1200px;
    margin: auto;
    table-layout: fixed
}


#container .about-main .company-info>li {
    display: table-cell;
    padding: 50px 20px;
    color: #fff;
    text-align: center;
    border-right: 1px solid rgba(255, 255, 255, 0.25)
}


#container .about-main .company-info>li:first-child {
    border-left: 1px solid rgba(255, 255, 255, 0.25)
}


#container .about-main .company-info>li i {
    display: inline-block;
    font-size: 48px;
    height: 60px
}


#container .about-main .company-info>li h4 {
    font-size: 18px;
    font-weight: 600;
    margin: 10px 0 15px
}


#container .about-main .company-info>li p {
    font-size: 16px;
    line-height: 1.35
}


#container .about-section1 {
    padding-bottom: 0 !important
}


#container .about-section1 .about-desc {
    font-size: 18px;
    color: #3b3b3b;
    text-align: center;
    line-height: 1.75;
    margin-bottom: 60px
}


#container .about-section1 .about-info {}


#container .about-section1 .about-info:after {
    content: '';
    clear: both;
    display: block
}


#container .about-section1 .about-info dt,
#container .about-section1 .about-info dd {
    font-size: 15px;
    line-height: 1
}


#container .about-section1 .about-info dt {
    float: left;
    display: block;
    width: 130px;
    padding: 20px 15px;
    font-weight: 600;
    color: #2b2b2b;
    border-top: 1px solid #333
}


#container .about-section1 .about-info dd {
    display: block;
    margin-left: 150px;
    padding: 20px 15px;
    color: #666;
    border-top: 1px solid #e2e2e2;
    line-height: 1.5;
}


#container .about-section2 .team-info>li {
    transition: opacity 0.4s ease
}


#container .about-section2 .team-info>li:before {
    content: '';
    display: block;
    height: 1px;
    margin-bottom: 30px;
    background: #e5e5e5;
    transition: background 0.4s ease
}


#container .about-section2 .team-info>li .imgBox {
    overflow: hidden
}


#container .about-section2 .team-info>li .imgBox img {
    display: block;
    width: 100%
}


#container .about-section2 .team-info>li .detail h3 {
    font-size: 24px;
    font-weight: 300;
    color: #2b2b2b;
    margin: 35px 0 5px
}


#container .about-section2 .team-info>li .detail .subtit {
    display: block;
    font-size: 14px;
    font-weight: 300;
    color: #9a9a9a;
    margin-bottom: 25px
}


#container .about-section2 .team-info>li .detail p {
    color: #6a6a6a;
    line-height: 1.85
}


#container .about-section2 .team-info>li .detail .sns-link {
    margin-top: 25px;
    font-size: 0
}


#container .about-section2 .team-info>li .detail .sns-link>li {
    display: inline-block;
    font-size: 18px;
    margin-right: 10px
}


#container .about-section2 .team-info>li .detail .sns-link>li a {
    font-size: 18px;
    color: #77a180
}


/* COMPANY - ¿¬Çõ */
#container .history-section {
    padding: 20px 0 80px !important
}


#container .history-section .year-wrap {
    position: relative;
    padding-bottom: 50px
}


#container .history-section .year-wrap:after {
    content: '';
    clear: both;
    display: block
}


#container .history-section .year-wrap:before {
    position: absolute;
    top: 0;
    left: 50%;
    content: '';
    width: 1px;
    height: 100%;
    margin-left: 1px;
    background: #e2e2e2;
    z-index: 10
}


#container .history-section .year-wrap:last-child {
    padding-bottom: 200px
}


#container .history-section .year-wrap>.year {
    position: relative;
    width: 80px;
    height: 80px;
    margin: auto;
    font-family: 'Abel', 'Noto Sans KR', sans-serif;
    font-size: 24px;
    font-weight: 300;
    color: #fff;
    text-align: center;
    line-height: 80px;
    border-radius: 50%;
    background: #77a180;
    z-index: 20
}


#container .history-section .year-wrap>ul {
    position: relative
}


#container .history-section .year-wrap>ul:after {
    content: '';
    clear: both;
    display: block
}


#container .history-section .year-wrap>ul>li {
    position: relative;
    margin-top: 40px;
    padding-left: 55%
}


#container .history-section .year-wrap>ul>li:before {
    position: absolute;
    top: 5px;
    left: 50%;
    content: '';
    width: 16px;
    height: 16px;
    margin-left: -8px;
    border: 2px solid #77a180;
    border-radius: 50%;
    background: #fff;
    z-index: 20
}


#container .history-section .year-wrap>ul>li.left {
    text-align: right;
    padding-left: 0;
    padding-right: 55%
}


#container .history-section .year-wrap>ul>li .inner {
    margin: auto
}


#container .history-section .year-wrap>ul>li h3 {
    font-size: 26px;
    font-weight: normal;
    color: #77a180;
    margin-bottom: 20px
}


#container .history-section .year-wrap>ul>li dl dt,
#container .history-section .year-wrap>ul>li dl dd {
    font-size: 15px
}


#container .history-section .year-wrap>ul>li dl dt {
    font-family: 'Abel', 'Noto Sans KR', sans-serif;
    font-weight: normal;
    color: #8a8a8a;
    letter-spacing: 1px;
    margin-bottom: 15px
}


#container .history-section .year-wrap>ul>li dl dd {
    color: #6a6a6a;
    line-height: 1.6
}


#container .history-section .finish-box {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 140px;
    height: 140px;
    margin-left: -70px;
    text-align: center;
    border: 6px solid #f2f2f2;
    border-radius: 50%;
    background: #77a180;
    z-index: 20
}


#container .history-section .finish-box:before {
    display: inline-block;
    content: '';
    height: 100%;
    vertical-align: middle
}


#container .history-section .finish-box p {
    display: inline-block;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    line-height: 1.65;
    vertical-align: middle
}


/* COMPANY - ¿À½Ã´Â±æ */
#container .location-section {
    padding: 0 0 80px !important
}


#container .location-section #map {
    height: 500px;
    margin-bottom: 50px
}


#container .location-section h3 {
    font-size: 20px;
    font-weight: normal;
    color: #2b2b2b;
    margin-bottom: 5px
}


#container .location-section h4 {
    font-size: 15px;
    font-weight: normal;
    color: #8a8a8a;
    margin-bottom: 60px
}


#container .location-section h4 span:before {
    content: '';
    display: inline-block;
    width: 1px;
    height: 12px;
    margin: 0 10px;
    background: #ccc;
    vertical-align: -1px
}


#container .location-section .method-wrapper {
    border-top: 3px solid #a46f0e
}


#container .location-section .method-wrapper .method-line {
    padding: 30px;
    border-bottom: 1px dotted #bbb
}


#container .location-section .method-wrapper .method-line p.title {
    font-size: 20px;
    font-weight: normal;
    color: #a46f0e;
    margin-bottom: 15px
}


#container .location-section .method-wrapper .method-line dl:after {
    content: '';
    clear: both;
    display: block
}


#container .location-section .method-wrapper .method-line dl dt,
#container .location-section .method-wrapper .method-line dl dd {
    font-size: 15px;
    padding: 7px 0
}


#container .location-section .method-wrapper .method-line dl dt {
    clear: both;
    float: left;
    font-weight: normal;
    color: #2b2b2b;
    padding-right: 20px
}


#container .location-section .method-wrapper .method-line dl dd {
    color: #6a6a6a
}


#container .location-section .method-wrapper .method-line dl dd .arrow:before {
    display: inline-block;
    content: '\e90b';
    font-family: 'xeicon';
    margin: 0 8px
}


#container .location-section .method-wrapper .method-line .subway {
    display: inline-block;
    color: #fff
}


#container .location-section .method-wrapper .method-line .subway.line1 {
    background: #00498b
}


#container .location-section .method-wrapper .method-line .subway.line2 {
    background: #009246
}


#container .location-section .method-wrapper .method-line .subway.line3 {
    background: #f36630
}


#container .location-section .method-wrapper .method-line .subway.line4 {
    background: #00a2d1
}


#container .location-section .method-wrapper .method-line .subway.line5 {
    background: #5940ff
}


#container .location-section .method-wrapper .method-line .subway.line6 {
    background: #cc660d
}


#container .location-section .method-wrapper .method-line .subway.line7 {
    background: #4d8000
}


#container .location-section .method-wrapper .method-line .subway.line8 {
    background: #ff33a6
}


#container .location-section .method-wrapper .method-line dl dt.subway {
    position: relative;
    top: 4px;
    margin-right: 20px;
    padding: 4px 10px
}


#container .location-section .method-wrapper .method-line span.subway {
    margin: 0 5px;
    padding: 0 6px;
    border-radius: 50%
}


#container .location-section .method-wrapper .method-line .box {
    float: left;
    width: 50%
}


#container .location-section .method-wrapper .method-line .box.last {
    width: 20%;
    padding-top: 42px
}


/*Ãß°¡¹®Àå*/
#container .location-section .method-wrapper .method-line .box1 {
    float: left;
    width: 100%
}


#container .location-section .method-wrapper .method-line .box1.last {
    width: 20%;
    padding-top: 42px
}


#container .location-section h5 {
    font-size: 15px;
    font-weight: normal;
    color: #8a8a8a;
    margin-bottom: 20px
}


#container .location-section h5 span:before {
    content: '';
    display: inline-block;
    width: 1px;
    height: 12px;
    margin: 0 10px;
    background: #ccc;
    vertical-align: -1px
}


#container .location-section h6 {
    margin-bottom: 40px
}


#container .location-section {
    margin-bottom: 40px
}


#container .location-section .category>ul {
    font-size: 0;
    text-align: center
}


#container .location-section .category>ul>li {
    display: inline-block;
    margin: 0 2px;
    font-size: 15px
}


#container .location-section .category>ul>li a {
    display: block;
    padding: 5px 10px
}


#container .location-section .category>ul>li.active a {
    font-weight: 500;
    color: #fff;
    background: #40424b !important
}








/* BUSINESS - »ç¾÷¼Ò°³ */
#container .business-intro {
    padding-top: 0 !important
}


#container .business-intro .business-info>li {
    position: relative;
    text-align: center
}


#container .business-intro .business-info>li:before {
    position: absolute;
    top: 0;
    left: -1px;
    content: '';
    width: 1px;
    height: 100%;
    background: #eee
}


#container .business-intro .business-info>li:first-child:before {
    display: none
}


#container .business-intro .business-info>li .iconBox img {
    max-width: 160px
}


#container .business-intro .business-info>li h3 {
    margin: 40px 0 30px;
    font-size: 18px;
    font-weight: 600;
    color: #77a180
}


#container .business-intro .business-info>li p {
    color: #6a6a6a;
    line-height: 1.8;
    word-break: keep-all
}


#container .business-detail {
    background: #f7f7f7
}


#container .business-detail .detail-items {
    white-space: nowrap;
    overflow: hidden
}


#container .business-detail .detail-items>li {
    position: relative;
    width: 33.333%;
    height: 500px;
    text-align: center;
    overflow: hidden;
    transition: width 0.3s ease-out
}


#container .business-detail .detail-items>li .bg {
    position: absolute;
    top: 0;
    left: 50%;
    width: 600px;
    margin-left: -300px
}


#container .business-detail .detail-items>li .bg:before {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.2;
    transition: opacity 0.3s ease-out;
    z-index: 10
}


#container .business-detail .detail-items>li .bg>img {
    display: block;
    max-width: 100%
}


#container .business-detail .detail-items>li .info-box {
    position: relative;
    top: 40%;
    padding: 0 30px;
    transition: top 0.3s ease-out;
    z-index: 20
}


#container .business-detail .detail-items>li .info-box span {
    display: block;
    font-size: 13px;
    color: #77a180;
    margin-top: 15px
}


#container .business-detail .detail-items>li .info-box h3 {
    font-size: 20px;
    font-weight: 500;
    color: #fff;
    margin-bottom: 20px
}


#container .business-detail .detail-items>li .info-box p {
    font-size: 14px;
    color: #fff;
    line-height: 1.75;
    white-space: normal;
    word-break: keep-all;
    width: 300px;
    margin: auto auto 30px;
    opacity: 0;
    transition: opacity 0.3s ease-out
}


#container .business-detail .detail-items>li .info-box a {
    opacity: 0;
    transition: all 0.3s ease-out
}


/* BUSINESS - »ç¾÷¼Ò°³ È«º¸¿µ»ó ¸ð´Þ */
#container .business-detail #promo-wrapper {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999
}


#container .business-detail #promo-wrapper>.mask-layer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.75;
    z-index: 100
}


#container .business-detail #promo-wrapper>.modal {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80%;
    max-width: 800px;
    height: 450px;
    margin: -225px 0 0 -400px;
    box-shadow: 0 0 60px 10px rgba(0, 0, 0, 0.2);
    opacity: 0;
    z-index: 120;
    transform: translateY(-50px);
    transition: all 0.4s ease-out
}


#container .business-detail #promo-wrapper>.modal .btn-close {
    position: absolute;
    top: 0;
    right: -60px;
    width: 40px;
    height: 40px;
    cursor: pointer;
    border: none;
    background: transparent;
    outline: none
}


#container .business-detail #promo-wrapper>.modal .btn-close span {
    position: absolute;
    display: block;
    top: 16px;
    left: 50%;
    width: 42px;
    height: 2px;
    margin-left: -21px;
    background: #fff
}


#container .business-detail #promo-wrapper>.modal .btn-close .closeline1 {
    transform: rotate(45deg)
}


#container .business-detail #promo-wrapper>.modal .btn-close .closeline2 {
    transform: rotate(-45deg)
}


#container .business-detail #promo-wrapper.play>.modal {
    opacity: 1;
    transform: translateY(0)
}


/* BUSINESS - »ç¾÷ ºÐ¾ß */
#container .business-part1 {
    padding-top: 20px !important
}


#container .business-part1 .part-items>li {
    margin-bottom: 60px;
    text-align: center;
    vertical-align: top
}


#container .business-part1 .part-items>li:nth-child(4),
#container .business-part1 .part-items>li:nth-child(5),
#container .business-part1 .part-items>li:nth-child(6) {
    margin-bottom: 0
}


#container .business-part1 .part-items>li .icon {
    width: 80px;
    height: 80px;
    font-size: 34px;
    color: #77a180;
    text-align: center;
    line-height: 76px;
    margin: auto;
    border: 2px solid #e2e2e2;
    border-radius: 50%;
    transition: all 0.3s ease-out
}


#container .business-part1 .part-items>li h3 {
    margin: 30px 0 15px;
    font-size: 22px;
    font-weight: 500;
    color: #77a180
}


#container .business-part1 .part-items>li p {
    font-size: 15px;
    color: #6a6a6a;
    line-height: 1.8
}


#container .business-part2 {
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0
}


#container .business-part2 .choose-info .text-info h3 {
    font-size: 28px;
    font-weight: normal;
    color: #2b2b2b
}


#container .business-part2 .choose-info .text-info h3:after {
    display: block;
    content: '';
    width: 35px;
    height: 2px;
    margin: 20px 0 30px;
    background: #77a180
}


#container .business-part2 .choose-info .text-info p {
    color: #4a4a4a;
    line-height: 1.75;
    margin-bottom: 25px
}


#container .business-part3 {
    border-bottom: 1px solid #f0f0f0
}


#container .business-part3 #client-slide>.info {
    float: left;
    width: 30%
}


#container .business-part3 #client-slide>.info h3 {
    font-size: 22px;
    font-weight: normal;
    color: #2b2b2b;
    margin-bottom: 20px
}


#container .business-part3 #client-slide>.info p {
    color: #6a6a6a;
    line-height: 1.8
}


#container .business-part3 #client-slide>.info .controller {
    padding-top: 30px;
    font-size: 0
}


#container .business-part3 #client-slide>.info .controller>li {
    display: inline-block;
    font-size: 15px;
    margin-right: 3px
}


#container .business-part3 #client-slide>.info .controller>li a {
    display: block;
    width: 32px;
    height: 32px;
    font-size: 13px;
    color: #000;
    text-align: center;
    line-height: 30px;
    border: 1px solid #e2e2e2;
    border-radius: 50%;
    transition: all 0.3s ease
}


#container .business-part3 #client-slide>.info .controller>li.disabled a {
    color: #ccc !important;
    border-color: #e2e2e2 !important;
    background: #f9f9f9 !important;
    cursor: not-allowed
}


#container .business-part3 #client-slide>.info .controller>li a:hover {
    color: #fff;
    border-color: #2b2b2b;
    background: #2b2b2b
}


#container .business-part3 #client-slide>.slides {
    position: relative;
    float: right;
    width: 65%;
    padding-top: 60px;
    overflow: hidden
}


#container .business-part3 #client-slide>.slides ul {
    position: relative;
    width: 5000px
}


#container .business-part3 #client-slide>.slides ul>li {
    float: left;
    text-align: center
}


#container .business-part3 #client-slide>.slides ul>li img {
    max-width: 100%
}


#container .business-part4 {}


#container .business-part4 .plan-list>li {
    font-size: 14px;
    text-align: center;
    vertical-align: bottom
}


#container .business-part4 .plan-list>li .title {
    padding: 35px
}


#container .business-part4 .plan-list>li.plan1 .title {
    background: linear-gradient(90deg, #42b574 0%, #84c450 100%)
}


#container .business-part4 .plan-list>li.plan2 .title {
    background: linear-gradient(90deg, #64aae1 0%, #79ccf2 100%)
}


#container .business-part4 .plan-list>li.plan3 .title {
    background: linear-gradient(90deg, #f5bf2f 0%, #f3a43d 100%)
}


#container .business-part4 .plan-list>li.plan4 .title {
    background: linear-gradient(90deg, #f54b0f 0%, #e50a0a 100%)
}


#container .business-part4 .plan-list>li .title>h3 {
    font-size: 24px;
    font-weight: 500;
    color: #fff
}


#container .business-part4 .plan-list>li .title>span {
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    margin-bottom: 15px;
    opacity: 0.8
}


#container .business-part4 .plan-list>li .title>.price {
    font-size: 24px;
    font-weight: 500;
    color: #fff
}


#container .business-part4 .plan-list>li .title>.price span {
    font-size: 18px;
    font-weight: 500;
    color: #fff;
    vertical-align: 5px
}


#container .business-part4 .plan-list>li .title>.price em {
    font-size: 13px;
    color: #fff;
    padding-left: 5px;
    vertical-align: -2px
}


#container .business-part4 .plan-list>li .info {
    padding: 20px;
    border: 1px solid #f0f0f0;
    border-top: none
}


#container .business-part4 .plan-list>li .info>ul {
    margin-bottom: 20px
}


#container .business-part4 .plan-list>li .info>ul>li {
    padding: 10px 0;
    color: #8b8b8b;
    border-top: 1px solid #f0f0f0
}


#container .business-part4 .plan-list>li .info>ul>li:first-child {
    border-top: none
}


#container .business-part4 .plan-list>li .info>ul>li strong {
    font-weight: 600;
    color: #2b2b2b;
    padding-right: 5px
}


#container .business-part4 .plan-list>li .info .btn-black {
    padding-top: 18px;
    padding-bottom: 18px
}




/*------------------ ¹öÆ° ½ºÅ¸ÀÏ ------------------ */
.btn-arrow {
    position: relative;
    display: inline-block;
    font-size: 15px;
    color: #666;
    text-align: left;
    line-height: 1;
    padding: 15px;
    width: 230px;
    border: 1px solid #dedede;
    transition: all 0.3s
}


.btn-arrow i {
    position: absolute;
    right: 25px;
    transition: right 0.3s
}


.btn-arrow:hover {
    color: #77a180
}


.btn-arrow:hover i {
    right: 15px
}


.btn-arrow.white {
    color: #fff;
    border-color: #fff
}


.btn-arrow.white:hover {
    color: #2b2b2b;
    background: #fff
}


.btn-arrow.black {
    color: #fff;
    border-color: #353535;
    background: #353535
}


.btn-arrow.black:hover {
    border-color: #000;
    background: #000
}


.btn {
    display: inline-block;
    font-size: 14px;
    line-height: 33px;
    height: 35px;
    padding: 0 15px;
    border: 1px solid transparent;
    border-radius: 2px !important;
    background: #fff;
    cursor: pointer;
    outline: none
}


.btn-default {
    color: #6b6b6b !important;
    border: 1px solid #e2e2e2;
    background: #fff
}


.btn-default:hover {
    color: #454545 !important;
    border-color: #aaa;
    background: #f9f9f9
}


.btn-function {
    color: #eee !important;
    border-color: #40424b;
    background: #40424b
}


.btn-function:hover {
    color: #fff !important;
    border-color: #32343f;
    background: #32343f
}


.btn-admin {
    color: #fff !important;
    border-color: #77a180;
    background: #77a180
}


.btn-admin:hover {
    border-color: #cc2c2c;
    background: #cc2c2c
}


.btn-danger {
    color: #fff !important;
    border-color: #d92f2f;
    background: #d92f2f
}


.btn-danger:hover {
    border-color: #cf2b2b;
    background: #cf2b2b
}


.btn-primary {
    display: inline-block;
    font-size: 14px;
    color: #fff;
    line-height: 1;
    padding: 15px 25px;
    border-radius: 3px;
    background: #77a180;
    transition: all 0.4s
}


.btn-primary:hover {
    background: #77a180;
    box-shadow: 0 2px 8px 2px rgba(0, 0, 0, 0.1)
}


.btn-black {
    display: inline-block;
    font-size: 15px;
    color: #fff;
    line-height: 1;
    padding: 15px 25px;
    background: #4b4b4b;
    transition: all 0.4s
}


.btn-black:hover {
    background: #77a180
}


.btn-block {
    display: block;
    width: 100%
}


.btn-load {
    cursor: not-allowed;
    color: #aaa;
    border-color: #ccc !important;
    background: #eee !important
}


/*------------------ ÀÎDz ¹× ¼¿·ºÆ® ½ºÅ¸ÀÏ ------------------ */
.frm-input {
    height: 35px;
    padding: 0 10px;
    border: 1px solid #e3e2e2;
    background: #fff;
    outline: none
}


.frm-input:focus {
    border-color: #40424b;
    background: #f9f9f9
}


.frm-select {
    height: 35px;
    padding: 0 30px 0 10px;
    border: 1px solid #e2e2e2;
    cursor: pointer;
    background: url(../../img/select_arrow.png) right 10px center no-repeat;
    outline: none
}


.frm-select:focus {
    border-color: #40424b;
    background-color: #f9f9f9
}


/*------------------ °Ô½ÃÆÇ ½ºÅ¸ÀÏ ------------------ */
/* ¸®½ºÆ®Çü ½ºÅ¸ÀÏ */
.tbl-brd-list {
    width: 100%;
    margin-bottom: 40px
}


.tbl-brd-list tr td {
    position: relative;
    padding: 15px;
    border-bottom: 1px solid #e2e2e2
}


.tbl-brd-list tr td[width="26"] {
    width: 60px
}


.tbl-brd-list tr td,
.tbl-brd-list font,
.tbl-brd-list span {
    font-family: inherit !important;
    font-size: inherit !important;
    color: inherit !important
}


.tbl-brd-list .att_title {
    font-weight: 500;
    color: #fff !important;
    text-align: center;
    border: none !important;
    background: #40424b !important
}


.tbl-brd-list tr:nth-child(even) {
    background: #f9f9f9
}


.tbl-brd-list tr td:first-child:before {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 5px;
    height: 100%;
    background: rgba(0, 0, 0, 0.15);
    opacity: 0;
    transition: opacity 0.25s ease
}


.tbl-brd-list tr:hover td a {
    color: #000
}


.tbl-brd-read {
    width: 100%;
    margin-bottom: 40px;
    border-top: 1px solid #40424b;
    table-layout: fixed
}


.tbl-brd-read tr td {
    height: auto !important;
    padding: 15px;
    border-bottom: 1px solid #e2e2e2
}


.tbl-brd-read tr td,
.tbl-brd-read tr td font,
.tbl-brd-read tr td span {
    font-family: inherit !important;
    font-size: inherit !important
}


.tbl-brd-read .board_bgcolor {
    font-weight: 500;
    color: #40424b;
    background-color: transparent !important
}


.tbl-brd-read .board_bgcolor font {
    color: #40424b !important
}


/* FAQ ½ºÅ¸ÀÏ */
.tbl-brd-faq {
    width: 100%;
    margin-bottom: 40px;
    border-top: 1px solid #40424b
}


.tbl-brd-faq tr td {
    background: #fff !important
}


.tbl-brd-faq .board_bgcolor:after {
    display: inline-block;
    content: 'Q';
    width: 30px;
    height: 30px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    text-align: center;
    line-height: 30px;
    border-radius: 2px;
    background: #40424b
}


.tbl-brd-faq .board_bgcolor font {
    display: none
}


.tbl-brd-faq .bbsnewf5 {
    position: relative
}


.tbl-brd-faq .bbsnewf5:after {
    position: absolute;
    top: 0;
    right: 15px;
    content: '\e941';
    font-family: 'xeicon';
    font-size: 14px;
    color: #454545;
    line-height: 61px
}


.tbl-brd-faq .bbsnewf5.open:after {
    content: '\e944'
}


.tbl-brd-faq .reply-row {
    display: none
}


.tbl-brd-faq .reply-row.open {
    display: table-row
}


.tbl-brd-faq .reply-row td {
    padding: 15px 35px 15px;
    background: #f7f7f7 !important
}


.tbl-brd-faq .reply-row td .reply-block {
    float: left;
    display: block;
    width: 30px;
    height: 30px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    text-align: center;
    line-height: 30px;
    border-radius: 2px;
    background: #77a180
}


.tbl-brd-faq .reply-row td .reply-container {
    margin-left: 80px
}


/* °¶·¯¸®Çü ½ºÅ¸ÀÏ */
div[class^=photo-grid-] .photo-grid-inner {
    margin: 0 -15px
}


div[class^=photo-grid-] .photo-grid-inner:after {
    content: '';
    clear: both;
    display: block
}


div[class^=photo-grid-] .photo-grid-inner>table {
    position: relative;
    float: left;
    margin-bottom: 30px;
    padding: 0 15px;
    overflow: hidden
}


div[class^=photo-grid-] .photo-grid-inner>table a {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden
}


div[class^=photo-grid-] .photo-grid-inner>table img {
    width: 100% !important;
    height: auto !important
}


div[class^=photo-grid-] .photo-grid-inner>table .overlay {
    position: absolute;
    top: 80%;
    left: 0;
    right: 0;
    height: 100%;
    background: rgba(119, 161, 128, 0.85);
    opacity: 0;
    z-index: 5;
    transition: all 0.35s ease
}


div[class^=photo-grid-] .photo-grid-inner>table .post-info {
    position: absolute;
    bottom: 20px;
    left: 30px;
    text-align: left;
    opacity: 0;
    z-index: 10;
    transition: all 0.35s ease
}


div[class^=photo-grid-] .photo-grid-inner>table .post-info h3 {
    font-size: 16px;
    font-weight: normal;
    color: #fff
}


div[class^=photo-grid-] .photo-grid-inner>table .post-info h3:after {
    content: '';
    display: block;
    width: 30px;
    height: 1px;
    margin: 15px 0;
    background: #fff
}


div[class^=photo-grid-] .photo-grid-inner>table .post-info span {
    font-size: 12px;
    color: #fff
}


div[class^=photo-grid-] .photo-grid-inner>table:hover .overlay {
    top: 0;
    opacity: 1
}


div[class^=photo-grid-] .photo-grid-inner>table:hover .post-info {
    bottom: 30px;
    opacity: 1
}


div[class^=photo-grid-] .photo-grid-inner>table:last-child {
    display: none
}


div[class^=photo-grid-] .photo-grid-inner .board {
    float: none;
    clear: both;
    width: 100%;
    padding-top: 40px
}


.container-fluid div[class^=photo-grid-] .photo-grid-inner,
.no-gap .photo-grid-inner {
    margin-left: 0 !important;
    margin-right: 0 !important
}


.container-fluid div[class^=photo-grid-] .photo-grid-inner>table,
.no-gap .photo-grid-inner>table {
    margin-bottom: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important
}


.container-fluid div[class^=photo-grid-] .photo-grid-inner>table .overlay,
.no-gap .photo-grid-inner>table .overlay {
    left: 0 !important;
    right: 0 !important
}


.container-fluid div[class^=photo-grid-] .photo-grid-inner>table .post-info,
.no-gap .photo-grid-inner>table .post-info {
    left: 30px
}


.container-fluid div[class^=photo-grid-] .photo-container {
    max-width: 1200px;
    margin: auto
}


.photo-grid-2 .photo-grid-inner>table {
    width: 50%
}


/* .photo-grid-3 .photo-grid-inner>table {
    width: 33.333334%
} */


.photo-grid-4 .photo-grid-inner>table {
    width: 25%
}


.photo-grid-5 .photo-grid-inner>table {
    width: 20%
}


.photo-grid-6 .photo-grid-inner>table {
    width: 16.666667%
}


.photo-grid-7 .photo-grid-inner>table {
    width: 14.285714%
}


.photo-grid-8 .photo-grid-inner>table {
    width: 12.5%
}


/* ÃÖ±Ù °Ô½Ã¹° - ¸®½ºÆ®Çü */
.tbl-brd-latest {
    width: 100%;
    border-top: 1px solid #e5e5e5;
    table-layout: fixed
}


.tbl-brd-latest td[width="1%"] {
    display: none
}


.tbl-brd-latest td[align="center"] {
    text-align: right
}


.tbl-brd-latest tr td {
    font-size: 14px;
    font-weight: 600;
    color: #888;
    padding: 30px 50px;
    border-bottom: 1px solid #e5e5e5
}


.tbl-brd-latest tr td a {
    font-size: 18px;
    font-weight: 300;
    color: #7b7b7b
}


.tbl-brd-latest tr td a:hover {
    color: #77a180
}


/* °Ô½ÃÆÇ °øÅë */
/* Å×À̺í */
.board,
.bbsnewf5 {
    font: inherit !important
}


.board-write {
    text-align: right;
    margin-bottom: 30px
}


/* ºäÆäÀÌÁö */
#post_area {
    min-height: 150px
}


#post_area img {
    height: auto !important
}


/* ÀÎDz ¹× ¼¿·ºÆ® */
input#border {
    height: 35px;
    padding: 0 10px;
    border: 1px solid #e3e2e2;
    background: #fff;
    outline: none
}


input#border:focus {
    border-color: #40424b;
    background: #f9f9f9
}


input#border[type=file] {
    width: 100%;
    border: none
}


.board_desc select {
    height: 35px;
    padding: 0 30px 0 10px;
    border: 1px solid #e2e2e2;
    cursor: pointer;
    background: url(../../img/select_arrow.png) right 10px center no-repeat;
    outline: none
}


.board_desc select:focus {
    border-color: #40424b;
    background-color: #f9f9f9
}


/* Ä«Å×°í¸® */
.board-category {
    margin-bottom: 40px
}


.board-category ul {
    font-size: 0;
    text-align: center
}


.board-category ul>li {
    display: inline-block;
    margin: 0 2px;
    font-size: 15px
}


.board-category ul>li a {
    display: block;
    padding: 5px 10px
}


.board-category ul>li.active a {
    font-weight: 500;
    color: #fff;
    background: #40424b !important
}


/* ÆäÀÌ¡ */
.board-paging {
    margin-bottom: 30px;
    font-size: 0;
    text-align: center
}


.board-paging>b,
.board-paging>a {
    display: inline-block;
    width: 30px;
    height: 30px;
    margin: 0 3px;
    font-size: 13px;
    line-height: 28px;
    border: 1px solid #e2e2e2;
    border-radius: 50%
}


.board-paging>a {
    color: #6b6b6b
}


.board-paging>a:hover {
    color: #454545;
    border-color: #ccc;
    background: #f9f9f9
}


.board-paging>b {
    color: #fff !important;
    border-color: #40424b !important;
    background: #40424b !important
}


/* °Ë»ö */
#ext_search input[type=text] {
    width: 160px;
    height: 35px;
    margin: 0 5px;
    padding: 0 10px;
    border: 1px solid #e3e2e2;
    background: #fff;
    outline: none
}


#ext_search input[type=text]:focus {
    border-color: #40424b;
    background: #f9f9f9
}


#ext_search select {
    min-width: 80px;
    height: 35px;
    padding: 0 30px 0 10px;
    border: 1px solid #e2e2e2;
    cursor: pointer;
    background: url(../../img/select_arrow.png) right 10px center no-repeat;
    outline: none
}


#ext_search select:focus {
    border-color: #40424b;
    background-color: #f9f9f9
}


/*------------------ Æû¸ÞÀÏ ½ºÅ¸ÀÏ ------------------ */
input.formmail_border {
    width: 100%;
    height: 35px;
    padding: 0 10px;
    border: 1px solid #e3e2e2;
    background: #fff;
    outline: none
}


input.formmail_border:focus {
    border-color: #40424b;
    background: #f9f9f9
}


input.formmail_border[name^=phone] {
    width: 60px !important
}


input.formmail_border[type=file] {
    border: none
}


.formmail_cell_bgcolor textarea {
    width: 100%;
    padding: 10px;
    font-family: inherit !important;
    font-size: inherit !important;
    border: 1px solid #e3e2e2;
    background: #fff;
    outline: none
}


.formmail_cell_bgcolor textarea:focus {
    border-color: #40424b;
    background: #f9f9f9
}


/* ----------------------------------------------------------
* ¹Ìµð¾î Äõ¸®
---------------------------------------------------------- */
/* PC */
@media screen and (min-width:1025px) {


    /*------------------ ¸ÞÀÎÆäÀÌÁö ½ºÅ¸ÀÏ ------------------ */
    /* ¸ÞÀÎ ¼½¼Ç - WORKS */
    #mainContainer #section4 .photo-grid>table:hover {
        transform: translateY(-20px)
    }


    /*------------------ ¼­ºêÆäÀÌÁö ½ºÅ¸ÀÏ ------------------ */
    /* COMPANY - ȸ»ç¼Ò°³ */
    #container .about-section2 .team-info:hover>li {
        opacity: 0.5
    }


    #container .about-section2 .team-info>li:hover {
        opacity: 1
    }


    #container .about-section2 .team-info>li:hover:before {
        background: #333
    }


    /* BUSINESS - »ç¾÷¼Ò°³ */
    #container .business-detail .detail-items>li:hover .bg:before {
        opacity: 0.5
    }


    #container .business-detail .detail-items>li:hover .info-box {
        top: 25%
    }


    #container .business-detail .detail-items>li:hover .info-box p,
    #container .business-detail .detail-items>li:hover .info-box a {
        opacity: 1
    }


    #container .business-detail .detail-items>li.on {
        width: 42%
    }


    #container .business-detail .detail-items>li.off {
        width: 29%
    }


    /* BUSINESS - »ç¾÷ºÐ¾ß */
    #container .business-part1 .part-items>li:hover .icon {
        color: #fff;
        border-color: #77a180;
        background: #77a180;
        box-shadow: 0 2px 15px 3px rgba(0, 0, 0, 0.12)
    }


    #container .business-part3 #client-slide>.slides ul>li img {
        opacity: 0.5;
        transition: opacity 0.3s
    }


    #container .business-part3 #client-slide>.slides ul>li img:hover {
        opacity: 1
    }


    /*------------------ °Ô½ÃÆÇ ½ºÅ¸ÀÏ ------------------ */
    /* ¸®½ºÆ®Çü ½ºÅ¸ÀÏ */
    .tbl-brd-list tr td a {
        transition: color 0.4s ease
    }


    .tbl-brd-list tr:hover td:first-child:before {
        opacity: 1
    }


    /* °Ô½ÃÆÇ °øÅë */
    .photo-grid-3 .photo-grid-inner>table {
        width: 33.333333%
    }
    .photo-grid-3 .photo-grid-inner>table:nth-child(3n+1){clear:both;}


    /* Ä«Å×°í¸® */
    .board-category ul>li a:hover {
        background: #f7f7f7
    }
}


/* ÅÂºí¸´ */
@media screen and (max-width:1024px) {


    /*------------------ ¸ÞÀÎÆäÀÌÁö ½ºÅ¸ÀÏ ------------------ */
    /* Å°ºñÁÖ¾ó */
    #keyVisual {
        height: 650px
    }


    #keyVisual .slides>li .text {
        padding: 0 30px
    }


    #keyVisual .slides>li .text h2 {
        font-size: 62px
    }


    #keyVisual .slides>li .text p {
        font-size: 18px
    }


    /* ¼½¼Ç °øÅë */
    #mainContainer .main-section {
        padding: 80px 0
    }


    #mainContainer .main-section .main-title h2 {
        font-size: 36px
    }


    #mainContainer .main-section .main-title p {
        font-size: 16px
    }


    #mainContainer .main-section>.container {
        padding: 0 30px
    }


    #mainContainer .main-section .btn-bottom {
        margin-top: 40px
    }


    /* ¸ÞÀÎ ¼½¼Ç - OUR BUSINESS */
    #mainContainer #section1 .business-grid>li {
        margin-bottom: 50px
    }


    /* ¸ÞÀÎ ¼½¼Ç - Æз²·¢½º À̹ÌÁö */
    #mainContainer #section2 {
        padding: 220px 0
    }


    #mainContainer #section2 .text h2 {
        font-size: 56px
    }


    /*------------------ ¼­ºêÆäÀÌÁö ½ºÅ¸ÀÏ ------------------ */
    /* ¼­ºêºñÁÖ¾ó */
    #subVisual {
        height: 380px;
        overflow: hidden
    }


    #subVisual>.visual_img {
        top: -20px;
        width: 1800px;
        margin-left: -900px
    }


    /* ¼½¼Ç °øÅë */
    #container .container-inner {
        padding: 0 30px
    }


    #container section.sub-section {
        position: relative;
        padding: 60px 0
    }


    /* COMPANY - ȸ»ç¼Ò°³ */
    #container .about-main {
        padding: 130px 0
    }


    #container .about-main h3 {
        font-size: 21px;
        margin-bottom: 70px
    }


    #container .about-main .company-info {
        padding: 0 30px
    }


    #container .about-section2 .team-info>li {
        margin-bottom: 50px
    }


    /* BUSINESS - »ç¾÷¼Ò°³ */
    #container .business-intro .business-info>li {
        margin-bottom: 60px
    }


    #container .business-intro .business-info>li:nth-child(3),
    #container .business-intro .business-info>li:nth-child(4) {
        margin-bottom: 0
    }


    #container .business-intro .business-info>li:before {
        display: none
    }


    #container .business-intro .business-info>li .iconBox img {
        max-width: 130px
    }


    #container .business-intro .business-info>li h3 {
        margin: 30px 0 20px
    }


    #container .business-detail .detail-items>li .bg:before {
        opacity: 0.5
    }


    #container .business-detail .detail-items>li .info-box {
        top: 20%
    }


    #container .business-detail .detail-items>li .info-box h3 {
        font-size: 18px
    }


    #container .business-detail .detail-items>li .info-box p {
        width: 100%;
        padding: 0;
        opacity: 1
    }


    #container .business-detail .detail-items>li .info-box a {
        opacity: 1
    }


    /* BUSINESS - »ç¾÷¼Ò°³ È«º¸¿µ»ó ¸ð´Þ */
    #container .business-detail #promo-wrapper>.modal {
        width: 80%;
        max-width: inherit;
        height: 280px;
        margin: -140px 0 0 -40%;
        box-shadow: 0 0 40px 10px rgba(0, 0, 0, 0.2)
    }


    #container .business-detail #promo-wrapper>.modal iframe {
        height: 280px
    }


    #container .business-detail #promo-wrapper>.modal .btn-close {
        right: -50px;
        width: 35px;
        height: 35px
    }


    #container .business-detail #promo-wrapper>.modal .btn-close span {
        top: 12px;
        width: 30px;
        margin-left: -15px
    }


    /* BUSINESS - »ç¾÷ºÐ¾ß */
    #container .business-part4 .plan-list>li {
        margin-bottom: 40px;
        vertical-align: top
    }


    #container .business-part4 .plan-list>li .title {
        padding: 30px
    }


    #container .business-part4 .plan-list>li .title>h3 {
        font-size: 20px
    }


    #container .business-part4 .plan-list>li .title>span {
        font-size: 15px
    }


    #container .business-part4 .plan-list>li .title>.price {
        font-size: 20px
    }


    #container .business-part4 .plan-list>li .title>.price span {
        font-size: 16px
    }


    /*------------------ °Ô½ÃÆÇ ½ºÅ¸ÀÏ ------------------ */
    /* °¶·¯¸®Çü ½ºÅ¸ÀÏ */
    div[class^=photo-grid-] .photo-grid-inner>table {
        width: 50% !important
    }
    div[class^=photo-grid-] .photo-grid-inner>table:nth-child(2n+1){clear:both;}

    div[class^=photo-grid-] .photo-grid-inner>table a {
        display: block
    }


    .container-fluid div[class^=photo-grid-] .photo-container {
        padding: 0 50px
    }
}


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


    /*------------------ ¸ÞÀÎÆäÀÌÁö ½ºÅ¸ÀÏ ------------------ */
    /* Å°ºñÁÖ¾ó */
    #keyVisual {
        height: 450px
    }


    #keyVisual .slides>li .text {
        padding: 0 15px;
        margin-top: -115px
    }


    #keyVisual .slides>li .text span {
        font-size: 14px
    }


    #keyVisual .slides>li .text h2 {
        font-size: 40px;
        margin: 10px 0 20px
    }


    #keyVisual .slides>li .text p {
        font-size: 15px
    }


    #keyVisual .slides>li .text .btn-arrow {
        font-size: 13px;
        width: 190px
    }


    #keyVisual .bx-controls-direction a {
        width: 40px;
        height: 60px;
        font-size: 16px;
        line-height: 60px;
        margin-top: -30px
    }


    #keyVisual .bx-pager {
        bottom: 30px
    }


    /* ¼½¼Ç °øÅë */
    #mainContainer .main-section {
        padding: 50px 0
    }


    #mainContainer .main-section .main-title {
        margin-bottom: 30px
    }


    #mainContainer .main-section .main-title h2 {
        font-size: 24px
    }


    #mainContainer .main-section .main-title h2:before {
        margin: 0 auto 10px;
        height: 30px
    }


    #mainContainer .main-section .main-title p {
        font-size: 15px;
        color: #333
    }


    #mainContainer .main-section>.container {
        padding: 0 15px
    }


    /* ¸ÞÀÎ ¼½¼Ç - OUR BUSINESS */
    #mainContainer #section1 .business-grid>li .title {
        font-size: 22px;
        margin: 25px 0 15px
    }


    #mainContainer #section1 .business-grid>li .title br {
        display: none
    }


    #mainContainer #section1 .business-grid>li p {
        font-size: 14px;
        font-weight: normal;
        line-height: 1.75
    }


    /* ¸ÞÀÎ ¼½¼Ç - Æз²·¢½º À̹ÌÁö */
    #mainContainer #section2 {
        padding: 160px 0
    }


    #mainContainer #section2 .text h2 {
        font-size: 36px
    }


    /* ¸ÞÀÎ ¼½¼Ç - WORKS */
    #mainContainer #section4 .photo-grid>table {
        margin-bottom: 50px
    }


    #mainContainer #section4 .photo-grid>table tr:last-child td {
        padding: 20px;
        height: 170px
    }


    #mainContainer #section4 .photo-grid>table .board_output_gallery_subject a {
        font-size: 15px
    }


    #mainContainer #section4 .photo-grid>table .board_output_gallery_description {
        font-size: 13px;
        max-height: 59px
    }


    #mainContainer #section4 .photo-grid>table .board_output_gallery_description:before {
        bottom: 20px;
        left: 20px
    }


    #mainContainer #section4 .photo-grid>table .board_output_gallery_description:after {
        bottom: 19px;
        left: 90px
    }


    #mainContainer #section4 .photo-grid>table:hover .board_output_gallery_description:after {
        left: 95px
    }


    /*------------------ ¼­ºêÆäÀÌÁö ½ºÅ¸ÀÏ ------------------ */
    /* ¼­ºêºñÁÖ¾ó */
    #subVisual {
        height: 260px
    }


    #subVisual>.visual_img {
        top: -10px;
        width: 1100px;
        margin-left: -550px
    }


    #subVisual>.title h2 {
        font-size: 28px
    }


    /* ÆäÀÌÁö ³»ºñ°ÔÀÌ¼Ç */
    #breadcrumbs>.container>.home {
        display: none
    }


    #breadcrumbs>.container>div {
        width: 50%
    }


    #breadcrumbs>.container>div>a {
        height: 40px;
        padding: 0 15px;
        font-size: 14px;
        line-height: 40px
    }


    #breadcrumbs>.container>div:last-child>a {
        border-right: none
    }


    #breadcrumbs>.container>div>a:after {
        right: 10px;
        font-size: 13px
    }


    #breadcrumbs>.container>div>ul {
        top: 40px;
        padding: 15px 20px
    }


    #breadcrumbs>.container>div>ul li a {
        font-size: 14px
    }


    /* ¼½¼Ç °øÅë */
    #container .container-inner {
        padding: 0 15px
    }


    #container section.sub-section {
        position: relative;
        padding: 50px 0
    }


    #container .main-title {
        padding: 35px 0
    }


    #container .main-title h2 {
        font-size: 22px
    }


    #container .main-title p {
        font-size: 14px;
        width: 80%;
        margin: 25px auto auto
    }


    #container .main-title p br {
        display: none
    }


    /* COMPANY - ȸ»ç¼Ò°³ */
    #container .about-main {
        padding: 60px 15px
    }


    #container .about-main h3 {
        font-size: 16px;
        margin: auto auto 35px;
        width: 80%;
        word-break: keep-all
    }


    #container .about-main .company-info {}


    #container .about-main .company-info>li {
        display: block;
        padding: 35px 15px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.55);
        border-right: none
    }


    #container .about-main .company-info>li:first-child {
        border-left: none
    }


    #container .about-main .company-info>li:last-child {
        border-bottom: none
    }


    #container .about-main .company-info>li i {
        display: inline-block;
        font-size: 36px;
        height: 50px
    }


    #container .about-main .company-info>li h4 {
        font-size: 15px;
        margin: 5px 0 10px
    }


    #container .about-main .company-info>li p {
        font-size: 13px;
        word-break: keep-all
    }


    #container .about-section1 .about-desc {
        font-size: 15px;
        margin-bottom: 35px
    }


    #container .about-section1 .about-info {
        margin-bottom: 30px
    }


    #container .about-section1 .about-info dt,
    #container .about-section1 .about-info dd {
        font-size: 13px;
        line-height: 1
    }


    #container .about-section1 .about-info dt {
        float: none;
        width: 100%;
        font-size: 14px;
        border-top: 1px solid #333;
        border-bottom: 1px solid #aaa
    }


    #container .about-section1 .about-info dd {
        margin: 0 0 40px 0px;
        border-top: none;
        border-bottom: 1px solid #e2e2e2
    }

     #container .about-section1 .ddetail {line-height:2;}

    #container .about-section2 .team-info>li:before {
        margin-bottom: 25px
    }


    #container .about-section2 .team-info>li .detail h3 {
        font-size: 15px;
        margin: 25px 0 5px
    }


    #container .about-section2 .team-info>li .detail .subtit {
        font-size: 12px;
        margin-bottom: 15px
    }


    #container .about-section2 .team-info>li .detail .sns-link {
        margin-top: 20px
    }


    #container .about-section2 .team-info>li .detail .sns-link>li {
        font-size: 16px
    }


    #container .about-section2 .team-info>li .detail .sns-link>li a {
        font-size: 16px
    }


    /* COMPANY - ¿¬Çõ */
    #container .history-section .year-wrap:before {
        display: none
    }


    #container .history-section .year-wrap:last-child {
        padding-bottom: 150px
    }


    #container .history-section .year-wrap>ul>li {
        margin-top: 25px;
        padding-left: 0 !important;
        padding-right: 0 !important;
        text-align: center !important
    }


    #container .history-section .year-wrap>ul>li:before {
        position: relative;
        left: 2px;
        display: block;
        width: 10px;
        height: 10px;
        margin: 0 auto 20px;
        border-width: 1px
    }


    #container .history-section .year-wrap>ul>li h3 {
        font-size: 18px;
        margin-bottom: 15px
    }


    #container .history-section .year-wrap>ul>li dl dt,
    #container .history-section .year-wrap>ul>li dl dd {
        font-size: 13px
    }


    #container .history-section .finish-box {
        width: 100px;
        height: 100px;
        margin-left: -50px;
        border-width: 4px
    }


    #container .history-section .finish-box p {
        font-size: 13px
    }


    #container .history-section .finish-box:after {
        position: absolute;
        bottom: 96px;
        left: 50%;
        content: '';
        width: 1px;
        height: 35px;
        background: #eee
    }


    /* COMPANY - ¿À½Ã´Â±æ */
    #container .location-section #map {
        height: 350px
    }


    #container .location-section h3 {
        font-size: 16px
    }


    #container .location-section h4 {
        font-size: 14px;
        margin-bottom: 40px
    }


    #container .location-section .method-wrapper .method-line {
        padding: 20px 0
    }


    #container .location-section .method-wrapper .method-line p.title {
        font-size: 16px
    }


    #container .location-section .method-wrapper .method-line dl dt,
    #container .location-section .method-wrapper .method-line dl dd {
        font-size: 13px;
        padding: 0
    }


    #container .location-section .method-wrapper .method-line dl dt {
        float: none;
        margin-bottom: 5px;
        font-weight: 600
    }


    #container .location-section .method-wrapper .method-line dl dd {
        margin-bottom: 10px;
        line-height: 1.65
    }


    #container .location-section .method-wrapper .method-line dl dt.subway {
        position: static;
        margin-right: 20px;
        padding: 4px 10px
    }


    #container .location-section .method-wrapper .method-line span.subway {
        padding: 0 4px;
        line-height: 1.3
    }


    #container .location-section .method-wrapper .method-line .box {
        float: none;
        clear: both;
        width: 100%;
        padding-top: 20px
    }


    #container .location-section .method-wrapper .method-line .box.last {
        width: 100%;
        padding: 0 !important
    }


    #container .location-section .method-wrapper .method-line .box:first-child {
        padding-top: 0 !important;
        padding-bottom: 10px
    }


    #container .location-section .method-wrapper .method-line .box:nth-child(2) {
        border-top: 1px dotted #bbb
    }


    /* BUSINESS - »ç¾÷¼Ò°³ */
    #container .business-intro .business-info>li {
        margin-bottom: 45px
    }


    #container .business-intro .business-info>li:nth-child(3) {
        margin-bottom: 45px !important
    }


    #container .business-intro .business-info>li h3 {
        font-size: 16px;
        margin: 25px 0 10px
    }


    #container .business-intro .business-info>li p {
        font-size: 13px
    }


    #container .business-detail .detail-items>li {
        display: block;
        width: 100%;
        margin-bottom: 15px
    }


    #container .business-detail .detail-items>li:last-child {
        margin-bottom: 0
    }


    #container .business-detail .detail-items>li .bg {
        left: 0;
        margin-left: 0
    }


    #container .business-detail .detail-items>li .bg img {
        width: 100%
    }


    #container .business-detail .detail-items>li .info-box {
        padding: 0 20px
    }


    #container .business-detail .detail-items>li .info-box span {
        font-size: 12px
    }


    #container .business-detail .detail-items>li .info-box h3 {
        font-size: 16px
    }


    /* BUSINESS - »ç¾÷¼Ò°³ È«º¸¿µ»ó ¸ð´Þ */
    #container .business-detail #promo-wrapper>.modal .btn-close {
        right: -35px
    }


    /* BUSINESS - »ç¾÷ºÐ¾ß */
    #container .business-part1 .part-items>li {
        margin-bottom: 40px !important
    }


    #container .business-part1 .part-items>li:last-child {
        margin-bottom: 0 !important
    }


    #container .business-part1 .part-items>li h3 {
        margin: 20px 0 10px;
        font-size: 16px
    }


    #container .business-part1 .part-items>li p {
        font-size: 13px
    }


    #container .business-part2 .choose-info .text-info {
        margin-top: 35px
    }


    #container .business-part2 .choose-info .text-info h3 {
        font-size: 18px
    }


    #container .business-part2 .choose-info .text-info h3:after {
        width: 25px;
        margin: 15px 0 20px
    }


    #container .business-part2 .choose-info .text-info p {
        font-size: 13px;
        margin-bottom: 20px
    }


    #container .business-part3 #client-slide>.info {
        float: none;
        width: 100% !important;
        margin-bottom: 35px
    }


    #container .business-part3 #client-slide>.info h3 {
        font-size: 16px
    }


    #container .business-part3 #client-slide>.info p {
        font-size: 13px
    }


    #container .business-part3 #client-slide>.info .controller {
        padding-top: 25px
    }


    #container .business-part3 #client-slide>.info .controller>li {
        font-size: 13px
    }


    #container .business-part3 #client-slide>.info .controller>li a {
        width: 28px;
        height: 28px;
        font-size: 12px;
        line-height: 26px
    }


    #container .business-part3 #client-slide>.info .controller>li a:hover {
        color: #fff;
        border-color: #2b2b2b;
        background: #2b2b2b
    }


    #container .business-part3 #client-slide>.slides {
        float: none;
        width: 100% !important;
        padding-top: 0
    }


    #container .business-part4 .plan-list>li {
        margin-bottom: 25px
    }


    #container .business-part4 .plan-list>li:last-child {
        margin-bottom: 40px
    }


    #container .business-part4 .plan-list>li .info>ul>li {
        font-size: 13px
    }


    /*------------------ ¹öÆ° ½ºÅ¸ÀÏ ------------------ */
    .btn-arrow {
        font-size: 14px
    }


    .btn {
        font-size: 13px
    }


    /*------------------ °Ô½ÃÆÇ ½ºÅ¸ÀÏ ------------------ */
    /* ¸®½ºÆ®Çü ½ºÅ¸ÀÏ */
    .tbl-brd-list tr td,
    .tbl-brd-list font,
    .tbl-brd-list span {
        font-size: 13px !important
    }


    .tbl-brd-read tr td,
    .tbl-brd-read tr td font,
    .tbl-brd-read tr td span {
        font-size: 13px !important
    }


    /* FAQ ½ºÅ¸ÀÏ */
    .tbl-brd-faq .board_bgcolor {
        width: 60px !important
    }


    .tbl-brd-faq .reply-row td {
        padding: 15px !important
    }


    .tbl-brd-faq .reply-row td .reply-block {
        float: left;
        display: block;
        width: 30px;
        height: 30px;
        font-size: 14px;
        font-weight: 600;
        color: #fff;
        text-align: center;
        line-height: 30px;
        border-radius: 2px;
        background: #77a180
    }


    .tbl-brd-faq .reply-row td .reply-container {
        margin-left: 60px
    }


    /* ƯÁ¤ ¿­ ¼û±èó¸® */
    .att_title[rel="¼±ÅÃ"] {
        display: none
    }


    .att_title[rel="¹øÈ£"] {
        display: none
    }


    .att_title[rel="ÀÛ¼ºÀÚ"] {
        display: none
    }


    .bbschk {
        display: none
    }


    .bbsno {
        display: none
    }


    .bbswriter {
        display: none
    }


    /* °¶·¯¸®Çü ½ºÅ¸ÀÏ */
    div[class^=photo-grid-] .photo-grid-inner {
        margin: 0
    }


    div[class^=photo-grid-] .photo-grid-inner>table {
        width: 50% !important;
        margin: 0;
        padding: 0
    }


    div[class^=photo-grid-] .photo-grid-inner>table .overlay {
        left: 0;
        right: 0
    }


    div[class^=photo-grid-] .photo-grid-inner>table .post-info {
        left: 15px;
        bottom: 5px
    }


    div[class^=photo-grid-] .photo-grid-inner>table:hover .post-info {
        bottom: 15px
    }


    div[class^=photo-grid-] .photo-grid-inner>table .post-info h3 {
        font-size: 15px
    }


    div[class^=photo-grid-] .photo-grid-inner>table .post-info h3:after {
        width: 20px;
        margin: 10px 0
    }


    div[class^=photo-grid-] .photo-grid-inner>table .post-info span {
        font-size: 11px
    }


    .container-fluid div[class^=photo-grid-] .photo-container {
        padding: 0 15px
    }


    /* ÃÖ±Ù °Ô½Ã¹° - ¸®½ºÆ®Çü */
    .tbl-brd-latest tr td {
        font-size: 12px;
        padding: 20px
    }


    .tbl-brd-latest tr td a {
        font-size: 15px
    }


    /* °Ô½ÃÆÇ °øÅë */
    /* Ä«Å×°í¸® */
    .board-category ul>li {
        font-size: 13px
    }


    .board-category ul>li a {
        display: block;
        padding: 5px 10px
    }
}


/* ÀúÇØ»óµµ ¸ð¹ÙÀÏ */
@media screen and (max-width:480px) {


    /*------------------ ¼­ºêÆäÀÌÁö ½ºÅ¸ÀÏ ------------------ */
    /* ¼­ºêºñÁÖ¾ó */
    #subVisual {
        height: 200px
    }


    #subVisual>.visual_img {
        top: -10px;
        width: 960px;
        margin-left: -480px
    }


    #subVisual>.title h2 {
        font-size: 28px
    }
}




/*202210 by ups*/
.dtgrid:after {
    content: '';
    clear: both;
    display: block
}


#container .about-section1 .about-info dd {
    font-size: 15px;
    line-height: 1
}


.dtgrid dt {
    float: left;
    display: block;
    width: 130px;
    padding: 20px 15px;
    font-weight: 600;
    color: #2b2b2b;
    border-top: 1px solid #333
}


.dtgrid dd {
    display: block;
    margin-left: 150px;
    padding: 20px 15px;
    color: #666;
    border-top: 1px solid #e2e2e2;
    line-height: 1.5;
}


/*»ç¾÷¼Ò°³ ÅÇ*/


.tabs {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 10px -2px rgba(0, 0, 0, 0.3);
    margin: 0 0 40px;
}


.tab {
    width: 100%;
    overflow: hidden;
}


.tab-label {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    
    background: #f6f6f6;
    font-weight: bold;
font-size:1.1em;
    cursor: pointer;
     padding:30px 15px ;
    /* Icon */
}


.tab-label:hover {
    background: #f0ddb9;
}


.tab-label::after {
    content: "\276F";
    width: 1em;
    height: 1em;
    text-align: center;
    /*   -webkit-transition: all .35s;
  transition: all .35s;
   */
}


.tab-content {
    max-height: 0;
    padding: 0 1em;
    color: #2c3e50;
    background: white;
font-size:1.1em;
    line-height: 2;
    /*   -webkit-transition: all .35s;
  transition: all .35s;
   */
}


.tab-close {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: end;
    justify-content: flex-end;
    padding: 1em;
    font-size: 0.75em;
    background: #2c3e50;
    cursor: pointer;
}


.tab-close:hover {
    background: #1a252f;
}




.tab input {
    display: none;
}


.tabs input:checked+.tab-label {
    background: #f0ddb9;
}


.tabs input:checked+.tab-label::after {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}


.tabs input:checked~.tab-content {
    max-height: 100vh;
    padding: 1em;
}


.busi-title {
    max-width: 1200px;
    margin: 40px auto;
    text-align: center
}


.busi-title h2 {
    font-size: 36px;
    font-weight: 300;
    color: #222;
    letter-spacing: 2px;
    margin-bottom: 10px;
    padding: 0 0 40px;
    border-bottom: 3px solid #a46f0e;
}


/*.busi-title h2:before {content:''; display:block; margin:0 auto 15px; width:1px; height:40px; background:#dedede}*/
.busi-title p {
    font-size: 18px;
    color: #333
}


@media(max-width:1024px){
.busi-title {
    padding:0 30px;
}
}
@media(max-width:768px){
.busi-title {
    padding:0 15px;
}
.busi-title h2 {
    font-size: 22px;
    
}
}


.busi-inner {
    position: relative;
    max-width: 800px;
    margin: auto
}



.busi-inner:before,
.busi-inner:after,
{
    content: '';
    display: block
}


.busi-inner:after,
{
    clear: both
}