﻿@charset 'utf-8';

/*****************************************************************
   deletion of the current branch prohibited
   powered by nnin ( http://www.nnin.com )
*****************************************************************/






/*****************************************************************
******************************************************************
******************************************************************
        메인페이지 : 각 모듈의 타이틀 공통 설정
******************************************************************
******************************************************************
*****************************************************************/

.nm_tit {
    position: relative;
    z-index: 10;
    text-align: center;
    margin: 0 15px 10px;
}

.nm_tit>h3 {
    /*    font-family: 'Playfair Display', serif;*/
    letter-spacing: 1px;
    font-size: 2.0em;
    font-weight: 100;
    color: #111;
}

.nm_tit>span {
    /*    font-family: 'Playfair Display', serif;*/
    display: inline-block;
    max-width: 800px;
    margin: 0 auto;
    padding: 10px;
    font-weight: 300;
    font-size: 1.0em;
    color: #333;
}

@media screen and (max-width: 768px) {
    .nm_tit>h3 {
        font-size: 1.5em;
    }

    .nm_tit>span {
        padding: 10px;
        font-size: 1.0em;
    }
}


















/*****************************************************************
******************************************************************
******************************************************************
        메인페이지 : 각 모듈의 타이틀 개별 설정
******************************************************************
******************************************************************
*****************************************************************/

.ms_off,
.ms_on,
.ms_bo {
    max-width: 1400px;
    margin: 60px auto 20px auto;
    overflow: hidden;
}

.ms_off h2,
.ms_on h2,
.ms_bo h2 {
    font-size: 30px;
    font-weight: 600;
    margin-bottom: 40px;
    color:#444;
}

.ms_off h2 {
    text-align: left;
}

.ms_on h2 {
    text-align: right;
}

.ms_off strong,
.ms_on strong,
.ms_bo strong {
    font-size: 18px;
    font-weight: 600;
    color:#999;
    display: block;
    margin-bottom: 5px;
}


.ms_off b,
.ms_on b,
.ms_bo b {
    display: block;
    color:#000;
    margin-top: 10px;
}

.ms_off a,
.ms_on a{
    display: block;
    background: #7171ff;
    font-size: 20px;
    color: #fff;
    width: 200px;
    padding: 10px;
    margin-top: 120px;
    transition:0.3s ease;
}

@media screen and (hover:hover) {
    .ms_off a:hover,
    .ms_on a:hover {
        background: #000000;
        color:#fff;
    }
     
}

.flex_desc {
    display: flex;
    flex-direction: column;

    flex-wrap: wrap;
}

.more_icon {
    margin-left: 60px;
}

.flex_desc.left {
    align-items: flex-start;
}

.flex_desc.right {
    align-items: flex-end;
}


.ms_off p,
.ms_on p,
.ms_bo p {
    text-align: left;
    font-size: 1.3em;
    color: #333;
    font-weight: 400;
    word-break: keep-all;
}

.ms_off p {
    padding-right: 150px;
}

.ms_on p {
    padding-left: 150px;
    text-align: right;
}

.ms_bo p {
    text-align: center;
}

.ms_off img,
.ms_on img {
    display: block;
    width: 100%;
    border-radius: 15px;
}


@media screen and (max-width:1400px) {
    .ms_off,
    .ms_on,
    .ms_bo {
        padding-left: 20px;
        padding-right: 20px;
    }
}

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


    .ms_off p {
        padding-right: 20px;
    }

    .ms_on p {
        padding-left: 20px;
    }

    .ms_off a, .ms_on a {
        margin-top: 25px;
    }
}

