@charset "UTF-8";


#sub { padding-top: 60px; }

/* --- subNavi ---- */
/* ================================================================================================================== */
#mqSub { z-index: 100; position: relative; }
#mqSub .visual { position: relative; text-align: center; height: 550px; background-position: center center; background-size: cover; background-repeat: no-repeat;}
#mqSub .visual.greeting { background-image: url('../images/sub/v_greeting.jpg'); }
#mqSub .visual.contact { background-image: url('../images/sub/v_contact.jpg'); }
#mqSub .visual.book { background-image: url('../images/sub/v_book.jpg'); }
#mqSub .visual.tour { background-image: url('../images/sub/v_tour.jpg'); }
#mqSub .visual.room { background-image: url('../images/sub/v_room.jpg'); }
#mqSub .visual.notice { background-image: url('../images/sub/v_notice.jpg'); }





#mqSub .visual.business { background-image: url('../images/sub/banner_2.jpg'); }
#mqSub .visual.news { background-image: url('../images/sub/banner_3.jpg'); }
#mqSub .visual.data { background-image: url('../images/sub/banner_4.jpg'); }
#mqSub .visual h2 { color: #fff; font-size: 70px; font-weight: 700; position: absolute; left: 3.7%; top: 50%; transform: translate3d(0, -50%, 0); }
#mqSub .visual h2 span { color: #fff; font-size: 70px; font-weight: 700; text-align: left; }

#mqSub .mqSubNavi { width: 1130px; height: 140px; padding: 0 1%; background: #0068ac; margin-left: auto; box-shadow: 2px 2px 30px rgba(0, 0, 0, 0.2); transform: translateY(-50%); }
#mqSub .mqSubNavi nav {  }
#mqSub .mqSubNavi nav ul { display: flex; height: 140px; }
#mqSub .mqSubNavi nav ul li { flex: 1; position: relative; text-align: center; height: 100%; }
#mqSub .mqSubNavi nav ul li::before { content: ''; position: absolute; left: 50%; top: 60px; transform: translateX(-50%); width: 7px; height: 7px; background: #fff; border-radius: 50%; opacity: 0; transition: opacity .3s, transform .3s; }
#mqSub .mqSubNavi nav ul li::after { content: ''; position: absolute; right: 0; top: 50%; transform: translate3d(0, -50%, 0); width: 1px; height: 18px; background: rgba(255, 255, 255, 0.3); }
#mqSub .mqSubNavi nav ul li:last-of-type::after { display: none; }
#mqSub .mqSubNavi nav ul li a { display: inline-block; height: 100%; color: rgba(255, 255, 255, 0.6); font-weight: 400; font-size: 20px; line-height: 140px; transition: color .2s; }

#mqSub .mqSubNavi nav ul li.active a,
#mqSub .mqSubNavi nav ul li:hover a { color: #fff; font-weight: 500; }
#mqSub .mqSubNavi nav ul li.active::before,
#mqSub .mqSubNavi nav ul li:hover::before{ transform: translateX(-50%) translateY(-23px); opacity: 1; }

#mqSub .location { position: absolute; left: 3.7%; bottom: 70px; }
#mqSub .location li { display: inline-block; margin-right: 11px; }
#mqSub .location li a { font-size: 15px; color: #888; }
#mqSub .location li:first-of-type a { display: block; transform: translateY(2px); }
#mqSub .location li:last-of-type a { color: #222; }


