header{
    background: linear-gradient( 45deg, #307df8,#003791 );
    width: 100%;
    height: 300px;
    vertical-align: middle;
}

header h2{
    margin-top: 10px;
}

section{
    width: 100%;
    margin-top: 100px;
    margin-bottom: 100px;
}

section > .wrap{
    width: 90%;
    margin: 0 auto;
}

h3, h4, p{
    text-align: center;
}

h3{
    margin-bottom: 30px;
}

h4{
    margin-bottom: 10px;
}

#nav_m_wrap{
    margin-top: 0;
    padding-top: 25%;
}

.header_wrap{
    margin: 0 auto;
    width: 70%;
    margin-top: 4.5rem;
}

#intro{
    display: inline-block;
}

#intro .img_holder{
    position: relative;
    width: 80%;
    min-width: 730px;
    margin: 0 auto;
    text-align: center;
}

/* #intro .img1{
    position: absolute;
    width: 50%;
}

#intro .img2{
    position: absolute;
    width: 77%;
    margin-left: 28%;
    margin-top: 12%;
} */

#intro .img1{
    width: 40%;
}

#intro .img2{
    width: 70%;
    margin-left: -20%;
}

#represent{
    height: 480px;
    margin-top: 50px;
}

#represent .wrap{
    width: 80%;
}

#represent .img_holder {
    width: 30%;
    text-align: center;
}

#represent .img_holder img{
    max-width: 230px;
}

#represent .name_holder{
    text-align: center;
    margin-top: 50px;
}

#represent .name{
    margin-left: 1.5rem;
    letter-spacing: .8rem;
}

#represent h4{
    text-align: left;
    margin-bottom: 30px;
}

#represent .greets{
    line-height: 2rem;
    text-align: left;
}

#represent .greets_holder{
    width: 65%;
    padding-left: 5%;
    margin-top: 50px;
}

#history{
    /* height: 1400px; */
    display: inline-block;

}

.cd-timeline__content p{
    font-size: 1rem;
    text-align: left;
}

.cd-timeline{
    background-color: transparent;
    font-family:  'Avenir','NanumSquare', 'sans-serif';
}

.cd-timeline__img{
    width: 30px;
    height: 30px;
    margin-left: calc(5% - 15px);
    margin-top: 22px;
}

.cd-timeline__block:nth-child(even) .cd-timeline__img {
    margin-right: calc(5% - 15px);
    background-color:#fff;
    box-shadow: 0 0 0 4px #307df8,inset 0 2px 0 rgba(0,0,0,0.08),0 3px 0 4px rgba(0,0,0,0.05);
}

.cd-timeline__content .col1{
    color: #307df8;
}

.cd-timeline__content .col2{
    color: #363636;
}

.cd-timeline__content h2{
    color: #000;
    font-size: 1.6rem !important;
    font-family:  'Avenir','NanumSquare', 'sans-serif';
}

.cd-timeline .dt{
    font-weight: bold;
    display: block;
}

.cd-timeline__block h2{
    margin-bottom: 10px;
}

.cd-timeline__block:nth-child(odd) h2, 
.cd-timeline__block:nth-child(odd) .col1, 
.cd-timeline__block:nth-child(odd) .col2,
.cd-timeline__block:nth-child(even) .cd-timeline__date{
    text-align: right;
}

.cd-timeline__block:nth-child(even) h2, 
.cd-timeline__block:nth-child(even), .col1,
.cd-timeline__block:nth-child(even) .col2,
.cd-timeline__block:nth-child(odd) .cd-timeline__date{
    text-align: left;
}
.cd-timeline__date{
    font-size: 1.5rem !important;
}

.cd-timeline__container::before{
    background: rgba(0,0,0, .5);
    width: 3px;
}

.cd-timeline__img--picture{
    background-color: #307df8;
}

.cd-timeline__content{
    box-shadow: none;
}


.text-component>*:first-child{
    font-size: 1.3rem;
}


#domain{
    margin-bottom: 70px;
    margin-top: 30px;
    text-align: center;
}

#domain img{
    width: 100%;
    max-width: 1140px;
}

#domain h4{
    margin-bottom: 70px;
    line-height: 2.5rem;
}

#waytocome{
    margin-top: 0;
}

#waytocome h3{
    margin-bottom: 50px;
}

#waytocome .wrap{
    width: 70%;
}

#waytocome .map_holder{
    float:left;
    background-color: #307df8;
    width: 50%;
    max-width: 630px;
    height: 450px;
}

#waytocome .map_desc{
    width: 45%;
    display: inline-block;
    margin-top: 1%;
    padding-left: 5%;
}

.map_desc .desc_card{
    margin-bottom: 2rem;
}

.map_desc .desc_card img{
    width: 50px;
    float:left;
}

.map_desc .desc_card b{
    display: inline-block; 
    line-height: 50px;
    font-size: 1.3rem; 
    margin-left: 10px;                                                                                                                                                                                                                                                                                       ;
}

.map_desc .desc_card .desc{
    padding-left: 62px;
    text-align: left;

}

#contact{
    display: inline-block;
    padding: 70px 0;
    background-image: url('../image/company/business.jpg');
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

#contact .btn_og{
    margin: 0 auto;
}

#contact p{
    line-height: 3rem;
    padding-bottom: 60px;
}