@media screen and (max-width:992px) {
    .dragorder2 {
        order: 2;
        margin-top: 15px;
    }

    .ms_off p, .ms_on p, .ms_bo p {
        word-break: normal;
        font-size:1.2em;
    }

    .ms_off p {
        padding-right: 0px;
    }

    .ms_on p {
        padding-left: 0px;
        text-align: left;
    }

    .ms_on h2 {
        text-align: left;
    }

    
    .flex_desc.right {
        align-items: flex-start;
    }

    /* .row>div:first-child {
        margin-bottom: 15px;
    } */

    .ms_off .row .col-lg-6:first-child {
        margin-bottom: 15px;
    } 

    .ms_on .row .col-lg-5 {
        margin-bottom: 15px;
    }

    .ms_off a, .ms_on a {
        margin-top: 60px;
    }
}


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


}

@media screen and (max-width:545px) {
    .ms_off p, .ms_on p, .ms_bo p {
        font-size:1.1em;
    }

    .ms_off a, .ms_on a {
        margin-top: 30px;
    }
}

/*****************************************************************
ms04 : 추출게시물
*****************************************************************/
.ms04>.nm_tit>h3 {
    font-family: 'Playfair Display', serif;
    font-weight: 900;
}



/*****************************************************************
ms05 : 추출게시물, 고객센터
*****************************************************************/
.ms05>.nm_tit>h3 {
    font-family: 'Playfair Display', serif;
    font-weight: 900;
}



/*****************************************************************
ms06 : 추출갤러리
*****************************************************************/
.ms06>.nm_tit>h3 {
    /*    font-family: 'Playfair Display', serif;*/
    font-weight: 600;
    color: #000;
}

.ms06>.nm_tit>span {
    font-size: 1.3em;
    font-wieght: 300;
    color: #000;
}



/*****************************************************************
ms07 : 1단이미지
*****************************************************************/
.ms07>.nm_tit>h3 {}



/*****************************************************************
ms10 : 예약문의(메인폼메일)
*****************************************************************/
.ms10>.nm_tit>h3 {
    font-family: 'Playfair Display', serif;
    letter-spacing: 3px;
    font-weight: 900;
    color: #fff;
}

.ms10>.nm_tit>span {
    color: #ddd;
}



/*****************************************************************
ms25 : 사이트맵
*****************************************************************/
.ms25>.nm_tit>h3 {
    font-family: 'Playfair Display', serif;
    font-weight: 900;
}

























/*****************************************************************
******************************************************************
******************************************************************
        메인페이지 : 각 모듈의 여백 및 배경이미지 개별설정
******************************************************************
******************************************************************
*****************************************************************/


/*****************************************************************
ms01 : 슬라이드
*****************************************************************/
.ms01 {
    background-color: #fff;
}



/*****************************************************************
ms04 : 추출게시물
*****************************************************************/
.ms04 {
    padding: 50px 0;
}



/*****************************************************************
ms05 : 추출게시물, 고객센터
*****************************************************************/
.ms05 {
    padding: 100px 0;
}



/*****************************************************************
ms06 : 추출갤러리
*****************************************************************/
.ms06 {
    padding: 70px 0 50px 0;
    /* background-color: #242424;*/
}



/*****************************************************************
ms07 : 1단이미지
*****************************************************************/
.ms07 {
    position: relative;
    margin: 0px 0;
    padding: 70px 0 50px 0;
    /* background-image: url(../../img/_des/de01/de01_img03.jpg);*/
    background-size: cover;
    background-repeat: repeat;
    background-attachment: fixed;
}

.ms07:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.6);
    width: 100%;
    height: 100%;
    z-index: 2;
}

.ms07>.container,
.ms07>.container-fulid {
    position: relative;
    z-index: 3;
}



/*****************************************************************
ms08 : 3단형
*****************************************************************/
.ms08 {
    position: relative;
    margin: 0px 0;
    padding: 100px 0;
    background-image: url(../../img/_des/de02/de02_img02.jpg);
    background-size: cover;
    background-repeat: repeat;
    background-attachment: fixed;
}

.ms08:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    background: rgba(215, 217, 210, 0.8);
    width: 100%;
    height: 100%;
    z-index: 2;
}

