@import url( setting_mobile.less); .c-subway5{color: #893bb6;} .c-subway9{color: #9f6500;} .c-bus1{color: #395cb3;} .c-bus2{color: #70b0e0;} .c-bus3{color: #4ea031;} .c-bus4{color: #ff3535;} .title1{font-size: 33px; line-height: 40px; font-weight: 500; color: #32246c;} .title2{font-size: 17px; line-height: 24px; font-weight: 700; color: #000;} .headline1{.fz_em(25,17); .lh(38,25); color:@c_p;} .pr-mb0{margin-bottom: 25px;} .pr-b1, .pr-mb1{margin-bottom: 45px;} .pr-mb2{margin-bottom: 85px;} .cover-ty1{position: absolute; left: 0; top: 0; z-index: 5; background-color: rgba( 255, 255, 255, 0.4 ); width: 100%; height: 100%; opacity: 0; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; } .cover-ty1:after{position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); font-size: 22px; font-weight: 700; color: #000; content:"+"; background-color: #fff; width: 50px; height: 50px; border-radius: 50px; margin-left: -25px; margin-top: -25px; text-align: center; line-height: 50px; opacity: 0; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } a:hover .cover-ty1{opacity: 1;} a:hover .cover-ty1:after{opacity: 1; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg);} .btn-top{position: fixed; right: 30px; bottom: -70px; width: 68px; height: 68px; border-radius: 68px; z-index: 6; background-color: #fff; border: 1px solid #cfcfcf; text-align: center; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;} .body_scroll .btn-top{ bottom: 30px;} .btn-top i{position: absolute; top: 50%; left: 50%; width:100%; height: auto;-webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); font-size: 22px; font-weight: 700; color: #000;} @media screen and (max-width: 840px) { .title1{.fz(40); .lh_unit(50);} .title2{.fz(26); .lh_unit(32);} .headline1{.fz(37); .lh_unit(57); .mb(50);} .pr-mb0{.mb(30);} .pr-b1, .pr-mb1{.mb(60);} .pr-mb2{.mb(100);} .btn-top{.r(20); .b(-100); .w(60); .h(60); .bdrs(60);} .body_scroll .btn-top{.b(20);} .btn-top i{.fz(20);} .cover-ty1{display: none;} } /* common / w840 */ .wrap-prd-ty2{} .wrap-prd-ty2 .thumb{margin-bottom: 25px; font-size: 0; & img{max-width: 100%; height: auto;}} .wrap-prd-ty2 .cont{margin-bottom: 25px;} .wrap-prd-ty2 .cont .h1{.fz_em(21,17); color: #32246c; font-weight: 500; } .wrap-prd-ty2 .cont .t1{margin-top:15px;} @media screen and (max-width: 840px) { .wrap-prd-ty2 .thumb{.mb(35);} .wrap-prd-ty2 .cont{ .mb(30);} .wrap-prd-ty2 .cont .h1{.fz(36);} .wrap-prd-ty2 .cont .t1{.mt(15);} } /* .wrap-prd-ty2 / w840 */ .txtbox-ty1 {position: relative; z-index: 1;} .txtbox-ty1 .title1 {font-size: 20px; position: relative; padding-bottom: 15px; margin-bottom: 15px; color: #0f0f0f; font-weight: 700; line-height: 1.2;} .txtbox-ty1 .title1:after{position: absolute; left: 0; bottom: 0; width: 34px; height: 2px; background-color: #32246c; content:""; } .txtbox-ty1 .thumb {} .txtbox-ty1 .thumb a.i-cut {display: block; width: 100%; height: 180px;} .txtbox-ty1 .cont .mt{margin-top: 20px;} .txtbox-ty1.v2 .title1{padding-bottom: 0;} .txtbox-ty1.v2 .title1:after{display: none;} @media screen and (max-width: 840px) { .txtbox-ty1 .title1 {.fz(30); .pb(15); .mb(15);} .txtbox-ty1 .title1:after{.w(50);} .txtbox-ty1 .thumb a.i-cut {height: auto;} .txtbox-ty1 .cont .mt{.mt(25);} .txtbox-ty1.v2 .title1{padding-bottom: 0;} } .lst-col.n3:after{clear: both;display: block;height: 0;visibility: hidden;content:"";} .lst-col.n3 .col{float: left; .w_p(290,930); .ml_p(29,930); &:first-child{margin-left: 0;} } @media screen and (max-width: 840px) { .lst-col.n3 .col{float: none; width: auto; margin-left: 0; .mt(80); &:first-child{margin-top: 0;}} } .tab-ty1{-webkit-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.15); -moz-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.15); box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.15); margin-bottom: 40px;} .tab-ty1 ul:after{display: block; clear: both; height: 0; visibility: hidden; content:"";} .tab-ty1 ul li{float: left; width: 50%; position: relative;} .tab-ty1 ul li a{display: block; width: 100%; height: 65px; text-align: center; color: #696969; .fz_em(18,17); font-weight: 700; position: relative; z-index: 2;} .tab-ty1 ul li:after{opacity: 0; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #fab000; z-index: 0; content:""; -webkit-border-radius: 0px 20px 0px 0px; -moz-border-radius: 0px 20px 0px 0px; border-radius: 0px 20px 0px 0px; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; } .tab-ty1 ul li.on:after{opacity: 1;} .tab-ty1 ul li.on a{color: #fff;} .tab-ty1.n3 li{width: 33.3333%;} @media screen and (max-width: 840px) { .tab-ty1{-webkit-box-shadow: 0.48vw 0.48vw 0.6vw 0px rgba(0,0,0,0.15); -moz-box-shadow: 0.48vw 0.48vw 0.6vw 0px rgba(0,0,0,0.15); box-shadow: 0.48vw 0.48vw 0.6vw 0px rgba(0,0,0,0.15); .mb(50);} .tab-ty1 ul li a{display: block; width: 100%; .h(80); .fz(26);} .tab-ty1 ul li:after{ -webkit-border-radius: 0 2.38vw 0 0; -moz-border-radius: 0 2.38vw 0 0; border-radius: 0 2.38vw 0 0; } } /* .tab-ty1 / w840 */ /* 21.05.20 type 2 추가*/ .tab-ty2 { -webkit-box-shadow: 4px 4px 5px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow: 4px 4px 5px 0px rgba(0, 0, 0, 0.15); box-shadow: 4px 4px 5px 0px rgba(0, 0, 0, 0.15); margin-bottom: 40px; } .tab-ty2 ul:after { display: block; clear: both; height: 0; visibility: hidden; content: ""; } .tab-ty2 ul li { float: left; width: 50%; position: relative; } .tab-ty2 ul li a { display: block; width: 100%; height: 65px; text-align: center; color: #696969; font-size: 18px; font-size: 1.05882353em; font-weight: 700; position: relative; z-index: 2; } .tab-ty2 ul li:after { opacity: 0; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #22105b; z-index: 0; content: ""; -webkit-border-radius: 0px 20px 0px 0px; -moz-border-radius: 0px 20px 0px 0px; border-radius: 0px 20px 0px 0px; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; } .tab-ty2 ul li.on:after { opacity: 1; } .tab-ty2 ul li.on a { color: #fff; } .tab-ty2.n3 li { width: 33.3333%; } @media screen and (max-width: 840px) { .tab-ty2 { -webkit-box-shadow: 0.48vw 0.48vw 0.6vw 0px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0.48vw 0.48vw 0.6vw 0px rgba(0, 0, 0, 0.15); box-shadow: 0.48vw 0.48vw 0.6vw 0px rgba(0, 0, 0, 0.15); margin-bottom: 50px; margin-bottom: 5.94530321vw; } .tab-ty2 ul li a { display: block; width: 100%; height: 80px; height: 9.51248514vw; font-size: 26px; font-size: 3.09155767vw; } .tab-ty2 ul li:after { -webkit-border-radius: 0 2.38vw 0 0; -moz-border-radius: 0 2.38vw 0 0; border-radius: 0 2.38vw 0 0; } } /* 21.05.20 type 2 추가 끝*/ .tbl-ty1{border-top: 2px solid #333333;} .tbl-ty1 table{width: 100%;} .tbl-ty1 table td, .tbl-ty1 table th{border-bottom: 1px solid #e9e9e9; padding: 10px; -ms-word-break: keep-all; word-break: keep-all;} .tbl-ty1 table thead th{vertical-align: middle;} .tbl-ty1.ta-c table td, .tbl-ty1.ta-c table th{text-align: center;} @media screen and (max-width: 840px) { .tbl-ty1 table td, .tbl-ty1 table th{.p(15);} } #footer .wrap_allmenu { position: absolute; left: 11px; bottom: 23px; background-color: #6c6c78; width: 100%; /* height: 150px; overflow: scroll;*/ padding: 10px 5px; font-size: 13px; display: none; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; & a{color: #fff; display: block; margin-bottom: 5px; &:hover{color: #fabe00;}} } #footer .wrap_allmenu .mc{margin-top: 10px; padding-left: 5px;} @media screen and (max-width: 840px) { #footer .wrap_allmenu { position: absolute; .l(-4); .b(30); background-color: #6c6c78; //.w(136); .pa2(10,5); .fz(18); display: none; } #footer .wrap_allmenu a {.mb(10); } #footer .wrap_allmenu .mc{.mt(10); .pl(5);} } .wrap-content-ceo .head .h1{ color: #32246c; font-size: 24px; font-size: 1.41em; font-weight: 700; margin-bottom: 40px; } .wrap-content-ceo .head .h1 strong{font-weight: 500;} .wrap-content-ceo .mid{} .wrap-content-ceo .mid .thumb{float: left; width: 218px; } .wrap-content-ceo .mid .txt{margin-left: 250px;} .wrap-content-ceo .mid .txt p{margin-top: 35px;} .wrap-content-ceo .mid p.last{margin-top: 30px; clear: both;} .wrap-content-ceo .sain{margin-top: 50px;} @media screen and (max-width: 840px) { .wrap-content-ceo .head .h1{ .fz(37); .lh_unit(57); .mb(50);} .wrap-content-ceo .mid .thumb{.w(327); .mr(50); } .wrap-content-ceo .mid .txt{margin-left: 0;} .wrap-content-ceo .mid .txt p{.mt(50);} .wrap-content-ceo .mid p.last{.mt(30);} .wrap-content-ceo .sain{.mt(50); & img{.w(450);}} }/*.wrap-content-ceo w840*/ .wrap-content-mission .head{text-align: center;} .wrap-content-mission .head > .title1{margin-bottom: 19px;} .wrap-content-mission .head > .t1{color: #32246c; margin-bottom: 40px;} .wrap-content-mission .lst .col{float: left; .w_p(290,930); .ml_p(29,930); &:first-child{margin-left: 0;} } .wrap-content-mission .organization{ margin-top: 120px; border-top: 1px solid #d8d8d8; padding-top: 60px; text-align: center; } .wrap-content-mission .organization .title1{margin-bottom: 40px;} @media screen and (max-width: 840px) { .wrap-content-mission .head > .title1{.mb(25);} .wrap-content-mission .head > .t1{.mb(50);} .wrap-content-mission .head > .img img{.w(427); height: auto;} .wrap-content-mission .lst .col{float: none; width: auto; margin-left: 0; .mt(40); &:first-child{margin-top: 0;}} .wrap-content-mission .organization{ .mt(130); .pt(60); } .wrap-content-mission .organization .title1{.mb(40);} }/*.wrap-content-ceo w840*/ .wrap_history{position: relative; z-index: 2; overflow: hidden;} .wrap_history:after{position: absolute; left: 50%; top: -70px; width: 4px; margin-left: -2px; height: 100%; content:""; background-color: #fab000; z-index: 0; padding-top: 70px;} .wrap_history .his_title{position: relative; text-align: center; margin-bottom: 30px; z-index: 3; margin-top: 40px; &.mt0{margin-top: 0;} } .wrap_history .his_title p{display: inline-block; width: 225px; height: 40px; line-height: 40px; .bdrs(40); background-color: #32246c; color: #fff; text-align: center;} .wrap_history .his{.clearfix(); padding-top: 50px; position: relative; z-index: 2;} .wrap_history .his .in{float: left; vertical-align: top; width: 50%; text-align: right; padding-right: 60px; .bxz(); position: relative;} .wrap_history .his .in:before{position: absolute; right: -12px; top: 5px; width: 26px; height: 26px; background: url(../images/company/ico_his1.png) 0 0 no-repeat; -webkit-background-size: 100%; background-size: 100%; content:""; } .wrap_history .his .in .y{font-family:@ff-en; font-size: 26px; color: #1b1b1b; font-weight: 500;} .wrap_history .his .in .t{ font-size: 21px; color: #1b1b1b; font-weight: 500;} .wrap_history .his .in .txt_his{margin-top: 15px;} .wrap_history .his .in .txt_his p{margin-bottom: 10px; padding-left: 30px; position: relative; line-height: 1.47; -ms-word-break: keep-all; word-break: keep-all;} .wrap_history .his .in .txt_his p .num{position: absolute; left: 0; top: 0;} .wrap_history .his .thumb{float: right; vertical-align: top; width: 50%; text-align: left; padding-left: 60px; .bxz(); font-size: 0;} .wrap_history .his .thumb .img1, .wrap_history .his .thumb .img2{display: inline-block; text-align: center; & img{max-width: 100%;} & p{font-size: 16px; margin-top: 3px;}} .wrap_history .his .thumb .img1{width: 100%;} .wrap_history .his .thumb .img2{width: 44%; margin-left: 4%; &:first-child{margin-left: 0;};} .wrap_history .his.lft .in .txt_his p{padding-left: 0; padding-right: 30px; text-align: right;} .wrap_history .his.lft .in .txt_his p .num{position: absolute; left:initial; right: 0; top: 0;} .wrap_history .his.rgh .in{float: right; padding-right: 0; padding-left: 60px; text-align: left;} .wrap_history .his.rgh .in:before{right: auto; left: -13px; } .wrap_history .his.rgh .thumb{float: left; text-align: right; text-align: right; padding-right: 60px; .bxz();} @media screen and (max-width: 840px) { .wrap_history:after{.t(-70); .w(4); .ml(-2); .pt(100);} .wrap_history .his_title{.mb(40); .mt(50);} .wrap_history .his_title p{.w(300); .h(60); .lh_unit(60); .bdrs(60); } .wrap_history .his{.clearfix(); .pt(60);} .wrap_history .his .in{.pr(60);} .wrap_history .his .in:before{ .r(-20); .t(2); .w(40); .h(40);} .wrap_history .his .in .y{.fz(30);} .wrap_history .his .in .t{ .fz(26);} .wrap_history .his .in .txt_his{.mt(20);} .wrap_history .his .in .txt_his p{.mb(20); .pl(45);} .wrap_history .his .in .txt_his p .num{} .wrap_history .his .thumb{.pl(60);} .wrap_history .his .thumb .img1, .wrap_history .his .thumb .img2{ & p{.fz(24); .mt(3)}} .wrap_history .his .thumb .img2{width: 100%; margin-left: 0; .mt(20); &:first-child{margin-top: 0;};} .wrap_history .his.lft .in .txt_his p{.pr(45);} .wrap_history .his.rgh .in{.pl(60);} .wrap_history .his.rgh .in:before{right: auto; .l(-20); } .wrap_history .his.rgh .thumb{ .pr(60);} } /* wrap_history / w840 */ .management_sec .sec1_1 .step{position: relative; z-index: 1; border-bottom: 1px solid #d8d8d8; padding: 0 0 35px 250px; margin-bottom: 35px; &:last-child{border-bottom: 0;};} .management_sec .sec1_1 .step h1{position: absolute; left: 0; top: 0; .fz_em(32,17); color: #32246c; line-height: 1.4; font-weight: 700; } .management_sec .sec1_1 .step .lst{text-align: left; font-size: 0;} .management_sec .sec1_1 .step .lst li{display: inline-block; margin-bottom: 30px; vertical-align: top;} .management_sec .sec1_1 .step .lst li.sz1{.w_p(314,677); .mr_p(39,677); } .management_sec .sec1_1 .step .lst li.sz2{.w_p(324,677); } .management_sec .sec1_2 .tlb .title2{margin-bottom: 10px;} .management_sec .sec1_2 .step{margin-top: 30px; &:first-child{margin-top: 0;};} .management_sec .sec1_2 .grap{float: left; .w_p(333,927); & img{max-width: 100%; height: auto;} } .management_sec .sec1_2 .tlb{float: right; .w_p(584,927); } @media screen and (max-width: 840px) { .management_sec .sec1_1 .step{ .pb(50); padding-left: 0; .mb(50);} .management_sec .sec1_1 .step h1{position: relative; left: 0; top: 0; .fz(50); .mb(30); } .management_sec .sec1_1 .step .lst li.sz1{.w_p(314,677); .mr_p(39,677); } .management_sec .sec1_1 .step .lst li.sz2{.w_p(324,677); } .management_sec .sec1_2 .tlb .title2{.mb(15);} .management_sec .sec1_2 .step{.mt(60);} .management_sec .sec1_2 .grap{float: none; width: auto; text-align: center; .mb(20); & img{width: 70%; height: auto; } } .management_sec .sec1_2 .tlb{float: none; width: auto; } } /* wrap_history / w840 */ .wrap-content-directions .step{position: relative; z-index: 0; padding: 50px 0 50px 220px; border-bottom: 2px solid #d5d6db;} .wrap-content-directions .step .al-vam.lft{position: absolute; left: 0; top: 0; width: 157px; height: 100%; text-align: center; border-bottom: 2px solid #32246c; } .wrap-content-directions .step .al-vam.lft h1{font-size: 21px; line-height: 31px; color: #32246c; font-weight: 700; text-align: center;} .wrap-content-directions .step .wrap-media{margin-top: 10px; &:first-child{margin-top: 0;} } .wrap-content-directions .step .media-left.sz1 p{min-width: 105px;} .wrap-content-directions .step .btn_rgh{position: absolute; right: 0; top: 50%; margin-top: -20px;} @media screen and (max-width: 1280px) { .wrap-content-directions .step .btn_rgh{position: relative; top: 0; margin-top: 10px; text-align: right;} } @media screen and (max-width: 840px) { .wrap-content-directions .step{.p(50,0,50,0);} .wrap-content-directions .step .al-vam.lft{position: relative; width: auto; height: auto; text-align: left; border-bottom: 2px solid #32246c; .pb(20); .mb(20); } .wrap-content-directions .step .al-vam.lft h1{.fz(36); .lh_unit(46); } .wrap-content-directions .step .wrap-media{.mt(15); &:first-child{margin-top: 0;} } .wrap-content-directions .step .media-left.sz1 p{ .w(160); min-width:initial;} .wrap-content-directions .step .btn_rgh{.mt(30);} } @media screen and (max-width: 840px) { .wrap-content-gallery .bbsListBasic-a1 .mid_list table, .wrap-content-gallery .bbsListBasic-a1 .mid_list tbody, .wrap-content-gallery .bbsListBasic-a1 .mid_list tbody tr{display: block; width: 100%;} .wrap-content-gallery .bbsListBasic-a1 .mid_list tbody tr:after{clear: both;display: block;height: 0;visibility: hidden;content:"";} .wrap-content-gallery .bbsListBasic-a1 .mid_list tbody td{display: block; width: 50%; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} } #domestic1{min-height: 700px;} #domestic1 .cont .h1{color: #000; font-weight: 700;} #domestic2 .step{margin-top: 120px; &:first-child{margin-top: 0};} #domestic2 .step:after{clear: both; height: 0; visibility: hidden; clear: both; content:"";display: block;} #domestic2 .step .col.lft{float: left;} #domestic2 .step .col.rgh{float: right;} #domestic2 .step .col p{margin-bottom: 25px;} #domestic2 .step .col .title2{font-size: 20px; margin-bottom: 10px;} #domestic2 .step.n1 .col.lft{.w_p(351,928);} #domestic2 .step.n1 .col.rgh{.w_p(540,928);} #domestic2 .step.n2 .col.rgh{.w_p(360,928);} #domestic2 .step.n2 .col.lft{.w_p(540,928);} #domestic2 .step.n3 .col.lft{.w_p(360,928);} #domestic2 .step.n3 .col.rgh{.w_p(540,928);} @media screen and (max-width: 840px) { #domestic1{.mih(700);} #domestic2 .step{.mt(140); &:first-child{margin-top: 0};} #domestic2 .img1{.w(340); height: auto;} #domestic2 .step .col.lft{float: none;} #domestic2 .step .col.rgh{float: none;} #domestic2 .step .col p{margin-bottom: 25px; .mb(30);} #domestic2 .step .col .title2{.fz(36); .mb(15);} #domestic2 .step.n1 .col.lft{width: auto;} #domestic2 .step.n1 .col.rgh{width: auto;} #domestic2 .step.n2 .col.rgh{width: auto;} #domestic2 .step.n2 .col.lft{width: auto;} #domestic2 .step.n3 .col.lft{width: auto;} #domestic2 .step.n3 .col.rgh{width: auto;} } .wrap-content-overseas .lst-col.ico1{text-align: center;} .wrap-content-overseas .lst-col img{max-width: 100%; height: auto;} .wrap-content-overseas .lst-col.ico1 .ico{margin-bottom: 10px;} .wrap-content-overseas .lst-col.ico1 .t1{color:@c_p; line-height: 1.2;} .wrap-content-overseas .lst-col.ico1 .t1 .b{.fz_em(30,17);} @media screen and (max-width: 840px) { .wrap-content-overseas .lst-col.ico1 .ico img{.w(200); height: auto;} .wrap-content-overseas .lst-col .col{.mt(30);} .wrap-content-overseas .lst-col.ico1 .col{.mt(60);} } .wrap-content-service p{line-height: 1.53; } .wrap-content-service h1{font-size: 20px; margin-top: 60px; margin-bottom: 35px; } @media screen and (max-width: 840px) { .wrap-content-service h1{.fz(34); .mt(70); .mb(40); } }