﻿* {
    padding: 0;
    margin: 0;
    color: #353535;
    font-size: 12pt;
    font-family: '맑은 고딕','helvetica';
    font-size-adjust: initial;
    letter-spacing: -1px;
    text-decoration-line: none;
    background-repeat: no-repeat;
}

a {
    text-decoration: none;
}

ul, li {
    list-style: none;
}

html{
    height:100%;
}
body {
    min-width: 1260px;
    height:100%;
    position:relative;
}


#wrap { /*전체 그룹*/
    width: 100%; /*1260px;*/
    /*height: 4475px;*/
    margin: 0 auto;
    min-height:100%;
}
/*위젯그룹*/
#widget {
    width: 290px;
    height: 63px; /*439px*/
    position: fixed;
    bottom: 12%;
    left: 75%;
    z-index: 50;
    transition-duration: 5s;
    display:none;
}

#dot {
    width: 63px;
    height: 63px;
    margin-right: 3px;
    float: right;
    -webkit-perspective: 1px;
    background-color: #3498db;
    background-image: url(../images/dot.png);
    background-size: 100%;
    background-position: center;
    background-position-x: -1px;
    border-radius: 32px;
    box-shadow: 10px 8px 15px 0px rgba(0,0,0,0.2); /*css #6D6D6D*/
    -webkit-box-shadow: 10px 8px 15px 0px rgba(0,0,0,0.2); /*Safari and Chrome */
    -moz-box-shadow: 10px 8px 15px 0px rgba(0,0,0,0.2); /* Firefox */
}

/*위젯2(클릭시)*/
#dot_pop {
    width: 281px;
    height: 373px; /*373px*/
    -webkit-perspective: 1px;
    background-image: url(../images/widget.png);
}

     .x {
        width: 34px;
        height: 27px;
        float: right;
        background-image: url(../images/x.png);
    }

#dot_list {
    width: 243px;
    height: 311px;
    float: left;
    margin-left: 28px;
    margin-top: 1px;
}

#dot_list > a{
    height:43px;
    width:241px;
    background-color:rebeccapurple;

}

.dot_list {
    
    height: 42px;
    width: 195px; /*243 -46*/
    margin: 0 auto;
    padding-left: 46px;
    line-height: 42px;
    color: #666666;
    background-color: white;
    background-image: url(../images/widget_list.png);
    border-bottom: 1px solid #d1d1d1;
}

#dot_list > div {
    height: 46px;
    width: 197px;/*243 - 46*/
    padding-left: 46px;
    line-height: 46px;
    background-image: none;
    background-color: #f9f9f9;
    font-size: 13pt;
    font-weight: 600;
    
}

.display {
    display: none;
}


.display_dot {
    margin-bottom: 373px;
}



/******************* * main page * *******************/


/*그룹1-메뉴*/
#main {
    width: 100%;
    /*height: 707px;*/
}

/*메뉴바- sns 메뉴바*/
#main_top_menu {
    width: 100%;
    height: 72px;
    border-bottom: solid 1px #C3D7DB;
    box-sizing: border-box;
}

.sns_menu {
    width: 287.4px;
    height: 55px;
    padding-top: 16px;
}

#main_sns_menu {
    margin: 0 auto;
}

.sns_menu > a {
    width: 40px;
    height: 40px;
    margin-right: 21.8px;
    background-color: #116171;
    float: left;
    border-radius: 20px;
}

    .sns_menu > a:last-child {
        margin-right: 0;
    }

    .sns_menu > a > div {
        color: white;
        font-size: large;
        text-align: center;
        line-height: 36px;
        font-weight: 900;
    }

/*메뉴바 -로고*/
#main_logo {
    width: 1260px;
    height: 579px;
    margin: 0 auto;
    background-image: url(../images/main_logo.png);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: 40%;
}

/*주메뉴*/
.main_menu {
    width: 100%;
    height: 56px;
    border-top: solid 1px #C3D7DB;
    border-bottom: solid 1px #C3D7DB;
    box-sizing: border-box;
}

.main_menu_down {
    width: 1020px;
    height: 100%;
    margin: 0 auto;
}

    .main_menu_down a {
        height: 100%;
        padding: 0 39.2px;
        border-right: solid 1px #C3D7DB;
        float: left;
        line-height: 54px;
    }

        .main_menu_down a:last-child {
            border-right: none;
        }

        .main_menu_down a > div {
            letter-spacing: -2px;
            color: #6D6D6D;
        }

        .main_menu_down a:hover {
            background-color: #f1f4f7;
        }