.ms08>.container,
.ms08>.container-fulid {
    position: relative;
    z-index: 3;
}



/*****************************************************************
ms09 : 제휴사
*****************************************************************/
.ms09 {
    position: relative;
    margin: 0px 0;
    padding: 100px 0;
    background-color: #fff;
    /*    background-image: url(../../img/_des/de02/de02_img02.jpg);*/
    background-size: cover;
    background-repeat: repeat;
    background-attachment: fixed;
}

.ms09:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    /*    background: rgba(215, 217, 210, 0.0);*/
    width: 100%;
    height: 100%;
    z-index: 2;
}

.ms09>.container,
.ms09>.container-fulid {
    position: relative;
    z-index: 3;
}




/*****************************************************************
ms10 : 예약문의(메인폼메일)
*****************************************************************/
.ms10 {
    position: relative;
    margin: 0px 0;
    padding: 100px 0;
    background-color: #fff;
    background-image: url(../../img/_des/de01/de01_img03.jpg);
    background-size: cover;
    background-repeat: repeat;
    background-attachment: fixed;
}

.ms10:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    background: rgba(70, 78, 6, 0.56);
    width: 100%;
    height: 100%;
    z-index: 2;
}

.ms10>.container {
    position: relative;
    z-index: 3;
}




/*****************************************************************
ms11 : RECRUIT : 채용안내
*****************************************************************/
.ms11 {
    margin: 0px 0;
    padding: 50px 0;
}




/*****************************************************************
ms12 : 3단아이콘
*****************************************************************/
.ms12 {
    position: relative;
    margin: 0px 0;
    padding: 100px 0;
    background-color: #fff;
    background-image: url(../../img/_des/de02/de02_img01.jpg);
    background-repeat: repeat;
    background-size: cover;
    background-attachment: fixed;
}

.ms12:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.8);
    width: 100%;
    height: 100%;
    z-index: 2;
}

.ms12>.container,
.ms12>.container-fulid {
    position: relative;
    z-index: 3;
}



/*****************************************************************
ms13 : 좌우6단
*****************************************************************/
.ms13 {
    margin: 0px 0;
    padding: 50px 0;
    background-color: #f4f4f4;
}



/*****************************************************************
ms14 : 아코디언(고객센터)
*****************************************************************/
.ms14 {
    margin: 0px 0;
    padding: 50px 0;
}



/*****************************************************************
ms15 : 불규칙블록
*****************************************************************/
.ms15 {
    position: relative;
    margin: 50px 0;
    padding: 0px 0;
    background-color: #fff;
    /*    background-image: url(../../img/_des/de02/de02_img03.jpg);*/
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

.ms15:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    background: rgba(113, 141, 136, 0.0);
    width: 100%;
    height: 100%;
    z-index: 2;
}

.ms15>.container,
.ms15>.container-fulid {
    position: relative;
    z-index: 3;
}



/*****************************************************************
ms16 : 롤오버6단
*****************************************************************/
.ms16 {
    margin: 100px 0;
    padding: 60px 0;
    /* background-color: #f3f3f3; */
    background: url('../../img/_des/de16/background.jpg');
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: auto;
    position: relative;
}
/* 
.ms16::before{
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 101%;
    height: 70px;
    background: #fff;
    margin-top: -45px;
    transform: rotate(0.5deg);
}
.ms16::after{
    content:'';
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 101%;
    height: 70px;
    margin-bottom: -45px;
    background: #fff;
    transform: rotate(0.5deg);
}
 */


/*****************************************************************
ms17 : 롤오버4단
*****************************************************************/
.ms17 {
    position: relative;
    margin: 30px 0 30px;
    padding: 0px 0 0px;
    background-color: #fff;
    /*    background-image: url(../../img/_des/de02/de02_img05.jpg);*/
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

.ms17:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    background: #fff;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.ms17>.container {
    position: relative;
    z-index: 3;
}



