@charset "utf-8";

/* aboutUs */
#aboutUs {}
#aboutUs .mainTitle {}
#aboutUs .mainTitle h1 {}
#aboutUs .mainTitle h1 {}


#aboutUs .about_content {margin-top:85px; margin-bottom:85px;}
#aboutUs .about_content .thumbnailImg {display: flex; width: 100%; justify-content: center; flex-direction: column; /* margin-bottom: 44px;*/ margin-bottom:52px;}
#aboutUs .about_content .thumbnailImg img {width:100%; /* width:84%;*/ margin:0 auto; padding:0 6%;}
#aboutUs .about_content h2 {font-size:28px; /*font-size:22px; padding: 0 0 20px; text-align:center; font-weight:600;*/ padding:0 6% 20px; font-weight: 500; }
#aboutUs .about_content h2.first {padding-bottom: 10px;}
#aboutUs .about_content .cont {/* margin-top:50px; margin-top:44px;*/ margin-top:12px; padding:0 6%;}
#aboutUs .about_content .cont p {line-height:1.8; margin-bottom:20px; /* font-weight:500; text-align:center;font-weight:600;*/   /* font-size:20px; */ font-size:16px;}

/* business */
#business .business_content {margin-top:85px; margin-bottom:48px;}
#business .business_content ul {display:flex; flex-wrap:wrap; justify-content:space-between; align-items: flex-start;/*display: flex;width: 450px;height: 400px;align-content: space-around;justify-content: space-around;flex-flow: column wrap; *//* display:flex; flex-wrap: wrap; flex-direction: row; */}

#business .business_content ul li {text-align: center;border:1px solid #e1e1e1; border-top-width: 3px;border-top-color: #df104a; /* width:48%; */ flex-basis: 48%; padding:50px 0;margin:0 0 36px;
    /* align-items: center; justify-content: center; margin:0 0 20px;*/
    /* flex:6;*/ /*border-top-color: #df104a;*/
    /* width:100px;height:100px;border-top:1px solid #ff0000; */
    /* display: flex;
     flex-direction: column;
     width: 200px;
     height: 180px;
         background: #fff;*/}

#business .business_content ul li h2 {color:#666; font-weight:600; margin:0 0 20px; color: #064090;}
#business .business_content ul li p {color:#666; font-size:14px; font-weight:400; line-height:1.5;}

/* history */
#history {}
#history .history_content {margin-top:85px; margin-bottom:85px; display:flex; justify-content: space-between;}
#history .history_content .left {/* flex:5.5; */ flex:5.2; /* padding:0 20px; */ padding: 0 20px 0 64px;}
#history .history_content .right {flex:8.5; margin-left: auto;}
#history .history_content .right .year {}
#history .history_content .right .year dl .align {display:flex; margin-bottom: 15px; }
#history .history_content .right .year dl dt {flex:1.6; font-size:30px; font-weight:700; /* color:#c5c5c5; */ color:#a9a9a9;}
#history .history_content .right .year dl dd {flex:10.5; color:#666666; font-size:14px; align-items: center; display: flex;}
#history .history_content .right .year dl dt.now {color:#282933;}