/* 공통 */
.highlight { position: relative; width: fit-content; padding-right: 10px; }
.highlight::after {content:''; z-index:-1; position:absolute; left:-2px; bottom: 5px; width:0; height: 40%; /*height:28px;*/ background: #c9ebfc; transition: width .8s .3s ease-out; }
.highlight.on::after { width:100%; }






/* ================================================================================================================== */
/* company */
/* company - greeting */
/* -------------------------------------------------------*/
#greeting { padding-bottom: 150px; }
#greeting .text_cont { min-height: 960px; position: relative; }
#greeting .text_cont .bg { position: absolute; left: 0; top: 70px; width: 100vw; height: 1042px; background: #f7f7f7; }
#greeting .text_cont .w1400 { display: flex; position: relative; }
#greeting .text_cont .photo { position: relative; width: calc(50% - 90px); z-index: 1; }
#greeting .text_cont .photo img { position: absolute; left: 0; top: 0; width: 400px; height: auto; aspect-ratio: 400 / 444; max-width: unset; box-shadow: 0 0 40px rgba(0, 0, 0, 0.3); }
#greeting .text_cont .text { z-index: 1; width: calc(50% + 90px); position: relative; padding-top: 160px; }
#greeting .text_cont .text .title { position: relative; z-index: 1; transform: translateY(-14px); margin-bottom: 45px;}
#greeting .text_cont .text .title p { font-size: 50px; font-weight: 700; color: #222; line-height: 1.4; }
#greeting .text_cont .text .message {  }
#greeting .text_cont .text .message p { font-size: 18px; line-height: 1.75; margin-bottom: 30px; }
#greeting .text_cont .text .message p:last-of-type { margin-bottom: 0; }
#greeting .text_cont .text .from { margin-top: 55px; text-align: right; }
#greeting .text_cont .text .from span { display: inline-block; font-size: 20px; font-weight: 500; margin-right: 25px; }
#greeting .text_cont .text .from strong { display: inline-block; font-size: 25px; font-weight: 800; letter-spacing: 0.08em; }

/* company - starring */
/* -------------------------------------------------------*/
#starring {}
#starring .cont { margin-bottom: 180px; }
#starring .cont .w1400 { position: relative; }
#starring .cont .title { position: relative; z-index: 1; margin-left: 20px; transform: translateY(30px); }
#starring .cont .title p { font-size: 50px; font-weight: 700; color: #222; line-height: 1.4; }
#starring .cont .photo { width: 1660px; height: 500px; overflow: hidden; }
#starring .cont .photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 39%; }
#starring .cont .text { margin-top: 60px; }
#starring .cont .text p { font-size: 22px; line-height: 2; }

#starring .cont.cont_2 .title { text-align: right; margin-left: 0; margin-right: 20px; }
#starring .cont.cont_2 .title p { margin-left: auto; }
#starring .cont.cont_2 .photo { position: absolute; right: 0; }
#starring .cont.cont_2 .photo img { object-position: center 28%; }
#starring .cont.cont_2 .text { text-align: right; padding-top: 500px; margin-top: 70px; }
#starring .cont.cont_2 .text p { font-size: 20px; }
#starring .cont.cont_2 .text p:nth-of-type(1) { margin-bottom: 40px; }
#starring .cont.cont_2 .text p.bold { font-size: 40px; font-weight: 700; }

#starring .block { padding: 142px 0 195px; }
#starring .block .title { font-size: 50px; font-weight: 700; color: #222; text-align: center; margin-bottom: 107px; }
#starring .block .title .dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--main-c3); }
#starring .block .item { position: relative; padding-left: 35%; }
#starring .block .item+.item { margin-top: 75px; }
#starring .block .item .sub_title { position: absolute; left: 0; top: 0; font-family: 'poppins'; font-size: 50px; font-weight: 700; color: var(--main-c3); }
#starring .block .item .info { position: relative; padding: 60px; }
#starring .block .item .info .txt { color: #333; font-size: 22px; font-weight: 300; line-height: 1.6; }
#starring .block .item .info .tit { color: #0063a7; font-size: 54px; font-weight: 700; line-height: 70px; }
#starring .block .item .info .txt + .img { margin-top: 55px; }
#starring .block .item .info .img { text-align: center; }
#starring .block .item .info .img img { max-width: 780px; }
#starring .block .item .info .img img+img { margin-top: 60px; }

#starring .block.block_1 { background: #f7f7f7; }

/* company - organization */
/* -------------------------------------------------------*/
#organization {}
#organization .organization_chart { text-align: center; padding: 135px 0 190px; background: url('../images/sub/organization_bg.jpg') no-repeat center top / cover; }
#organization .organization_chart .title { font-family: 'poppins'; font-size: 160px; font-weight: 800; color: #fff; text-shadow: 0 0 20px rgba(0, 0, 0, 0.05); margin-bottom: 68px; }
#organization .organization_chart .chart { max-width: 682px; margin: 0 auto; position: relative; }
#organization .organization_chart .chart::before { content: ''; position: absolute; left: 50%; top: 0; width: 1px; height: 471px; background: #ddd; }

#organization .organization_chart .chart .circle { width: 170px; height: 170px; border-radius: 50%; background: #fff; display: flex; justify-content: center; align-items: center; box-shadow: 7px 7px 20px rgba(0, 131, 202, 0.2); position: relative; }
#organization .organization_chart .chart .circle::after { content: ''; position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--main-c3); z-index: 3; }
#organization .organization_chart .chart .circle.blue { width: 180px; height: 180px; background: var(--main-c3); box-shadow: 0 0 0 10px rgba(0, 131, 202, 0.2); }
#organization .organization_chart .chart .circle img { margin: 0 auto; margin-bottom: 20px; }
#organization .organization_chart .chart .circle span { font-size: 22px; font-weight: 700; }
#organization .organization_chart .chart .circle.blue span { color: #fff; }

#organization .organization_chart .chart .circle.circle_1 { margin: 0 auto; }
#organization .organization_chart .chart .circle.circle_2 { margin-left: auto; }
#organization .organization_chart .chart .circle.circle_3 { margin: 0 auto; }

#organization .organization_chart .chart .circle.circle_2::after { left: -4px; top: 50%; transform: translateY(-50%); }
#organization .organization_chart .chart .circle.circle_3::after { left: 48.5%; top: -4px; }
#organization .organization_chart .chart .circle.circle_4::after { left: 48.5%; top: -4px; }
#organization .organization_chart .chart .circle.circle_5::after { left: 48.5%; top: -4px; }

#organization .organization_chart .chart>li {  }
#organization .organization_chart .chart>li ul {  }
#organization .organization_chart .chart>li ul:first-of-type li { position: relative; padding-bottom: 85px; }
#organization .organization_chart .chart>li ul:first-of-type li::before { content: ''; position: absolute; left: 50%; top: 50%; width: 50%; height: 1px; background: #ddd; }
#organization .organization_chart .chart>li ul:first-of-type li .circle { position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
#organization .organization_chart .chart>li ul:last-of-type { position: relative; display: flex; justify-content: space-between; padding: 0 42px; margin-top: 70px; }
#organization .organization_chart .chart>li ul:last-of-type::before { content: ''; position: absolute; left: 50%; top: -34px; transform: translateX(-50%); width: 62.6%; height: 1px; background: #ddd; }
#organization .organization_chart .chart>li ul:last-of-type .circle { position: relative; z-index: 1; }
#organization .organization_chart .chart>li ul:last-of-type .circle::before { content: ''; position: absolute; left: 50%; top: -34px; width: 1px; height: 34px; background: #ddd; }

/* company - director */
/* -------------------------------------------------------*/
#director {  }
#director .title_cont {  }
#director .title_cont .w1400 { position: relative; display: flex; justify-content: space-between; align-items: center; padding: 0 200px 0 195px; }
#director .title_cont .w1400::before { content: ''; position: absolute; left: 0; bottom: 0; width: 1660px; height: 400px; background: #334360; }
#director .title_cont .title { position: relative; z-index: 1; margin-top: 110px; }
#director .title_cont .title p { font-size: 45px; font-weight: 700; color: #fff; margin-bottom: 43px; }
#director .title_cont .title p em { font-size: 35px; font-weight: 400; color: #fff; }
#director .title_cont .title span { font-size: 22px; color: #fff; line-height: 1.9; }
#director .title_cont .bg { position: absolute; right: -20px; bottom: 60px; }
#director .title_cont .photo {}
#director .title_cont .photo img { width: 380px; position: relative; z-index: 1; }

#director .list_cont { padding: 180px 0 180px; border-bottom: 1px solid #cccccc; }
#director .list_cont ul { display: flex; justify-content: center; flex-wrap: wrap; padding: 0 40px; }
#director .list_cont ul>li { flex: 0 0 33.33%; margin-bottom: 115px; }
#director .list_cont ul>li a { display: block; text-align: center; }
#director .list_cont ul>li a img { width: 250px; height: auto; margin: 0 auto; }
#director .list_cont ul>li a .info { padding: 40px 0 0; }
#director .list_cont ul>li a .info p { color: #333; font-size: 35px; font-weight :700; margin-bottom: 27px; }
#director .list_cont ul>li a .info p span { font-size: 25px; font-weight: 400; }
#director .list_cont ul>li a .info dl dd { display: block; font-size: 18px; line-height: 1.6; }

/* company - contactus */
/* -------------------------------------------------------*/
#contactus { background: #f7f7f7; }
#contactus .wrap { position: relative; }
#contactus .info { width: calc(50% - 100px); height: 800px; }
#contactus .info ul {  }
#contactus .info ul li { padding: 43px 0; font-size: 0; border-bottom: 1px solid #ddd; }
#contactus .info ul li:first-of-type { padding-top: 80px; }
#contactus .info ul li:last-of-type { border: none; }
#contactus .info ul li::after { content: ''; clear: both; display: block; }
#contactus .info ul li img { float: left; margin-right: 44px; }
#contactus .info ul li .text { float: left; width: calc(100% - 105px); }
#contactus .info ul li .text .tit { font-family: 'poppins'; font-weight: 700; color: #222; font-size: 20px; margin-bottom: 20px; }
#contactus .info ul li .text .cont { font-size: 18px; color: #555; }
#contactus .info ul li:first-of-type .text .cont { line-height: 1.8; }
#contactus .info ul li .text .cont a { color: #555; }
#contactus .info ul li .text .icon_bus { display: inline-block; width: 26px; height: 26px; line-height: 26px; text-align: center; margin-right: 10px; border-radius: 100%; color: #fff; font-size: 14px; font-weight: 700; }
#contactus .info .group { width: 100%; display: flex; gap: 70px; flex-wrap: wrap; }
#contactus .info .group_item {  }
#contactus .info .group_item p { font-size: 20px; line-height: 22px; font-weight: 700; margin-bottom :15px; }
#contactus .info .group_item .item { margin-bottom: 10px; }
#contactus .info .group_item .item em { font-size: 18px; color: #555; }
#contactus .info .icon_bus.blue { background: #2c9ede; }
#contactus .info .icon_bus.blue_dark { background: #395cb4; }
#contactus .info .icon_bus.green { background: #388646; }
#contactus .info .icon_bus.red { background: #ea1e1e; }
#contactus .MAP { position: absolute; left: 50%; top: 0; width: 960px; }



/* ================================================================================================================== */
/* #business */
/* -------------------------------------------------------*/
/* #business 공통 */
#business {}
#business .banner {}
#business .banner img { margin: 0 auto; }
#business .title { margin-top: 110px; margin-bottom: 145px; padding-left: 140px; position: relative; }
#business .title::before { content: ''; position: absolute; left: 0; top: -60px; width: 200px; height: 131px; background: url('../images/sub/business_quote.png') no-repeat left center / contain; }
#business .title::after { content: ''; clear: both; display: block;  }
#business .title h3 { font-family: 'binggrae'; font-size: 50px; font-weight: 700; float: left; display: inline-block; margin-right: 55px; }
#business .title p { font-size: 22px; line-height: 1.9; display: inline; word-break: normal; }

#business .cont { padding-top: 140px; padding-bottom: 50px; background: url('../images/sub/business_bg.png') no-repeat center top; }
#business .cont .list {}
#business .cont .list>li { display: flex; align-items: flex-start; gap: 50px; padding: 100px 0; border-bottom: 1px solid #dddddd; }
#business .cont .list>li:last-of-type { border-bottom: none; }
#business .cont .list>li img { margin-top: -20px; margin-left: -28px; }
#business .cont .list>li .text {}
#business .cont .list>li .text p { font-family: 'binggrae'; font-size: 40px; line-height: 1.3; font-weight: 700; margin-bottom: 40px; }
#business .cont .list>li .text ul {}
#business .cont .list>li .text ul li { display: flex; margin-bottom: 15px; position: relative; padding-left: 15px; }
#business .cont .list>li .text ul li::before { content: ''; position: absolute; left: 0; top: 13px; width: 5px; height: 5px; border-radius: 50%; background: var(--main-c3); }
#business .cont .list>li .text ul li strong { width: 90px; font-size: 20px; font-weight: 700; line-height: 1.5; }
#business .cont .list>li .text ul li span { width: calc(100% - 90px); font-size: 20px; line-height: 1.5; }



/* ================================================================================================================== */
/* #policy (개인정보처리방침) */
/* -------------------------------------------------------*/
#policy { padding-bottom: 150px; }
#policy .visual { position: relative; text-align: center; height: 550px; background-position: center center; background-size: cover; background-repeat: no-repeat;}
#policy .visual.company { background-image: url('../images/sub/banner_1.jpg'); }
#policy .visual h2 { color: #fff; font-size: 70px; font-weight: 700; position: absolute; left: 3.7%; top: 50%; transform: translate3d(0, -50%, 0); }
#policy .visual h2 span { color: #fff; font-size: 70px; font-weight: 700; text-align: left; }
#policy .w1400 { padding-top: 100px; }
#policy p { font-size: 15px; line-height: 1.8; color: #444; }
#policy p .txt1 { display: block; font-size: 25px; font-weight: 600; margin-bottom: 20px; color: #222; }
#policy p .txt2 { display: block; font-size: 16px; font-weight: 600; margin-bottom: 10px; color: #333; }



/* ------ 반응형 ----- */
@media screen and (max-width: 1900px) {
    /* ============================================================================================================= */
    /* #business */
    /* -------------------------------------------------------*/
    /* #business 공통 */
    #business .banner { padding: 0 3.7%; }
    #business .banner img { width: 100%; }
}


@media screen and (max-width: 1500px) {
    /* --- subNavi ---- */
    #mqSub .mqSubNavi { width: 85%; }
    #mqSub .mqSubNavi nav ul li a { font-size: 18px; }
    #mqSub .location { bottom: 35px; }


    /* ============================================================================================================= */
    /* company */
    /* company - greeting */
    /* -------------------------------------------------------*/


    /* company - director */
    /* -------------------------------------------------------*/
    #director .title_cont .w1400 { padding: 0 15vw; }

    /* company - contactus */
    /* -------------------------------------------------------*/
    #contactus .info { width: calc(100% - 50vw); }


    /* ================================================================================================================== */
    /* #business */
    /* -------------------------------------------------------*/
    /* #business 공통 */
    #business .title { margin-left: 3.7%; margin-right: 3.7%; padding-left: 40px; }
    #business .title h3 { display: block; float: none; margin-right: 0; margin-bottom: 30px; }
}


@media screen and (max-width: 1400px) {
    #header .h_nav .dep1 .dep1_li {  }


    /* ============================================================================================================= */
    /* company */
    /* company - greeting */
    /* -------------------------------------------------------*/
    #greeting { padding-bottom: 0; }
    #greeting .text_cont { height: 1460px; }
    #greeting .text_cont .w1400 { flex-direction: column; gap: 100px; }
    #greeting .text_cont .bg { height: 1390px; }
    #greeting .text_cont .photo { width: 50%; }
    #greeting .text_cont .photo img { position: static; }
    #greeting .text_cont .text { width: 100%; padding-left: 0; padding-top: 0; }
}


@media screen and (max-width: 1300px) {
    /* --- subNavi ---- */
    #mqSub .mqSubNavi { width: 90%; }


    /* ============================================================================================================= */
    /* company */
    /* company - contactus */
    /* -------------------------------------------------------*/
    #contactus .MAP { position: static; width: 100% !important; height: 70vw; padding-bottom: 80px; }
    #contactus .MAP .wrap_map { height: 100% !important; }
    #contactus .info { width: 100%; height: auto; }
    #contactus .info .group_item { width: 30%; }
}


@media screen and (max-width: 1100px) {
    /* --- subNavi ---- */
    #mqSub .mqSubNavi { display: none; }
    #mqSub .location { position: static; margin-top: 50px; padding-left: 3.7%; }


    /* ============================================================================================================= */
    /* company */
    /* company - organization */
    /* -------------------------------------------------------*/
    #organization .organization_chart .title { font-size: 13vw; }

    /* company - director */
    /* -------------------------------------------------------*/
    #director .title_cont .w1400 { padding: 0 3.7%; }
    #director .list_cont ul { padding: 0; justify-content: space-around; }
    #director .list_cont ul>li { flex: none; width: 43%; margin-bottom: 70px; }

}


/*** Mobile ***/
@media screen and (min-width:1px) and (max-width:768px) {
    .row { padding: 0 20px; }

    /* --- subNavi ---- */
    #mqSub .visual { height: 300px; }
    #mqSub .visual h2 { font-size: 33px; width: 80%; }
    #mqSub .visual h2 span { font-size: 33px; }
    #mqSub .mqSubNavi .title h3 { font-size: 23px; line-height: 27px; padding: 20px 0; }
    #mqSub .location { padding-left: 40px; }


    /* ============================================================================================================= */
    /* company */
    /* company - greeting */
    /* -------------------------------------------------------*/
    #greeting { padding-bottom: 100px; }
    #greeting .text_cont { height: auto; min-height: unset; }
    #greeting .text_cont .w1400 { gap: 80px; }
    #greeting .text_cont .bg { height: 1220px; display: none; }
    #greeting .text_cont .photo { width: 100vw; }
    #greeting .text_cont .photo img { width: 50%; }
    #greeting .text_cont .text .title { margin-bottom: 25px; }
    #greeting .text_cont .text .title p { font-size: 35px; }
    #greeting .text_cont .text .message p { font-size: 16px; margin-bottom: 23px; }
    #greeting .text_cont .text .from { text-align: left; }
    #greeting .text_cont .text .from span { font-size: 18px; margin-right: 23px; }
    #greeting .text_cont .text .from strong { font-size: 23px; }

    /* company - starring */
    /* -------------------------------------------------------*/
    #starring .cont { margin-bottom: 120px; }
    #starring .cont .title { transform: translateY(25px); }
    #starring .cont .title p { font-size: 40px; }
    #starring .cont .photo { width: calc(100% + 20px); height: 65vw; }
    #starring .cont .photo img { object-position: 20% 10%; transform: scale(2.2) translateX(-31px); }
    #starring .cont .text { margin-top: 45px; }
    #starring .cont .text p { font-size: 17px; }

    #starring .cont.cont_2 .text { padding-top: 65vw; }
    #starring .cont.cont_2 .text p { font-size: 16px; }
    #starring .cont.cont_2 .text p:nth-of-type(2) { margin-bottom: 10px; }
    #starring .cont.cont_2 .text p.bold { font-size: 26px; line-height: 1.2; }

    #starring .block {  }
    #starring .block .title { font-size: 40px; margin-bottom: 75px; }
    #starring .block .item { padding-left: 0; }
    #starring .block .item+.item { margin-top: 50px; }
    #starring .block .item .sub_title { position: static; font-size: 40px; margin-bottom: 45px; }
    #starring .block .item .info { padding: 40px 20px; }
    #starring .block .item .info .txt { font-size: 18px; }
    #starring .block .item .info .img img { max-width: 100%; }
    #starring .block .item .info .img img+img { margin-top: 40px; }

    /* company - organization */
    /* -------------------------------------------------------*/
    #organization .organization_chart { padding: 100px 0 120px; background-image: url('../images/sub/organization_bg_m.jpg'); }
    #organization .organization_chart .title { margin-bottom: 50px; }
    #organization .organization_chart .chart .circle { width: 120px; height: 120px; }
    #organization .organization_chart .chart .circle.blue { width: 130px; height: 130px; }
    #organization .organization_chart .chart .circle img { width: auto; height: 28px; margin-bottom: 10px; }
    #organization .organization_chart .chart .circle span { font-size: 16px; }

    #organization .organization_chart .chart .circle.circle_3::after { left: 48%; }

    #organization .organization_chart .chart::before { height: 372px; }

    #organization .organization_chart .chart>li ul:last-of-type::before { width: calc(100% - 205px); }

    /* company - director */
    /* -------------------------------------------------------*/
    #director .title_cont .w1400 { padding: 0 40px 0 40px; }
    #director .title_cont .w1400::before { height: 300px; }
    #director .title_cont .photo img { width: 280px; }
    #director .title_cont .title { margin-top: 70px; }
    #director .title_cont .title p { font-size: 35px; margin-bottom: 30px; }
    #director .title_cont .title p em { font-size: 25px; }
    #director .title_cont .title span { font-size: 17px; }
    #director .title_cont .bg { left: 40px; right: auto; }
    #director .title_cont .bg img { width: 150%; max-width: none; }

    #director .list_cont { padding: 100px 0 120px; }
    #director .list_cont ul { justify-content: space-between; padding: 0 10px; }
    #director .list_cont ul>li { margin-bottom: 70px; }
    #director .list_cont ul>li a .info { padding-top: 30px; }
    #director .list_cont ul>li a .info p { font-size: 25px; margin-bottom: 15px; }
    #director .list_cont ul>li a .info p span { font-size: 18px; }
    #director .list_cont ul>li a .info dl dd { font-size: 16px; }

    /* company - contactus */
    /* -------------------------------------------------------*/
    #contactus .info ul li { padding: 30px 0; }
    #contactus .info ul li img { width: 50px; margin-right: 30px; }
    #contactus .info ul li .text .cont { font-size: 16px; }
    #contactus .info .group { gap: 40px; }
    #contactus .info .group_item { width: 44%; }
    #contactus .info .group_item p { font-size: 18px; }
    #contactus .info .group_item .item em { font-size: 16px; }


    /* ============================================================================================================= */
    /* #business */
    /* -------------------------------------------------------*/
    /* #business 공통 */
    #business .banner { padding: 0 40px; }
    #business .title { padding-left: 70px; padding-right: 40px; margin: 70px 0 80px; }
    #business .title::before { width: 150px; height: 98px; left: 40px; top: -47px; }
    #business .title h3 { font-size: 35px; margin-bottom: 35px; }
    #business .title p { font-size: 20px; float: none; display: block; line-height: 1.6; }
    #business .cont { padding-top: 70px; background-image: url('../images/sub/business_bg_m.png'); }
    #business .cont .list>li { flex-direction: column; }
    #business .cont .list>li img { margin-left: auto; margin-right: auto; margin-top: 0; width: 200px; }
    #business .cont .list>li .text p { font-size: 30px; }
    #business .cont .list>li { padding: 70px 0; }
    #business .cont .list>li .text ul li strong { font-size: 16px; width: 70px; }
    #business .cont .list>li .text ul li span { font-size: 16px; width: calc(100% - 70px); }


    /* ============================================================================================================= */
    /* #policy */
    #policy .visual { height: 300px; }
    #policy .visual h2 { font-size: 33px; width: 80%; }
    #policy .visual h2 span { font-size: 33px; }
}


@media screen and (max-width: 500px) {
    /* --- subNavi ---- */
    #mqSub .location { padding-left: 20px; margin-top: 35px; }
    #mqSub .location li a { font-size: 12px; }
    #mqSub .location li:first-of-type a { transform: translateY(1px); }
    #mqSub .location li:first-of-type a img { width: 10px; }
    #mqSub .location li.arrow img { width: 5px; }


    /* ============================================================================================================= */
    /* company */
    /* company - greeting */
    /* -------------------------------------------------------*/
    #greeting .text_cont .w1400 { gap: 60px; }
    #greeting .text_cont .bg { top: 100px; }
    #greeting .text_cont .text .title { margin-bottom: 10px; }
    #greeting .text_cont .text .title p { font-size: 25px; }
    #greeting .text_cont .text .message p { font-size: 12px; margin-bottom: 15px; }
    #greeting .text_cont .text .from { margin-top: 25px; }
    #greeting .text_cont .text .from span { font-size: 14px; margin-right: 15px; }
    #greeting .text_cont .text .from strong { font-size: 18px; }

    /* company - starring */
    /* -------------------------------------------------------*/
    #starring .cont { margin-bottom: 80px; }
    #starring .cont .title { transform: translateY(17px); margin-left: 10px; }
    #starring .cont .title p { font-size: 27px; }
    #starring .cont .photo img { object-position: 20% 5%; transform: scale(2.4) translateX(-21px); }
    #starring .cont .text { margin-top: 30px; }
    #starring .cont .text p { font-size: 13px; line-height: 1.8; }

    #starring .cont.cont_2 .title { margin-right: 10px; }
    #starring .cont.cont_2 .photo { right: 20px; }
    #starring .cont.cont_2 .text { margin-top: 30px; }
    #starring .cont.cont_2 .text p { font-size: 12px; }
    #starring .cont.cont_2 .text p:nth-of-type(1) { margin-bottom: 20px; }
    #starring .cont.cont_2 .text p:nth-of-type(2) { margin-bottom: 10px; }
    #starring .cont.cont_2 .text p.bold { font-size: 22px; line-height: 1.2; }

    #starring .block { padding: 65px 0 85px; }
    #starring .block .title { font-size: 27px; margin-bottom: 50px; }
    #starring .block .item+.item { margin-top: 30px; }
    #starring .block .item .sub_title { font-size: 27px; margin-bottom: 25px; }
    #starring .block .item .info:before { height: 1px; }
    #starring .block .item .info:after { height: 1px; }
    #starring .block .item .info { padding: 30px 10px; }
    #starring .block .item .info:before { width: 88%; }
    #starring .block .item .info .txt { font-size: 13px; font-weight: 400; }
    #starring .block .item .info .txt + .img { margin-top: 25px; }
    #starring .block .item .info .img img+img { margin-top: 30px; }

    /* company - organization */
    /* -------------------------------------------------------*/
    #organization .organization_chart { padding: 60px 0 90px; }
    #organization .organization_chart .title { text-shadow: 0 0 8px rgb(0 0 0 / 8%); margin-bottom: 40px; }

    #organization .organization_chart .chart .circle { width: 85px; height: 85px; box-shadow: 5px 5px 10px rgba(0, 131, 202, 0.2); }
    #organization .organization_chart .chart .circle::after { width: 5px; height: 5px; }
    #organization .organization_chart .chart .circle.blue { width: 90px; height: 90px; box-shadow: 0 0 0 5px rgba(0, 131, 202, 0.2); }
    #organization .organization_chart .chart .circle img { height: 20px; margin-bottom: 5px; }
    #organization .organization_chart .chart .circle span { font-size: 13px; }

    #organization .organization_chart .chart::before { height: 237px; }
    #organization .organization_chart .chart>li ul:first-of-type li { padding-bottom: 43px; }
    #organization .organization_chart .chart>li ul:last-of-type { margin-top: 35px; padding: 0 10px; }
    #organization .organization_chart .chart>li ul:last-of-type::before { width: calc(100% - 105px); top: -17px; }
    #organization .organization_chart .chart>li ul:last-of-type .circle::before { height: 17px; top: -17px; }

    /* company - director */
    /* -------------------------------------------------------*/
    #director .title_cont .w1400 { padding: 0 20px 0 20px; }
    #director .title_cont .w1400::before { width: 100%; height: 200px; }
    #director .title_cont .title { margin-top: 40px; position: absolute; left: 20px; z-index: 2; }
    #director .title_cont .title p { font-size: 22px; margin-bottom: 20px; }
    #director .title_cont .title p em { font-size: 15px; }
    #director .title_cont .title span { font-size: 12px; }
    #director .title_cont .photo { margin-left: auto; }
    #director .title_cont .photo img { width: 183px; }
    #director .title_cont .bg { display: none; }

    #director .list_cont { padding: 55px 0 60px; }
    #director .list_cont ul { padding: 0 5px; }
    #director .list_cont ul>li { margin-bottom: 44px; }
    #director .list_cont ul>li a .info { padding-top: 20px; }
    #director .list_cont ul>li a .info p { font-size: 17px; margin-bottom: 13px; }
    #director .list_cont ul>li a .info p span { font-size: 12px; }
    #director .list_cont ul>li a .info dl dd { font-size: 11px; }

    /* company - contactus */
    /* -------------------------------------------------------*/
    #contactus .info ul li { padding: 25px 0; }
    #contactus .info ul li:first-of-type { padding-top: 40px; }
    #contactus .info ul li img { width: 35px; margin-right: 20px; }
    #contactus .info ul li .text { width: calc(100% - 55px); }
    #contactus .info ul li .text .tit { font-size: 14px; margin-bottom: 10px; }
    #contactus .info ul li .text .cont { font-size: 12px; }
    #contactus .info ul li .text .icon_bus { width: 18px; height: 18px; line-height: 18px; font-size: 8px; margin-right: 5px; }
    #contactus .info .group { justify-content: space-between; gap: 10px; }
    #contactus .info .group_item { width: 45%; }
    #contactus .info .group_item p { font-size: 13px; margin-bottom: 7px; }
    #contactus .info .group_item .item em { font-size: 12px; }
    #contactus .MAP { position: static; width: 100vw !important; height: 110vw; padding-bottom: 40px; transform: translateX(-20px); }


    /* ============================================================================================================= */
    /* #business */
    /* -------------------------------------------------------*/
    /* #business 공통 */
    #business .banner { padding: 0 20px; }
    #business .title { margin-top: 55px; margin-bottom: 65px; padding-left: 30px; padding-right: 20px; }
    #business .title::before { width: 100px; height: 65px; left: 20px; top: -30px; }
    #business .title h3 { font-size: 25px; margin-bottom: 20px; }
    #business .title p { font-size: 14px; }
    #business .cont { padding-top: 40px; background-size: 220%; }
    #business .cont .list>li { gap: 20px; padding: 50px 0; }
    #business .cont .list>li img { width: 145px; }
    #business .cont .list>li .text p { font-size: 23px; margin-bottom: 20px; }
    #business .cont .list>li .text ul li { padding-left: 10px; }
    #business .cont .list>li .text ul li::before { width: 3px; height: 3px; top: 10px; }
    #business .cont .list>li .text ul li strong { font-size: 14px; width: 50px; }
    #business .cont .list>li .text ul li span { font-size: 14px; width: calc(100% - 50px); }


    /* ============================================================================================================= */
    /* #policy */
    #policy .w1400 { padding-top: 50px; }
    #policy p { font-size: 13px; }
    #policy p .txt1 { font-size: 18px; }
    #policy p .txt2 { font-size: 15px; margin-bottom: 5px; }

}