﻿/**
* OLYM Cascading Style Sheets
* File Name : contents.css
* Description : 컨텐츠 스타일시트
* Author : Web business Team / Choi Hyun Mi
* Email : desingtj@olym.co.kr
* Date : 2017.04.26
* Update : 2016.04.26
* Copyright(c) 2017 OLYM Communications. All Rights Reserved.
*/

/* _0101 인사말 */
.welcome .hello {display: flex;align-items: center;padding: 0 100px;position: relative;z-index: 10;width: 100%;height: 200px;box-sizing: border-box;}
.welcome .hello::before {position: absolute;right: 0;z-index: 0;width: 100%;height:  100%;background: url(/project/design/com/welcome_img.png) no-repeat center / contain;content: '';/* top: 60px; */}
.welcome .hello::after {position: absolute;top: 0;left:0;z-index: -1;width: 100%;height: 200px;background-color: #F1F6FF;content: '';}
.welcome .hello p {font-size: 30px;font-weight: 400;color: #000;}
.welcome .hello p span { font-weight: 700; color: #1D317D;}
.welcome .hello p span br {display: none;}
.welcome .desc {padding: 60px;font-size: 18px;font-weight: 400; line-height: 2;}
.welcome .desc p:nth-child(1) { margin-bottom: 50px;}
.welcome .desc .ceo { margin-top: 125px;}
.welcome .desc .ceo span { padding-left: 10px; font-size: 30px; font-weight: 700; color: #000;}

@media all and (max-width: 1440px) {
    .welcome .hello, .welcome .hello::after, .welcome .hello::before { height: 300px;}
    .welcome .hello { padding: 0 0 0 50px;}
    .welcome .hello p { font-size: 30px; line-height: 1.5;}
    .welcome .desc { font-size: 18px;}
    .welcome .desc .ceo span { font-size: 35px;}
}

@media all and (max-width: 1260px) {
    .welcome .hello, .welcome .hello::after, .welcome .hello::before { height: 250px; }
    .welcome .hello p { font-size: 25px; }
    .welcome .desc { padding: 40px 60px;}
    .welcome .desc .ceo { margin-top: 100px;}
    .welcome .desc .ceo span { font-size: 30px;}
}

@media all and (max-width: 900px) {
    .welcome .hello, .welcome .hello::after, .welcome .hello::before { height: 180px;}
    .welcome .hello { padding: 0 0 0 20px;}
    .welcome .hello::before { top: 0px;}
    .welcome .hello p { font-size: 20px;}
    .welcome .desc { font-size: 15px; }
    .welcome .desc .ceo { margin-top: 40px; }
    .welcome .desc .ceo span { font-size: 25px;}
}

@media all and (max-width: 680px) {
    .welcome .desc { padding: 40px; }
}

@media all and (max-width:550px) {
    .welcome .hello p span br { display: block; }
}

@media all and (max-width: 440px) {
    .welcome .hello, .welcome .hello::after, .welcome .hello::before {/* height:  150px; */padding: 20px;box-sizing: border-box;}
    .welcome .hello p {font-size: 18px;line-height: 1.4;}
    .welcome .desc { padding: 20px; font-size: 15px;}
    .welcome .desc p:nth-child(1){margin-bottom: 30px;line-height: 1.7;}
    .welcome .desc p:nth-child(2) br { display: none; }
    .welcome .desc .ceo span { font-size: 20px;}
}


/* _0102 주요업무/조직도 */
.con6 h3.stle { display: none; }
.business .bus_area { position: relative; z-index: 10; width: 100%; }
.business .bus_area img { width: 100%; }
.business .bus_area .pc { display: block;}
.business .bus_area .mobile { display: none;}
/* .business .bus_area::before { content: ''; position: absolute; width: 1920px; height: 100%; background-color: #FBFBFB; z-index: -1; top: 0; left: 50%; transform: translateX(-50%); } */

@media all and (max-width: 680px) {
    .business .bus_area {/* padding: 35px 0; */}
    .business .bus_area .pc { display: none;}
    .business .bus_area .mobile { display: block;}
}

/*  _0103찾아오시는 길 */
.root_daum_roughmap .wrap_controllers,
.wrap_btn_zoom { display: none !important; }
.map .map_area { position: relative; height:  560px;}
.map .map_area .root_daum_roughmap .wrap_map { height: 560px !important;}
.map .map_area .map_border { display: none;}
.map .map_area .map_address { display: flex; gap: 10px; justify-content: center; flex-direction: column; padding: 36px 40px; position: absolute; right: 0; bottom: 0; z-index: 10; background-color: rgba(255, 255, 255, 0.9); box-sizing: border-box;}
.map .map_area .map_address p { font-size: 27px; font-weight: 700; color: #333; }
.map .map_area .map_address ul { display: flex; gap: 20px; flex-wrap: wrap;}
.map .map_area .map_address ul li { display: flex; gap: 10px; /* font-family: 'Pretendard'; */ align-items: center; font-size: 17px; font-weight: 500;}
.map .map_area .map_address ul li span { display: flex; align-items: center; justify-content: center; min-width: 35px; min-height:  35px; background-color: #001345; border-radius: 100%;}
.map .map_area .map_address ul li span i { font-size: 17px; color : #fff;}

.map_area .cont { display: none !important; }
.map_area .root_daum_roughmap { width: 100% !important; }


.map .address_area { display: flex; gap: 100px; margin-top: 55px; padding: 35px 40px; position: relative; border-radius: 5px;}
.map .address_area::before { position: absolute; top: 50%; left: 50%; width: 1px; height: 90%; background-color: #E8E8E8; content: ''; transform: translate(-50%, -50%);}
.map .address_area > div { flex: 1; font-family: 'Pretendard'; font-size: 15px; font-weight: 500; color: #686868;}
.map .address_area > div > p { display: flex; gap: 15px; align-items: center; font-size: 30px; font-weight: 600; color: #333333;}
.map .address_area > div p span { display: flex; align-items: center; justify-content: center; width: 56px; height:  56px; border-radius: 100%;}
.map .address_area div:nth-child(1) > p span { border: 1px solid #1E327D; background-color: #F1F6FF;}
.map .address_area > div:nth-child(2) > p span { border: 1px solid #FF783E; background-color: #FFEFE8;}
.map .address_area > div p span i {font-size: 28px;}
.map .address_area > div:nth-child(1) > p span i { color: #395DB2; }
.map .address_area > div:nth-child(2) > p span i {color: #FF783E; }
.map .address_area > div > div { padding-top: 28px;}
/* .map .address_area .use_bus .come1 div { padding-bottom: 40px;} */
.map .address_area .use_bus .come1 div:last-child { padding-bottom: 0;}
.map .address_area .use_bus .come1 div span {display: inline-block;margin-bottom: 20px;/* padding: 10px 20px; */font-size: 22px;font-weight: 700;color: #000000;border-radius: 5px;}
.map .address_area .use_bus .come1 > div:nth-child(1) span {/* background-color: #FF783E; */}
.map .address_area .use_bus .come1 div:nth-child(2) span { background-color: #395DB2; }
.map .address_area .use_car .come2 div { margin-bottom: 20px; }
.map .address_area .use_car .come2 div span { display: inline-block; padding: 10px 20px; background-color: #EBEBEB; font-size: 17px; font-weight: 700; color: #404040; border-radius: 8px;}
.map .address_area .use_car .come2 div p {padding: 20px 0;line-height: 1.7;}

.map .address_area .use_bus .use_bus_info ul li:not(:last-child){
    margin-bottom: 20px;
}

.map .address_area .use_bus .use_bus_info ul li p:first-child{
    display: inline-block;
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 15px;
    line-height: 1.7;
    padding: 10px 20px;
    color: #404040;
    border-radius: 8px;
    background: #EBEBEB;
}

.map .address_area .use_bus .use_bus_info ul li p:last-child{
    line-height: 1.6;
}

@media (max-width: 900px) {
.map .address_area .use_bus .use_bus_info ul li p:first-child {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        font-size: 15px;
    }
}

@media all and (max-width: 1440px) {
    .map .map_area { height: 400px;}
    .map .map_area .root_daum_roughmap .wrap_map { height: 400px !important;}
    .map .map_area .map_address { padding: 25px 30px; }
    .map .map_area .map_address p { font-size: 25px;}
    .map .map_area .map_address ul { gap: 10px;}
    .map .map_area .map_address ul li { font-size: 15px; }
    .map .address_area > div > p { gap: 10px; font-size: 25px;}
}

@media all and (max-width: 1260px) {
    .map .address_area > div p span { width: 50px; height: 50px; }
    .map .map_area .map_address p { font-size: 20px; }
    .map .address_area { margin-top: 80px; }
    .map .address_area > div { font-size: 15px; }
    .map .address_area > div > p { font-size: 20px; }
    .map .address_area .use_bus .come1 div span {/* padding: 5px 15px; */font-size: 18px;}
    .map .address_area .use_car .come2 div span { font-size: 15px;}
}

@media all and (max-width: 900px) {
    .map .map_area { border: 1px solid #E2E2E2; height: auto;}
    .map .address_area { gap: 60px; margin-top: 40px;}
    .map .address_area > div p span { width: 40px; height: 40px;}
    .map .address_area > div p span i { font-size: 22px;}
    .map .map_area .map_address { position: relative;}
    .map .map_area .map_address ul { flex-direction: column;}
    .map .map_area .map_address p { font-size: 18px; }
    .map .address_area > div { font-size: 15px; }
    .map .address_area > div > p { font-size: 18px; }
    .map .address_area .use_bus .come1 div span {/* padding: 5px 15px; */font-size: 18px;}
    .map .address_area .use_car .come2 div span { display: flex; align-items: center; justify-content: center; width: 100%;font-size: 15px;}
}

@media all and (max-width: 680px) {
    .map .map_area .root_daum_roughmap .wrap_map { height: 250px !important;}
    .map .map_area .map_address p {font-size: 17px;}
    .map .map_area .map_address ul li { gap: 5px; align-items: baseline;}
    .map .map_area .map_address ul li span { min-width: 25px; min-height: 25px;}
    .map .map_area .map_address ul li span i { font-size: 13px; }
    .map .address_area { display: block; gap: 100px; padding: 0px;}
    .map .address_area::before { display: none; }
    .map .address_area .use_car { margin-top: 100px; }
    .come1 p{font-size: 14px; font-weight: 400;line-height: 1.6;}
    .map .address_area .use_car .come2 div p{font-size: 14px; font-weight: 400; line-height: 1.6;}
}

@media all and (max-width: 440px) {
    .map .map_area .map_address { padding: 20px 15px; }
    .map .map_area .map_address ul li {font-size: 15px;}
    .map .address_area > div > p { font-size: 15px; }
    .map .address_area > div p span { width: 30px; height: 30px;}
    .map .address_area > div p span i { font-size: 18px; }
    .map .address_area > div { font-size: 13px;}
}


/* _0201 사업소개 */

.int_business .area_01 {display: flex;gap: 128px;align-items: center;margin-bottom: 65px;padding: 60px;position: relative;z-index: 10;width: 100%;background: url(/project/design/com/int_business1.png) no-repeat center / cover;}
.int_business .area_01::before {display: none;position: absolute;top: 0;left: 50%;z-index: -1;width: 100%;height:  100%;content: '';transform: translateX(-50%);/* background: url(/project/design/com/int_business1.png) no-repeat center / contain; *//* padding: 20px; *//* box-sizing: border-box; */}
.int_business .area_01 .area_img01 { display: flex; flex-direction: column;}
.int_business .area_01 .area_img01 img { width: 100%;}
.int_business .area_01 .area_text01 p { font-size: 32px; font-weight: 800; color: #000; text-align: center; line-height: 1.5;} 
.int_business .area_01 .area_text01  strong{color: #395DB2; font-weight: 800;}
.int_business .area_01 .area_text01 p span { font-weight: 800; color: #395DB2; }
.int_business .area_01 .area_text01 p.desc {padding-top: 30px;font-size: 17px;font-weight: 300;color: #686868;}
.int_business .area_02 { text-align: center; }
.int_business .area_02 .mobile { display: none; }

@media all and (max-width: 1600px) {
    .int_business .area_02 img { width: 100%;}
}

@media all and (max-width: 1440px) {
    .int_business .area_01 .area_text01 p { font-size: 28px; }
    .int_business .area_01 .area_text01 p.desc { padding-top: 20px; font-size: 18px;}
    .int_business .area_01 .area_text01 p.desc br { display: none;}
}

@media all and (max-width: 1260px) {
    .int_business .area_01 { gap: 80px; }
    .int_business .area_01::before { width: 120vw;}
    .int_business .area_01 .area_text01 p { font-size: 22px; }
    .int_business .area_01 .area_text01 p.desc { padding-top: 20px; font-size: 15px;}
    .int_business .area_01 .area_text01 p.desc br { display: none;}
}

@media all and (max-width: 900px) {
    .int_business .area_01::before { width: 140vw; }
    .int_business .area_01 .area_text01 p { font-size: 18px; }
    .int_business .area_01 .area_text01 p.desc { padding-top: 10px; font-size: 15px; }
}

@media all and (max-width: 680px) {
    .int_business .area_01 { display: block; gap: 50px; margin-bottom: 20px; padding: 25px;}
    .int_business .area_01 .area_img01 img { width: 50%; }
    .int_business .area_01::before { width: 100vw; background: url(/project/design/com/int_business1.png) no-repeat left / cover;}
    .int_business .area_text01 { padding-top: 30px; }
    .int_business .area_02 .pc { display: none; }
    .int_business .area_02 .mobile { display: block;}
}

@media all and (max-width: 440px) {
    .int_business .area_01::before { width: 100vw; background:#FBFBFB url(/project/design/com/int_business1.png) no-repeat left top / 800px;}
    .int_business .area_01 .area_text01 p { font-size: 15px;}
    .int_business .area_01 .area_text01 p.desc { font-size: 13px;}
}