/*** 서브 주 메뉴 ***/
.sub_menu_down {
    width: 1260px;
    height: 100%;
    margin: 0 auto;
}

    .sub_menu_down > div {
        /* width: 620px; */
        float: right;
    }

    .sub_menu_down a:last-child {
        border-right: solid 1px #C3D7DB;

    }
    

    /* 회사소개 대기1 */
#sub1_menu_down a:first-child {
    background-color: #f1f4f7;
}
    /* 회사소개 대기2*/
#sub2_menu_down a:nth-child(2) {
    background-color: #f1f4f7;
}

/* 회사소개 대기3*/
#sub3_menu_down a:nth-child(3) {
    background-color: #f1f4f7;
}
/* 회사소개 대기4*/
#sub4_menu_down a:nth-child(4) {
    background-color: #f1f4f7;
}

/* 회사소개 대기5*/
#sub5_menu_down a:nth-child(5) {
    background-color: #f1f4f7;
}


    /************************/


    /*고래이미지*/
    #contents1 {
        width: 100%;
        height: 250px;
        background-color: #023B51;
        background-image: url(../images/main_contents1.png);
        background-size: 100% 100%;
        background-repeat: no-repeat;
        background-position-y: center;
    }

/* 회사 비전 소개*/
#contents2 {
    width: 1028px;
    height: 1258.5px;
    padding: 115px 116px 0 116px;
    margin: 0 auto;
}
/*백그라운드에 설명 아이콘*/
#contents2_vision {
    width: 100%;
    height: 322px; /*489px; = 117 */  /*372 - 50 */
    /*
    background-image: url(../images/contents2_vision.png);
    background-repeat: no-repeat;
    background-position-x: 60px;
    background-position-y: 0px;*/
}
    /*Well together */
    #contents2_vision > p:first-child {
        margin-bottom: 38px;
        margin-left: 12px;
        font-family: Georgia, 'Times New Roman', Times, serif;
        font-size: 29pt;
        color: #263D4D;
        letter-spacing: -1.5px;
    }
    /* 회사 설명*/
    #contents2_vision > p:nth-child(2) {
        margin-left: 12px;
        font-family: '맑은 고딕',Arial;
        font-size: 13pt;
        line-height: 16pt;
        color: #25292B;
    }
/*버튼 about more + : 누르면 회사 소개페이지로 이동 */
.botton {
    display: block;
    width: 167px;
    height: 45.5px;
    background-color: #3498DB;
    color: white;
    font-family: '명조';
    font-size: 13.5pt;
    border-radius: 7px;
    line-height: 44px;
    text-align: center
}

#contents2_vision > a {
    margin-top: 158px; /*287*/ /*202-50*/
    float: right;
}

/*중간 구분선*/
hr {
    margin-top: 26px;
    margin-bottom: 42px;
    border: solid 1px #C3D7DB;
}

/*회사 이미지, 소개.. 기타 */
#contents2_images > div:nth-child(1) {
    width: 1028px;
    height: 404px;
    margin: 0 auto;
    background-color: gray;
    background-image: url(../images/b2.jpg);
    /*url(https://images.unsplash.com/photo-1437385545573-fcf5b4b7fb57?auto=format&fit=crop&w=1267&q=60&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D);*/
    background-size: 110%;
    background-position-y: -340px;
    background-attachment: scroll;
    margin-bottom: 46px;
}

#contents2_images > div:nth-child(2) {
    height: 268px;/*218+50*/
    width: 1004px;
}
    #contents2_images > div:nth-child(2) > p:nth-child(n) {
        font-size: 11pt;
        margin-bottom:5px;
    }

    #contents2_images > div:nth-child(2) > p:nth-child(1) {
        font-weight: 700;
        font-size: 15pt;
        font-family: 'Helvetica';
        margin-bottom: 27px;
    }

    



/*이미지 4개 바탕 청록*/
#contents2_box li { /*drop-shadow: x-offset y-offset blur spread color inset;*/
    width: 201px;
    height: 152px;
    float: left;
    margin-right: 69px;
    background: #3c6b6d;
    box-shadow: 0px 0px 12px 2px #b7b1b1; /*css #6D6D6D*/
    -webkit-box-shadow: 0px 0px 12px 2px #b7b1b1; /* Safari and Chrome */
    -moz-box-shadow: 0px 0px 12px 2px #b7b1b1; /* Firefox */
}

    #contents2_box li:last-child {
        margin-right: 0px;
    }