/* portfolio */
#markinfo {}
.portfolio {}
.portfolio .portfolio_content {margin-top:85px; margin-bottom:85px; display: flex; flex-direction: row; justify-content: space-between;}
.portfolio .portfolio_content .left {flex:6; padding:0 20px;}
.portfolio .portfolio_content .left img {width:100%;}
.portfolio .portfolio_content .right {flex:6;}
.portfolio .portfolio_content .right .cont{}
.portfolio .portfolio_content .right .cont .top {padding: 0 0 30px; border-bottom: 2px solid #ccc;}
.portfolio .portfolio_content .right .cont .top h2 {font-size: 36px; letter-spacing: -2.5px;}
.portfolio .portfolio_content .right .cont .top em {margin: 10px 0 20px; display: block; font-size: 14px; /* letter-spacing: -0.5px; */ font-weight: 600; color: #333;}
.portfolio .portfolio_content .right .cont .top p {font-size: 14px;line-height: 1.8;/* line-height: 1.5; */}
.portfolio .portfolio_content .right .cont .under {padding-top:32px;}
.portfolio .portfolio_content .right .cont .under dl {/* margin-bottom:32px; */ padding-bottom:40px;}
.portfolio .portfolio_content .right .cont .under dl .align {display:flex; margin-bottom: 12px;}
.portfolio .portfolio_content .right .cont .under dl .align dt {flex:2; font-size:14px; font-weight: 600;}
.portfolio .portfolio_content .right .cont .under dl .align dd {flex:10; font-size:14px; font-weight:500; color:#929191;}
.portfolio .portfolio_content .right .cont .under dl .align dd > a {/*color: #1A70C6; color: #0465c5; color: #0465c5;*/ color: #0372e1; text-decoration: underline; text-underline-position: from-font;}
.portfolio .portfolio_content .right .cont .under > a {color:#df104a; padding: 15px 25px 15px 25px; border: 2px solid #df104a; font-weight: 600; font-size: 16px;}
/*
.portfolio .portfolio_content .right .cont .under button {color:#df104a; padding: 15px 25px 15px 25px; border: 2px solid #df104a; font-weight: 600; font-size: 16px;}
*/
/* contact */
#contact {}
#contact .contact_content {display: flex;
    flex-direction: row;
    justify-content: space-between; padding: 85px 0;}
#contact .contact_content .left {flex: 6;}
#contact .contact_content .left iframe {}
#contact .contact_content .right {flex: 6;
    /* margin-right: 28px; */
    padding: 0 0 0 32px;}
#contact .contact_content .right dl {}
#contact .contact_content .right dl .align {display:flex; /* margin-bottom: 28px;*/ flex-direction: column; margin-bottom: 20px;}
#contact .contact_content .right dl dt {font-size: 18px; font-weight: 600; margin-bottom: 8px; /*padding-bottom:12px; */}
#contact .contact_content .right dl dd {font-size:14px; line-height: 1.5;}
#contact .contact_content .right dl .dlstyle dt {font-size:16px;}


/*
.map-responsive{
overflow:hidden;
padding-bottom:56.25%;
position:relative;
height:0;
}
.map-responsive iframe{
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}
*/

/* coming */
#copynpay .coming {font-size: 36px;
    /* margin: 0 auto; */
    text-align: center;
    /* margin: 0 24px; */
    margin: 10% 0;}

/* members */
.tabBox {margin-top: 28px; margin-bottom:28px;}
.tab-container {display: flex; justify-content: center; align-items: center;}
.tab-container__item {cursor: pointer; flex: 4; border: 1px solid #ddd; box-sizing: border-box; line-height: 2.5; text-align: center; border-right:0;}
li:last-child.tab-container__item {border-right:1px solid #ddd; box-sizing:border-box;}
.tab-container__item:hover {/* background-color: #369fff;*/ border: 1px solid #282933; transition: background-color 0.4s ease-in-out;}
li:last-child.tab-container__item:hover {border: 1px solid #282933;}
.tab-container__item:hover .tab-container__item--title {/*color: #fff;*/ color:#282933; /* transition: color 0.4s ease-in-out;*/}
.tab-container__item.active {/* border-bottom: 2px solid #369fff; */ border: 1px solid #282933;}
li:last-child.tab-container__item.active {border: 1px solid #282933;}
.tab-container__item.active .tab-container__item--title {/* color: #369fff;*/ color:#282933;}
.tab-container__item.active:hover {/* background-color: #369fff; */  border: 1px solid #282933; transition: background-color 0.4s ease-in-out;}
.tab-container__item.active:hover .tab-container__item--title {/* color: #fff;*/ color:#282933; transition: color 0.4s ease-in-out;}
.tab-container__item--title {/* display: inline-block; font-weight: 700; */ font-weight:600; color: #999;  text-decoration: none; /* margin: 15px; */}
/* content-container */
.content-container {padding:10px 0; margin-top:28px;}
.content-container__content {display: flex; display: none; flex-wrap: wrap; /* justify-content: space-around;*/}
.content-container__content li {/* flex:3; */ justify-content: flex-start; width: 20%; /*padding:0 6px;*//* padding-right:20px; */position:relative; margin-bottom:24px;}
.content-container__content.target {/*display: block;*/ display: flex; /*justify-content: flex-start;*/}


/* img */
.content-container__content li .img {display: flex;
    justify-content: center;}
.content-container__content li .img img {width:100%; width: 220px; height: auto;}
/* txt */
.content-container__content li .txt {position: absolute;  left: 10px; bottom: 2px; /* background: rgb(223 16 74 / 35%); */ /* left: 11px; padding:10px 12px;width: 66%;*/
    padding: 20px 19px;
    width: 92%;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    flex-direction: column;
    background: rgb(40 41 51 / 75%);
    top:0;
}

/* left: 0; bottom:0; bottom: 46px; display: flex; justify-content: space-between;*/
/* display:flex; flex-direction:column; */
/*
.content-container__content li .txt_leader {background: rgb(6 64 144 / 50%);}
.content-container__content li .txt_leader p.position {color:#ded126;}
.content-container__content li .txt_leader p.position span {color:#ded126;}
.content-container__content li .txt_leader p.position span:before {background: #ded126;}
*/
.content-container__content li .txt p {color:#fff; font-size: 10px; font-weight: 600;}
.content-container__content li .txt p.position {margin-bottom:16px;}
.content-container__content li .txt p.position span {color:#fff; position:relative;}
.content-container__content li .txt p.position span:before {    position: absolute;
    content: '';
    width: 15px;
    height: 1px;
    left: 0;
    bottom: -4px;
    /* z-index: 2; */
    background: #fff;}
/*
.content-container__content li .txt_leader p.position {color:#ded126;}
.content-container__content li .txt_leader p.position span {color:#ded126;}
.content-container__content li .txt_leader p.position span:before {background: #ded126;}
*/
.content-container__content li .txt p.nameLast {font-size:24px; font-weight:600; margin-bottom:4px; letter-spacing: -1.5px;}
.content-container__content li .txt p.name {font-size:12px; font-weight:600;}

#members .tabBox .content-container .oper li:last-child .txt p.position, #members .tabBox .content-container .all li:last-child .txt p.position  {letter-spacing: -0.4px;}
#members .tabBox .content-container .content-container__content li .txt {opacity:0; transition: opacity 0.3s ease-in-out;}
#members .tabBox .content-container .content-container__content li:hover .txt {opacity:1;}



/* ------ 반응형 ------ */

/* 1280 S */
@media (max-width: 1280px) {
    #aboutUs .about_content .thumbnailImg img {/* width:100%;*/ padding:unset;}
    #aboutUs .about_content h2 {padding:0 0 20px;}
    #aboutUs .about_content .cont {padding:unset;}

}
/* 1280 E */

/* 1228 S */
@media (max-width: 1228px) {
}
/* 1228 E */

/* 1200 S */
@media (max-width: 1200px) {
}
/* 1200 E */

/* 1199 S */
@media (max-width: 1199px) {

    /* h1 */
    .mainTitle h1 {font-size:28px; font-weight:600;}


    /* portfolio */
    .portfolio .portfolio_content .left {padding: 0 36px 0 0;}
    .portfolio .portfolio_content .right .cont .under dl .align dt {flex:3;}

    /* members */

    .content-container__content li {width:25%;}
    .content-container__content li .img img {width: 100%; padding: 0 5%;}
    .content-container__content li .txt
    {
        padding: 20px 19px;
        width: 92%;
        height: 100%;
        display: flex;
        justify-content: flex-end;
        align-items: flex-start;
        flex-direction: column;
    }
    .content-container__content li .txt {left: 8px; bottom: 0;}

    li:last-child.tab-container__item {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 100%;
    }

    /* history */
    #history .history_content .left {padding: 0 40px 0 0;}
    #history .history_content .right .year dl dt {flex: 3;}
    #history .history_content .right .year dl dd {flex:11.5; line-height:1.8;}

    /* contact */
    #contact .contact_content .left iframe {height:360px;}



}
/* 1199 E */

/* 1024 S */
@media (max-width: 1024px) {
}
/* 1024 E */

/* 960 S */
@media (max-width: 960px) {
}
/* 960 E */

/* 959 S */
@media (max-width: 959px) {
    .container {width:728px;}

    /* aboutUs */
    #aboutUs .about_content {margin-top:40px;}
    #aboutUs .about_content .thumbnailImg {margin-bottom:36px;}
    #aboutUs .about_content h2 {font-size:22px; padding:0 0 8px;}

    /* business */
    #business .business_content ul li {padding: 50px 28px;}

    /* */
    #history .history_content .right .year dl dd {flex:6.2;}
    /* portfolio */
    .portfolio .portfolio_content .left {padding: 0 20px 0 0;}
    .portfolio .portfolio_content .right .cont .under dl .align dt {flex:4;}
    .portfolio .portfolio_content .right .cont .under dl .align dd {flex:9;}

    /* members */
    .tab-container {justify-content: space-around; /*  padding: 0 18%; padding:0 10%; */ padding:0 8%;}
    .tab-container__item {flex:unset; box-sizing: border-box; line-height: 3; border-radius: 5px; border-right:unset; border: 1px solid #ddd; padding: 0 12px; font-size: 12px;}
    .content-container__content li .txt p.nameLast {
        display:unset;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 100%;
    }

    /* contact */
    #contact .contact_content .left iframe {height:280px;}

}
/* 959 E */

/* 768 S */
@media (max-width: 768px) {

    .container {padding:unset;}

    /* portfolio */
    .portfolio .portfolio_content {margin-top:24px;}
    .portfolio .portfolio_content .right .cont .under > a {padding: 12px 20px; font-size: 14px;}


    /* history */
    #history .history_content .left {flex: 6.5;}
    #history .history_content .left img {width:100%;}
    #history .history_content .right .year dl dt {font-size:20px; flex: 2.2;}
    #history .history_content .right .year dl dd {flex:10;}


    /* member */
    .content-container__content li {width:33.333333%;}
    .content-container__content li .txt { left: 11px; bottom: 1px;}

}

/* 768 E */
@media (max-width: 767px) {

    /* container */
    .container {width:unset; padding:0 16px;}

    /* h1 */
    .mainTitle h1 {font-size:20px;}

    /* aboutUs */
    #aboutUs .about_content h2 {font-size:22px;}
    #aboutUs .about_content .cont p {font-size:14px;}

    /* business */
    #business .business_content ul {align-items: unset; flex-direction: column; }
    #business .business_content ul li h2 {font-size: 14px; font-weight: 700;}

    /* */

    #history .history_content {/* flex-direction: column; */
        /* justify-content: space-between; */
        /* align-items: flex-start; */
        margin: 40px 0 24px;
    }

    /*#history .history_content .left {display:none; }*/
    #history .history_content {flex-direction: column;}
    #history .history_content .left {flex:unset; padding:0;}
    #history .history_content .left img {width:unset;}
    #history .history_content .right {flex: unset; margin-left: 0;     margin-top: 32px;}
    #history .history_content .right .year dl dd {flex:14;}


    /* contact */
    #contact .contact_content {flex-direction: column; padding: 40px 0 24px;}
    #contact .contact_content .right {margin-top:32px; padding:0;}

    /* */
    .portfolio .portfolio_content {margin-top: 24px; flex-direction: column; margin-bottom: 52px;}
    .portfolio .portfolio_content .left {align-items: center; justify-content: center; display: flex;}
    .portfolio .portfolio_content .left img {width:60%;}
    .portfolio .portfolio_content .right {margin-top:40px;}

    /* member */
    .tab-container {padding:0 3%;}
    .content-container__content li .txt {left: 14px; bottom: 0;}


}


/* 576 S */
@media (max-width: 576px) {
    #aboutUs .about_content { margin-bottom:36px;}

    /* member */
    .tab-container {padding:0; flex-wrap: wrap; justify-content: unset; align-items: unset;}
    .content-container__content li {width:50%;}
    .tab-container__item {margin-bottom: 8px; margin-right: 8px; display: flex;}
    .tab-container__item {flex:unset; box-sizing: border-box; line-height: 3; border-radius: 5px; border-right:unset; border: 1px solid #ddd; padding: 0 12px; font-size: 12px;}
    .content-container__content li .txt {left: 9px; bottom: 1px;}
}
/* 576 E */

@media (max-width: 575px) {
    #history .history_content .right .year dl dt {flex: 3.2;}
}

/* 414 S */
@media (max-width: 414px) {
    .content-container__content li .txt {width:90%;}
    #history .history_content .left img {width:100%;}
    #history .history_content .right .year dl dd {line-height:1.5;}
}
/* 414 E */

/* 375 S */
@media (max-width: 375px) {
}
/* 375 E */

/* 360 S */
@media (max-width: 360px) {
}
/* 360 E */

/* 320 S */
@media (max-width: 320px) {
}
/* 320 E */