/*****************************************************************
ms18 : 4단블럭
*****************************************************************/
.ms18 {
    margin: 0px 0;
    padding: 50px 0;
}





/*****************************************************************
ms19 : 1단형텍스트
*****************************************************************/


.ms19 {
    display: block;
    max-width: 1400px;
    margin: 0 auto;
    /* height: 650px;   */
    /* height: 850px; */
    position: relative;
    /* padding: 100px 0; */
    /*background-color: #fff;*/
    /* background-image: url(../../img/_des/de19/de19_img02.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center; */
    /*background-attachment: fixed;
*/
}

.ms19 img {
    display: block;
    width: 100%;
}

.ms19 .img_PC {
    width: 80%;
    margin: 0 auto;
    display: block;
}

.ms19 .img_Tab {
    width: 100%;
    display: none;
}

.ms19 .img_Mo {
    width: 100%;
    display: none;
}


/*.ms19:before {
    -webkit-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.8);
    width: 100%;
    height: 100%;
    z-index: 2;
}*/


/*.ms19:hover:before {
    background: rgba(255, 255, 255, 0.6);
}*/


.ms19>.container {
    position: relative;
    z-index: 3;
}

/* 
@media screen and (max-width: 991px) {
    .ms19 {
        width: 100%;
        height: 768px;
        background-image: url(../../img/_des/de19/de19_img02_2.jpg);
        background-position: center center;
        overflow: hidden;
    }
} */


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

    .ms19 .img_PC {
        display: none;
    }

    .ms19 .img_Tab {
        display: block;
    }

    .ms19 .img_Mo {
        display: none;
    }
}

@media screen and (max-width:545px) {
    .ms19 .img_PC {
        display: none;
    }

    .ms19 .img_Tab {
        display: none;
    }

    .ms19 .img_Mo {
        display: block;
    }
}


/*****************************************************************
ms20 : 인사말
*****************************************************************/


.ms20 {
    margin: 0px 0;
    padding: 50px 0;
}




/*****************************************************************
ms21 : 회사소개
*****************************************************************/


.ms21 {
    margin: 0px 0;
    padding: 50px 0;
}





/*****************************************************************
ms22 : 회사연역
*****************************************************************/


.ms22 {
    margin: 0px 0;
    padding: 50px 0;
}



/*****************************************************************
ms23 : 동영상
*****************************************************************/


.ms23 {
    position: relative;
    margin: 0px 0;
    padding: 100px 0;
    background-color: #fff;
    /*    background-image: url(../../img/_des/de01/de01_img03.jpg);*/
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

.ms23:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    background: rgba(88, 88, 88, 0);
    width: 100%;
    height: 100%;
    z-index: 2;
}

.ms23>.container {
    position: relative;
    z-index: 3;
}





/*****************************************************************
ms24 : CLICK HERE : 모달팝업
*****************************************************************/
.ms24 {
    margin: 0px 0;
    padding: 50px 0;
}




/*****************************************************************
ms25 : 사이트맵
*****************************************************************/
.ms25 {
    margin: 0px 0;
    padding: 100px 0 0;
}



/*****************************************************************
ms26 : 사업분야1
*****************************************************************/
.ms26 {
    margin: 0px 0;
    padding: 50px 0;
}



/*****************************************************************
ms27 : 사업분야2
*****************************************************************/
.ms27 {
    margin: 0px 0;
    padding: 50px 0;
}



/*****************************************************************
ms28 : 시설안내 : 탭기능
*****************************************************************/
.ms28 {
    margin: 0px 0;
    padding: 50px 0;
}



/*****************************************************************
ms29 : 조직도
*****************************************************************/
.ms29 {
    margin: 0px 0;
    padding: 50px 0;
}



/*****************************************************************
ms30 : 구글지도
*****************************************************************/
.ms30 {
    margin: 0px 0;
    padding: 0px 0 0;
}