/*프로그램 소개 및 파트너사*/
#contents3 {
    width: 100%;
    height: 1248px;
    background-color: rgba(183,210,217,0.6);
    background-image: url(../images/bb13-1.png);
    /*background-image: url(../images/contents3_images.png);*/
    background-repeat: no-repeat;
    background-position-x: center;
    background-size: 100% 71%;
}

/*이미지박스 설명*/
#contents3_box {
    width: 1028px;
    height: 246px;
    margin: 0 auto;
    margin-bottom: 75px;
}

#contents3_box li { /*drop-shadow: x-offset y-offset blur spread color inset;*/
	width: 153px; /*가로 201 -24-24*/
	height: 198px; /* 세로 246 -22-22*/
	padding: 22px 24px; /*세로 가로*/
	float: left;
	margin-right: 69px;
	background-color: white;
	box-shadow: 0px 0px 12px 2px #b7b1b1; /*css*/
	-webkit-box-shadow: 0px 0px 12px 2px #b7b1b1; /* Safari and Chrome */
	-moz-box-shadow: 0px 0px 12px 2px #b7b1b1; /* Firefox */
}

#contents3_box li:last-child {
    margin-right: 0px;
}

#contents3_box li p {
    font-size: 9pt;
    font-weight: 500;
    line-height: 14pt;
    letter-spacing: -1.5px;
    margin-bottom: 6px;
}

#contents3_box li p:first-child {
    font-size: 10.5pt;
    font-weight: 700;
    margin-bottom: 14px;
    letter-spacing:-1.2px;
}

/*프로그램 소개 text 설정 :contents3_text*/
#contents3_text {
    width: 1028px;
    height: 408px;
    margin: 0 auto;
}
/*텍스트 박스*/
#contents3_text1, #contents3_text2 {
    float: left;
    height: 100%;
    padding: 0 6px;
}

#contents3_text1 {
    width: 484px; /*496 패딩 -6-6*/
    margin-right: 95px;

}

#contents3_text2 {
    width: 425px; /*437 -6-6*/
}

/*텍스트박스 제목*/
.contents2_text_title {
    border-left: solid 7px #24144c;
    height: 43px;
    font-size: 18pt;
    line-height: 20pt;
    padding-left: 16px;
    font-weight: 600;
    margin-bottom: 25px;
}

#contents3_text p {
    font-size: 10pt;
    line-height: 13pt;
    margin-left: 17px;
    margin-bottom: 12px;
    letter-spacing: -1px;
    font-weight: 500;
    color:rgba(0,0,0,0.7);
}

.botton {
    float: right;
    margin-left: 4px;
}

/*클라이언트 리스트*/
#contents3_clients {
    width: 1130px; /*1028 51 51*/
    padding: 0 51px 30px 51px;
    margin: auto auto;
    margin-top: 212px;
    border-bottom: solid 1px #C3D7DB
}

#contents3_clients p {
    margin-left: 48px;
    margin-bottom: 52px;
    font-size: 22pt;
    line-height: 22pt;
    font-weight: 500;
}
#contents3_clients .crop {
    width: 1030px; /*1012 // 1010*/
    height: 142px;
    overflow: hidden;
    margin: 0 auto;
}
#contents3_clients .banner_c {
    position: relative;
    width: 1700px; /*1012 // 1010*/
    height: 142px;
    overflow: hidden;
    margin: 0 auto;
}

#contents3_clients ul {
    position: absolute;
    width: 1535px; /*1012 // 1010 + 205*/
    height: 142px;
    /*margin: 0 auto;*/
}

#contents3_clients ul > li {
    float: left;
    width: 190px;
    height: 142px;
    padding-right: 20px;
    /*border: 1px solid #f0f4f5;*/
    /*#fafafa;*/                  
}

#contents3_clients ul > li > a {
    float: left;
    width: 100%;
    height: 100%;
    background-color: white;
}

.aa{
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}


.c1 {
    background-image: url(../images/hanamarine.png);
    background-size: 42%;
}

.c2 {
    
    background-image: url(../images/fortune.png);
    background-size: 82%;
        
}

.c3 {
    
    background-image: url(../images/keoyoungship.png);
    background-size: 84%; 
}
   .c4 {
    
    background-image: url(../images/oceanjade.png);
    background-size: 84%;
}
.c5{                
    
    background-image: url(../images/unam.png);
    background-size: 84%;
    background-color: white;
}

.c6 {
  background-image: url(../images/dongjin.png);
  background-size: 84%;
  background-color: white;
    }

.c7 {
    background-image: url(../images/eastern.png);
    background-size: 64%;
    background-color: white;
}

.c8 { /*리앤쉬핑*/
    background-image: url(../images/leeship_logo.png);
    background-size: 64%;
    background-color: white;
}

.c9 { /*ksim*/
    background-image: url(../images/ksim.png);
    background-size: 64%;
    background-color: white;
}
            
.c10 { /*새한선박*/
    background-image: url(../images/seahan_logo1.png);
    background-size: 84%;
    background-color: white;
}

.c11 { /*(주)한유*/
    background-image: url(../images/hanyu_logo.png);
    background-size: 54%;
    background-color: white;
}

.c12 { /*MSSM*/
    background-image: url(../images/mssm.png);
    background-size: 44%;
    background-color: white;
}

.c13 { /*덕양해운*/
    background-image: url(../images/dy.png);
    background-size: 60%;
    background-color: white;
}

#contents3_clients ul > li:last-child {
    /*
    margin-right: 0;
    background-color: #fafafa;
    // background-image: url(../images/ex_clients5.png);
    background-size: 50%;
    */
}

/*고객센터 지원안내*/
#customer {
    width: 1028px;
    height: 456px; /*712 -128-128*/
    margin: 0 auto;
    padding: 128px 116px;
}

#customer > div:first-child {
    height: 115px;
    background-image: url(../images/customer.png);
    background-repeat: no-repeat;
    background-position-x: center;
    text-align: center;
    font-size: 26pt;
    line-height: 150px;
    letter-spacing: 1px;
    margin-bottom: 107px;
}

#customer > div:nth-child(2) {
    padding: 0 26px;
    margin-bottom: 42px;
}


/*텍스트박스 가운데정렬*/
#customer_text {
    width: 1028px;
    margin: 0 auto;
}
/*텍스트 박스 안쪽 들여놓기*/
#customer_text1, #customer_text2 {
    float: left;
    width: 403px; /*415 -6 -6*/
    padding: 0 6px;
}

#customer_text1 {
    margin-right: 198px;
}

#customer_text2 {
}

#customer_text p, #customer_text li, #customer_text span {
    font-size: 10pt;
    margin-left: 24px;
}

#customer_text p {
    line-height: 13pt;
    margin-bottom: 16px;
}

#customer_text li {
    list-style-image: url(../images/list-style.png);
    margin-bottom: 9px;
}

#customer_text1 > div:first-child, #customer_text2 > div:first-child {
    height: 25px;
    font-size: 15pt;
    font-weight: 500;
    line-height: 14pt;
}

#customer_text1 > div:nth-child(3) p {
    padding-top: 16px;
    border-top: solid 1px #C3D7DB;
}

#customer_text span {
    color: #3498db;
    margin-left: 12px;
}


/*푸터ㅓㅓㅓㅓㅓㅓ */

footer {
    width: 100%;
    height: 158px; /*198 -40 = 158 */
    float: left;
    padding-top: 40px;
    background-color: #1c394f;
    position:absolute;
    z-index:5;
}
/*푸터 글부분 전체(청록 전체 +푸터 패딩값있음*/
#footer_text {
    width: 1070px;
    margin: 0 auto;
    height: 123px; /*163*/
}

#footer_text1, #footer_text2 {
    color: rgba(179,183,186,0.8);
}

/*footer 씨텍 이름 + 아래여백 포함한 높이:36*/
#footer_text1 {
    height: 36px;
    font-size: 18pt;
    font-weight: 300;
}
/*footer 부가정보 전제틀 : 55 / (푸터198 -윗패딩40 -씨텍이름,여백36 -부가정보55 = 36 ->이부분으로 top*/
#footer_text2 {
    height: 55px;
    margin-bottom: 10px;
}

    /*footer 부가정보 세부박스 1/2/3/4 */
    #footer_text2 > ul > li {
        float: left;
        width: 212px;
        margin-right: 74px;
    }
        /*마진설정*/
        #footer_text2 > ul > li:last-child {
            margin-right: 0;
        }
/*세부박스 1. : li 높이설정:아이콘때문에*/
#footer_text2_01 li {
    height: 19px;
}
    /* 전화모양. 아이콘 등*/
    #footer_text2_01 li div {
        width: 20px;
        height: 19px;
        float: left;
        margin-right: 5px;
        background-image: url(../images/call.png);
    }

#footer_text2_01 > ul > li:nth-child(2) > div {
    background-image: url(../images/fax.png);
}

#footer_text2_01 > ul > li:nth-child(3) > div {
    background-image: url(../images/mail.png);
}

#footer_text2 li {
    color: rgba(179,183,186,0.8);
    font-size: 12px;
    line-height: 14pt;
}

/*top 바로가기*/
#top_botten {
    width: 47px;
    height: 22px;
    margin: 0 auto;
    background-image: url(../images/top.png);
}
/*맨 아래 카피라이터*/
#footer_copyright {
    height: 35px;
    width: 100%;
    background-color: #142835;
    text-align: center;
    font-size: 10pt;
    color: rgba(255,255,255,0.3);
    line-height: 35px;
}

/****************** sub1*******************/

/*맨 윗 메뉴 : sms메뉴. 로고. 주메뉴*/
.sub1 {
    width: 100%;
}

    /*바로가기메뉴/ 로고 두가지그룹div*/
    .sub1 > div:first-child {
        width: 1260px;
        height: 131px;
        margin: 0 auto;
    }

.sub_top_menu {
    width: 354px;
    float: right;
    /*햄버거메뉴+40여백 47*/
}

.h_menu {
    width: 47px;
    height: 100%;
    float: right;
    background-image: url(../images/menu.png);
    background-repeat: no-repeat;
    background-position-x: right;
    background-position-y: center;
}

#sub_top_menu {
    width: 354px;
    height: 71px;
    background-color: white;
}

#sub_sns_menu {
    float: left;
    width: 288px;
}

.sub1_logo {
    height: 131px;
    width: 164px;
    float: left;
    background-image: url(../images/main_logo.png);
    background-size: 77%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: -25px;
}

.sub_img {
    height: 519px;    
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: 40%;
    border-bottom: solid 1px #C3D7DB;
}

/*서브1 이미지*/
#sub1_img {
    background-image: url(https://images.unsplash.com/photo-1487958449943-2429e8be8625?auto=format&fit=crop&w=1350&q=60&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D);
    /*background-image: url(https://images.unsplash.com/photo-1460620105278-b7f0516e6d65?auto=format&fit=crop&w=1350&q=60&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D);
    */
}
#sub2_img {
    height:513px;
    background-image: url(../images/sub2_program.png);
    background-position:top;
}

/*서브 컨텐츠 창 : 포지션 릴레이티브 부여-z값 */
.sub_contents {
    width: 1058px; /*1260*/
    /*height: 896px;*/
    padding: 42px 101px 108px 101px;
    margin: 0 auto;
    background-color: white;
    position: relative;
}
#sub1_contents {
    height: 896px;
}
/* 물방울 클릭창 / 소메뉴 멘트 */
/*소메뉴 그룹*/
.click_ev {
    width: 112px; /*112*/
    height: 92px;
    float: right;
    border-right: solid 1px #D5DFE0;
    box-sizing: border-box;
}

/*말풍선 그룹*/
.ment {
    width: 100%;
    height: 30px;
    position: relative;
}
    /*말풍선 : z-inex*/
    .ment li {
        width: 100%;
        height: 100%;
        background-size: 99%;
        background-repeat: no-repeat;
        background-position-x: center;
        position: absolute;
    }

#ment1 {
    z-index: 10;
    background-image: url(../images/ment1_2.png);
}

#ment2 {
    z-index: -20;
    background-image: url(../images/ment2_2.png);
}

#ment3 {
    z-index: -30;
    background-image: url(../images/ment3_2.png);
}

.drop{

    width:60px;
    height:26px;
    float:right;
}
/*물방울 클릭*/
.drop li {
    width: 60px;
    margin-right:3px;
    height: 24px;
    float: left;
    background-size: 85%;
    background-position-y:-3px;

}

#drop1 {
    display:none;
    background-image: url(../images/drop1.png);
}

#drop2 {
    background-image: url(../images/drop2.png);
}

#drop3 {
    background-image: url(../images/drop3.png);
}

/*서브이미지 :(인사말/ 사업범위 /오는길 */
.sub_contents_in {
    width: 1058px;
    height: 834px;
    float: left;
    position: absolute;
    top: 118px;
}


/*서브이미지 제목 : CEO인사말/ 사업범위 / 오시는길 */
.in_title {
    width: 100%;
    height: 50px;
}

    .in_title li {
        float: left;
    }
        /*제목글자 드가는 곳*/
        .in_title li:nth-child(2) {
            width: 34%;
            text-align: center;
            line-height: 28px;
            font-size: 10pt;
            letter-spacing: -1px;
            color: #6e6e6e;
        }

        .in_title li:nth-child(2n-1) {
            width: 33%;
            height: 16px;
            border-bottom: solid 1px #C3D7DB;
        }

        .in_title li:nth-child(3) {
            border-right: solid 1px #D5DFE0;
            box-sizing: border-box;
        }

/*서브이미지 : 사진 드가는 곳*/
.sub_contents_img {
    width: 1058px;
    height: 433px;
    margin: 0 auto;
    background-color: gray;
    margin-bottom: 45px;
}

#sub_contents_img {
    background-image: url(../images/sub_man2.png);
    background-size: 100% auto;
    background-position-y: center;
}

/*서브이미지 설명글*/
.sub_contents_text1 {
}

    .sub_contents_text1 p {
        margin-bottom: 37px;
        margin-left: 10px;
        font-size: 10.8pt;
        line-height: 16pt;
    }

        .sub_contents_text1 p:last-child {
            margin-bottom: 0;
        }

/*서브1 z값*/
#sub_contents_in_1 {
    z-index: 10;
}

/******** 서브 2******/

#sub_contents_img2 {
    background-image: url(../images/sub_note2.png);
    background-size:100%;
}

#sub_contents_text2 {
    margin-left: 20px;
}

.sub_contents_text1 ul li {
    font-size: 11pt;
    list-style-image: url(../images/list-style.png);
    margin-bottom: 45px;
}

#sub_contents_text2 p {
    margin-top: 10px;
}

/*서브2 z값*/
#sub_contents_in_2 {
    display:none;
    height:1438px;
    z-index: -20;
}

/******** 서브 3 ******/

#sub_contents_img3 {
    height: 521px;
    background-image: url(../images/sub_map.png);
    background-position: center;
    background-size: 100.5%;
}

#sub_contents_text3 {
    margin-left: 20px;
}

    #sub_contents_text3 p {
        margin-top: 10px;
    }
/*서브3 z값*/
#sub_contents_in_3 {
    z-index: -30;
}


/*********** sub2_program **********/
#sub2_contents {
    width:100%;
    padding:0;
}

 /* 프로그램 소개 */
.introduction {
    width: 1058px;
    height: 695px;
    padding: 97px 0 116px 0;
    margin: 0 auto;
    background-image: url(../images/sub2_graph2.png);
    background-position-y:300px;
}

/* 소개 타이틀만 싸는 div*/
.sub3_text_title {
    height: 46px;
    width:100%;
    border-bottom: solid rgba(104,97,92,0.38) 4px;
    box-sizing: border-box;
    margin-bottom:27px;
}

    /* text : Program introduction */
    .sub3_text_title > div:first-child {
        font-size: 28pt;
        line-height: 18pt;
        font-weight:600;
        color: #2a374f;
        float: left;
        
    }

    /* text : 01 */
    .sub3_text_title > div:last-child {
        font-size: 28pt;
        line-height: 22pt;
        font-weight: 700;
        color: rgba(118,142,244,0.38);
        float: right;
    }

    /*프로그램 페이지 전체 p 값*/
#sub2_contents p {
    margin-top:0px;
    font-size: 10pt;
    line-height: 15pt;
    letter-spacing: -1.2px;
    margin-left:10px;
}
/*프로그램 설명 p 값*/
#sub2_contents .introduction > p {
    line-height:14pt;
    color:#6e6e6e;
}

#sub2_contents .introduction > p:last-of-type{
    margin-left:30px;
    margin-top:130px;
}
/*프로그램 소개 그래프*/
.introduction_graph {
    width: 1014px;
    height: 276px;
    margin: 0 auto;
    margin-top: 117px;
}

/* curriculum */
.curriculum {    
    padding-top:91px;
    padding-bottom:112px;
    background-image: url(../images/pattern.png);
    background-repeat:repeat;
}

.curriculum >div{
    width:1058px;
    margin:0 auto;
}

    .curriculum > div:nth-child(2) {
        height: 1058px; /*1352 px  -(윗여백 123 -106) -150 =*/
        width: 760px;
        padding: 229px 0 140px 200px; /*top 123(스텝이미지 위의 여백) + 106 =229*/
        background-image: url(../images/curriculum_bg.png);
        background-position-x: center;
        background-position-y:40%;
    }

    .step{        
        margin-bottom:158px;
    }

#sub2_contents .curriculum > div:nth-child(2) > .step > p {
    margin-top: 7px;
}

/* 동영상/ 동영상 설명*/
.box_video{
    height:593px;
}

.in_video {
    width: 100%;
    height: 402px;
    background-color: dimgrey;
    margin: 0 auto;
    margin-bottom: 39px;
    background-image: url(../images/sub2_curriculum.png);
    background-size:100% 100%;
}

.video_text {
    height:152px;
}
.video_d_box {
    width: 132px; /*174 - 21 -21*/
    height: 91px; /*152 -57 -24 = 71 + 20*/
    padding:37px 21px 24px 21px; /*57 - 20*/

    margin-right: 120px;
    float: left;
    font-size: 11px;
    line-height: 12pt;
    color: #a8a8a8;
    background-image: url(../images/video_d_box.png);
    background-position-x:center;
    background-color: #7acbc5;
}

.video_text > div:nth-child(2) {
    background-color: #ffdc83;
}
.video_text > div:nth-child(3) {
    background-color: #ff787f;
}
.video_text > div:last-child {
    background-color: #916bdb;
    margin-right:0;
}

#sub2_contents .video_d_box p {
    margin-left: 0;
    color: #dfe1e5;
    line-height:25px;
    letter-spacing: 0;
}
/******** * 장점 / 강점 * ********/
.advantage {
    width: 1058px;
    margin: 0 auto;
    padding-top: 200px;
    padding-bottom: 212px;
}
    
    .advantage > div:nth-child(2) {
        width: 100%;
        height: 299px;
        margin: 113px 0 75px 0;
        background-image: url(../images/monitor.png);
    }

    .advantage >div:nth-child(3) {
        width:1058px;
        height:140px;
    }

    .advantage_text {
        width: 31.3%;
        padding-right: 3%;
    }

.advantage ul li {
    font-size: 21pt;
    font-weight: 600;
    float: left;
    color: #595959
}

.advantage ul > li:last-child {
    padding-right: 0;
}

#sub2_contents .advantage ul li p {
    margin-top: 7px;
    margin-left: 0;
    font-weight:300;

}

/****************** sub3 고객센터 ( sub3_customer) *************************/

#sub3_img {
    /*background-image: url(../images/pattern2.png);*/
    background-image: url(../images/customer1.png);
}

#sub3_contents {
    width:1260px;
    padding-right:0;
    padding-left:0;
    padding-bottom:0;
}

    #sub3_contents >div{
        padding:0 180px;
        margin:0 auto;
    }

        #sub3_contents .customer_title {
            height: 135px; /*166-42*/
            padding-top: 27px;
            background-image: url(../images/pattern3.png);
            background-repeat: repeat-x;
            background-position: bottom;
        }

        .customer_title div {
            width: 900px;
            height: 69px;
            background-color: #1c394f;
            margin:0 auto;

            color:white;
            text-align:center;
            font-weight:400;
            font-size:17pt;
            line-height:69px;
            letter-spacing:0.3px;
        }

        /* 질문 리스트*/
#sub3_contents .customer_box {
    background-color: #dddddd;
    padding-bottom: 200px;
}

    .customer_box > div:first-child {
        text-align: center;
        line-height: 102px;
        font-size: 16pt;
        font-weight: 800;
        color: #b9b8b8;
    }

.customer_list {
    background-color: #efefef;
    border: 1px solid #a3a3a3;
    border-bottom: 0;
    border-top: 0;
    box-sizing: border-box;
}

.customer_list >li {
    border-top: 1px solid #a3a3a3;
    box-sizing: border-box;
    background-color: white;
    line-height: 57px;
    /*overflow: hidden;*/
    font-size: 17px;
    color: #7e7a7a;
    font-weight: 500;
    background-image: url(../images/list_menu_2.png);
}

    .customer_list > li:nth-child(n+5) {
        background-image: url(../images/list_menu_1.png);
    }
    .customer_list > li:last-child {
        border-bottom: 1px solid #a3a3a3;
    }
    
    .customer_list p {
        margin-left: 70px;
    }

    .customer_list span {
        float: right;
        margin-right: 20px;
        font-size:10pt;
        color: #919191
    }

    .customer_list dl {
        background-color: #efefef;
        border-top: 1px solid #a3a3a3;
    }

    .customer_list dt {
        padding: 50px 70px;
        line-height: 18pt;
        font-size: 11pt;
        color: #919191
    }

    /*************** * sub4_menbership * ********************/
#sub4_contents{
    width:100%;
    overflow:hidden;
    padding:0;
    position:relative;
    margin-bottom:-198px;
    background-color:none;
}
    #sub4_contents > div:nth-child(1) {
        width: 309px;
        height: 444px;
        margin: 0 auto;
        padding-top: 169px;
        padding-bottom: 218px; /*198*/
    }
    
    .member {
        width: 188px;
        height: 188px;
        border-radius: 94px;
        background-color: #ffd488;
        background-image: url(../images/ship.png);
        background-position-x: center;
        background-position-y: 38px;
        margin: 0 auto;
        margin-bottom: 58px;
        box-shadow: 5px 8px 15px 0px rgba(0,0,0,0.3); /*css #6D6D6D*/
        -webkit-box-shadow: 5px 8px 15px 0px rgba(0,0,0,0.3); /*Safari and Chrome */
        -moz-box-shadow: 5px 8px 15px 0px rgba(0,0,0,0.3); /* Firefox */
    }

#sub4_contents .input_box {
    display: block;
    width: 306px;
    height: 42px;
    border: 1px solid #c3d7db;
    box-sizing: border-box;
    margin: 0 auto;
    margin-bottom: 21px;
    padding: 12px 21px;
    font-size: 12pt;
    color: #95a0a0;
}

#sub4_contents #input_id {
    margin-bottom: 13px;
}
    
.bt{
    width:100%;
    margin:0 auto;
    height:45.5px;
    margin-bottom:13px;
}

#sub4_bt1 {
    width: 192px;
    margin: 0;
    float:left;
}

#sub4_bt2{
    width:98px;

}
#sub4_contents > a:last-child {
    color: #95a0a0;
    font-size:11pt;
    letter-spacing:0;
}

/***********/
.loss_g {
    position: absolute;
    width: 398px;
    top: 15%;
    left: 50%;
    transform: translateX(-50%);
    z-index: -10;
}
.loss {
    width: 398px;
    height: 459px; /*459 46 */
    float:right;
    border: solid 1px #C3D7DB;
    box-sizing: border-box;
    position: relative;
    background-color:white;
    box-shadow: 5px 8px 15px 0px rgba(0,0,0,0.3); /*css #6D6D6D*/
    -webkit-box-shadow: 5px 8px 15px 0px rgba(0,0,0,0.3); /*Safari and Chrome */
    -moz-box-shadow: 5px 8px 15px 0px rgba(0,0,0,0.3); /* Firefox */
}

.loss_box01, .loss_box02 {
    height: 46px;
    width: 204px;
    box-sizing: border-box;
    position: absolute;
    top: 0;
}

.loss_box01 {
    border-top: 46px solid #1c394f; /*활성화 #1c394f 남색 /// 비활성화 #f1f4f7 회색*/
    border-right: 18px solid rgba(0,0,0,0);
    box-sizing: border-box;
    left: 0;
}

.loss_box02 {
    border-bottom: 46px solid #f1f4f7; /*활성화 #1c394f 회색 /// 비활성화 #f1f4f7 회색*/
    border-left: 18px solid rgba(0,0,0,0);
    letter-spacing: 0;
    right: 0;
}

.loss span {
    width: 197px;
    height: 46px;
    color: #95a0a0;
    line-height: 46px;
    display: block;
    text-align: center;
    position: absolute;
    z-index: 1;
    /*color: #C3D7DB;*/
}

.loss > span:nth-child(4) {
    right: 0;
}
/* input 박스. 버튼 등 내용 2개 감싸는 */
.loss_textbox {
    width: 396px;
    height: 413px;
    margin-top: 46px;
    overflow: hidden;
    position:relative;
}

/*input 박스. 버튼 등 내용 */
.loss_text {
    position:absolute;
    float: left; 
    width: 316px; /*396 -40 -40*/
    height: 302px; /*413 -65 -46*/
    padding: 65px 40px 46px 40px;
}

#loss_textbox02 {
    left:396px;
}

.loss label {
    font-size: 9pt;
    display: block;
    margin-bottom: 3px;
    margin-left: 8px;
}
.loss_textbox p{

    font-size:10pt;
    line-height:12pt;
    color:#6e6e6e;
    margin-left:8px;
    margin-bottom:56px;

}
#loss_bt {
    width: 174px;
    margin: 0 auto;
    margin-right: 58px;
}