/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Mobile용 서브 하위메뉴 공통 영역 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Mobile용 서브 하위메뉴 리스트 영역 */ .mo-sub-gnb {position: relative; width: 100%; height: auto; background: #fff;} .mo-sub-gnb ul {display: flex; flex-wrap: wrap;} .mo-sub-gnb ul li {width: 25%; border-right: 1px solid #e2e2e2; border-bottom: 1px solid #e2e2e2;} .mo-sub-gnb ul li:nth-of-type(4n+4) {border-right: 0;} .mo-sub-gnb ul li a {display: block; width: 100%; height: 100%; padding-top: 0.2rem; text-align: center; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 1.5rem; color: #676767; line-height: 32px; letter-spacing: -0.1rem;} .mo-sub-gnb.roll {position: fixed; top: 60px; background: #fff; z-index: 1000000;} /* 스크롤시 하위메뉴 상단고정 적용 */ #mo-tab-menu li.on a {font-family: "s-core-dream-heavy", sans-serif; color: #fff; background-color: #d31820;} /* 스크롤시 하위메뉴 선택메뉴 스타일 적용 */ .mo-sub-gnb ul li.active a {font-family: "s-core-dream-heavy", sans-serif; color: #fff; background-color: #d31820;} /* 일반메뉴 선택메뉴 스타일 적용 */ /* Mobile용 서브 하위메뉴 공통 영역 - 메뉴수 예외처리 */ .mo-sub-gnb-mn4 ul li {width: 50%;} .mo-sub-gnb-mn4 ul li:nth-of-type(2n+2) {border-right: 0;} .mo-sub-gnb-mn5 ul li {width: 33.3334%;} .mo-sub-gnb-mn5 ul li:nth-of-type(3) {border-right: 0;} .mo-sub-gnb-mn5 ul li:nth-of-type(4) {width: 50%; border-right: 1px solid #e2e2e2;} .mo-sub-gnb-mn5 ul li:nth-of-type(5) {width: 50%; border-right: 0;} .mo-sub-gnb-mn9 ul li {width: 50%;} /* Mobile용 서브 하위메뉴 페이지 이동 탭메뉴 리스트 영역 */ .mo-sub-gnbtab {position: sticky; top: 60px; width: 100%; background: #fff; z-index: 10;} .mo-sub-gnbtab .tabs-container {width: 100%;} .mo-sub-gnbtab .tabs-container ul {display: flex; flex-wrap: wrap; width: 100%;} .mo-sub-gnbtab .tabs-container ul li {width: 33.3334%; border-right: 1px solid #e2e2e2; border-bottom: 1px solid #e2e2e2;} .mo-sub-gnbtab .tabs-container ul li:nth-of-type(3n+3) {border-right: 0;} .mo-sub-gnbtab .tabs-container ul li a {display: block; width: 100%; height: 100%; padding-top: 0.2rem; text-align: center; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 1.5rem; color: #676767; line-height: 32px; letter-spacing: -0.1rem;} #mo-tab-menu li.on {border-bottom: 1px solid #d31820;} #mo-tab-menu li.on a {font-family: "s-core-dream-heavy", sans-serif; color: #fff; background-color: #d31820; border-bottom: 1px solid #d31820;} /* 스크롤시 하위메뉴 선택메뉴 스타일 적용 */ /* Mobile용 서브 하위메뉴 페이지 이동 탭메뉴 리스트 영역 - 메뉴수 예외처리 */ .mo-sub-gnbtab-mn1 ul li:nth-of-type(7) {width: 100%;} .mo-sub-gnbtab-mn1 ul li:nth-of-type(7) {border-right: 0;} .mo-sub-gnbtab-mn3 ul li:nth-of-type(7) {width: 50%;} .mo-sub-gnbtab-mn3 ul li:nth-of-type(8) {width: 50%; border-right: 0;} .mo-sub-gnbtab-mn3 ul li:nth-of-type(6) {border-right: 0;} /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* PC용 서브 컨텐츠 공통 영역 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 서브 sub-visual 배경이미지 영역 */ .sub-visual {position: relative; width: 100%; height: 390px; background-repeat: no-repeat; background-position: center top; background-size: cover; z-index: 1;} /* 서브 대메뉴 타이틀 영역 */ .subtitle-area {position: relative; display: flex; align-items: center; width: 100%; height: 100%;} .subtitle-area .inner {margin: 0 auto; width: 100%; max-width: 135rem; text-align: left;} .subtitle-area .stxt {font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.6rem; color: #fff; line-height: 1; letter-spacing: -0.1rem; margin-top: 1rem; margin-bottom: 1.5rem; text-shadow: 1px 1px 10px rgba(0,0,0,0.75);} .subtitle-area .stxt strong {font-family: "s-core-dream-heavy", sans-serif;} .subtitle-area .stxt strong.hanja {font-family: "Noto Sans KR", sans-serif; font-weight: 800;} .subtitle-area h2.tit {font-weight: normal; font-family: "s-core-dream-extrabold", sans-serif; transform: rotate(-0.03deg); font-size: 5.2rem; color: #fff; line-height: 1; letter-spacing: -0.1rem; margin-top: 0.8rem;} .subtitle-area p {font-family: "s-core-dream-regular", sans-serif; transform: rotate(-0.03deg); font-size: 2.2rem; color: #fff; line-height: 1.3; letter-spacing: -0.1rem; word-break: keep-all; margin-top: 2.5rem; text-shadow: 1px 1px 10px rgba(0,0,0,0.75);} .subtitle-area p span {display: block;} /* 서브 하위메뉴 리스트 영역 */ .sub-gnb {position: relative; float: left; width: 100%; height: 60px; background: #fff; border-bottom: 1px solid #e2e2e2; z-index: 2;} .sub-gnb .inner {display: flex; flex-wrap: wrap; margin: 0 auto; width: 100%; max-width: 135rem;} .sub-gnb ul {width: 100%; font-size: 0; text-align: center;} .sub-gnb ul li {display: inline-block; padding: 0 1.83rem;} .sub-gnb ul li a {display: block; height: 60px; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 1.75rem; color: #676767; line-height: 64px; letter-spacing: -0.1rem; padding: 0 0.4rem; border-bottom: 4px solid rgba(211,24,32,0); -webkit-transition: all .3s; transition: all .3s;} .sub-gnb ul li a:hover {color: #d31820; border-bottom: 4px solid #d31820;} /* 마우스롤오버 메뉴 표시 */ .sub-gnb ul li.active a {font-family: "s-core-dream-heavy", sans-serif; color: #d31820; border-bottom: 4px solid #d31820;} /* 선택된 메뉴 표시 */ .sub-gnb.roll {position: fixed; top: 70px; background: #fff; border-bottom: 1px solid #e2e2e2; z-index: 1000000;} /* 서브 하위메뉴 - 이동 탭메뉴 페이지스크롤 이동시 롤오버, 선택시 적용 */ .sub-gnb ul li.on a {font-family: "s-core-dream-heavy", sans-serif; color: #d31820; border-bottom: 4px solid rgba(211,24,32,1);} /* 서브 하위메뉴 페이지 이동 탭메뉴 리스트 영역 */ .sub-gnbtab {position: sticky; top: 70px; width: 100%; height: 60px; background: #fff; border-bottom: 1px solid #e2e2e2; z-index: 2;} .sub-gnbtab .tabs-container {width: 100%;} .sub-gnbtab .tabs-container ul {width: 100%; font-size: 0; text-align: center;} .sub-gnbtab .tabs-container ul li {display: inline-block; padding: 0 1.83rem;} .sub-gnbtab .tabs-container ul li a {display: block; height: 60px; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 1.75rem; color: #676767; line-height: 64px; letter-spacing: -0.1rem; padding: 0 0.4rem; border-bottom: 4px solid rgba(211,24,32,0); -webkit-transition: all .3s; transition: all .3s;} .sub-gnbtab .tabs-container ul li a:hover {color: #d31820; border-bottom: 4px solid rgba(211,24,32,1);} /* 마우스롤오버 메뉴 표시 */ .sub-gnbtab .tabs-container ul li.on a {font-family: "s-core-dream-heavy", sans-serif; color: #d31820; border-bottom: 4px solid rgba(211,24,32,1);} /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 레이아웃 공통 영역 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ .sec-sub {position: relative; float: left; width: 100%;} .sec-sub .inner {margin: 0 auto; width: 100%; max-width: 135rem;} .subpage-common {float: left; width: 100%;} .subpage-common .page-common {float: left; width: 100%;} .subpage-common .page-common .page-title {width: 100%; text-align: center;} .subpage-common .page-common .page-title h3 {font-weight: normal; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 4rem; color: #111; line-height: 1.2; letter-spacing: -0.1rem; word-break: keep-all;} .subpage-common .page-common .page-title h3 strong {font-family: "s-core-dream-heavy", sans-serif;} .subpage-common .page-common .page-title h3 font {font-family: "Noto Sans KR", sans-serif;} .subpage-common .page-common .page-title p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #656363; line-height: 1.2; letter-spacing: -0.1rem; word-break: keep-all; margin-top: 2.8rem;} /*.subpage-common .page-common .page-title p span {display: block;}*/ .subpage-common .page-common .page-title p font {font-family: "Noto Sans KR", sans-serif;} .subpage-common .page-common .page-title2 p span {display: block;} .subpage-common .page-common .page-title3 {text-align: left;} .page-title-board {margin-bottom: 6rem;} .subpage-common .page-common .page-title-white h3 {color: #fff;} .subpage-common .page-common .page-title-white p {color: #fff;} .subpage-common .page-common .page-title-white p strong {font-family: "s-core-dream-heavy", sans-serif;} .subpage-common .page-common .page-wrap {width: 100%; margin-top: 7rem;} .subpage-common .page-common2 {padding: 0;} .page-solution {margin: 8rem 0 12rem;} .page-solution-review {margin: 4rem 0 12rem;} .page-cttbox {margin: 5rem 0 12rem; padding: 0 2rem;} /* 이용약관 및 개인정보처리방침 페이지 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* PC용 서브 하단 고정 고객센터 공통 영역 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ .subfoot-common {position: relative; width: 100%; height: 15rem; background-color: #f4951d; overflow: hidden;} .subfoot-common .left-colortbg {position: absolute; top: 0; left: 0; content: ""; width: 35.5%; height: 100%; z-index: 1;} .subfoot-common .left-colortbg:before {position: absolute; top: 0; left: 0; content: ""; width: 88%; height: 100%; background-color: #d21312;} .subfoot-common .left-colortbg:after {position: absolute; top: -90%; right: 0; content: ""; width: 50rem; height: 50rem; transform: rotate(295deg); background-color: #d21312;} .subfootcustomer-box {position: absolute; width: 100%; height: 100%; z-index: 2;} .subfootcustomer-box .inner {display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto; width: 100%; max-width: 135rem;} .subfootcustomer-box .left {position: relative; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; width: 42%; height: 15rem;} .subfootcustomer-box .left .conbox {width: 100%; padding-left: 1rem;} .subfootcustomer-box .left .conbox p {display: inline-block; width: auto; height: 3.6rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.2rem; color: #fff; line-height: 3.5rem; padding: 0 2.5rem; background-color: #850808; border-radius: 5.5rem;} .subfootcustomer-box .left .conbox p span {font-family: "Noto Sans KR", sans-serif;} .subfootcustomer-box .left .conbox .callinfo {display: flex; flex-wrap: wrap; align-items: center; width: 100%; padding-left: 2.4rem; margin-top: 1.2rem;} .subfootcustomer-box .left .conbox .callinfo i {display: inline-block; width: 4.5rem; height: 4.5rem; margin-right: 1.3rem;} .subfootcustomer-box .left .conbox .callinfo i img {width: 100%;} .subfootcustomer-box .left .conbox .callinfo span {font-family: "s-core-dream-heavy", sans-serif; transform: rotate(-0.03deg); font-size: 3rem; color: #fff; line-height: 1; letter-spacing: 0.02rem;} .subfootcustomer-box .right {position: relative; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; width: 58%; height: 15rem;} .subfootcustomer-box .right .conbox {display: flex; flex-wrap: wrap; align-items: center; width: 100%; font-size: 0;} .subfootcustomer-box .right .conbox .subfoot-map {display: inline-block; width: 14.2rem;} .subfootcustomer-box .right .conbox .subfoot-map img {width: 100%;} .subfootcustomer-box .right .conbox .subfoot-slogan {display: inline-block; padding-left: 4rem;} .subfootcustomer-box .right .conbox .subfoot-slogan .tittxt {font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 3.5rem; color: #fff; line-height: 1.2; letter-spacing: -0.1rem;} .subfootcustomer-box .right .conbox .subfoot-slogan p {width: 100%; margin-top: 1.5rem;} .subfootcustomer-box .right .conbox .subfoot-slogan p span {display: inline-block; height: 3.7rem; font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 1.8rem; color: #f4951d; line-height: 3.8rem; letter-spacing: -0.1rem; padding: 0 2.5rem; margin-right: 1.1rem; background-color: #fff; border-radius: 5.5rem;} /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 서브페이지 컨텐츠영역 01 - 전국차량탁송 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 01 서비스유형 */ .page-servicetype {padding-top: 12rem;} .service-type {display: flex; justify-content: space-between; width: 100%;} .service-type2 {margin-top: 6rem;} .service-type .itemtype {width: 48%;} .service-type .itemtype .item-thumb {position: relative; z-index: 1; width: 100%; overflow: hidden;} .service-type .itemtype .item-thumb img {width: 100%;} .service-type .itemtype .item-info {position: relative; z-index: 2; width: 100%; text-align: center; padding-top: 3rem; margin-bottom: 2rem; border-top: 2px solid #d53331;} .service-type .itemtype .item-info h3 {font-weight: normal; display: inline-block; width: auto; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 3.4rem; color: #111; letter-spacing: -0.1rem; line-height: 1; background-color: #fff;} .service-type .itemtype .item-info h3 strong {font-family: "s-core-dream-heavy", sans-serif;} .service-type .itemtype .item-info p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.2rem; color: #252525; letter-spacing: -0.1rem; line-height: 1.3; word-break: keep-all; margin-top: 2rem;} .service-type .itemtype .item-info p span {display: block;} .service-contents {width: 100%; margin-top: 7rem;} .service-contents .service-title {width: 100%; text-align: center;} .service-contents .service-title h4 {font-weight: normal; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 3.6rem; color: #111; letter-spacing: -0.1rem; line-height: 1.2;} .service-contents .service-title p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.2rem; color: #656363; letter-spacing: -0.1rem; line-height: 1.3; margin-top: 1.8rem;} .service-contents .service-list {display: flex; justify-content: space-between; width: 100%; margin-top: 5rem;} .service-contents .service-list .service-item {width: 23.3334%;} .service-contents .service-list .service-item figure {position: relative; padding: 0; margin: 0; border-radius: 1.4rem; overflow: hidden;} .service-contents .service-list .service-item figure img {width: 100%; height: 100%; object-fit: cover; transform: scale(1); -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;} .service-contents .service-list .service-item figure figcaption {position: absolute; bottom: 0; left: 0; width: 100%; height: 8rem; background-image: -webkit-linear-gradient(top, transparent 0%, #000 100%); background-image: linear-gradient(to bottom, transparent 0%, #000 100%);} .service-contents .service-list .service-item figure figcaption div.tit {display: inline-block; width: 100%; font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #fff; line-height: 1; letter-spacing: -0.08rem; text-align: center; padding-top: 3.2rem;} .service-contents .service-list .service-item .infotxt {width: 100%; text-align: center; margin-bottom: 2rem;} .service-contents .service-list .service-item .infotxt div.tit {display: inline-block; width: 100%; font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #111; line-height: 1; letter-spacing: -0.08rem; text-align: center;} .service-contents .service-list .service-item .infotxt p {display: inline-block; width: 100%; transform: rotate(-0.03deg); font-size: 1.9rem; color: #484747; font-weight: 400; line-height: 1.4; letter-spacing: -0.1rem; padding-top: 1rem; word-break: keep-all;} .service-contents .service-list .service-item .infotxt p span {display: block;} .tagsongbigyo-box {width: 100%; margin-top: 7rem; padding: 7rem 6rem; background-color: #f9f9f9;} .tagsongbigyo-box h4 {font-weight: normal; text-align: center; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 3.6rem; color: #111; letter-spacing: -0.1rem; line-height: 1.2;} .tagsongbigyo-box .tablebox {position: relative; width: 100%; margin-top: 5rem;} .tagsongbigyo-box .tablebox:after {position: absolute; left: 19.7%; top: -4px; content: ""; width: 40.5%; height: 101%; border: 4px solid #d53331;} .tagsongbigyo-box .tablebox .table-layout {width: 100%; word-break: keep-all;} .tagsongbigyo-box .tablebox .table-layout th {height: 7.3rem; font-weight: normal; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.6rem; color: #fff; letter-spacing: -0.1rem;} .tagsongbigyo-box .tablebox .table-layout th.bg1 {border-right: 2px solid #2b6ab9; background-color: #02326f;} .tagsongbigyo-box .tablebox .table-layout th.bg2 {background-color: #02489f;} .tagsongbigyo-box .tablebox .table-layout th.bg3 {background-color: #0e68d7;} .tagsongbigyo-box .tablebox .table-layout td {height: 9.2rem; padding: 0 3rem; text-align: center; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.1rem; color: #636363; line-height: 1.3; word-break: keep-all; background-color: #fff; border-bottom: 2px solid #e8eaf2;} .tagsongbigyo-box .tablebox .table-layout td.tit {font-family: "s-core-dream-extrabold", sans-serif; font-size: 2.4rem; color: #323232; background-color: #ecf5fb;} .tagsongbigyo-box .tablebox .table-layout td.mark {border-left: 2px solid #e8eaf2; border-right: 2px solid #e8eaf2;} .tagsongbigyo-box .tablebox .table-layout tr.last td {border-bottom: 2px solid #b6bac6;} /* 02 진행절차 */ .page-progress {padding-top: 12rem;} .progress-list {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; padding: 6rem; background-color: #f2f7fa;} .progress-list .liststep {position: relative; width: 30.08130081300813%;} .progress-list .liststep:nth-child(-n+3) {margin-bottom: 6rem;} .progress-list .liststep .topico {position: absolute; top: 0; left: 0; width: 100%; height: 20.7rem; text-align: center;} .progress-list .liststep .topico img {width: 14.5rem;} .progress-list .liststep .stepbox {width: 100%; margin-top: 19rem;} .progress-list .liststep .stepbox figure {padding: 0; margin: 0; border-radius: 1.4rem 1.4rem 0 0; overflow: hidden;} .progress-list .liststep .stepbox figure img {width: 100%;} .progress-list .liststep .stepbox .stepinfo {display: flex; flex-wrap: wrap; align-items: center; min-height: 17rem; padding: 0 4rem; background-color: #fff; border: 1px solid #e1dfdf; border-top: 0; border-radius: 0 0 1.4rem 1.4rem; overflow: hidden;} .progress-list .liststep .stepbox .stepinfo ul {width: 100%;} .progress-list .liststep .stepbox .stepinfo ul li {padding-left: 3.8rem; margin-bottom: 1.5rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.2rem; color: #363636; line-height: 2.8rem; letter-spacing: -0.1rem; word-break: keep-all;} .progress-list .liststep .stepbox .stepinfo ul li:last-child {margin-bottom: 0;} .progress-list .liststep .stepbox .stepinfo ul li:after {position: absolute; top: 0; left: 0; content: ""; width: 2.8rem; height: 2.7rem; background-image: url("../national/images/check_ico.png"); background-repeat: no-repeat; background-position: left top; background-size: 2.8rem 2.7rem;} .progress-list .liststep .stepbox .stepinfo ul li span {display: block;} /* 03 고객추천 */ .page-recommend {background-color: #f9f9f9; padding: 12rem 0; margin-top: 12rem;} .recommend-list {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%;} .recommend-list .item-list {width: 30.37037037037037%;} .recommend-list .item-list:nth-child(-n+3) {margin-bottom: 6rem;} .recommend-list .item-list figure {position: relative; padding: 0; margin: 0; border-radius: 2rem; overflow: hidden;} .recommend-list .item-list figure img {width: 100%;} .recommend-list .item-list .item-info {width: 100%; margin-top: 3rem;} .recommend-list .item-list .item-info .tit {font-family: "s-core-dream-heavy", sans-serif; transform: rotate(-0.03deg); font-size: 2.8rem; color: #f15922; letter-spacing: -0.1rem; line-height: 1;} .recommend-list .item-list .item-info p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.2rem; color: #252525; letter-spacing: -0.1rem; line-height: 1.4; margin-top: 1.8rem;} .recommend-list .item-list .item-info p span {display: block;} .page-recommend .review-btn {width: 100%; text-align: center; margin-top: 6rem;} .page-recommend .review-btn a {position: relative; display: inline-block; width: 29.4rem; height: 7rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.2rem; color: #fff; text-align: left; line-height: 7.2rem; padding-left: 4.5rem; background-color: #d31820; border-radius: 1rem; transition: all 0.35s ease;} .page-recommend .review-btn a strong {font-family: "s-core-dream-heavy", sans-serif;} .page-recommend .review-btn a i {position: absolute; right: 13%; top: 50%; transform: translateY(-50%); width: 1.1rem; height: 1.9rem; font-style: normal;} .page-recommend .review-btn a:hover {background-color: #f7941e;} /* 04 베스트서비스 */ .page-bestservice {padding-top: 12rem;} .bestservice-list {width: 100%; padding: 6rem; background-color: #f3f3f3;} .bestservice-list ul {display: flex; flex-wrap: wrap; background-color: #fff; border-top: 1px solid #e6e5e5; border-left: 1px solid #e6e5e5;} .bestservice-list ul li {width: 25%; border-right: 1px solid #e6e5e5; border-bottom: 1px solid #e6e5e5;} .bestservice-list ul li dl {min-height: 33rem; padding: 3.5rem 3.2rem;} .bestservice-list ul li dl.bestico-1 {background-image: url("../national/images/bestico_1.png"); background-repeat: no-repeat; background-position: 80% 84%;} .bestservice-list ul li dl.bestico-2 {background-image: url("../national/images/bestico_2.png"); background-repeat: no-repeat; background-position: 80% 84%;} .bestservice-list ul li dl.bestico-3 {background-image: url("../national/images/bestico_3.png"); background-repeat: no-repeat; background-position: 82% 84%;} .bestservice-list ul li dl.bestico-4 {background-image: url("../national/images/bestico_4.png"); background-repeat: no-repeat; background-position: 82% 84%;} .bestservice-list ul li dl.bestico-5 {background-image: url("../national/images/bestico_5.png"); background-repeat: no-repeat; background-position: 84% 84%;} .bestservice-list ul li dl.bestico-6 {background-image: url("../national/images/bestico_6.png"); background-repeat: no-repeat; background-position: 82% 84%;} .bestservice-list ul li dl.bestico-7 {background-image: url("../national/images/bestico_7.png"); background-repeat: no-repeat; background-position: 82% 84%;} .bestservice-list ul li dl dt {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #111; line-height: 1.3; letter-spacing: -0.1rem; word-break: keep-all;} .bestservice-list ul li dl dt strong {font-family: "s-core-dream-extrabold", sans-serif; color: #f15922;} .bestservice-list ul li dl dt span {display: block;} .bestservice-list ul li dl dd {transform: rotate(-0.03deg); font-size: 1.7rem; color: #6e6c6c; font-weight: 400; line-height: 1.3; letter-spacing: -0.1rem; word-break: keep-all; margin-top: 1rem;} .bestservice-list ul li dl .review-btn {width: 100%; text-align: center; margin-top: 4rem;} .bestservice-list ul li dl .review-btn a {position: relative; display: inline-block; width: 80%; height: 6rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 1.8rem; color: #fff; text-align: left; line-height: 6.2rem; padding-left: 3rem; background-color: #d31820; border-radius: 0.8rem; transition: all 0.35s ease;} .bestservice-list ul li dl .review-btn a strong {font-family: "s-core-dream-heavy", sans-serif;} .bestservice-list ul li dl .review-btn a i {position: absolute; right: 13%; top: 50%; transform: translateY(-45%); width: 0.9rem; height: 1.7rem; font-style: normal;} .bestservice-list ul li dl .review-btn a i img {width: 100%;} .bestservice-list ul li dl .review-btn a:hover {background-color: #f7941e;} /* 05 예약절차 */ .page-process {background-color: #fdf9f5; padding: 12rem 0; margin-top: 12rem;} .reservation-process {width: 100%;} .reservation-process ul {display: flex; justify-content: space-between; flex-wrap: wrap;} .reservation-process ul li {position: relative; width: 17.03703703703704%;} .reservation-process ul li:after {position: absolute; top: 31%; right: -3.3rem; content: ""; display: inline-block; width: 1.5rem; height: 2.4rem; background: url("../national/images/process_arrow.png") no-repeat center;} .reservation-process ul li:last-child:after {display: none;} .reservation-process ul li .listarea {position: relative; width: 100%; height: 0; padding-bottom: 100%; text-align: center; background-color: #fff; border: 2px solid #eab83f; border-radius: 50%; overflow: hidden;} .reservation-process ul li .listarea .box {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; flex-wrap: wrap; align-content: center;} .reservation-process ul li .listarea .box .step {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; width: 100%; height: 23.91304347826087%; font-family: "Saira", sans-serif; transform: rotate(-0.03deg); font-size: 2.6rem; color: #fff; font-weight: 700; padding-top: 4%; background-color: #eab83f;} .reservation-process ul li .listarea .box .icoarea {display: inline-block; width: 100%; height: 76.08695652173913%; background-color: #fff;} .reservation-process ul li .listarea .box .icoarea i {display: inline-block; width: auto; height: auto; margin-top: 2rem;} .reservation-process ul li .listarea .box .icoarea p {font-family: "s-core-dream-bold", sans-serif; font-size: 2.4rem; color: #111; line-height: 1; letter-spacing: -0.1rem; margin-top: 1.5rem;} .reservation-process ul li .listarea .box .icoarea p font {font-family: "Noto Sans KR", sans-serif;} .reservation-process ul li p.contxt {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2rem; color: #846824; line-height: 1.35; letter-spacing: -0.1rem; text-align: center; margin-top: 3rem;} .reservation-process ul li p.contxt span {display: block;} .reservation-process ul li p.contxt font {font-family: "Noto Sans KR", sans-serif;} .reservation-process .receipt-btns {width: 100%; text-align: center; margin-top: 6.5rem; font-size: 0;} .reservation-process .receipt-btns a {position: relative; display: inline-block; width: 26.5rem; height: 7rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.8rem; color: #fff; text-align: left; line-height: 7.2rem; padding-left: 4.5rem; background-color: #d31820; border-radius: 1rem; box-shadow: 6px 6px 10px rgba(0,0,0,0.15); transition: all 0.35s ease;} .reservation-process .receipt-btns a:first-child {margin-right: 5rem;} .reservation-process .receipt-btns a.online {background-color: #f15922;} .reservation-process .receipt-btns a strong {font-family: "s-core-dream-heavy", sans-serif;} .reservation-process .receipt-btns a i {position: absolute; right: 13%; top: 50%; transform: translateY(-50%); width: 1.1rem; height: 1.9rem; font-style: normal;} .reservation-process .receipt-btns a:hover {background-color: #07ae4d;} /* 06 선박회사안내 */ .page-shipcompany {width: 100%; height: 112rem; padding: 12rem 0 0; margin-top: 12rem; background-image: url("../national/images/shipcompany_bg.jpg"); background-repeat: no-repeat; background-position: center top; background-size: cover;} .page-shipcompany2 {margin-top: 0;} .page-shipcompany .page-wrap {margin-top: 0;} .shipcompany-box {width: 100%; padding-top: 12rem;} .shipcompany-box p.tit {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #fff; line-height: 1.2; letter-spacing: -0.1rem; padding: 0 6rem; margin-bottom: 2.5rem; text-shadow: 1px 1px 10px rgba(0,0,0,0.75);} .shipcompany-box .shipcompany-area {width: 100%;} .shipcompany-list {width: 100%; padding: 0 6rem; margin-bottom: 7rem;} .shipcompany-list table.table-layout {width: 100%; background-color: rgba(0,74,128,0.5); border: 2px solid rgba(255,255,255,0.20);} .shipcompany-list table.table-layout th {height: 5.9rem; font-family: "s-core-dream-bold", sans-serif; font-size: 2.6rem; color: #fff; line-height: 1; letter-spacing: -0.1rem; background-color: rgba(0,54,128,0.90); border-right: 1px solid rgba(255,255,255,0.20);} .shipcompany-list table.table-layout th:last-child {border-right: 0;} .shipcompany-list table.table-layout td {text-align: center; height: 5.1rem; padding: 0 2%; font-family: "s-core-dream-medium", sans-serif; font-size: 2.2rem; color: #fff; line-height: 1; letter-spacing: -0.1rem; border-right: 1px solid rgba(255,255,255,0.20); border-bottom: 1px solid rgba(255,255,255,0.20);} .shipcompany-list table.table-layout td.last {border-right: 0;} .shipcompany-list table.table-layout td a {color: #fff;} .shipcompany-list table.table-layout td a:hover {color: #00ffff;} .shipcompany-list table.table-layout td.siteurl {font-family: "Noto Sans KR", sans-serif; letter-spacing: -0.06rem; text-align: left; padding: 0 4%;} .txtguide {width: 100%; text-align: center;} .txtguide p {font-family: "s-core-dream-medium", sans-serif; font-size: 2.9rem; color: #fff; line-height: 1.5; letter-spacing: -0.1rem; text-shadow: 1px 1px 10px rgba(0,0,0,0.75);} .txtguide p span {display: block;} .txtguide .online-btns {padding-top: 4rem;} .txtguide .online-btns a {position: relative; display: inline-block; width: 26.5rem; height: 7rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.8rem; color: #fff; text-align: left; line-height: 7.2rem; padding-left: 4.5rem; background-color: #0098f0; border-radius: 1rem; box-shadow: 6px 6px 10px rgba(0,0,0,0.15); transition: all 0.35s ease;} .txtguide .online-btns a strong {font-family: "s-core-dream-heavy", sans-serif;} .txtguide .online-btns a i {position: absolute; right: 13%; top: 50%; transform: translateY(-50%); width: 1.1rem; height: 1.9rem; font-style: normal;} .txtguide .online-btns a:hover {background-color: #d4080d;} /* 07 선박운항시간표 */ .page-shipschedule {width: 100%; height: 101rem; padding-top: 12rem; margin: 0 !important; background-image: url("../national/images/shipschedule_bg.jpg"); background-repeat: no-repeat; background-position: center top; background-size: cover;} .page-shipschedule .page-wrap {margin-top: 6rem !important;} .shipschedule-box {width: 100%;} .shiprace-list {width: 100%; padding: 0 6rem;} .shiprace-list table.table-layout {width: 100%; background-color: rgba(0,74,128,0.6); border: 3px solid rgba(255,255,255,0.20);} .shiprace-list table.table-layout th {height: 5.9rem; font-family: "s-core-dream-bold", sans-serif; font-size: 2.6rem; color: #fff; line-height: 1; letter-spacing: -0.1rem; background-color: rgba(0,54,128,0.80); border-right: 1px solid rgba(255,255,255,0.20);} .shiprace-list table.table-layout th:last-child {border-right: 0;} .shiprace-list table.table-layout td {text-align: center; height: 5.1rem; padding: 0 2%; font-family: "s-core-dream-medium", sans-serif; font-size: 2.2rem; color: #fff; line-height: 1; letter-spacing: -0.1rem; border-right: 1px solid rgba(255,255,255,0.20); border-bottom: 1px solid rgba(255,255,255,0.20);} .shiprace-list table.table-layout td.last {border-right: 0;} .shiprace-list table.table-layout td font {font-family: "Noto Sans KR", sans-serif; font-weight: 700; vertical-align: 1px;} /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 서브페이지 컨텐츠영역 02 - 제주탁송 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 01 탁송서비스 */ .jeju-banner {margin-top: 7rem;} .jeju-banner img {width: 100%;} /* 06 탁송 제한품목 */ .page-restricteditems {width: 100%; padding: 12rem 0;} .restricteditems-box {display: flex; justify-content: space-between; width: 100%;} .restricteditems-box .item-box {position: relative; width: 32.2962962962963%; height: 43rem; border: 1px solid #d8d8d8; border-radius: 2rem; box-shadow: 8px 8px 12px rgba(0,0,0,0.08);} .restricteditems-box .item-box h4 {position: relative; font-weight: normal; display: flex; width: 80%; height: 5rem; padding-left: 3rem; margin-top: 3rem; background-repeat: no-repeat; background-position: right top;} .restricteditems-box .item-box h4:before {position: absolute; top: 0; left: 0; content: ""; width: 78%; height: 100%; background-color: #f7941e; z-index: 1;} .restricteditems-box .item-box h4 span {position: relative; font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.6rem; color: #fff; line-height: 5.2rem; letter-spacing: -0.08rem; z-index: 2;} .restricteditems-box .item01 h4 {background-image: url("../jeju/images/restricted_tit_arrow1.png");} .restricteditems-box .item01 h4:before {background-color: #f7941e;} .restricteditems-box .item02 h4 {background-image: url("../jeju/images/restricted_tit_arrow2.png");} .restricteditems-box .item02 h4:before {background-color: #eb1f20;} .restricteditems-box .item03 h4 {background-image: url("../jeju/images/restricted_tit_arrow3.png");} .restricteditems-box .item03 h4:before {background-color: #02ad47;} .restricteditems-box .item-box .guide {font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.6rem; color: #252525; line-height: 1.2; letter-spacing: -0.08rem; padding: 0 3rem; margin-top: 2rem;} .restricteditems-box .item-box .guide span {display: block;} .restricteditems-box .item-box .infotxt {width: 100%; padding: 0 3rem;} .restricteditems-box .item-box .infotxt .tit {font-family: "s-core-dream-medium", sans-serif; font-size: 2.2rem; color: #252525; line-height: 1.2; letter-spacing: -0.1rem; padding-top: 2.5rem; margin-top: 2.5rem; border-top: 1px solid #e2e2e2;} .restricteditems-box .item-box .infotxt p {height: 6rem; font-size: 1.8rem; color: #6f6e6e; font-weight: 400; line-height: 1.2; letter-spacing: -0.1rem; word-break: keep-all; margin-top: 1rem;} .restricteditems-box .item-box .infotxt .itemimg {text-align: center;} .restricteditems-box .item-box .infotxt .itemimg img {max-width: 100%;} /* 07 예약시 유의사항 */ .page-noticenote {width: 100%; padding: 5rem 0 12rem; background-color: #f9f9f9;} .noticenote-box {width: 100%; text-align: center;} .noticenote-box .titbox {position: relative; z-index: 2; display: inline-block; width: auto; height: 7rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 4rem; color: #fff; letter-spacing: -0.06rem; line-height: 7.2rem; padding: 0 5rem; background-color: #f15922; border-radius: 5.5rem;} .noticenote-box .titbox i.ico {position: relative; vertical-align: -0.4rem; display: inline-block; width: 4.3rem; height: 3.9rem; margin-right: 1rem; background-image: url("../jeju/images/title_bullet.png"); background-repeat: no-repeat; background-position: left center; background-size: 4.3rem 3.9rem;} .noticenote-box .titbox strong {font-family: "s-core-dream-heavy", sans-serif;} .noticenote-box .note-list {position: relative; z-index: 1; display: inline-block; width: 100%; padding: 7rem 6rem 6rem; margin-top: -3.4rem; background-color: #fff; border: 3px solid #e8ceb0; border-radius: 3rem;} .noticenote-box .note-list ul {float: left; width: 50%; text-align: left;} .noticenote-box .note-list ul li {padding-left: 3.8rem; margin-bottom: 2rem; font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #252525; line-height: 2.8rem; letter-spacing: -0.1rem; word-break: keep-all;} .noticenote-box .note-list ul li:after {position: absolute; top: 0; left: 0; content: ""; width: 2.8rem; height: 2.7rem; background-image: url("../jeju/images/check_ico.png"); background-repeat: no-repeat; background-position: left top; background-size: 2.8rem 2.7rem;} .noticenote-box .note-list ul .notesub {width: 100%; padding-left: 3.8rem; margin-bottom: 5rem;} .noticenote-box .note-list ul .notesub p {position: relative; padding-left: 1.5rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 1.8rem; color: #6a6a6a; line-height: 1.5; letter-spacing: -0.06rem; word-break: keep-all;} .noticenote-box .note-list ul .notesub p:before {position: absolute; top: 0; left: 0; display: flex; content: "-"; font-size: 1.8rem;} .noticenote-box .note-list ul .notesub .img {padding-left: 1.5rem; margin: 1.5rem 0;} .noticenote-box .note-list ul .notesub:last-child {margin-bottom: 0;} /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 서브페이지 컨텐츠영역 03 - 대리운전 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 01 대리서비스 */ .page-driverbanner {padding-top: 12rem;} .driverbanner-box {display: flex; flex-wrap: wrap;} .driverbanner-box .bann-left {width: 50%;} .driverbanner-box .bann-right {width: 50%;} /* 02 어플서비스 */ .page-appservice {padding: 12rem 0; margin-top: 12rem; background-color: #f9f9f9;} .appslide-box {position: relative; margin: 0 auto; width: 100%; max-width: 135rem; margin-top: 10rem; z-index: 1;} .appslide-box .swiper {position: relative; width: 100%; height: 100%; padding: 5rem 0 10rem; overflow: hidden;} .appslide-box .swiper .swiper-slide {width: 21.9rem; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center;} .appslide-box .swiper .swiper-slide .app-box {position: relative; transition: all 300ms ease-out; transform: scale(1); opacity: 0.6;} .appslide-box .swiper .swiper-slide .app-box .app-img {position: relative; width: 100%; height: 100%; text-align: center;} .appslide-box .swiper .swiper-slide .app-box .app-img img {max-width: 100%;} .appslide-box .swiper .swiper-slide .app-box .app-stepinfo {opacity: 0; text-align: center; margin-top: 2rem; background-color: #bc2c2c;} .appslide-box .swiper .swiper-slide .app-box .app-stepinfo .number {float: left; width: 18%; height: 4rem; font-family: "Gmarket Sans", sans-serif; transform: rotate(-0.03deg); font-size: 1.6rem; color: #fff; font-weight: 700; line-height: 4.25rem; background-color: #2e2e2e;} .appslide-box .swiper .swiper-slide .app-box .app-stepinfo .tit {float: left; width: 82%; height: 4rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 1.7rem; color: #fff; line-height: 4.3rem; letter-spacing: -0.08rem; background-color: #bc2c2c;} /* 02 어플서비스 - 슬라이드 가운데 이동시 효과 적용 */ .appslide-box .swiper .swiper-slide-active .app-box {transform: scale(1.195); opacity: 1;} .appslide-box .swiper .swiper-slide-active .app-box .app-img img {width: 100%;} .appslide-box .swiper .swiper-slide-active .app-stepinfo {opacity: 1 !important;} /* 02 어플서비스 - 센터 모바일 프레임 */ .mobile-frame {position: absolute; width: 100%; max-width: 21.5556%; top: calc(50% - 1px); left: calc(50% - 1px); transform: translate(-50%,-60%); z-index: 3; text-align: center; overflow: hidden;} .mobile-frame .coverbox img {width: 100%;} /* 02 어플서비스 - 슬라이드 페이징 pagination */ .appslide-box .swiper .paging {position: absolute; bottom: 0; left: calc(50% - 1px); transform: translateX(-50%); width: 18rem; height: 2rem; overflow: hidden;} .appslide-box .swiper .swiper-pagination-bullet {width: 1.3rem !important; height: 1.3rem !important; display: inline-block; background: #dddddd !important; opacity: 1 !important; outline: none; transition: all 0.3s ease;} .appslide-box .swiper .swiper-pagination-bullet-active {width: 1.3rem !important; height: 1.3rem !important; background: #bc2c2c !important; border-radius: 50px; border: none;} .appslide-box .swiper .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {bottom: 0 !important;} .appslide-box .swiper .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 var(--swiper-pagination-bullet-horizontal-gap,5px) !important;} /* 02 어플서비스 - 슬라이드 button 스타일 적용 - button 외부빼기 */ .appslide-box .swiper .swiper-button-prev, .swiper-rtl .swiper-button-next {left: 0; width: auto; background: #fff url("../driver/images/app_prev.png") no-repeat !important; background-position: left top !important; top: initial; bottom: 0.1rem;} .appslide-box .swiper .swiper-button-next, .swiper-rtl .swiper-button-prev {right: 0; width: auto; background: #fff url("../driver/images/app_next.png") no-repeat !important; background-position: left top !important; top: initial; bottom: 0.1rem;} .appslide-box .swiper .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {display: none;} .appslide-box .swiper .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {display: none;} .appslide-box .swiper .appprev, .appslide-box .swiper .appnext {width: 0.8rem !important; height: 1.6rem !important; background-size: 0.8rem 1.6rem !important; z-index: 12 !important; outline: none;} /* 02_2 어플서비스 APP 다운로드 배너 */ .page-appbanner {width: 100%; height: 23rem; background-image: url("../driver/images/appbanner_bg.jpg"); background-repeat: no-repeat; background-position: center top; background-size: cover;} .app-download {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; height: 23rem;} .app-download .txtarea p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 4rem; color: #fff; line-height: 1.3; letter-spacing: -0.08rem;} .app-download .txtarea p span {display: block;} .app-download .txtarea p font {font-family: "Noto Sans KR", sans-serif; font-weight: 700;} .app-download .txtarea div.etc {width: 100%; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.3rem; color: #fcd6d2; line-height: 1; letter-spacing: -0.08rem; margin-top: 1.5rem;} .app-download .btnarea {display: flex; align-items: center;} .app-download .btnarea .logowhite {display: flex; margin-right: 3rem;} .app-download .btnarea .appbann-btn {display: flex;} .app-download .btnarea .appbann-btn .appbtn {width: 21.5rem; height: 6.5rem;} .app-download .btnarea .appbann-btn .appbtn:first-child {margin-right: 2rem;} .app-download .btnarea .appbann-btn .appbtn a {display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-family: "Saira", sans-serif; font-size: 2.2rem; color: #363636; font-weight: 500; line-height: 6.2rem; letter-spacing: -0.5px; text-align: center; background: #fff; border-radius: 1rem;} .app-download .btnarea .appbann-btn .appbtn a span {margin-left: 1.5rem;} .app-download .btnarea .appbann-btn .appbtn a:hover {text-decoration: underline;} /* 03 일일 & 의전기사 */ .page-protocoldriver {padding: 12rem;} .driver-contents {float: left; width: 100%;} .driver-list {display: flex; justify-content: space-between; width: 100%;} .driver-list .driver-type {width: 23.3334%;} .driver-list .driver-type figure {position: relative; padding: 0; margin: 0; border-radius: 1.4rem; overflow: hidden;} .driver-list .driver-type figure img {width: 100%; height: 100%; object-fit: cover; transform: scale(1); -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;} .driver-list .driver-type .infotxt {float: left; width: 100%; text-align: center; margin-top: 3rem;} .driver-list .driver-type .infotxt div.tit {font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #111; line-height: 1.3; letter-spacing: -0.08rem; } .driver-list .driver-type .infotxt div.tit span {display: block;} .driver-list .driver-type .infotxt p {display: inline-block; width: 100%; transform: rotate(-0.03deg); font-size: 1.9rem; color: #484747; font-weight: 400; line-height: 1.3; letter-spacing: -0.1rem; padding-top: 1.5rem;} .driver-list .driver-type .infotxt p span {display: block;} /* 04 법인대리운전 */ .page-corpordrive {padding: 12rem; background-color: #f2f7fa;} .corpordrive-list {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%;} .corpordrive-list .item-list {width: 30.37037037037037%;} .corpordrive-list .item-list figure {position: relative; padding: 0; margin: 0; border-radius: 2rem; overflow: hidden;} .corpordrive-list .item-list figure img {width: 100%;} .corpordrive-list .item-list .item-info {width: 100%; margin-top: 3rem;} .corpordrive-list .item-list .item-info .tit {font-family: "s-core-dream-heavy", sans-serif; transform: rotate(-0.03deg); font-size: 2.8rem; color: #f15922; letter-spacing: -0.1rem; line-height: 1;} .corpordrive-list .item-list .item-info .infotxt {width: 100%; margin-top: 2rem;} .corpordrive-list .item-list .item-info .infotxt ul li {position: relative; display: flex; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 1.8rem; color: #252525; letter-spacing: -0.1rem; padding-left: 1.5rem; margin-bottom: 0.5rem;} .corpordrive-list .item-list .item-info .infotxt ul li:before {position: absolute; top: 0.2rem; left: 0; display: flex; content: "-"; font-size: 1.8rem; vertical-align: top;} .corpordrive-list .item-list .item-info .infotxt ul li:last-child {margin-bottom: 0;} /* 04 법인대리운전 - 계약절차 */ .corpordrive-process {width: 100%; padding-top: 12rem;} .corpordrive-process ul {display: flex; justify-content: space-between; flex-wrap: wrap; padding-top: 7rem;} .corpordrive-process ul li {position: relative; width: 14.07407407407407%;} .corpordrive-process ul li:after {position: absolute; top: 31%; right: -3rem; content: ""; display: inline-block; width: 1.5rem; height: 2.4rem; background: url("../driver/images/corprocess_arrow.png") no-repeat center;} .corpordrive-process ul li:last-child:after {display: none;} .corpordrive-process ul li .listarea {position: relative; width: 100%; height: 0; padding-bottom: 100%; text-align: center; background-color: #fff; border: 2px solid #8fbbd5; border-radius: 50%; overflow: hidden;} .corpordrive-process ul li .listarea .box {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; flex-wrap: wrap; align-content: center;} .corpordrive-process ul li .listarea .box .step {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; width: 100%; height: 23.68421052631579%; font-family: "Saira", sans-serif; transform: rotate(-0.03deg); font-size: 2rem; color: #fff; font-weight: 700; padding-top: 1rem; background-color: #8fbbd5;} .corpordrive-process ul li .listarea .box .icoarea {display: inline-block; width: 100%; height: 76.31578947368421%;} .corpordrive-process ul li .listarea .box .icoarea i {display: inline-block; width: auto; height: 8rem; margin-top: 2.8rem;} .corpordrive-process ul li p.contxt {font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.2rem; color: #252525; line-height: 1.35; letter-spacing: -0.1rem; text-align: center; margin-top: 2.5rem;} .corpordrive-process ul li p.contxt span {display: block;} /* 06 기사서비스연구소 */ .page-edusystem {padding-top: 12rem;} .edusystem-contents {width: 100%;} .edusystem-contents .driver-common {display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom: 10rem;} .edusystem-contents .driver-common:last-child {margin-bottom: 0;} .edusystem-contents .driver-common .left-tit {width: 26.6667% /*360px*/;} .edusystem-contents .driver-common .left-tit p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 3.4rem; color: #111; line-height: 1; letter-spacing: -0.08rem;} .edusystem-contents .driver-common .left-tit p strong {font-family: "s-core-dream-heavy", sans-serif;} .edusystem-contents .driver-common .right-info {width: 69.25925925925926% /*935px*/;} /* 06 기사서비스연구소 - 1 기사 서비스 마인드 */ .driver-mind {width: 100%;} .driver-mind ul {display: flex; justify-content: space-between; flex-wrap: wrap;} .driver-mind ul li {width: 47.05882352941176%;} .driver-mind ul li:nth-of-type(-n+2) {margin-bottom: 5.5rem;} .driver-mind ul li figure {position: relative; padding: 0; margin: 0; border-radius: 1rem; overflow: hidden;} .driver-mind ul li figure img {width: 100%;} .driver-mind ul li .info {width: 100%; margin-bottom: 2.5rem;} .driver-mind ul li .info .tittxt {font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.6rem; color: #111; line-height: 1; letter-spacing: -0.08rem;} .driver-mind ul li .info p {transform: rotate(-0.03deg); font-size: 1.9rem; color: #484747; line-height: 1.3; letter-spacing: -0.1rem; margin-top: 1.5rem;} .driver-mind ul li .info p span {display: block;} /* 06 기사서비스연구소 - 2 기사 서비스교육 */ .driver-edc {width: 100%;} .driver-edc ul {display: flex; justify-content: space-between; flex-wrap: wrap;} .driver-edc ul li {width: 31.12299465240642%;} .driver-edc ul li figure {position: relative; padding: 0; margin: 0; border-radius: 1rem; overflow: hidden;} .driver-edc ul li figure img {width: 100%;} .driver-edc ul li .info {width: 100%; min-height: 24rem; margin-bottom: 2.5rem;} .driver-edc ul li .info .tittxt {font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.6rem; color: #111; line-height: 1; letter-spacing: -0.08rem;} .driver-edc ul li .info .infotxt {width: 100%; margin-top: 1.5rem;} .driver-edc ul li .info .infotxt ul li {position: relative; width: 100%; display: flex; transform: rotate(-0.03deg); font-size: 1.9rem; color: #484747; letter-spacing: -0.1rem; padding-left: 1rem;} .driver-edc ul li .info .infotxt ul li:before {position: absolute; top: 0.2rem; left: 0; display: flex; content: "-"; font-family: "Noto Sans KR", sans-serif; font-size: 1.7rem; font-weight: 500; vertical-align: top;} .driver-edc ul li .info .infotxt ul li:last-child {margin-bottom: 0;} /* 06 기사서비스연구소 - 3 기사 평가 및 관리 */ .driver-evalua {width: 100%;} .driver-evalua .box {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;} .driver-evalua .box .left-img {width: 47.05882352941176%;} .driver-evalua .box .left-img figure {position: relative; padding: 0; margin: 0; border-radius: 1rem; overflow: hidden;} .driver-evalua .box .left-img figure img {width: 100%;} .driver-evalua .box .right-box {width: 47.05882352941176%;} .driver-evalua .box .right-box .txt {width: 100%;} .driver-evalua .box .right-box .txt .number-txt {display: flex; flex-wrap: wrap; align-items: center; margin: 1.5rem 0;} .driver-evalua .box .right-box .txt .number-txt span {display: inline-flex; align-items: center; justify-content: center; width: 4.3rem; height: 4.3rem; padding-top: 0.3rem; font-family: "Gmarket Sans", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #fff; font-weight: 700; text-align: center; background-color: #d31820; border-radius: 0.5rem;} .driver-evalua .box .right-box .txt .number-txt p {display: inline-flex; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #111; line-height: 1.2; letter-spacing: -0.08rem; padding-left: 1.5rem;} /* 06 기사서비스연구소 - 4 기사 모집 */ .driver-recruitment {width: 100%;} .driver-recruitment p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #111; line-height: 1.3; letter-spacing: -0.08rem; } .driver-recruitment p span {display: block;} .employment-box .box {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-top: 4rem;} .employment-box .box .left-img {width: 47.05882352941176%;} .employment-box .box .left-img figure {position: relative; padding: 0; margin: 0; border-radius: 1rem; overflow: hidden;} .employment-box .box .left-img figure img {width: 100%;} .employment-box .box .employment-guide {width: 49.73262032085561%;} .employment-box .box .employment-guide ul li {width: 100%; margin-bottom: 2.5rem;} .employment-box .box .employment-guide ul li:last-child {margin-bottom: 0;} .employment-box .box .employment-guide ul li .tit {position: relative; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #111; line-height: 1.2; letter-spacing: -0.08rem; padding-left: 2rem;} .employment-box .box .employment-guide ul li .tit:before {position: absolute; top: 50%; left: 0; display: flex; transform: translateY(-50%); content: ""; width: 1.1rem; height: 1.1rem; background-color: #d31820;} .employment-box .box .employment-guide ul li .gudie-info {width: 100%; padding-left: 2rem; margin-top: 0.8rem;} .employment-box .box .employment-guide ul li .gudie-info p {position: relative; font-family: "Noto Sans KR", sans-serif; font-size: 1.9rem; color: #484747; font-weight: 400; line-height: 1.35; letter-spacing: -0.08rem; padding-left: 1.5rem;} .employment-box .box .employment-guide ul li .gudie-info p:before {position: absolute; top: 0.2rem; left: 0; display: flex; content: "-"; font-family: "Noto Sans KR", sans-serif; font-size: 1.7rem; font-weight: 500; vertical-align: top;} /* 07 법인 대리운전 요금 */ .page-corporfee {padding-top: 12rem;} .page-dailyfee {padding-top: 12rem; margin-bottom: 12rem;} .corporfee-box {width: 100%;} .corporfee-box2 {margin-top: 7rem;} .corporfee-box table.table-layout {width: 100%;} .corporfee-box table.table-layout tr:nth-child(even) {background-color: #f9f9f9;} .corporfee-box table.table-layout th {padding: 2rem; font-family: "s-core-dream-bold", sans-serif; font-size: 2.4rem; color: #fff; line-height: 1; letter-spacing: -0.1rem; background-color: #f15922; border-right: 1px solid #fd7f51;} .corporfee-box table.table-layout th:last-child {border-right: 0;} .corporfee-box table.table-layout td {text-align: left;; padding: 2rem; font-size: 1.8rem; color: #4a4a4a; font-weight: 500; line-height: 1.3; letter-spacing: -0.1rem; word-break: keep-all; border-right: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf;} .corporfee-box table.table-layout td:last-child {border-right: 0;} .corporfee-box table.table-layout td.price {text-align: center; font-size: 2.4rem; color: #ec5d07; font-weight: 700; background-color: #fef8f1;} /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 서브페이지 컨텐츠영역 04 - 고객후기 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ .page-solution .review-morearea {width: 100%; margin-bottom: 3rem;} .page-solution .review-morearea .shortcuts-box {display: flex; flex-wrap: wrap; align-items: center; padding-left: 63.5rem;} .page-solution .review-morearea .shortcuts-box .morebtn {position: relative; margin-right: 2rem; display: inline-block; width: auto; height: 4.8rem; text-align: left; padding: 0 2rem 0 3rem; background-color: #d31820; border-radius: 5.5rem; transition: all 0.6s ease;} .page-solution .review-morearea .shortcuts-box .morebtn span {display: inline-block; transform: rotate(-0.03deg); font-size: 1.8rem; color: #fff; font-weight: 500; letter-spacing: -0.06rem; line-height: 4.8rem;} .page-solution .review-morearea .shortcuts-box .morebtn i {display: inline-block; width: 2.5rem; height: 1rem; font-style: normal; margin-left: 1rem;} .page-solution .review-morearea .shortcuts-box .morebtn i img {vertical-align: 0.3rem;} .page-solution .review-morearea .shortcuts-box .blog {display: inline-block; width: 4.8rem; height: 4.8rem; margin-right: 2rem;} .page-solution .review-morearea .shortcuts-box .blog a {display: block; width: 100%; height: 100%; transition: all 0.35s ease;} .page-solution .review-morearea .shortcuts-box .blog img {width: 100%;} .page-solution .review-morearea .shortcuts-box .youtube {display: inline-block; width: 4.8rem; height: 4.8rem;} .page-solution .review-morearea .shortcuts-box .youtube a {display: block; width: 100%; height: 100%; transition: all 0.35s ease;} .page-solution .review-morearea .shortcuts-box .youtube img {width: 100%;} .page-solution .review-morearea .shortcuts-box .morebtn:hover {background-color: #f7941e;} .page-solution .review-morearea .shortcuts-box .blog a:hover {opacity: 0.4;} .page-solution .review-morearea .shortcuts-box .youtube a:hover {opacity: 0.4;} /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 서브페이지 컨텐츠영역 05 - 고객센터 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 02 자주묻는질문 */ #bo_cate {float: left; width: 100%; padding: 4rem 0; background: #f8fafc;} #bo_cate_ul {float: left; width: 100%; text-align: center;} #bo_cate_ul li {position: relative; display: inline-block; padding: 0 3rem;} #bo_cate_ul li a {position: relative; display: block; width: 100%; height: 100%; transform: rotate(-0.03deg); font-size: 3.6rem; color: #111; font-weight: 700; line-height: 1; letter-spacing: -0.08rem; transition: all 0.3s ease;} #bo_cate_ul li:after {position: absolute; right: 0; top: 50%; display: inline-block; content: ""; width: 1px; height: 1.5rem; background: #c6c6c6; transform: translateY(-50%);} #bo_cate_ul li:last-child:after {display: none;} #bo_cate #bo_cate_on {position: relative; color: #d31820;} #bo_cate #bo_cate_on:after {position: absolute; display: block; bottom: -2.1rem; left: 0; content: ""; width: 100%; height: 0.5rem; background: #d31820;} #bo_cate_ul li a:hover {color: #d31820;} #bo_cate_ul li a:hover:after {position: absolute; display: block; bottom: -2.1rem; left: 0; content: ""; width: 100%; height: 0.5rem; background: #d31820;} .boardsearch {margin-bottom: 5rem;} .boardsearch-wrap {display: inline-block; width: 100%; text-align: center; padding: 3rem 0; margin-top: 2rem; margin-bottom: 2rem; background-color: #fdf9f5;} .boardsearch-wrap .searchtype {position: relative; display: inline-block; width: 60rem;} .boardsearch-wrap .searchtype .searchbox {position: relative; width: 100%; display: flex; align-items: center; justify-content: flex-start; flex-direction: row;} .boardsearch-wrap .searchtype .searchbox select.formselect {float: left; width: 20rem; height: 6rem; font-family: 'Noto Sans KR',sans-serif; font-size: 1.7rem; color: #646464; font-weight: 400; letter-spacing: -0.06rem; padding-left: 3rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #d8d8d8; border-radius: 0; background: #fff url("../images/ico_select_arrow.png") no-repeat 93% 55%;} .boardsearch-wrap .searchtype .searchbox input.forminput {position: relative; width: 40rem; height: 6rem; font-size: 1.7rem; color: #646464; font-weight: 400; letter-spacing: -0.06rem; padding-left: 2rem; border: 1px solid #d8d8d8; border-left: 0;} .boardsearch-wrap .searchtype .searchbox input.forminput:focus {border: 1px solid #f25121; transition: border 0.5s ease;} .boardsearch-wrap .searchtype .searchbox input.btn-submit {position: absolute; top: 50%; right: 2rem; transform: translateY(-50%); width: 2.3rem; height: 2.3rem; font-size: 0; background-image: url("../customer/images/btn_search.png"); background-repeat: no-repeat; background-size: contain; background-position: center; background-color: transparent; cursor: pointer;} #slide-faqmenu {width: 100%;} #slide-faqmenu ul {width: 100%; height: 100%; border-top: 2px solid #f68c1f;} #slide-faqmenu ul li {width: 100%; background-color: #fff; border-bottom: 1px solid #dfd0bd; overflow: hidden; position: relative;} #slide-faqmenu ul li a {display: block; transform: rotate(-0.04deg); cursor: pointer;} #slide-faqmenu ul li.faq-item a {position: relative; display: block;} #slide-faqmenu ul li.faq-item a .faq-categoay {display: inline-block; width: 12%; font-size: 1.6rem; color: #f68c1f; font-weight: 500; letter-spacing: -0.06rem;} #slide-faqmenu ul li.faq-item a .faq-qico {display: block; float: left; width: 3.6rem; height: 3.6rem; font-family: "s-core-dream-heavy", sans-serif; font-size: 2rem; color: #fff; text-align: center; line-height: 3.8rem; margin-right: 2rem; background-color: #d31820; border-radius: 50px;} #slide-faqmenu ul li.faq-item a .faq-subject {display: inline-block; position: relative; width: 88%; font-size: 2rem; color: #3c3c3c; font-weight: 500; text-overflow: ellipsis; white-space: pre-line; overflow: hidden; vertical-align: 10px;} #slide-faqmenu ul li.faq-item .lotate-v {width: 2.2rem; height: 1.2rem; display: block;} #slide-faqmenu ul li.faq-item .lotate-v img {width: 100%; vertical-align: top;} #slide-faqmenu ul li.faq-item .lotate-v-180 {-ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg);} #slide-faqmenu ul li a .itemarea {display: flex; justify-content: space-between; align-items: center; width: 100%; height: 9rem; padding: 0 2rem;} #slide-faqmenu ul li ul.faqnav {background: #f6f6f6; border-top: 1px solid #dfd0bd; display: block; display: none;} #slide-faqmenu ul li ul.faqnav li {display: block; height: auto; font-family: "Noto Sans KR", sans-serif; padding: 3rem 4rem; background: #fdf9f4; border-bottom: 0;} #slide-faqmenu ul li ul.faqnav li .faq-aico {position: absolute; top: 3rem; left: 4rem; width: 3.6rem; height: 3.6rem; transform: rotate(-0.04deg); font-family: "s-core-dream-heavy", sans-serif; font-size: 2rem; color: #fff; line-height: 3.8rem; text-align: center; background-color: #07ae4d; border-radius: 50px; vertical-align: top;} #slide-faqmenu ul li ul.faqnav li p {display: block; width: 100%; transform: rotate(-0.04deg); font-size: 1.7rem; color: #000; font-weight: 300; letter-spacing: -0.06rem; word-break: break-all; padding-left: 6rem;} #slide-faqmenu ul li ul.faqnav li p span img {width: 100%;} #slide-faqmenu ul li ul.faqnav li .modifybtn {padding-left: 6rem;} #slide-faqmenu ul li ul.faqnav li .modifybtn a {display: block; width: 6rem; height: 3rem; font-size: 1.4rem; color: #2f2f2f; text-align: center; line-height: 2.8rem; padding: 0; margin-top: 1rem; background-color: #fff; border: 1px solid #ccc;} #slide-faqmenu ul li.active.faq-item a {cursor: pointer; background-color: #fbfaf9;} #slide-faqmenu ul li.active.faq-item a .faq-qico {background-color: #000;} #slide-faqmenu ul li.active.faq-item a .faq-subject {color: #000; font-weight: 700;} /* 03 보험보상 */ .page-inscoverage {width: 100%; padding-top: 12rem;} .inscoverage-top {width: 100%;} .inscoverage-top img {width: 100%;} .page-insprocess {width: 100%; padding: 12rem;} .insprocess-list {width: 100%;} .insprocess-list ul {display: flex; flex-wrap: wrap; justify-content: space-between;} .insprocess-list ul li {position: relative; width: 22.07407407407407%;} .insprocess-list ul li:after {position: absolute; top: 50%; right: -14%; transform: translateY(-50%); content: ""; display: inline-block; width: 2.8rem; height: 2.8rem; background: url("../customer/images/insprocess_arrow.png") no-repeat; background-size: 2.8rem 2.8rem;} .insprocess-list ul li:last-child:after {display: none;} .insprocess-list ul li .circel-box {position: relative; display: flex; flex-wrap: wrap; width: 100%; height: 0; padding-bottom: 100%; text-align: center; background-color: #fff; border: 1px solid #e8e7e7; border-radius: 50%; box-shadow: 5px 5px 16px rgba(0,0,0,0.08); overflow: hidden;} .insprocess-list ul li .circel-box .cbox {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%;} .insprocess-list ul li .circel-box .cbox i {display: inline-block; width: auto; height: 9.5rem;} .insprocess-list ul li .circel-box .cbox i.fine {display: inline-block; width: auto; height: 11rem;} .insprocess-list ul li .circel-box .cbox p {width: 100%; font-family: "s-core-dream-bold", sans-serif; font-size: 2.4rem; color: #252525; line-height: 1; letter-spacing: -0.15rem; margin-top: 3rem;} .page-accident {width: 100%; padding: 12rem; background-color: #f6f6f6;} .accident-box {width: 100%;} .accident-box table.table-layout {width: 100%;} .accident-box table.table-layout th {padding: 2rem; font-family: "s-core-dream-bold", sans-serif; font-size: 2.4rem; color: #fff; line-height: 1; letter-spacing: -0.1rem; background-color: #f15922; border-right: 1px solid #fd7f51;} .accident-box table.table-layout th:last-child {border-right: 0;} .accident-box table.table-layout td {background-color: #fff; text-align: center;; padding: 2rem; font-size: 2.4rem; color: #4a4a4a; font-weight: 500; line-height: 1.3; letter-spacing: -0.1rem; word-break: keep-all; border-right: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf;} .accident-box table.table-layout td:last-child {border-right: 0;} .accident-box table.table-layout td.item {text-align: center; font-size: 2.4rem; color: #ec5d07; font-weight: 700; background-color: #fceee0;} /* 03 보험보상 - 보험보상 세부내역 신규 추가 */ .accident-box .insure-detail {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; margin-top: 8rem; margin-bottom: 8rem;} .accident-box .insure-detail .left-tit {width: 26.6667% /*360px*/;} .accident-box .insure-detail .left-tit p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 3.4rem; color: #111; line-height: 1; letter-spacing: -0.08rem;} .accident-box .insure-detail .right-insurelist {width: 69.25925925925926% /*935px*/;} .accident-box .insure-detail .right-insurelist ul {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%;} .accident-box .insure-detail .right-insurelist ul li {width: 48%;} .accident-box .insure-detail .right-insurelist ul li div.tit {font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.6rem; color: #111; letter-spacing: -0.08rem;} .accident-box .insure-detail .right-insurelist ul li div.tit span {display: inline-block; line-height: 1; width: auto; padding: 1.5rem 3rem 1rem; background-color: #fff; border: 1px solid #111; border-radius: 5.8rem;} .accident-box .insure-detail .right-insurelist ul li .info {width: 100%; margin-top: 2rem;} .accident-box .insure-detail .right-insurelist ul li .info p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2rem; color: #484747; line-height: 1; letter-spacing: -0.08rem; padding-left: 2rem; margin: 1rem 0;} .accident-box .etc-list {width: 100%; margin-top: 4rem;} .accident-box .etc-list p {position: relative; padding-left: 3.8rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #111; line-height: 1.2; letter-spacing: -0.08rem; margin-bottom: 1rem;} .accident-box .etc-list p:after {position: absolute; top: 0; left: 0; content: ""; width: 2.8rem; height: 2.7rem; background-image: url("../customer/images/check_ico.png"); background-repeat: no-repeat; background-position: left top; background-size: 2.8rem 2.7rem;} .insurance-type {display: flex; justify-content: center; width: 100%; text-align: center; margin-top: 5rem;} .insurance-type .safety-logo {display: flex; align-items: center; justify-content: center; flex-wrap: wrap; width: 32.2rem; height: 9.4rem; text-align: center; background-color: #fff; border-radius: 2rem; border: 1px solid #e2e2e2; box-shadow: 5px 5px 16px rgba(0,0,0,0.08);} .insurance-type .safety-logo:first-child {margin-right: 3rem;} .insurance-type .safety-logo img {max-width: 100%;} /* 04 제주선박안내 */ .shipcompany-title {width: 100%; padding-top: 12rem; margin-bottom: 7rem;} .shipcompany-title .inner {margin: 0 auto; width: 100%; max-width: 135rem; text-align: center;} .shipcompany-title h3 {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 4rem; color: #111; line-height: 1.2; letter-spacing: -0.1rem;} .shipcompany-title h3 strong {font-family: "s-core-dream-heavy", sans-serif;} /* 05 고객서비스연구소 신규 추가 */ .page-servicelab {width: 100%; padding-top: 12rem;} .page-servicelab .page-title p {line-height: 1.4 !important;} .page-servicelab .page-title p span {display: block;} .page-carcare {width: 100%; padding: 12rem 0; margin-top: 12rem; background-color: #f6f6f6;} .carcare-box {width: 100%;} .carcare-box ul {display: flex; justify-content: space-between; flex-wrap: wrap;} .carcare-box ul li {width: 31.25925925925926%;} .carcare-box ul li .box {width: 100%; height: 100%; padding: 5rem 3rem 4rem; text-align: center; background-color: #fff; border: 1px solid #d7d7d7;} .carcare-box ul li .box h4 {height: 7rem; font-family: "s-core-dream-extrabold", sans-serif; transform: rotate(-0.03deg); font-size: 2.8rem; color: #f15922; letter-spacing: -0.1rem; line-height: 1.3; margin-bottom: 3rem;} .carcare-box ul li .box h4 span {display: block;} .carcare-box ul li .box i {display: inline-block; width: auto;} .carcare-box ul li .box i img {max-width: 100%;} .carcare-box ul li .box .info-txt {text-align: left; margin-top: 3rem;} .carcare-box ul li .box .info-txt p {transform: rotate(-0.03deg); font-size: 1.8rem; color: #2e2e2d; font-weight: 400; line-height: 1.4; letter-spacing: -0.08rem; text-indent: -1.8rem; word-break: keep-all; padding-left: 1.8rem; margin: 1rem 0;} .safeoper-list {width: 100%;} .safeoper-list ul {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%;} .safeoper-list ul li {width: 48%;} .safeoper-list ul li:nth-child(-n+6) {margin-bottom: 7rem;} .safeoper-list ul li .item-box {width: 100%;} .safeoper-list ul li .item-box h4 {font-family: "s-core-dream-heavy", sans-serif; transform: rotate(-0.03deg); font-size: 3rem; color: #f15922; letter-spacing: -0.1rem; line-height: 1.3; margin-bottom: 2rem;} .safeoper-list ul li .item-box p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2rem; color: #252525; line-height: 1.4; letter-spacing: -0.1rem; margin-bottom: 4rem;} .safeoper-list ul li .item-box p span {display: block;} .safeoper-list ul li .item-box figure {padding: 0; margin: 0; border-radius: 1.4rem; overflow: hidden;} .safeoper-list ul li .item-box figure img {width: 100%;} /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 서브페이지 컨텐츠영역 06 - 회사소개 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 01 회사소개 - 공통 타이틀 */ .introduce-title {width: 100%; text-align: center;} .introduce-title h3 {font-weight: normal; display: inline-flex; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 5rem; color: #373737; letter-spacing: -0.15rem; word-break: keep-all; border-bottom: 2px solid #cdcdcd;} .introduce-title h3 strong {font-family: "s-core-dream-heavy", sans-serif;} .introduce-title h3 span {position: relative; display: inline-flex; padding-bottom: 1rem;} .introduce-title h3 span:after {position: absolute; bottom: -2px; left: 0; content: ""; width: 100%; height: 4px; background-color: #d31820;} .introduce-title p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.7rem; color: #373737; line-height: 1.3; letter-spacing: -0.08rem; word-break: keep-all; margin-top: 1.5rem;} /* 01 회사소개 */ .page-introduce {width: 100%; padding: 5rem 0 12rem;} .page-introduce .page-wrap {margin-top: 0 !important;} .greeting-box {width: 100%; text-align: left;} .greeting-box .topimg {width: 100%; margin-bottom: 5rem;} .greeting-box .topimg img {max-width: 100%;} .greeting-box p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #373737; line-height: 1.5; letter-spacing: -0.08rem; word-break: keep-all;} .greeting-box p font {font-family: "s-core-dream-heavy", sans-serif;} .page-network {width: 100%; padding: 12rem 0; background-color: #f9f9f9;} .network-box {width: 100%; text-align: center;} .network-box .con-img {width: auto;} .network-box .con-img img {max-width: 100%;} .page-organization {width: 100%; padding: 12rem 0;} .organization-box {width: 100%; text-align: center;} .organization-box .con-box {width: 100%; padding: 12rem 0; border: 2px solid #d4d2d2;} .organization-box .con-box .con-img img {max-width: 100%;} /* 02 경영비전 */ .page-target {width: 100%; padding: 12rem 0; background-color: #f9f9f9;} .target-box {width: 100%;} .target-box .target-list {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%;} .target-box .target-list .targetitem {width: 30.37037037037037%; text-align: left;} .target-box .target-list .targetitem figure {position: relative; padding: 0; margin: 0; border-radius: 2rem; overflow: hidden;} .target-box .target-list .targetitem figure img {width: 100%;} .target-box .target-list .targetitem p {margin-bottom: 3rem; font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.5rem; color: #363636; line-height: 1.2; letter-spacing: -0.08rem; word-break: keep-all;} .page-values {width: 100%; padding: 12rem 0;} .values-box {width: 100%;} .values-box .values-list {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%;} .values-box .values-list .valuesitem {width: 20%; border-top: 1px solid #dfdede;} .values-box .values-list .valuesitem:first-child {border-left: 1px solid #dfdede;} .values-box .values-list .valuesitem .box {display: flex; justify-content: center; align-content: center /*세로2줄이상시사용*/; flex-wrap: wrap; width: 100%; height: 100%; min-height: 42rem; text-align: center; padding: 0 5rem; border-right: 1px solid #dfdede; border-bottom: 1px solid #dfdede;} .values-box .values-list .valuesitem .box i {display: flex; width: 15rem; height: 15rem;} .values-box .values-list .valuesitem .box i img {max-width: 100%;} .values-box .values-list .valuesitem .box div.tit {display: flex; /*justify-content: center;*/ width: 100%; text-align: left; font-family: "s-core-dream-heavy", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #f9582a; line-height: 1; letter-spacing: -0.08rem; margin: 3rem 0 2rem;} .values-box .values-list .valuesitem .box p {text-align: left; transform: rotate(-0.03deg); font-size: 1.7rem; color: #252525; font-weight: 400; line-height: 1.3; letter-spacing: -0.15rem; word-break: keep-all;} .page-rule {width: 100%; padding: 12rem 0; background-color: #f9f9f9;} .rule-list {width: 100%;} .rule-list .ruleitem {width: 100%; margin-bottom: 5rem;} .rule-list .ruleitem:last-child {margin-bottom: 0;} .rule-list .ruleitem .box {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%;} .rule-list .ruleitem .box .left-img {width: 37.03703703703704%;} .rule-list .ruleitem .box .left-img figure {position: relative; padding: 0; margin: 0; border-radius: 2rem; overflow: hidden;} .rule-list .ruleitem .box .left-img figure img {width: 100%;} .rule-list .ruleitem .box .right-info {width: 57.03703703703704%;} .rule-list .ruleitem .box .right-info .txt-box {width: 100%; height: 100%; display: flex; align-content: center; flex-wrap: wrap;} .rule-list .ruleitem .box .right-info .txt-box .tittxt {display: inline-flex; align-items: center; flex-wrap: wrap; width: 100%; font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 3rem; color: #111; line-height: 1; letter-spacing: -0.08rem; word-break: keep-all;} .rule-list .ruleitem .box .right-info .txt-box .tittxt span {display: inline-flex; align-items: center; justify-content: center; padding-top: 0.2rem; width: 3.9rem; height: 3.9rem; font-family: "Gmarket Sans", sans-serif; transform: rotate(-0.03deg); font-size: 2.2rem; color: #fff; font-weight: 700; text-align: center; margin-right: 1.5rem; background-color: #d31820; border-radius: 0.5rem;} .rule-list .ruleitem .box .right-info .txt-box ul {width: 100%; margin-top: 3rem;} .rule-list .ruleitem .box .right-info .txt-box ul li {position: relative; display: flex; width: 100%; padding-left: 1.5rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.1rem; color: #484747; line-height: 1.5; letter-spacing: -0.08rem; word-break: keep-all;} .rule-list .ruleitem .box .right-info .txt-box ul li:before {position: absolute; top: 0; left: 0; display: flex; content: "-"; font-family: "Noto Sans KR", sans-serif; font-size: 2rem; font-weight: 700; vertical-align: top;} /* 03 연혁 */ .page-history {width: 100%; padding: 5rem 0 12rem;} .page-history .page-wrap {margin-top: 0 !important;} .history-box {width: 100%; margin-bottom: 7rem;} .history-box .topimg {width: 100%; margin-bottom: 5rem;} .history-box .topimg img {max-width: 100%;} .subpage-common .page-common .page-wrap2 {margin-top: 3rem;} .history-tit {width: 100%; text-align: center;} .history-tit span {display: inline-block; width: auto; height: 6rem; padding: 0 5rem; font-family: "Saira", sans-serif; transform: rotate(-0.03deg); font-size: 2.4rem; color: #acacac; font-weight: 600; letter-spacing: -0.08rem; line-height: 5.9rem; background-color: #fff; border: 2px solid #cac9c9; border-radius: 5rem;} .history-content {position: relative; float: left; width: 100%;} .history-content:before {position: absolute; top: 0; left: 50%; content: ""; width: 1px; height: 100%; background-color: #ccc;} .history-content .list-box {position: relative; float: left; width: 100%; padding-top: 10rem;} .history-content .list-box:first-child {padding-top: 7rem;} .history-content .list-box .year {position: relative; float: left; width: 50%; text-align: right; padding-right: 17rem;} .history-content .list-box .year:before {position: absolute; top: 50%; right: -0.6rem; transform: translateY(-48%); content: ""; width: 1.2rem; height: 1.2rem; background: #b2b2b2; border-radius: 100%;} .history-content .list-box .year span {font-family: "Saira", sans-serif; transform: rotate(-0.03deg); font-size: 4rem; color: #fb5a30; font-weight: 700; line-height: 1;} .history-content .list-box .year:after {position: absolute; top: 50%; right: 0; content: ""; width: 15rem; height: 1px; background: #b2b2b2;} .history-content .list-box .time-con {float: right; width: 50%; text-align: left; padding-top: 0.7rem; padding-left: 5rem;} .history-content .list-box .time-con dl {position: relative; display: flex; align-items: center; flex-wrap: wrap; width: 100%; transform: rotate(-0.03deg); margin-bottom: 1.5rem;} .history-content .list-box .time-con dl dt {float: left; text-align: left; width: 8.5rem; font-family: "s-core-dream-medium", sans-serif; font-size: 2.2rem; color: #111111; letter-spacing: -0.06rem; line-height: 1.3;} .history-content .list-box .time-con dl dd {float: left; width: 80%; font-family: "s-core-dream-medium", sans-serif; font-size: 1.9rem; color: #606060; letter-spacing: -0.06rem; line-height: 1.3; word-break: keep-all;} /* 연혁 짝수년도 왼쪽 위치 재정렬 */ .history-content .list-box:nth-of-type(even) .year {float: right; text-align: left; padding-left: 17rem; padding-right: 0;} .history-content .list-box:nth-of-type(even) .year:before {left: -0.6rem;} .history-content .list-box:nth-of-type(even) .year:after {left: 0;} .history-content .list-box:nth-of-type(even) .time-con {float: left; text-align: right; padding-left: 0; padding-right: 6rem;} .history-content .list-box:nth-of-type(even) .time-con dl dt {order: 2; text-align: right;} .history-content .list-box:nth-of-type(even) .time-con dl dd {order: 1;} /* 04 오시는길 */ .page-location {width: 100%; padding: 5rem 0 12rem;} .page-location .page-wrap {margin-top: 0 !important;} .location-box {width: 100%;} .location-box .map-canvas {position: relative; display: flex; width: 100%; height: 55rem; border: 1px solid #ddd; overflow: hidden;} .location-box .map-canvas img {position: absolute; top: 0; left: 50%; transform: translateX(-50%);} .location-box .map-info {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; width: 100%; margin-top: 5rem;} .location-box .map-info .left-contents {display: flex; align-items: center; flex-wrap: wrap;} .location-box .map-info .left-contents .callcenter {display: flex; align-content: center; flex-wrap: wrap; text-align: center; width: 31.7rem; height: 13rem; background: -webkit-linear-gradient(left, #ed1c24 0%, #f7941e 100%); background: -moz-linear-gradient(left, #ed1c24 0%, #f7941e 100%); background: linear-gradient(to right, #ed1c24 0%, #f7941e 100%); border-radius: 1rem;} .location-box .map-info .left-contents .callcenter p {width: 100%; font-family: "s-core-dream-medium", sans-serif; font-size: 1.9rem; color: #fff; letter-spacing: -0.06rem; line-height: 1; padding-top: 0.5rem;} .location-box .map-info .left-contents .callcenter .callnumber {width: 100%; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;} .location-box .map-info .left-contents .callcenter .callnumber i {display: inline-block; width: 4.2rem; height: 4.2rem; margin-right: 1.8rem;} .location-box .map-info .left-contents .callcenter .callnumber span {display: inline-block; font-family: "Saira", sans-serif; transform: rotate(-0.03deg); font-size: 3.7rem; color: #fff; font-weight: 700;} .location-box .map-info .left-contents .address {display: inline-block; padding-left: 3rem;} .location-box .map-info .left-contents .address .txtarea {display: flex; align-items: center; transform: rotate(-0.03deg); font-size: 2rem; color: #252525; font-weight: 500; letter-spacing: -0.1rem; margin-bottom: 1rem;} .location-box .map-info .left-contents .address .txtarea span.tit {display: inline-block; margin-right: 1rem; width: 6rem; height: 3rem; font-size: 1.6rem; color: #fff; font-weight: 700; text-align: center; line-height: 2.9rem; background-color: #f78d22; border-radius: 0.5rem;} .location-box .map-info .left-contents .address p {display: flex; align-items: center; padding-left: 7rem; transform: rotate(-0.03deg); font-size: 2rem; color: #111; font-weight: 400; letter-spacing: -0.08rem; line-height: 1.2;} .location-box .map-info .left-contents .address p strong {margin-right: 1.5rem;} .location-box .map-info .left-contents .address p span {display: flex; justify-content: center; align-items: center; margin-right: 1rem; width: 2.7rem; height: 2.7rem; text-align: center; font-size: 1.6rem; color: #fff; font-weight: 700; background-color: #833edb; border-radius: 100%;} .location-box .map-info .mapbtn a {display: inline-block; width: 17.2rem; height: 7rem; text-align: center; transform: rotate(-0.03deg); font-size: 1.8rem; color: #fff; font-weight: 500; letter-spacing: -0.08rem; line-height: 7rem; transition: all 0.3s ease;} .location-box .map-info .mapbtn a.naver {background-color: #41c72a; border: 1px solid #41c72a; margin-right: 1.5rem;} .location-box .map-info .mapbtn a.google {background-color: #f78d22; border: 1px solid #f78d22;} /* 04 오시는길 - 마우스 롤오버 효과 적용 */ .location-box .map-info .mapbtn a.naver:hover {color: #41c72a; background-color: #fff; border: 1px solid #41c72a;} .location-box .map-info .mapbtn a.google:hover {color: #f78d22; background-color: #fff; border: 1px solid #f78d22;} /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 서브페이지 컨텐츠영역 07 - 예약하기 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 01 예약하기 - 예약간편접수 추가 */ .reservation-process-re ul li:after {top: 48%;} .reservation-process-re .re-guide-title {width: 100%; margin-top: 6rem; margin-bottom: 3rem;} .reservation-process-re .re-guide-title p {font-family: "s-core-dream-bold", sans-serif; font-size: 3.6rem; letter-spacing: -0.02rem; text-align: left;} .reservation-process-re .re-guide-title p.guide-txt1 {color: #f95925; margin-bottom: 2rem;} .reservation-process-re .re-guide-title p.guide-txt2 {color: #ff1827;} /* 01 예약하기 */ .page-reservation {position: relative; width: 100%; padding: 5rem 0 12rem;} .reservation-form {position: relative; width: 100%;} .form-box {width: 100%; margin-bottom: 8rem;} .form-listbox {margin-bottom: 5rem;} .form-box .form-title {display: flex; align-items: center; flex-wrap: wrap; width: 100%; margin-bottom: 2rem;} .form-box .form-title h3 {font-weight: normal; display: inline-block; font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 3rem; color: #111; line-height: 1; letter-spacing: -0.08rem;} .form-box .form-title h3 span {font-family: "Gmarket Sans", sans-serif; transform: rotate(-0.03deg); font-size: 3.2rem; color: #252525; font-weight: 700; vertical-align: 0.1rem;} .form-box .form-title p {display: inline-block; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.2rem; color: #252525; font-weight: 500; line-height: 1; letter-spacing: -0.1rem; padding-left: 2rem; margin-top: -0.2rem;} .form-box .form-title p font {font-family: "Noto Sans KR", sans-serif;} /* 01 예약하기 - 테이블 스타일 */ .form-box .form-table {width: 100%;} .form-box .form-table .table-layout {width: 100%; word-break: keep-all; word-break: keep-all; border-top: 2px solid #252525;} .form-box .form-table .table-layout th {position: relative; font-family: "s-core-dream-bold", sans-serif; font-size: 2rem; color: #333333; letter-spacing: -0.06rem; text-align: left; padding: 1.5rem 2rem 1.5rem 4rem; background: #f6f6f6; border-bottom: 1px solid #d9d9d9;} .form-box .form-table .table-layout th font {font-family: "Noto Sans KR", sans-serif;} .form-box .form-table .table-layout th:before {display: inline-block; content: "*"; font-size: 2rem; color: red; margin-right: 1rem; vertical-align: top;} .form-box .form-table .table-layout th p {display: inline-block; transform: rotate(-0.03deg); font-size: 2rem; color: #333333; letter-spacing: -0.06rem; text-align: left; word-break: keep-all;} .form-box .form-table .table-layout td {height: 8rem; font-size: 2rem; color: #333333; font-weight: 500; letter-spacing: -0.06rem; word-break: keep-all; text-align: left; padding: 1.5rem 2rem; border-bottom: 1px solid #eee;} .form-box .form-table .table-layout td .linebreak {display: inline-block; margin-top: 0.5rem; margin-right: 2.5rem; vertical-align: top;} .form-box .form-table .table-layout td .linebreak2 {display: block;} .form-box .form-table .table-layout td .linebreak3 {display: block; padding: 1rem 0;border-bottom: 1px dashed #ddd;} .form-box .form-table .table-layout td .linebreak3 .td-tit {font-size: 2rem; color: #333333; font-weight: 700; letter-spacing: -0.06rem; margin-bottom: 0.5rem;} .form-box .form-table .table-layout td .linebreak3:last-child {margin-bottom: 0; border-bottom: 0;} .form-box .form-table .table-layout td .linebreak-sub {display: inline-block; margin-top: 0.5rem; margin-right: 2.5rem; vertical-align: top;} .form-box .form-table .table-layout td p {display: inline-block; font-size: 2rem; color: #333333; font-weight: 400; letter-spacing: -0.08rem; line-height: 1;} /* 01 예약하기 - 인풋, 셀렉트박스 속성 설정 */ .form-box .form-table .table-layout td input.style-radio {width: 2rem; height: 2rem; margin-right: 0.5rem; vertical-align: 0.2rem;} .form-box .form-table .table-layout td input.style-input {width: 40rem; height: 5rem; font-size: 1.8rem; color: #474646; font-weight: 400; padding-left: 2rem; border: 1px solid #dededf; border-radius: 0.6rem;} .form-box .form-table .table-layout td input.style-input-code {width: 12rem; margin-right: 1rem;} .form-box .form-table .table-layout td input.style-input-arrdess {width: 50rem;} .form-box .form-table .table-layout td input.style-input-addr {width: 77rem; margin-top: 0.5rem;} .form-box .form-table .table-layout td input.style-input-phone {width: 50rem;} .form-box .form-table .table-layout td input.style-input-calendar {margin-right: 3rem; background: url("../reservation/images/form_ico_calendar.svg") no-repeat 100% 50%; background-position: right 2rem center;} .form-box .form-table .table-layout td label {cursor: pointer; font-size: 2rem; color: #333333; font-weight: 500; letter-spacing: -0.08rem; line-height: 1; vertical-align: top;} /* 01 예약하기 - 우편번호 타이틀 없애기, 주소검색 버튼 스타일 설정 */ .msg_sound_only, .sound_only {display: inline-block !important; position: absolute; top: 0; left: 0; margin: 0 !important; padding: 0 !important; font-size: 0 !important; line-height: 0; border: 0 !important; overflow: hidden !important;} .form-box .form-table .table-layout td button.address-search {display: inline-block; padding: 0 2rem; margin-right: 1rem; height: 5rem; border: 0; background: #333; font-size: 1.6rem; color: #fff; letter-spacing: -0.1rem; background: #706f6f; border-radius: 0.6rem;} /* 01 예약하기 - 인풋 속성 - 마우스 포커싱 스타일 설정 */ .form-box .form-table .table-layout td input:focus {border: 1px solid #d31920; box-shadow: 1px 1px 10px rgba(211,25,32,0.10); transition: border 0.6s ease; outline: none;} /* 01 예약하기 - placeholder 속성 설정 */ .form-box .form-table .table-layout td input::-webkit-input-placeholder {color: #9b9b9b} .form-box .form-table .table-layout td input::-moz-placeholder {color: #9b9b9b} .form-box .form-table .table-layout td input:-ms-input-placeholder {color: #9b9b9b} .form-box .form-table .table-layout td input::placeholder {color: #9b9b9b} /* 01 예약하기 - 미니 달력 스타일 적용 */ .ui-datepicker {width: 25rem !important; border-radius: 5px !important; padding: 1rem !important; border: 1px solid #e1e1e1 !important;} .ui-widget-header {padding: 0.5rem 0 !important; background: #f9f9f9 !important; border: 1px solid #e6e5e5 !important;} .ui-datepicker .ui-datepicker-title {margin: 0 3rem !important;} .ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {height: 2.2rem !important; font-size: 1.3rem !important; border: 1px solid #c1c1c1 !important;} /*상단년도 셀렉트박스 스타일*/ .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {top: 18.5% !important; width: 2rem !important; height: 2rem !important;} .ui-datepicker .ui-datepicker-prev {left: 0.5rem !important; border: 0 !important;} .ui-datepicker .ui-datepicker-next {right: 0.5rem !important; border: 0 !important;} .ui-icon {width: 2rem !important; height: 2rem !important;} /*상단년도 좌우 넘기기 화살표 아이콘 스타일*/ .ui-icon-circle-triangle-w {background: url("../reservation/images/year_prev.svg") no-repeat left top !important;} .ui-icon-circle-triangle-e {background: url("../reservation/images/year_right.svg") no-repeat right top !important;} .ui-datepicker th {font-size: 1.4rem !important;} .ui-datepicker td span, .ui-datepicker td a {font-size: 1.3rem !important; text-align: center !important; padding: 0.2rem !important;} .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {background: #f9f9f9 !important; border: 1px solid #f9f9f9 !important;} .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {color: #f28922 !important; border: 1px solid #f28922 !important;} .ui-state-focus {border: 0 !important;} .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {color: #fff !important; background: #f28922 !important; border: 1px solid #f28922 !important;} .ui-datepicker .ui-datepicker-buttonpane button {font-family: "Noto Sans KR", sans-serif !important; transform: rotate(-0.03deg); font-size: 1.3rem !important; padding: 0.5rem 1rem !important; background: #f9f9f9 !important; border: 1px solid #ebebeb !important;} .ui-widget-header .ui-datepicker-prev-hover, .ui-widget-header .ui-datepicker-next-hover {border: 0 !important;} .ui-widget-header .ui-state-hover {background: none !important; border: 0 !important;} /* 개인정보 활용 동의 */ .privacy-agreement {width: 100%; text-align: center;} .privacy-check {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; margin-bottom: 2rem;} .privacy-check .checkbox-input {display: inline-block; width: 2.4rem; height: 2.4rem; background: #fff; border: 1px solid #b2b2b2; vertical-align: top;} .privacy-check .checkbox-input+label {display: inline-block; width: auto; transform: rotate(-0.03deg); font-size: 1.8rem; font-weight: 500; color: #303030; line-height: 1; word-break: keep-all; padding-left: 1rem; position: relative; vertical-align: top;} .pop-form button {display: inline-block; height: 2rem; padding: 0 1.5rem; transform: rotate(-0.03deg); font-size: 1.8rem; font-weight: 400; color: #303030; line-height: 1.2; background: #fff; position: relative; border: 0; outline: none; text-decoration: underline;} /* 개인정보동의 레이어팝업 layerpop */ .layerpop-pree {position: fixed !important; overflow: hidden; width: 100%; height: 100%; background: rgba(0,0,0,0.8); top: 0 !important; left: 0 !important; z-index: 1000000000; display: none;} .layerpop-box {position: absolute; width: 100%; height: auto; top: 0; left: 0;} .popup-contents {position: fixed; box-sizing: border-box; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; max-width: 80rem; border: 1px solid #000;} .popup-contents .button-area {bottom: 0; width: 100%; padding-bottom: 1rem; background: #fff; border-top: 1px solid #3d3d3d;} .popup-contents button {display: block; margin: 15px auto; width: 20rem; height: 5rem; font-size: 1.8rem; color: #777; line-height: 4rem; background: #fff; border: 2px solid #383838; outline: none;} .popup-contents button:hover {color: #fff; background: #d31820; border: 1px solid #d31820;} .privacy-wrap {border: 1px solid #ccc; font-size: 1.55rem; color: #464646; font-weight: 400; line-height: 1.5; letter-spacing: -0.1rem; text-align: left; padding: 2rem; height: 40rem; overflow: auto; background: #fff;} .privacy-wrap h5 {width: 100%; font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 2.2rem; color: #fff; font-weight: 700; letter-spacing: -0.1rem; text-align: center; padding: 1rem 0 0.7rem; margin-bottom: 1rem; background: #ed6e01;} .privacy-wrap strong {display: block; font-family: "s-core-dream-bold", sans-serif; transform: rotate(-0.03deg); font-size: 1.7rem; color: #111; padding: 2rem 0 0.4rem 0; font-weight: 500; letter-spacing: -0.1rem;} .privacy-wrap .poptxt {float: left; width: 100%; margin-top: 1.5rem;} /* 01 예약하기 - 접수신청 버튼 영역 */ .appcarecep-box {width: 100%; text-align: center;} .appcarecep-box p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.5rem; color: #252525; line-height: 1.2; letter-spacing: -0.05rem; word-break: keep-all; margin-top: 2.8rem;} .appcarecep-box .btn-appcarecep {width: 100%; text-align: center; margin-top: 2rem;} .appcarecep-box .btn-appcarecep a {position: relative; display: inline-block; width: 29.4rem; height: 7rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.8rem; color: #fff; text-align: left; line-height: 7.2rem; padding-left: 4.5rem; background-color: #d31820; border-radius: 1rem; transition: all 0.35s ease;} .appcarecep-box .btn-appcarecep a i {position: absolute; right: 13%; top: 50%; transform: translateY(-50%); width: 1.1rem; height: 1.9rem; font-style: normal;} .appcarecep-box .btn-appcarecep a:hover {background-color: #f7941e;} /* 02 예약조회 */ .page-reservationcheck {width: 100%; padding: 5rem 0 12rem;} .reservationcheck-box {width: 100%; padding: 0 30rem; text-align: center;} .subpage-common .page-common .page-title .recheck-guide-title {width: 100%; margin-top: 4rem; margin-bottom: 3rem;} .subpage-common .page-common .page-title .recheck-guide-title p {font-family: "s-core-dream-bold", sans-serif; font-size: 2.8rem; letter-spacing: -0.02rem; text-align: center;} .subpage-common .page-common .page-title .recheck-guide-title p.guide-txt1 {color: #111; margin-top: 0;} .subpage-common .page-common .page-title .recheck-guide-title p.guide-txt2 {font-family: "Noto Sans KR", sans-serif !important; font-size: 2.6rem; color: #ff1827; font-weight: 700; margin-top: 1.5rem;} /* 02 예약조회 - 인풋, 버튼 속성 설정 */ .reservationcheck-box .recheck-box {padding: 5rem 10rem 30rem; background: url("../reservation/images/s02_recheck_bg.jpg") no-repeat 100% 100%; border: 1px solid #e8e8e9;} .reservationcheck-box .recheck-box input.style-input {width: 100%; height: 6rem; font-size: 1.8rem; color: #474646; font-weight: 400; padding-left: 2rem; margin-bottom: 2rem; border: 2px solid #dededf; border-radius: 0.6rem;} .reservationcheck-box .recheck-box .btncheck {width: 100%; max-width: 26rem; height: 7rem; text-align: center; border-radius: 5.5rem; background: #f49b00; font-size: 2rem; color: #fff; font-weight: 700; margin-top: 4rem; border: 0; outline: none;} .reservationcheck-box .recheck-box .btncheck:hover {background: #d31920; transition: background 0.6s ease;} /* 02 예약조회 - 인풋, 셀렉트박스 속성 - 마우스 포커싱 스타일 설정 */ .reservationcheck-box .recheck-box input:focus {border: 2px solid #d31920; box-shadow: 1px 1px 10px rgba(211,25,32,0.10); transition: border 0.6s ease; outline: none;} /* 02 예약조회 - placeholder 속성 설정 */ .reservationcheck-box .recheck-box input::-webkit-input-placeholder {color: #9b9b9b} .reservationcheck-box .recheck-box input::-moz-placeholder {color: #9b9b9b} .reservationcheck-box .recheck-box input:-ms-input-placeholder {color: #9b9b9b} .reservationcheck-box .recheck-box input::placeholder {color: #9b9b9b} /* 02 예약조회 - 조회 확인페이지 */ .form-box .form-table .table-layout-result th:before {display: none;} /* 02 예약조회 - 메인으로 버튼 영역 */ .gotomain-box {width: 100%; text-align: center;} .gotomain-box p {font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.5rem; color: #252525; line-height: 1.2; letter-spacing: -0.05rem; word-break: keep-all; margin-top: 2.8rem;} .gotomain-box .btn-gotomain {width: 100%; text-align: center; margin-top: 2rem;} .gotomain-box .btn-gotomain a {position: relative; display: inline-block; width: 29.4rem; height: 7rem; font-family: "s-core-dream-medium", sans-serif; transform: rotate(-0.03deg); font-size: 2.8rem; color: #fff; line-height: 7.2rem; background-color: #3c3c3c; border-radius: 1rem; transition: all 0.35s ease;} .gotomain-box .btn-gotomain a:hover {background-color: #f7941e;} /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 서브페이지 컨텐츠영역 08 - 이용약관 및 개인정보처리방침 */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* 01 이용약관 */ .ctt_agreement {padding: 4rem; background-color: #fff; border: 1px solid #eee; border-top: 2px solid #000;} .ctt_agreement #ctt_con {font-weight: 400; line-height: 1.5; letter-spacing: -0.06rem; word-break: keep-all;} .ctt_agreement #ctt_con p {font-size: 1.5rem !important; color: #484848;} /* 02 개인정보처리방침 */ .ctt_privacy {padding: 4rem; background-color: #fff; border: 1px solid #eee; border-top: 2px solid #000;} .ctt_privacy #ctt_con {font-weight: 400; line-height: 1.5; letter-spacing: -0.06rem; word-break: keep-all;} .ctt_privacy #ctt_con p {font-size: 1.5rem !important; color: #484848;} /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Mobile 359 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (max-width:359px) { /* 레이아웃 공통 영역 */ .subpage-common .page-common .page-title {padding: 0 2rem;} .subpage-common .page-common .page-title h3 {font-size: 3.5rem;} .subpage-common .page-common .page-title p {font-size: 2rem;} .subpage-common .page-common .page-wrap {padding: 0 2rem; margin-top: 5rem;} /* PC용 서브 하단 고정 고객센터 공통 영역 */ .subfoot-common {height: 100%;} .subfoot-common .left-colortbg {display: none;} .subfootcustomer-box {position: relative; height: 100%;} .subfootcustomer-box .left {justify-content: center; width: 100%; text-align: center; background-color: #d21312;} .subfootcustomer-box .left .conbox {padding-left: 0;} .subfootcustomer-box .left .conbox .callinfo {justify-content: center; padding-left: 0;} .subfootcustomer-box .right {width: 100%; height: 100%;} .subfootcustomer-box .right .conbox .subfoot-map {width: 35%;} .subfootcustomer-box .right .conbox .subfoot-slogan {width: 65%; padding-left: 0;} .subfootcustomer-box .right .conbox .subfoot-slogan .tittxt {font-size: 2.1rem; word-break: keep-all;} .subfootcustomer-box .right .conbox .subfoot-slogan p {margin-top: 1rem;} .subfootcustomer-box .right .conbox .subfoot-slogan p span {height: 3.2rem; font-size: 1.4rem; line-height: 3.3rem; padding: 0 1.5rem; margin: 0.25rem 0.25rem;} /* 서브 sub-visual 배경이미지 영역 */ .sub-visual {height: 200px; margin-top: 60px; background-position: center;} .sub-visual:before {position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: rgba(0,0,0,0.2);} .sub-visual-shadow:before {background-color: rgba(0,0,0,0.08);} /* 서브 대메뉴 타이틀 영역 */ .subtitle-area {padding: 0 2rem;} .subtitle-area .stxt {font-size: 1.7rem;} .subtitle-area h2.tit {font-size: 3rem; margin-top: 0.5rem; text-shadow: 1px 1px 10px rgba(0,0,0,0.75);} .subtitle-area h2.tit-shadow {text-shadow: 1px 1px 10px rgba(0,0,0,0);} .subtitle-area p {font-size: 1.5rem; padding-right: 3rem; margin-top: 2rem;} .subtitle-area p span {display: inline;} /* PC용 서브하위매뉴 삭제 */ .sub-gnb {display: none;} .sub-gnbtab {display: none;} /* 서브페이지 컨텐츠영역 01 - 전국차량탁송 */ .page-servicetype {padding-top: 8rem;} .service-type {flex-wrap: wrap;} .service-type .itemtype {width: 100%;} .service-type .itemtype:last-child {margin-top: 4rem;} .service-type .itemtype .item-info h3 {font-size: 3rem;} .service-type .itemtype .item-info p {font-size: 1.8rem;} .service-type .itemtype .item-info p span {display: inline;} .service-contents {margin-top: 4rem;} .service-contents .service-title h4 {font-size: 2.4rem;} .service-contents .service-title p {font-size: 1.6rem;} .service-contents .service-list {flex-wrap: wrap;} .service-contents .service-list .service-item {width: 48%; margin-bottom: 3rem;} .service-contents .service-list .service-item:nth-of-type(3), .service-contents .service-list .service-item:nth-of-type(4) {margin-bottom: 0;} .service-contents .service-list .service-item figure figcaption div.tit {font-size: 1.9rem; padding-top: 4rem;} .service-contents .service-list .service-item .infotxt {height: auto;} .service-contents .service-list .service-item .infotxt div.tit {font-size: 2.1rem;} .service-contents .service-list .service-item .infotxt p {font-size: 1.6rem; line-height: 1.3; word-break: keep-all;} .service-contents .service-list .service-item .infotxt p span {display: inline;} .tagsongbigyo-box {padding: 3rem 2rem;} .tagsongbigyo-box h4 {font-size: 2.4rem;} .tagsongbigyo-box .tablebox {display: flex;} .tagsongbigyo-box .tablebox .table-layout th {height: auto;font-size: 1.4rem; padding: 3% 0;} .tagsongbigyo-box .tablebox .table-layout th span {display: block;} .tagsongbigyo-box .tablebox .table-layout td {font-size: 1.3rem; padding: 2% 1%;} .tagsongbigyo-box .tablebox .table-layout td.tit {font-size: 1.35rem;} .tagsongbigyo-box .tablebox .table-layout td.mark i {display: inline-block; width: 1.5rem;} .tagsongbigyo-box .tablebox .table-layout td.mark i img {width: 100%;} .tagsongbigyo-box .tablebox:after {top: -2px; height: 100.5%; border: 3px solid #d53331;} .page-progress {padding-top: 8rem;} .progress-list {padding: 3rem;} .progress-list .liststep {width: 100%; margin-bottom: 3rem;} .progress-list .liststep:nth-child(-n+3) {margin-bottom: 3rem;} .progress-list .liststep:last-child {margin-bottom: 0;} .progress-list .liststep .topico img {width: 10rem;} .progress-list .liststep .stepbox {margin-top: 13.2rem;} .progress-list .liststep .stepbox .stepinfo {min-height: auto; padding: 2rem 2rem;} .progress-list .liststep .stepbox .stepinfo ul li {margin-bottom: 1rem; font-size: 1.8rem;} .page-recommend {padding: 8rem 0; margin-top: 8rem;} .recommend-list .item-list {width: 48.5%;} .recommend-list .item-list .item-info .tit {font-size: 2.1rem;} .recommend-list .item-list .item-info p {font-size: 1.6rem; letter-spacing: -0.15rem; word-break: keep-all;} .recommend-list .item-list .item-info p span {display: inline;} .page-bestservice {padding-top: 8rem;} .bestservice-list {padding: 2rem;} .bestservice-list ul li {width: 50%;} .bestservice-list ul li dl {min-height: 28rem; padding: 1.5rem;} .bestservice-list ul li dl dt {font-size: 1.7rem;} .bestservice-list ul li dl dd {font-size: 1.4rem;} .bestservice-list ul li dl dd span {display: inline;} .bestservice-list ul li dl.bestico-1 {background-size: 40%;} .bestservice-list ul li dl.bestico-2 {background-size: 44%;} .bestservice-list ul li dl.bestico-3 {background-size: 40%;} .bestservice-list ul li dl.bestico-4 {background-size: 48%;} .bestservice-list ul li dl.bestico-5 {background-size: 50%;} .bestservice-list ul li dl.bestico-6 {background-size: 34%;} .bestservice-list ul li dl.bestico-7 {background-size: 40%;} .bestservice-list ul li:nth-of-type(8) dl dt span {display: inline;} .bestservice-list ul li dl .review-btn {margin-top: 3rem;} .bestservice-list ul li dl .review-btn a {width: 100%; height: 5rem; font-size: 1.5rem; line-height: 5.2rem; padding-left: 2rem;} .page-process {padding: 8rem 0; margin-top: 8rem;} .reservation-process ul li {width: 45%; margin-bottom: 3rem;} .reservation-process ul li:after {top: 28%; right: -2.85rem; background-size: 90%;} .reservation-process ul li:nth-of-type(2n+2):after {display: none;} .reservation-process ul li:last-child {margin-bottom: 0;} .reservation-process ul li .listarea .box .step {font-size: 2rem; padding-top: 5%;} .reservation-process ul li .listarea .box .icoarea i {width: 36%; margin-top: 1.5rem;} .reservation-process ul li .listarea .box .icoarea p {font-size: 1.7rem;} .reservation-process ul li p.contxt {font-size: 1.6rem; line-height: 1.3; word-break: keep-all; margin-top: 2rem;} .reservation-process ul li p.contxt span {display: inline;} .reservation-process .receipt-btns {display: flex; justify-content: space-between;} .reservation-process .receipt-btns a {width: 48%; font-size: 2.4rem; padding-left: 2rem;} .reservation-process .receipt-btns a:first-child {margin-right: 0;} .reservation-process .receipt-btns a i {right: 10%;} .reservation-process .receipt-btns a i img {width: 96%;} .page-shipcompany {height: 110rem; padding: 8rem 0; margin-top: 8rem; background-image: url("../national/images/mo_shipcompany_bg.jpg"); background-size: 100% 100%;} /*모바일용 BG 변경*/ .shipcompany-box {position: relative; padding-top: 0;} .shipcompany-box:after {content: ""; display: block; position: absolute; top: 30px; right: 0; width: 5rem; height: 5rem; background: url("../images/mousedrag_ico.png") no-repeat 0 0; background-size: 100%;} .shipcompany-box p.tit {font-size: 1.8rem; letter-spacing: -0.15rem; text-indent: -1.8rem; padding: 0 0 0 1.8rem; text-shadow: -3px -3px 12px rgba(0,0,0,1);} .shipcompany-list {padding: 0; overflow-x: auto;} .shipcompany-list table.table-layout {min-width: 200%;} .shipcompany-list table.table-layout th {font-size: 1.85rem;} .shipcompany-list table.table-layout td {height: 4.6rem; font-size: 1.45rem; padding: 0 1%;} .shipcompany-list table.table-layout td.siteurl {padding: 0 3%;} .txtguide {margin-bottom: 15rem;} .txtguide p {font-size: 2.2rem; word-break: keep-all;} .txtguide p span {display: inline;} .txtguide .online-btns a {font-size: 2.5rem; padding-left: 3rem;} .txtguide .online-btns a i {right: 9%;} .page-shipschedule {height: 100rem; padding: 8rem 0; margin-top: 8rem; background-image: url("../national/images/mo_shipschedule_bg.jpg"); background-size: 100% 100%;} /*모바일용 BG 변경*/ .shipschedule-box {position: relative;} .shipschedule-box:after {content: ""; display: block; position: absolute; top: -20px; right: 0; width: 5rem; height: 5rem; background: url("../images/mousedrag_ico.png") no-repeat 0 0; background-size: 100%;} .shiprace-list {padding: 0; overflow-x: auto;} .shiprace-list table.table-layout {min-width: 165%;} .shiprace-list table.table-layout th {font-size: 1.85rem;} .shiprace-list table.table-layout td {height: 4.6rem; font-size: 1.45rem; padding: 0 1%;} /* 서브페이지 컨텐츠영역 02 - 제주탁송 */ .page-restricteditems {padding: 8rem 0 0;} .restricteditems-box {flex-wrap: wrap;} .restricteditems-box .item-box {width: 100%; height: 100%; margin-bottom: 2rem;} .restricteditems-box .item-box:last-child {margin-bottom: 0;} .restricteditems-box .item-box h4 {width: 88%;} .restricteditems-box .item-box h4:before {width: 72%;} .restricteditems-box .item-box .guide {font-size: 2.2rem; line-height: 1.3;} .restricteditems-box .item-box .infotxt {margin-bottom: 3rem;} .restricteditems-box .item-box .infotxt .tit {font-size: 2rem;} .restricteditems-box .item-box .infotxt p {font-size: 1.6rem;} .page-noticenote {padding: 2rem 0 8rem;} .noticenote-box .titbox {font-size: 2.2rem; height: auto; line-height: 1.4; letter-spacing: -0.12rem; word-break: keep-all; padding: 1rem 3rem;} .noticenote-box .titbox i.ico {width: 3.4rem; height: 3rem; background-size: 3.4rem 3rem;} .noticenote-box .note-list {padding: 5rem 2rem 4rem;} .noticenote-box .note-list ul {width: 100%;} .noticenote-box .note-list ul:last-child {margin-top: 3rem;} .noticenote-box .note-list ul li {font-size: 2rem; line-height: 3rem; margin-bottom: 1rem;} .noticenote-box .note-list ul .notesub {margin-bottom: 3rem;} .noticenote-box .note-list ul .notesub p {font-size: 1.6rem; line-height: 1.4;} .noticenote-box .note-list ul .notesub p:before {font-size: 1.6rem;} .noticenote-box .note-list ul .notesub .img img {width: 100%;} /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .page-driverbanner {padding-top: 8rem;} .driverbanner-box .bann-left {width: 100%;} .driverbanner-box .bann-right {width: 100%;} .page-appservice {padding: 8rem 0; margin-top: 8rem;} .subpage-common .page-common .page-wrap2 {padding: 0; margin-top: 0;} .appslide-box {margin-top: 5rem;} .appslide-box .swiper .swiper-slide .app-box .app-stepinfo .number {font-size: 1.5rem;} .appslide-box .swiper .swiper-slide .app-box .app-stepinfo .tit {font-size: 1.4rem;} .mobile-frame {max-width: 57.5%; transform: translate(-50%,-64%);} /*모바일 프레임 사이즈 조절*/ .page-appbanner {height: auto;} .app-download {height: auto; padding: 2rem;} .app-download .txtarea {width: 100%; text-align: center;} .app-download .txtarea p {font-size: 3rem;} .app-download .txtarea div.etc {font-size: 1.8rem; margin-top: 1rem;} .app-download .btnarea {width: 100%; flex-wrap: wrap;} .app-download .btnarea .logowhite {justify-content: center; width: 100%; margin-top: 2rem;} .app-download .btnarea .logowhite i {display: inline-block; width: 16rem;} .app-download .btnarea .logowhite i img {width: 100%;} .app-download .btnarea .appbann-btn {justify-content: space-between; width: 100%; margin-top: 2rem;} .app-download .btnarea .appbann-btn .appbtn:first-child {margin-right: 0;} .app-download .btnarea .appbann-btn .appbtn {width: 48%;} .app-download .btnarea .appbann-btn .appbtn a {font-size: 2rem;} .app-download .btnarea .appbann-btn .appbtn a img {max-width: 100%;} .app-download .btnarea .appbann-btn .appbtn a span {margin-left: 1rem;} .page-protocoldriver {padding: 8rem 0;} .driver-list {flex-wrap: wrap;} .driver-list .driver-type {width: 48%; margin-bottom: 3rem;} .driver-list .driver-type:nth-of-type(3), .driver-list .driver-type:nth-of-type(4) {margin-bottom: 0;} .driver-list .driver-type .infotxt {margin-top: 2rem;} .driver-list .driver-type .infotxt div.tit {font-size: 2rem;} .driver-list .driver-type .infotxt p {font-size: 1.6rem;} .page-corpordrive {padding: 8rem 0;} .corpordrive-list .item-list {width: 100%; margin-bottom: 4rem;} .corpordrive-list .item-list:last-child {margin-bottom: 0;} .corpordrive-list .item-list .item-info .infotxt ul li {word-break: keep-all;} .corpordrive-process {padding-top: 8rem;} .corpordrive-process ul {padding-top: 5rem;} .corpordrive-process ul li {width: 45%; margin-bottom: 3rem;} .corpordrive-process ul li:nth-of-type(2n+2):after {display: none;} .corpordrive-process ul li .listarea .box .step {font-size: 1.8rem; padding-top: 0.7rem;} .corpordrive-process ul li .listarea .box .icoarea i {width: 36%; height: auto;} .corpordrive-process ul li p.contxt {font-size: 2rem;} .page-edusystem {padding-top: 8rem;} .edusystem-contents .driver-common {margin-bottom: 8rem;} .edusystem-contents .driver-common .left-tit {width: 100%; margin-bottom: 4rem;} .edusystem-contents .driver-common .left-tit p {font-size: 3.2rem;} .edusystem-contents .driver-common .right-info {width: 100%;} .driver-recruitment p {font-size: 2.2rem;} .driver-mind ul {flex-wrap: wrap;} .driver-mind ul li {width: 100%; margin-bottom: 5rem;} .driver-mind ul li:nth-of-type(-n+2) {margin-bottom: 5rem;} .driver-mind ul li:last-child {margin-bottom: 0;} .driver-mind ul li .info p {font-size: 1.7rem;} .driver-edc ul {flex-wrap: wrap;} .driver-edc ul li {width: 100%; margin-bottom: 4rem;} .driver-edc ul li:last-child {margin-bottom: 0;} .driver-edc ul li .info .infotxt ul li {margin-bottom: 0;} .driver-evalua .box .left-img {width: 100%;} .driver-evalua .box .right-box {width: 100%; margin-top: 2rem;} .driver-evalua .box .right-box .txt .number-txt span {width: 3.8rem; height: 3.8rem; font-size: 2rem;} .driver-evalua .box .right-box .txt .number-txt p {font-size: 2rem; line-height: 1.4; padding-top: 0.2rem;} .employment-box .box .left-img {width: 100%;} .employment-box .box .left-img figure {height: 40rem;} .employment-box .box .employment-guide {width: 100%; margin-top: 3rem;} .page-corporfee {padding-top: 8rem;} .table-scroll {position: relative;} .table-scroll:before {z-index: 2; content: ""; display: block; position: absolute; top: -25px; right: 0; width: 5rem; height: 5rem; background: url("../images/mousedrag_ico.png") no-repeat 0 0; background-size: 100%;} .corporfee-box {overflow-x: auto;} .corporfee-box table.table-layout {min-width: 200%;} .corporfee-box table.table-layout th {font-size: 1.85rem;} .corporfee-box table.table-layout td {font-size: 1.65rem;padding: 2% 1%;} .corporfee-box table.table-layout td.price {font-size: 1.8rem;} .corporfee-box2 {margin-top: 5rem;} .page-dailyfee {padding-top: 8rem; margin-bottom: 8rem;} /* 서브페이지 컨텐츠영역 04 - 고객후기 */ .page-solution .review-morearea .shortcuts-box {padding: 0 2rem;} .page-solution .review-morearea .shortcuts-box .morebtn {margin-right: 1rem; padding: 0 1rem 0 2rem;} .page-solution .review-morearea .shortcuts-box .morebtn span {font-size: 1.8rem;} .page-solution .review-morearea .shortcuts-box .blog {margin-right: 1rem;} /* 서브페이지 컨텐츠영역 05 - 고객센터 */ .subpage-common .page-common .page-title-board {padding: 0 1rem;} .subpage-common .page-common .page-title-board h3 {font-size: 2.8rem;} .page-title-board {margin-bottom: 3rem;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 02 자주묻는질문 */ #bo_cate {padding: 2rem 0;} #bo_cate_ul {float: none;} #bo_cate_ul li {/*width: 25%;*/ width: auto; text-align: center; padding: 0 2rem;} #bo_cate_ul li a {position: relative; display: inline-block; width: 100%; font-family: "Noto Sans KR", sans-serif; transform: rotate(-0.04deg); font-size: 2.2rem; letter-spacing: -0.1rem;} #bo_cate_ul li:after {display: none;} .boardsearch-wrap {padding: 2rem 2rem;} .boardsearch-wrap .searchtype {width: 100%;} .boardsearch-wrap .searchtype .searchbox {width: 100%; display: initial;} .boardsearch-wrap .searchtype .searchbox select.formselect {width: 35% !important; height: 6rem; font-size: 1.7rem; padding-left: 1rem;} .boardsearch-wrap .searchtype .searchbox input.forminput {width: 65% !important; height: 6rem; font-size: 1.7rem; padding-left: 1rem;} #slide-faqmenu ul li a .itemarea {display: block; height: auto; padding-top: 1.2rem;} #slide-faqmenu ul li.faq-item a .faq-categoay {order: 2; width: auto; padding-top: 0.5rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li.faq-item a .faq-qico {order: 1; margin-right: 1rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li.faq-item a .faq-subject {order: 3; font-size: 1.8rem; padding-top: 0.5rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li.faq-item .lotate-v {order: 4; position: absolute; top: 45%; right: 2rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li ul.faqnav li {padding: 2rem;} #slide-faqmenu ul li ul.faqnav li .faq-aico {top: 2rem; left: 2rem;} #slide-faqmenu ul li ul.faqnav li p {font-size: 1.6rem; padding-left: 5rem;} #slide-faqmenu ul li ul.faqnav li p img {max-width: 100%;} /* 그누보드 글쓰기 에디터 */ #smart_editor2 {width: 100% !important; min-width: 100% !important;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 03 보험보상 */ .page-inscoverage {padding-top: 8rem;} .page-insprocess {padding: 8rem 0;} .insprocess-list ul li {width: 44%; margin-bottom: 3rem;} .insprocess-list ul li:nth-of-type(2n+2):after {display: none;} .insprocess-list ul li:nth-of-type(3), .insprocess-list ul li:nth-of-type(4) {margin-bottom: 0;} .insprocess-list ul li:after {right: -22%;} .insprocess-list ul li .circel-box .cbox i {height: auto;} .insprocess-list ul li .circel-box .cbox i.fine {height: auto;} .insprocess-list ul li .circel-box .cbox i img {width: 50%;} .insprocess-list ul li .circel-box .cbox p {font-size: 1.8rem; margin-top: 1rem;} .accident-box {position: relative;} .accident-box:before {z-index: 2; content: ""; display: block; position: absolute; top: -25px; right: 0; width: 5rem; height: 5rem; background: url("../images/mousedrag_ico.png") no-repeat 0 0; background-size: 100%;} .accident-table {overflow-x: auto; margin-bottom: 3rem;} .accident-table table.table-layout {min-width: 160%;} .accident-table table.table-layout th {font-size: 1.85rem;} .accident-table table.table-layout td {font-size: 1.65rem;padding: 2% 1%;} .accident-table table.table-layout td.item {font-size: 1.8rem;} .accident-box .etc-list p {font-size: 1.7rem; letter-spacing: -0.1rem; line-height: 1.5; word-break: keep-all;} .accident-box .etc-list p:after {width: 2.4rem; height: 2.3rem; background-size: 2.4rem 2.3rem;} .accident-box .insure-detail .left-tit {width: 100%;} .accident-box .insure-detail .left-tit p {font-size: 3.2rem;} .accident-box .insure-detail .right-insurelist {width: 100%;} .accident-box .insure-detail .right-insurelist ul {margin-top: 3rem;} .accident-box .insure-detail .right-insurelist ul li {width: 100%;} .accident-box .insure-detail .right-insurelist ul li:first-child {margin-bottom: 2rem;} .accident-box .insure-detail .right-insurelist ul li div.tit {font-size: 2.4rem;} .page-accident {padding: 8rem 2rem;} .page-accident .page-wrap {padding: 0 !important;} .insurance-type {justify-content: space-between;} .insurance-type .safety-logo {width: 48.5%; height: 8rem; padding: 0 3%; border-radius: 1.4rem;} .insurance-type .safety-logo:first-child {margin-right: 0;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 04 제주선박안내 */ .shipcompany-title2 {padding-top: 8rem; margin-bottom: 0;} .page-shipcompany3 {margin-top: 3rem;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 05 고객서비스연구소 */ .page-servicelab {padding-top: 8rem;} .driver-edc ul li .info {min-height: auto;} .page-carcare {padding: 8rem 0; margin-top: 8rem;} .carcare-box ul li {width: 100%; margin-bottom: 2rem;} .carcare-box ul li:last-child {margin-bottom: 0;} .carcare-box ul li .box h4 {height: auto;} .carcare-box ul li .box i {width: 15rem;} .carcare-box ul li .box i img {width: 100%;} .safeoper-list ul li {width: 100%; margin-bottom: 7rem;} .safeoper-list ul li:last-child {margin-bottom: 0;} .safeoper-list ul li .item-box h4 {font-size: 2.8rem; word-break: keep-all;} .safeoper-list ul li .item-box p {font-size: 1.8rem; word-break: keep-all;} .safeoper-list ul li .item-box p span {display: inline;} /* 서브페이지 컨텐츠영역 06 - 회사소개 */ .page-introduce {padding: 5rem 0 8rem;} .page-introduce .page-wrap {margin-top: 0 !important;} .greeting-box .topimg {position: relative;} .greeting-box .topimg img {max-width: 100%;} .greeting-box p {font-size: 2rem; line-height: 1.4;} .greeting-box p br:nth-of-type(3), .greeting-box p br:nth-of-type(6), .greeting-box p br:nth-of-type(7) {display: none;} .page-network {padding: 8rem 0;} .introduce-title {padding: 0 2rem;} .introduce-title h3 {font-size: 3.5rem;} .introduce-title p {font-size: 1.9rem;} .page-organization {padding: 8rem 0;} .organization-box .con-box {padding: 2rem;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 02 경영비전 */ .page-target {padding: 8rem 0;} .target-box .target-list .targetitem {width: 100%; margin-bottom: 5rem;} .target-box .target-list .targetitem:last-child {margin-bottom: 0;} .target-box .target-list .targetitem p {font-size: 2.2rem;} .page-values {padding: 8rem 0;} .values-box .values-list .valuesitem {width: 100%; border: 1px solid #dfdede; border-bottom: 0;} .values-box .values-list .valuesitem:last-child {width: 100%; border-bottom: 1px solid #dfdede; border-left: 1px solid #dfdede;} .values-box .values-list .valuesitem:nth-of-type(3) {border-left: 1px solid #dfdede;} .values-box .values-list .valuesitem .box {min-height: initial /*초기화*/; padding: 3rem; border: 0;} .values-box .values-list .valuesitem .box i {width: 10rem; height: 10rem;} .values-box .values-list .valuesitem .box p {font-size: 1.6rem;} .page-rule {padding: 8rem 0;} .rule-list .ruleitem .box .left-img {width: 100%;} .rule-list .ruleitem .box .right-info {width: 100%; margin-top: 3rem;} .rule-list .ruleitem .box .right-info .txt-box .tittxt span {font-size: 2rem;} .rule-list .ruleitem .box .right-info .txt-box .tittxt {font-size: 2.2rem;} .rule-list .ruleitem .box .right-info .txt-box ul {margin-top: 2rem;} .rule-list .ruleitem .box .right-info .txt-box ul li {font-size: 1.8rem;} .rule-list .ruleitem .box .right-info .txt-box ul li:before {font-size: 1.8rem;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 03 연혁 */ .page-history {padding: 5rem 0 8rem;} .page-history .page-wrap {margin-top: 0 !important;} .history-tit {margin-top: 3rem; padding: 0 2rem;} .history-tit span {width: 100%; border-radius: 0.5rem;} .history-content {padding: 0 2rem;} .history-content:before {left: 3rem;} .history-content .list-box {padding-top: 5rem;} .history-content .list-box .year {width: 100%; text-align: left; padding-left: 5rem; padding-right: 0;} .history-content .list-box .year:before {right: 0; left: 0.5rem;} .history-content .list-box .year:after {left: 1.5rem; width: 2.5rem;} .history-content .list-box .time-con {width: 100%; padding-top: 2rem; padding-left: 5rem;} .history-content .list-box .time-con dl {align-items: initial /*초기화*/;} .history-content .list-box .time-con dl dt {width: 6rem; font-size: 1.7rem; vertical-align: top;} .history-content .list-box .time-con dl dd {width: 80%; font-size: 1.65rem; vertical-align: top;} .history-content .list-box:nth-of-type(even) .year {padding-left: 5rem;} .history-content .list-box:nth-of-type(even) .year:before {left: 0.5rem;} .history-content .list-box:nth-of-type(even) .year:after {left: 1.5rem;} .history-content .list-box:nth-of-type(even) .time-con {text-align: left; padding-left: 5rem; padding-right: 0;} .history-content .list-box:nth-of-type(even) .time-con dl dt {order: 1; text-align: left;} .history-content .list-box:nth-of-type(even) .time-con dl dd {order: 2;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 04 오시는길 */ .page-location {padding: 5rem 0 8rem;} .location-box .map-canvas {height: 45rem;} .location-box .map-canvas img {top: -20%;} .location-box .map-info .left-contents .callcenter {width: 100%;} .location-box .map-info .left-contents .address {padding-left: 0;} .location-box .map-info .left-contents .address .txtarea {flex-wrap: wrap; font-size: 1.8rem; line-height: 1.2; margin-top: 2rem; word-break: keep-all;} .location-box .map-info .left-contents .address .txtarea span {margin-bottom: 1rem;} .location-box .map-info .left-contents .address p {padding-left: 0; font-size: 1.8rem;} .location-box .map-info .mapbtn {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; margin-top: 3rem;} .location-box .map-info .mapbtn a {width: 48%;} .location-box .map-info .mapbtn a.naver {margin-right: 0;} /* 서브페이지 컨텐츠영역 07 - 예약하기 */ .reservation-process-re ul li:after {top: 40%; right: -2.6rem;} .reservation-process-re .re-guide-title {margin-bottom: 1rem;} .reservation-process-re .re-guide-title p {font-size: 2.8rem; word-break: keep-all;} .reservation-process-re .re-guide-title p strong {float: left;} .page-reservation {padding: 8rem 0;} .reservation-form {padding: 0 2rem;} .form-box {margin-bottom: 6rem;} .form-box .form-title h3 {font-size: 2.5rem;} .form-box .form-title h3 span {font-size: 2.6rem;} .form-box .form-title p {font-size: 1.7rem; padding-left: 2.8rem; margin-top: 1rem;} .form-box .form-title p.retorntxt {padding-left: 3.1rem; margin-top: 1rem;} .form-box .form-table .table-layout th {width: 35%; font-size: 1.7rem; padding: 1rem 1rem;} .form-box .form-table .table-layout th p {width: 80%; font-size: 1.7rem;} .form-box .form-table .table-layout th:before {font-size: 1.5rem; margin-right: 0.5rem;} .form-box .form-table .table-layout td {font-size: 1.6rem; padding: 1rem;} .form-box .form-table .table-layout td label {font-size: 1.6rem;} .form-box .form-table .table-layout td p {font-size: 1.5rem;} .form-box .form-table .table-layout td .linebreak {margin-right: 1.5rem;} .form-box .form-table .table-layout td .linebreak2 {margin-right: 0;} .form-box .form-table .table-layout td input.style-radio {width: 1.8rem; height: 1.8rem;} .form-box .form-table .table-layout td input.style-input {width: 100%; padding-left: 1rem;} .form-box .form-table .table-layout td input.style-input-code {width: 45%;} .form-box .form-table .table-layout td button.address-search {padding: 0 1rem; margin-right: 0;} .form-box .form-table .table-layout td input.style-input-arrdess {width: 100%; margin-top: 1rem;} .form-box .form-table .table-layout td input.style-input-addr {width: 100% !important;} .form-box .form-table .table-layout td input.style-input-calendar {margin-right: 0; margin-bottom: 1rem;} /* 서브페이지 컨텐츠영역 07 - 예약하기 - placeholder 속성 설정 */ .form-box .form-table .table-layout td input::-webkit-input-placeholder {font-size: 1.3rem;} .form-box .form-table .table-layout td input::-moz-placeholder {font-size: 1.3rem;} .form-box .form-table .table-layout td input:-ms-input-placeholder {font-size: 1.3rem;} .form-box .form-table .table-layout td input::placeholder {font-size: 1.3rem;} /* 개인정보 활용 동의 */ .privacy-agreement {display: flex; justify-content: center; flex-wrap: wrap;} .privacy-check {align-items: initial; flex-wrap: initial; width: 100%; text-align: left;} .privacy-check .checkbox-input+label {width: 80%; line-height: 1.2; margin-top: 0.2rem;} .pop-form {width: 100%;} /* 개인정보동의 레이어팝업 layerpop */ .popup-contents {width: 90%;} /*가로사이즈 조절*/ .appcarecep-box p {font-size: 2.2rem;} .appcarecep-box .btn-appcarecep a {width: 26.4rem; font-size: 2.5rem; padding-left: 3.5rem;} /* 02 예약조회 */ .page-reservationcheck {padding: 8rem 0;} .reservationcheck-box {padding: 0;} .reservationcheck-box .recheck-box {padding: 3rem 3rem 20rem; background-position: center bottom; background-size: 100%;} /* 서브페이지 컨텐츠영역 08 - 이용약관 및 개인정보처리방침 */ .ctt_agreement {padding: 2rem;} .ctt_privacy {padding: 2rem;} } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Mobile 360,719 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:360px) and (max-width:719px) { /* 레이아웃 공통 영역 */ .subpage-common .page-common .page-title {padding: 0 2rem;} .subpage-common .page-common .page-title h3 {font-size: 3.5rem;} .subpage-common .page-common .page-title p {font-size: 2rem; line-height: 1.4;} .subpage-common .page-common .page-wrap {padding: 0 2rem; margin-top: 5rem;} /* PC용 서브 하단 고정 고객센터 공통 영역 */ .subfoot-common {height: 100%;} .subfoot-common .left-colortbg {display: none;} .subfootcustomer-box {position: relative; height: 100%;} .subfootcustomer-box .left {justify-content: center; width: 100%; text-align: center; background-color: #d21312;} .subfootcustomer-box .left .conbox {padding-left: 0;} .subfootcustomer-box .left .conbox .callinfo {justify-content: center; padding-left: 0;} .subfootcustomer-box .right {width: 100%; height: 100%;} .subfootcustomer-box .right .conbox .subfoot-map {width: 40%;} .subfootcustomer-box .right .conbox .subfoot-slogan {width: 60%; padding-left: 0;} .subfootcustomer-box .right .conbox .subfoot-slogan .tittxt {font-size: 2.2rem; word-break: keep-all;} .subfootcustomer-box .right .conbox .subfoot-slogan p {margin-top: 1rem;} .subfootcustomer-box .right .conbox .subfoot-slogan p span {height: 3.2rem; font-size: 1.4rem; line-height: 3.3rem; padding: 0 1.5rem; margin: 0.25rem 0.25rem;} /* 서브 sub-visual 배경이미지 영역 */ .sub-visual {height: 200px; margin-top: 60px; background-position: center;} .sub-visual:before {position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: rgba(0,0,0,0.2);} .sub-visual-shadow:before {background-color: rgba(0,0,0,0.08);} /* 서브 sub-visual 배경이미지 영역 - 배경이미지 위치조절 예외처리 */ .sub-visual-42 {background-position: 60% center;} /* 고객후기 - 전국탁송 리얼포토 예외처리 */ .sub-visual-43 {background-position: 60% center;} /* 고객후기 - 대리운전 리얼포토 예외처리 */ .sub-visual-54 {background-position: 20% center;} /* 고객센터 - 제주선박안내 예외처리 */ /* 서브 대메뉴 타이틀 영역 */ .subtitle-area {padding: 0 2rem;} .subtitle-area .stxt {font-size: 1.7rem;} .subtitle-area h2.tit {font-size: 3rem; margin-top: 0.5rem; text-shadow: 1px 1px 10px rgba(0,0,0,0.75);} .subtitle-area h2.tit-shadow {text-shadow: 1px 1px 10px rgba(0,0,0,0);} .subtitle-area p {font-size: 1.5rem; padding-right: 3rem; margin-top: 2rem;} .subtitle-area p span {display: inline;} /* PC용 서브하위매뉴 삭제 */ .sub-gnb {display: none;} .sub-gnbtab {display: none;} /* 서브페이지 컨텐츠영역 01 - 전국차량탁송 */ .page-servicetype {padding-top: 8rem;} .service-type {flex-wrap: wrap;} .service-type2 {margin-top: 4rem;} .service-type .itemtype {width: 100%;} .service-type .itemtype:last-child {margin-top: 4rem;} .service-type .itemtype .item-info h3 {font-size: 3rem;} .service-type .itemtype .item-info p {font-size: 1.8rem;} .service-type .itemtype .item-info p span {display: inline;} .service-contents {margin-top: 4rem;} .service-contents .service-title h4 {font-size: 2.4rem;} .service-contents .service-title p {font-size: 1.6rem;} .service-contents .service-list {flex-wrap: wrap;} .service-contents .service-list .service-item {width: 48%; margin-bottom: 3rem;} .service-contents .service-list .service-item:nth-of-type(3), .service-contents .service-list .service-item:nth-of-type(4) {margin-bottom: 0;} .service-contents .service-list .service-item figure figcaption div.tit {font-size: 1.9rem; padding-top: 4rem;} .service-contents .service-list .service-item .infotxt {height: auto;} .service-contents .service-list .service-item .infotxt div.tit {font-size: 2.2rem;} .service-contents .service-list .service-item .infotxt p {font-size: 1.6rem; line-height: 1.3; word-break: keep-all;} .service-contents .service-list .service-item .infotxt p span {display: inline;} .tagsongbigyo-box {padding: 3rem 2rem;} .tagsongbigyo-box h4 {font-size: 2.4rem;} .tagsongbigyo-box .tablebox {display: flex;} .tagsongbigyo-box .tablebox .table-layout th {height: auto;font-size: 1.4rem; padding: 3% 0;} .tagsongbigyo-box .tablebox .table-layout th span {display: block;} .tagsongbigyo-box .tablebox .table-layout td {font-size: 1.3rem; padding: 2% 1%;} .tagsongbigyo-box .tablebox .table-layout td.tit {font-size: 1.35rem;} .tagsongbigyo-box .tablebox .table-layout td.mark i {display: inline-block; width: 1.5rem;} .tagsongbigyo-box .tablebox .table-layout td.mark i img {width: 100%;} .tagsongbigyo-box .tablebox:after {top: -2px; height: 100.5%; border: 3px solid #d53331;} .page-progress {padding-top: 8rem;} .progress-list {padding: 3rem;} .progress-list .liststep {width: 100%; margin-bottom: 3rem;} .progress-list .liststep:nth-child(-n+3) {margin-bottom: 3rem;} .progress-list .liststep:last-child {margin-bottom: 0;} .progress-list .liststep .topico img {width: 10rem;} .progress-list .liststep .stepbox {margin-top: 13.2rem;} .progress-list .liststep .stepbox .stepinfo {min-height: auto; padding: 2rem 2rem;} .progress-list .liststep .stepbox .stepinfo ul li {margin-bottom: 1rem; font-size: 1.8rem;} .page-recommend {padding: 8rem 0; margin-top: 8rem;} .recommend-list .item-list {width: 48.5%;} .recommend-list .item-list .item-info .tit {font-size: 2.2rem;} .recommend-list .item-list .item-info p {font-size: 1.6rem; letter-spacing: -0.15rem; word-break: keep-all;} .recommend-list .item-list .item-info p span {display: inline;} .page-bestservice {padding-top: 8rem;} .bestservice-list {padding: 2rem;} .bestservice-list ul li {width: 50%;} .bestservice-list ul li dl {min-height: 28rem; padding: 1.5rem;} .bestservice-list ul li dl dt {font-size: 1.7rem;} .bestservice-list ul li dl dd {font-size: 1.4rem;} .bestservice-list ul li dl dd span {display: inline;} .bestservice-list ul li dl.bestico-1 {background-size: 40%;} .bestservice-list ul li dl.bestico-2 {background-size: 44%;} .bestservice-list ul li dl.bestico-3 {background-size: 40%;} .bestservice-list ul li dl.bestico-4 {background-size: 48%;} .bestservice-list ul li dl.bestico-5 {background-size: 50%;} .bestservice-list ul li dl.bestico-6 {background-size: 34%;} .bestservice-list ul li dl.bestico-7 {background-size: 40%;} .bestservice-list ul li:nth-of-type(8) dl dt span {display: inline;} .bestservice-list ul li dl .review-btn {margin-top: 3rem;} .bestservice-list ul li dl .review-btn a {width: 100%; height: 5rem; font-size: 1.5rem; line-height: 5.2rem; padding-left: 2rem;} .page-process {padding: 8rem 0; margin-top: 8rem;} .reservation-process ul li {width: 45%; margin-bottom: 3rem;} .reservation-process ul li:after {top: 28%; right: -2.85rem; background-size: 90%;} .reservation-process ul li:nth-of-type(2n+2):after {display: none;} .reservation-process ul li:last-child {margin-bottom: 0;} .reservation-process ul li .listarea .box .step {font-size: 2.2rem; padding-top: 5%;} .reservation-process ul li .listarea .box .icoarea i {width: 36%; margin-top: 1.5rem;} .reservation-process ul li .listarea .box .icoarea p {font-size: 1.7rem;} .reservation-process ul li p.contxt {font-size: 1.6rem; line-height: 1.3; word-break: keep-all; margin-top: 2rem;} .reservation-process ul li p.contxt span {display: inline;} .reservation-process .receipt-btns {display: flex; justify-content: space-between;} .reservation-process .receipt-btns a {width: 48%; font-size: 2.4rem; padding-left: 2rem;} .reservation-process .receipt-btns a:first-child {margin-right: 0;} .reservation-process .receipt-btns a i {right: 10%;} .reservation-process .receipt-btns a i img {width: 96%;} .page-shipcompany {height: 110rem; padding: 8rem 0; margin-top: 8rem; background-image: url("../national/images/mo_shipcompany_bg.jpg"); background-size: 100% 100%;} /*모바일용 BG 변경*/ .shipcompany-box {position: relative; padding-top: 0;} .shipcompany-box:after {content: ""; display: block; position: absolute; top: 40px; right: 0; width: 5rem; height: 5rem; background: url("../images/mousedrag_ico.png") no-repeat 0 0; background-size: 100%;} .shipcompany-box p.tit {font-size: 1.8rem; letter-spacing: -0.15rem; text-indent: -1.8rem; padding: 0 0 0 1.8rem; text-shadow: -3px -3px 12px rgba(0,0,0,1);} .shipcompany-list {padding: 0; overflow-x: auto;} .shipcompany-list table.table-layout {min-width: 200%;} .shipcompany-list table.table-layout th {font-size: 1.85rem;} .shipcompany-list table.table-layout td {height: 4.6rem; font-size: 1.45rem; padding: 0 1%;} .shipcompany-list table.table-layout td.siteurl {padding: 0 3%;} .txtguide {margin-bottom: 15rem;} .txtguide p {font-size: 2.2rem; word-break: keep-all;} .txtguide p span {display: inline;} .txtguide .online-btns a {font-size: 2.5rem; padding-left: 3rem;} .txtguide .online-btns a i {right: 9%;} .page-shipschedule {height: 100rem; padding: 8rem 0; margin-top: 8rem; background-image: url("../national/images/mo_shipschedule_bg.jpg"); background-size: 100% 100%;} /*모바일용 BG 변경*/ .shipschedule-box {position: relative;} .shipschedule-box:after {content: ""; display: block; position: absolute; top: -25px; right: 0; width: 5rem; height: 5rem; background: url("../images/mousedrag_ico.png") no-repeat 0 0; background-size: 100%;} .shiprace-list {padding: 0; overflow-x: auto;} .shiprace-list table.table-layout {min-width: 165%;} .shiprace-list table.table-layout th {font-size: 1.85rem;} .shiprace-list table.table-layout td {height: 4.6rem; font-size: 1.45rem; padding: 0 1%;} /* 서브페이지 컨텐츠영역 02 - 제주탁송 */ .page-restricteditems {padding: 8rem 0 0;} .restricteditems-box {flex-wrap: wrap;} .restricteditems-box .item-box {width: 100%; height: 100%; margin-bottom: 2rem;} .restricteditems-box .item-box:last-child {margin-bottom: 0;} .restricteditems-box .item-box h4 {width: 88%;} .restricteditems-box .item-box h4:before {width: 75%;} .restricteditems-box .item-box .guide {font-size: 2.2rem; line-height: 1.3;} .restricteditems-box .item-box .infotxt {margin-bottom: 3rem;} .restricteditems-box .item-box .infotxt .tit {font-size: 2rem;} .restricteditems-box .item-box .infotxt p {font-size: 1.6rem;} .page-noticenote {padding: 2rem 0 8rem;} .noticenote-box .titbox {font-size: 2.2rem; height: auto; line-height: 1.4; letter-spacing: -0.12rem; word-break: keep-all; padding: 1rem 3rem;} .noticenote-box .titbox i.ico {width: 3.4rem; height: 3rem; background-size: 3.4rem 3rem;} .noticenote-box .note-list {padding: 5rem 2rem 4rem;} .noticenote-box .note-list ul {width: 100%;} .noticenote-box .note-list ul:last-child {margin-top: 3rem;} .noticenote-box .note-list ul li {font-size: 2rem; line-height: 3rem; margin-bottom: 1rem;} .noticenote-box .note-list ul .notesub {margin-bottom: 3rem;} .noticenote-box .note-list ul .notesub p {font-size: 1.6rem; line-height: 1.4;} .noticenote-box .note-list ul .notesub p:before {font-size: 1.6rem;} .noticenote-box .note-list ul .notesub .img img {width: 100%;} /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .page-driverbanner {padding-top: 8rem;} .driverbanner-box .bann-left {width: 100%;} .driverbanner-box .bann-right {width: 100%;} .page-appservice {padding: 8rem 0; margin-top: 8rem;} .subpage-common .page-common .page-wrap2 {padding: 0; margin-top: 0;} .appslide-box {margin-top: 5rem;} .appslide-box .swiper .swiper-slide .app-box .app-stepinfo .number {font-size: 1.5rem;} .appslide-box .swiper .swiper-slide .app-box .app-stepinfo .tit {font-size: 1.4rem;} .mobile-frame {max-width: 54.5%; transform: translate(-50%,-64%);} /*모바일 프레임 사이즈 조절*/ .page-appbanner {height: auto;} .app-download {height: auto; padding: 2rem;} .app-download .txtarea {width: 100%; text-align: center;} .app-download .txtarea p {font-size: 3rem;} .app-download .txtarea div.etc {font-size: 1.8rem; margin-top: 1rem;} .app-download .btnarea {width: 100%; flex-wrap: wrap;} .app-download .btnarea .logowhite {justify-content: center; width: 100%; margin-top: 2rem; margin-right: 0;} .app-download .btnarea .logowhite i {display: inline-block; width: 16rem;} .app-download .btnarea .logowhite i img {width: 100%;} .app-download .btnarea .appbann-btn {justify-content: space-between; width: 100%; margin-top: 2rem;} .app-download .btnarea .appbann-btn .appbtn:first-child {margin-right: 0;} .app-download .btnarea .appbann-btn .appbtn {width: 48%;} .app-download .btnarea .appbann-btn .appbtn a {font-size: 2rem;} .app-download .btnarea .appbann-btn .appbtn a img {max-width: 100%;} .app-download .btnarea .appbann-btn .appbtn a span {margin-left: 1rem;} .page-protocoldriver {padding: 8rem 0;} .driver-list {flex-wrap: wrap;} .driver-list .driver-type {width: 48%; margin-bottom: 3rem;} .driver-list .driver-type:nth-of-type(3), .driver-list .driver-type:nth-of-type(4) {margin-bottom: 0;} .driver-list .driver-type .infotxt {margin-top: 2rem;} .driver-list .driver-type .infotxt div.tit {font-size: 2rem;} .driver-list .driver-type .infotxt p {font-size: 1.6rem;} .page-corpordrive {padding: 8rem 0;} .corpordrive-list .item-list {width: 100%; margin-bottom: 4rem;} .corpordrive-list .item-list:last-child {margin-bottom: 0;} .corpordrive-process {padding-top: 8rem;} .corpordrive-process ul {padding-top: 5rem;} .corpordrive-process ul li {width: 45%; margin-bottom: 3rem;} .corpordrive-process ul li:nth-of-type(2n+2):after {display: none;} .corpordrive-process ul li .listarea .box .icoarea i {width: 36%; height: auto; margin-top: 2.4rem;} .corpordrive-process ul li p.contxt {font-size: 2rem;} .page-edusystem {padding-top: 8rem;} .edusystem-contents .driver-common {margin-bottom: 8rem;} .edusystem-contents .driver-common .left-tit {width: 100%; margin-bottom: 4rem;} .edusystem-contents .driver-common .left-tit p {font-size: 3.2rem;} .edusystem-contents .driver-common .right-info {width: 100%;} .driver-recruitment p {font-size: 2.2rem;} .driver-mind ul {flex-wrap: wrap;} .driver-mind ul li {width: 100%; margin-bottom: 5rem;} .driver-mind ul li:nth-of-type(-n+2) {margin-bottom: 5rem;} .driver-mind ul li:last-child {margin-bottom: 0;} .driver-mind ul li .info p {font-size: 1.7rem;} .driver-edc ul {flex-wrap: wrap;} .driver-edc ul li {width: 100%; margin-bottom: 4rem;} .driver-edc ul li:last-child {margin-bottom: 0;} .driver-edc ul li .info .infotxt ul li {margin-bottom: 0;} .driver-evalua .box .left-img {width: 100%;} .driver-evalua .box .right-box {width: 100%; margin-top: 2rem;} .driver-evalua .box .right-box .txt .number-txt span {width: 3.8rem; height: 3.8rem; font-size: 2rem;} .driver-evalua .box .right-box .txt .number-txt p {font-size: 2rem; line-height: 1.4;} .employment-box .box .left-img {width: 100%;} .employment-box .box .left-img figure {height: 40rem;} .employment-box .box .employment-guide {width: 100%; margin-top: 3rem;} .page-corporfee {padding-top: 8rem;} .table-scroll {position: relative;} .table-scroll:before {z-index: 2; content: ""; display: block; position: absolute; top: -25px; right: 0; width: 5rem; height: 5rem; background: url("../images/mousedrag_ico.png") no-repeat 0 0; background-size: 100%;} .corporfee-box {overflow-x: auto;} .corporfee-box table.table-layout {min-width: 200%;} .corporfee-box table.table-layout th {font-size: 1.85rem;} .corporfee-box table.table-layout td {font-size: 1.65rem;padding: 2% 1%;} .corporfee-box table.table-layout td.price {font-size: 1.8rem;} .corporfee-box2 {margin-top: 5rem;} .page-dailyfee {padding-top: 8rem; margin-bottom: 8rem;} /* 서브페이지 컨텐츠영역 04 - 고객후기 */ .page-solution .review-morearea .shortcuts-box {padding: 0 2rem;} .page-solution .review-morearea .shortcuts-box .morebtn {margin-right: 1rem; padding: 0 1rem 0 2rem;} .page-solution .review-morearea .shortcuts-box .morebtn span {font-size: 1.6rem;} .page-solution .review-morearea .shortcuts-box .blog {margin-right: 1rem;} /* 서브페이지 컨텐츠영역 05 - 고객센터 */ .subpage-common .page-common .page-title-board {padding: 0 1rem;} .subpage-common .page-common .page-title-board h3 {font-size: 2.8rem;} .page-title-board {margin-bottom: 3rem;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 02 자주묻는질문 */ #bo_cate {padding: 2rem 0;} #bo_cate_ul {float: none;} #bo_cate_ul li {/*width: 25%;*/ width: auto; text-align: center; padding: 0 2rem;} #bo_cate_ul li a {position: relative; display: inline-block; width: 100%; font-family: "Noto Sans KR", sans-serif; transform: rotate(-0.04deg); font-size: 2.2rem; letter-spacing: -0.1rem;} #bo_cate_ul li:after {display: none;} .boardsearch-wrap {padding: 2rem 2rem;} .boardsearch-wrap .searchtype {width: 100%;} .boardsearch-wrap .searchtype .searchbox {width: 100%; display: initial;} .boardsearch-wrap .searchtype .searchbox select.formselect {width: 35% !important; height: 6rem; font-size: 1.7rem; padding-left: 1rem;} .boardsearch-wrap .searchtype .searchbox input.forminput {width: 65% !important; height: 6rem; font-size: 1.7rem; padding-left: 1rem;} #slide-faqmenu ul li a .itemarea {display: block; height: auto; padding-top: 1.2rem;} #slide-faqmenu ul li.faq-item a .faq-categoay {order: 2; width: auto; padding-top: 0.5rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li.faq-item a .faq-qico {order: 1; margin-right: 1rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li.faq-item a .faq-subject {order: 3; font-size: 1.8rem; padding-top: 0.5rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li.faq-item .lotate-v {order: 4; position: absolute; top: 45%; right: 2rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li ul.faqnav li {padding: 2rem;} #slide-faqmenu ul li ul.faqnav li .faq-aico {top: 2rem; left: 2rem;} #slide-faqmenu ul li ul.faqnav li p {font-size: 1.6rem; padding-left: 5rem;} #slide-faqmenu ul li ul.faqnav li p img {max-width: 100%;} /* 그누보드 글쓰기 에디터 */ #smart_editor2 {width: 100% !important; min-width: 100% !important;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 03 보험보상 */ .page-inscoverage {padding-top: 8rem;} .page-insprocess {padding: 8rem 0;} .insprocess-list ul li {width: 44%; margin-bottom: 3rem;} .insprocess-list ul li:nth-of-type(2n+2):after {display: none;} .insprocess-list ul li:nth-of-type(3), .insprocess-list ul li:nth-of-type(4) {margin-bottom: 0;} .insprocess-list ul li:after {right: -22%;} .insprocess-list ul li .circel-box .cbox i {height: auto;} .insprocess-list ul li .circel-box .cbox i.fine {height: auto;} .insprocess-list ul li .circel-box .cbox i img {width: 70%;} .insprocess-list ul li .circel-box .cbox p {font-size: 1.8rem; margin-top: 1rem;} .accident-box {position: relative;} .accident-box:before {z-index: 2; content: ""; display: block; position: absolute; top: -25px; right: 0; width: 5rem; height: 5rem; background: url("../images/mousedrag_ico.png") no-repeat 0 0; background-size: 100%;} .accident-table {overflow-x: auto; margin-bottom: 3rem;} .accident-table table.table-layout {min-width: 160%;} .accident-table table.table-layout th {font-size: 1.85rem;} .accident-table table.table-layout td {font-size: 1.65rem;padding: 2% 1%;} .accident-table table.table-layout td.item {font-size: 1.8rem;} .accident-box .etc-list p {font-size: 1.7rem; letter-spacing: -0.1rem; line-height: 1.5; word-break: keep-all;} .accident-box .etc-list p:after {width: 2.4rem; height: 2.3rem; background-size: 2.4rem 2.3rem;} .accident-box .insure-detail .left-tit {width: 100%;} .accident-box .insure-detail .left-tit p {font-size: 3.2rem;} .accident-box .insure-detail .right-insurelist {width: 100%;} .accident-box .insure-detail .right-insurelist ul {margin-top: 3rem;} .accident-box .insure-detail .right-insurelist ul li {width: 100%;} .accident-box .insure-detail .right-insurelist ul li:first-child {margin-bottom: 2rem;} .accident-box .insure-detail .right-insurelist ul li div.tit {font-size: 2.2rem;} .accident-box .insure-detail .right-insurelist ul li .info p {font-size: 1.8rem;} .page-accident {padding: 8rem 2rem;} .page-accident .page-wrap {padding: 0 !important;} .insurance-type {justify-content: space-between;} .insurance-type .safety-logo {width: 48.5%; height: 8rem; padding: 0 3%; border-radius: 1.4rem;} .insurance-type .safety-logo:first-child {margin-right: 0;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 04 제주선박안내 */ .shipcompany-title2 {padding-top: 8rem; margin-bottom: 0;} .page-shipcompany3 {margin-top: 3rem;} .shipcompany-title h3 {font-size: 3.5rem;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 05 고객서비스연구소 */ .page-servicelab {padding-top: 8rem;} .driver-edc ul li .info {min-height: auto;} .page-carcare {padding: 8rem 0; margin-top: 8rem;} .carcare-box ul li {width: 100%; margin-bottom: 2rem;} .carcare-box ul li:last-child {margin-bottom: 0;} .carcare-box ul li .box h4 {height: auto;} .carcare-box ul li .box i {width: 15rem;} .carcare-box ul li .box i img {width: 100%;} .safeoper-list ul li {width: 100%; margin-bottom: 7rem;} .safeoper-list ul li:last-child {margin-bottom: 0;} .safeoper-list ul li .item-box h4 {font-size: 2.4rem; word-break: keep-all;} .safeoper-list ul li .item-box p {font-size: 1.7rem; word-break: keep-all;} .safeoper-list ul li .item-box p span {display: inline;} /* 서브페이지 컨텐츠영역 06 - 회사소개 */ .page-introduce {padding: 5rem 0 8rem;} .page-introduce .page-wrap {margin-top: 0 !important;} .greeting-box .topimg {position: relative;} .greeting-box .topimg img {max-width: 100%;} .greeting-box p {font-size: 2rem; line-height: 1.4;} .greeting-box p br:nth-of-type(3), .greeting-box p br:nth-of-type(6), .greeting-box p br:nth-of-type(7) {display: none;} .page-network {padding: 8rem 0;} .introduce-title {padding: 0 2rem;} .introduce-title h3 {font-size: 3.5rem;} .introduce-title p {font-size: 1.9rem;} .page-organization {padding: 8rem 0;} .organization-box .con-box {padding: 2rem;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 02 경영비전 */ .page-target {padding: 8rem 0;} .target-box .target-list .targetitem {width: 100%; margin-bottom: 5rem;} .target-box .target-list .targetitem:last-child {margin-bottom: 0;} .target-box .target-list .targetitem p {font-size: 2.2rem;} .page-values {padding: 8rem 0;} .values-box .values-list .valuesitem {width: 50%; border-top: 0;} .values-box .values-list .valuesitem:last-child {width: 100%; border-bottom: 1px solid #dfdede; border-left: 1px solid #dfdede;} .values-box .values-list .valuesitem:nth-of-type(3) {border-left: 1px solid #dfdede;} .values-box .values-list .valuesitem .box {min-height: initial /*초기화*/; padding: 2rem 1rem; border-top: 1px solid #dfdede; border-bottom: 0;} .values-box .values-list .valuesitem .box i {width: 10rem; height: 10rem;} .values-box .values-list .valuesitem .box p {font-size: 1.6rem;} .page-rule {padding: 8rem 0;} .rule-list .ruleitem .box .left-img {width: 100%;} .rule-list .ruleitem .box .right-info {width: 100%; margin-top: 3rem;} .rule-list .ruleitem .box .right-info .txt-box .tittxt span {font-size: 2rem;} .rule-list .ruleitem .box .right-info .txt-box .tittxt {font-size: 2.4rem;} .rule-list .ruleitem .box .right-info .txt-box ul {margin-top: 2rem;} .rule-list .ruleitem .box .right-info .txt-box ul li {font-size: 1.8rem;} .rule-list .ruleitem .box .right-info .txt-box ul li:before {font-size: 1.8rem;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 03 연혁 */ .page-history {padding: 5rem 0 8rem;} .page-history .page-wrap {margin-top: 0 !important;} .history-tit {margin-top: 3rem; padding: 0 2rem;} .history-tit span {width: 100%; border-radius: 0.5rem;} .history-content {padding: 0 2rem;} .history-content:before {left: 3rem;} .history-content .list-box {padding-top: 5rem;} .history-content .list-box .year {width: 100%; text-align: left; padding-left: 5rem; padding-right: 0;} .history-content .list-box .year:before {right: 0; left: 0.5rem;} .history-content .list-box .year:after {left: 1.5rem; width: 2.5rem;} .history-content .list-box .time-con {width: 100%; padding-top: 2rem; padding-left: 5rem;} .history-content .list-box .time-con dl {align-items: initial /*초기화*/;} .history-content .list-box .time-con dl dt {width: 6rem; font-size: 1.7rem; vertical-align: top;} .history-content .list-box .time-con dl dd {width: 80%; font-size: 1.65rem; vertical-align: top;} .history-content .list-box:nth-of-type(even) .year {padding-left: 5rem;} .history-content .list-box:nth-of-type(even) .year:before {left: 0.5rem;} .history-content .list-box:nth-of-type(even) .year:after {left: 1.5rem;} .history-content .list-box:nth-of-type(even) .time-con {text-align: left; padding-left: 5rem; padding-right: 0;} .history-content .list-box:nth-of-type(even) .time-con dl dt {order: 1; text-align: left;} .history-content .list-box:nth-of-type(even) .time-con dl dd {order: 2;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 04 오시는길 */ .page-location {padding: 5rem 0 8rem;} .location-box .map-canvas {height: 45rem;} .location-box .map-canvas img {top: -20%;} .location-box .map-info .left-contents .callcenter {width: 100%;} .location-box .map-info .left-contents .address {padding-left: 0;} .location-box .map-info .left-contents .address .txtarea {flex-wrap: wrap; font-size: 1.8rem; line-height: 1.2; margin-top: 2rem; word-break: keep-all;} .location-box .map-info .left-contents .address .txtarea span {margin-bottom: 1rem;} .location-box .map-info .left-contents .address p {padding-left: 0; font-size: 1.8rem;} .location-box .map-info .mapbtn {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; margin-top: 3rem;} .location-box .map-info .mapbtn a {width: 48%;} .location-box .map-info .mapbtn a.naver {margin-right: 0;} /* 서브페이지 컨텐츠영역 07 - 예약하기 */ .reservation-process-re ul li:after {top: 40%; right: -2.4rem;} .reservation-process-re .re-guide-title {margin-bottom: 1rem;} .reservation-process-re .re-guide-title p {font-size: 2.8rem; word-break: keep-all;} .reservation-process-re .re-guide-title p strong {float: left;} .page-reservation {padding: 8rem 0;} .reservation-form {padding: 0 2rem;} .form-box {margin-bottom: 6rem;} .form-box .form-title h3 {font-size: 2.5rem;} .form-box .form-title h3 span {font-size: 2.6rem;} .form-box .form-title p {font-size: 1.7rem; padding-left: 1rem;} .form-box .form-title p.retorntxt {padding-left: 3.1rem; margin-top: 1rem;} .form-box .form-table .table-layout th {width: 30%; font-size: 1.6rem; padding: 1rem 1rem;} .form-box .form-table .table-layout th p {width: 80%; font-size: 1.6rem;} .form-box .form-table .table-layout th:before {font-size: 1.5rem; margin-right: 0.5rem;} .form-box .form-table .table-layout td {font-size: 1.6rem; padding: 1rem;} .form-box .form-table .table-layout td label {font-size: 1.6rem;} .form-box .form-table .table-layout td p {font-size: 1.3rem;} .form-box .form-table .table-layout td .linebreak {margin-right: 1.5rem;} .form-box .form-table .table-layout td .linebreak2 {margin-right: 0;} .form-box .form-table .table-layout td input.style-radio {width: 1.8rem; height: 1.8rem;} .form-box .form-table .table-layout td input.style-input {width: 100%; padding-left: 1rem;} .form-box .form-table .table-layout td input.style-input-code {width: 45%;} .form-box .form-table .table-layout td button.address-search {font-size: 1.5rem; margin-right: 0;} .form-box .form-table .table-layout td input.style-input-arrdess {width: 100%; margin-top: 1rem;} .form-box .form-table .table-layout td input.style-input-addr {width: 100% !important;} .form-box .form-table .table-layout td input.style-input-calendar {margin-right: 0; margin-bottom: 1rem;} /* 서브페이지 컨텐츠영역 07 - 예약하기 - placeholder 속성 설정 */ .form-box .form-table .table-layout td input::-webkit-input-placeholder {font-size: 1.4rem;} .form-box .form-table .table-layout td input::-moz-placeholder {font-size: 1.4rem;} .form-box .form-table .table-layout td input:-ms-input-placeholder {font-size: 1.4rem;} .form-box .form-table .table-layout td input::placeholder {font-size: 1.4rem;} /* 개인정보 활용 동의 */ .privacy-agreement {display: flex; justify-content: center; flex-wrap: wrap;} .privacy-check {align-items: initial; flex-wrap: initial; width: 100%; text-align: left;} .privacy-check .checkbox-input+label {width: 80%; line-height: 1.2; margin-top: 0.2rem;} .pop-form {width: 100%;} /* 개인정보동의 레이어팝업 layerpop */ .popup-contents {width: 90%;} /*가로사이즈 조절*/ .appcarecep-box p {font-size: 2.2rem;} .appcarecep-box .btn-appcarecep a {width: 26.4rem; font-size: 2.5rem; padding-left: 3.5rem;} /* 02 예약조회 */ .subpage-common .page-common .page-title .recheck-guide-title p.guide-txt2 {font-size: 2.4rem;} .page-reservationcheck {padding: 8rem 0;} .reservationcheck-box {padding: 0;} .reservationcheck-box .recheck-box {padding: 3rem 3rem 20rem; background-position: center bottom; background-size: 100%;} /* 서브페이지 컨텐츠영역 08 - 이용약관 및 개인정보처리방침 */ .ctt_agreement {padding: 2rem;} .ctt_privacy {padding: 2rem;} } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Mobile 360,413 예외처리 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:360px) and (max-width:413px) { .sub-gnb ul li a {font-size: 1.25rem;} .subfootcustomer-box .right .conbox .subfoot-slogan .tittxt {font-size: 1.8rem;} .subfootcustomer-box .right .conbox .subfoot-slogan p span {font-size: 1.3rem; padding: 0 1rem;} .service-contents .service-title h4 {font-size: 2.2rem;} .service-contents .service-title p {word-break: keep-all;} .service-contents .service-list .service-item figure figcaption div.tit {font-size: 1.7rem; padding-top: 4.5rem;} .service-contents .service-list .service-item .infotxt div.tit {font-size: 1.8rem;} .service-contents .service-list .service-item .infotxt p {font-size: 1.4rem; line-height: 1.2;} .recommend-list .item-list .item-info .tit {font-size: 1.8rem;} .recommend-list .item-list .item-info p {font-size: 1.5rem;} .bestservice-list ul li dl dt {font-size: 1.6rem; letter-spacing: -0.15rem;} .bestservice-list ul li dl dd {font-size: 1.35rem; letter-spacing: -0.15rem;} .bestservice-list ul li dl .review-btn {margin-top: 2rem;} .bestservice-list ul li dl .review-btn a {height: 4rem; font-size: 1.2rem; line-height: 4.2rem; padding-left: 1.5rem;} .bestservice-list ul li dl .review-btn a i {right: 8%; width: 0.7rem; transform: translateY(-35%);} .reservation-process ul li .listarea .box .step {font-size: 2rem; padding-top: 5%;} .reservation-process ul li .listarea .box .icoarea i {width: 32%; margin-top: 1.5rem;} .reservation-process .receipt-btns a {font-size: 1.8rem; padding-left: 2rem;} .reservation-process .receipt-btns a i {right: 10%;} .shipcompany-list table.table-layout {min-width: 250%;} .txtguide {margin-bottom: 5rem;} /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .mobile-frame {transform: translate(-50%,-66%);} /*모바일 프레임 사이즈 조절*/ .appslide-box .swiper .swiper-slide .app-box .app-stepinfo .tit {font-size: 1.2rem;} .app-download .btnarea .appbann-btn .appbtn a {font-size: 1.8rem;} .rule-list .ruleitem .box .right-info .txt-box .tittxt {font-size: 2rem; letter-spacing: -0.1rem;} .rule-list .ruleitem .box .right-info .txt-box .tittxt span {width: 3.4rem; height: 3.4rem;} .form-box .form-table .table-layout td input.style-input-arrdess {width: 100%;} .corpordrive-process ul li .listarea .box .step {font-size: 1.8rem; padding-top: 0.5rem;} .insprocess-list ul li .circel-box .cbox p {font-size: 1.6rem;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 05 고객서비스연구소 */ .carcare-box ul li .box h4 {font-size: 2.4rem;} .carcare-box ul li .box .info-txt p {font-size: 1.65rem;} /* 서브페이지 컨텐츠영역 06 - 회사소개 */ .values-box .values-list .valuesitem {width: 100%; border: 1px solid #dfdede; border-bottom: 0;} .values-box .values-list .valuesitem .box {border: 0;} /* 서브페이지 컨텐츠영역 07 - 예약하기 */ .form-box .form-table .table-layout th {width: 33%; font-size: 1.35rem;} .form-box .form-table .table-layout th p {font-size: 1.5rem;} .form-box .form-title p {font-size: 1.55rem; margin-top: 1rem; padding-left: 2.6rem;} .form-box .form-table .table-layout td input.style-input-code {width: 41%;} .form-box .form-table .table-layout td button.address-search {padding: 0 1rem; margin-right: 0;} /* 서브페이지 컨텐츠영역 07 - 예약하기 - placeholder 속성 설정 */ .form-box .form-table .table-layout td input::-webkit-input-placeholder {font-size: 1.3rem;} .form-box .form-table .table-layout td input::-moz-placeholder {font-size: 1.3rem;} .form-box .form-table .table-layout td input:-ms-input-placeholder {font-size: 1.3rem;} .form-box .form-table .table-layout td input::placeholder {font-size: 1.3rem;} .ui-datepicker {width: 22rem !important;} } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Mobile 380,419 예외처리 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:380px) and (max-width:419px) { .mobile-frame {max-width: 55%; transform: translate(-50%, -64%);} } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Mobile 420,480 예외처리 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:420px) and (max-width:480px) { .mobile-frame {max-width: 55%; transform: translate(-50%, -62%);} } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Mobile 481,520 예외처리 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:481px) and (max-width:520px) { .subpage-common .page-servicelab .page-title p span {display: inline;} /* 서브페이지 컨텐츠영역 02 - 제주탁송 */ .restricteditems-box .item-box h4 {width: 78%;} /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .appslide-box .swiper .swiper-slide .app-box .app-stepinfo .tit {font-size: 1.35rem;} .mobile-frame {transform: translate(-50%,-62%);} /*모바일 프레임 사이즈 조절*/ } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Mobile 521,569 예외처리 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:521px) and (max-width:569px) { .subpage-common .page-servicelab .page-title p span {display: inline;} /* 서브페이지 컨텐츠영역 02 - 제주탁송 */ .restricteditems-box .item-box h4 {width: 73%;} /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .mobile-frame {max-width: 55.5%; transform: translate(-50%,-60.2%);} /*모바일 프레임 사이즈 조절*/ .corpordrive-process ul li .listarea .box .icoarea i {margin-top: 3.5rem;} } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Mobile 570,719 예외처리 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:570px) and (max-width:719px) { /* 서브페이지 컨텐츠영역 02 - 제주탁송 */ .reservation-process ul li .listarea .box .icoarea i {margin-top: 3rem;} .restricteditems-box .item-box h4:before {width: 85%;} /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .mobile-frame {max-width: 35%; transform: translate(-50%,-65%);} /*모바일 프레임 사이즈 조절*/ } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Tablet 720,767 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:720px) and (max-width:767px) { /* 레이아웃 공통 영역 */ .subpage-common .page-common .page-title {padding: 0 4rem;} .subpage-common .page-common .page-wrap {padding: 0 4rem; margin-top: 5rem;} /* PC용 서브 하단 고정 고객센터 공통 영역 */ .subfoot-common .left-colortbg:before {width: 80%;} .subfoot-common .left-colortbg:after {top: -160%; right: 0;} .subfootcustomer-box .left .conbox p {font-size: 2rem;} .subfootcustomer-box .right .conbox .subfoot-map {width: 30%;} .subfootcustomer-box .right .conbox .subfoot-slogan {width: 70%; padding-left: 1rem;} .subfootcustomer-box .right .conbox .subfoot-slogan .tittxt {font-size: 2rem; word-break: keep-all;} .subfootcustomer-box .right .conbox .subfoot-slogan p span {height: 3.2rem; font-size: 1.3rem; line-height: 3.3rem; padding: 0 1.5rem; margin: 0.25rem 0.25rem;} /* 서브 sub-visual 배경이미지 영역 */ .sub-visual {height: 300px; margin-top: 70px; background-position: center;} .sub-visual:before {position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: rgba(0,0,0,0.2);} .sub-visual-shadow:before {background-color: rgba(0,0,0,0.08);} /* 서브 대메뉴 타이틀 영역 */ .subtitle-area {padding: 0 4rem;} .subtitle-area p {padding-right: 5rem;} .subtitle-area p span {display: inline;} /* Mobile용 서브하위매뉴 스크롤고정 높이값 */ .mo-sub-gnb.roll {top: 70px;} .mo-sub-gnb ul li a {font-size: 1.6rem; line-height: 40px;} .mo-sub-gnbtab {top: 70px;} .mo-sub-gnbtab .tabs-container ul li a {font-size: 1.8rem;} /* PC용 서브하위매뉴 삭제 */ .sub-gnb {display: none;} .sub-gnbtab {display: none;} /* 서브페이지 컨텐츠영역 01 - 전국차량탁송 */ .page-servicetype {padding-top: 8rem;} .service-type2 {margin-top: 3rem;} .service-type .itemtype .item-info h3 {font-size: 3rem;} .service-type .itemtype .item-info p {font-size: 2rem;} .service-type .itemtype .item-info p span {display: inline;} .service-contents .service-list {flex-wrap: wrap;} .service-contents .service-list .service-item {width: 48%; margin-bottom: 5rem;} .service-contents .service-list .service-item:nth-of-type(3), .service-contents .service-list .service-item:nth-of-type(4) {margin-bottom: 0;} .tagsongbigyo-box {padding: 3rem 3rem;} .tagsongbigyo-box h4 {font-size: 2.4rem;} .tagsongbigyo-box .tablebox {display: flex;} .tagsongbigyo-box .tablebox .table-layout th {height: auto;font-size: 2rem; padding: 3% 0;} .tagsongbigyo-box .tablebox .table-layout th span {display: inline;} .tagsongbigyo-box .tablebox .table-layout td {font-size: 1.6rem; padding: 2% 1%;} .tagsongbigyo-box .tablebox .table-layout td.tit {font-size: 1.65rem;} .tagsongbigyo-box .tablebox .table-layout td.mark i {display: inline-block; width: 1.5rem;} .tagsongbigyo-box .tablebox .table-layout td.mark i img {width: 100%;} .tagsongbigyo-box .tablebox:after {top: -2px; height: 100.5%; border: 3px solid #d53331;} .page-progress {padding-top: 8rem;} .progress-list {padding: 4rem;} .progress-list .liststep {width: 48%; margin-bottom: 3rem;} .progress-list .liststep .stepbox .stepinfo {padding: 0 2rem;} .page-recommend {padding: 8rem 0; margin-top: 8rem;} .recommend-list .item-list {width: 48%;} .bestservice-list {padding: 3rem;} .bestservice-list ul li {width: 50%;} .page-bestservice {padding-top: 8rem;} .page-process {padding: 8rem 0; margin-top: 8rem;} .reservation-process ul {justify-content: center;} .reservation-process ul li {width: 33.3334%; padding: 2rem;} .reservation-process ul li:after {top: 32%; right: -1rem; background-size: 90%;} .reservation-process ul li:nth-of-type(3n+3):after {display: none;} .reservation-process ul li:last-child {margin-bottom: 0;} .reservation-process ul li .listarea .box .step {font-size: 2.2rem; padding-top: 5%;} .reservation-process ul li .listarea .box .icoarea i {width: 36%;} .reservation-process ul li .listarea .box .icoarea p {font-size: 2rem;} .reservation-process .receipt-btns {margin-top: 4rem;} .page-shipcompany {padding: 8rem 0; margin-top: 8rem;} .shipcompany-list {padding: 0;} .shipcompany-list table.table-layout th {font-size: 1.85rem;} .shipcompany-list table.table-layout td {font-size: 1.65rem; line-height: 1.3; padding: 0 0.5%; word-break: keep-all;} .shipcompany-list table.table-layout td.siteurl {padding: 0 2%;} .shiprace-list {padding: 0;} .shiprace-list table.table-layout th {font-size: 1.85rem;} .shiprace-list table.table-layout td {font-size: 1.65rem; padding: 0 0.5%;} /* 서브페이지 컨텐츠영역 02 - 제주탁송 */ .page-restricteditems {padding: 8rem 0;} .restricteditems-box {flex-wrap: wrap;} .restricteditems-box .item-box {width: 100%; height: 100%; margin-bottom: 2rem;} .restricteditems-box .item-box:last-child {margin-bottom: 0;} .restricteditems-box .item-box .infotxt {margin-bottom: 3rem;} .restricteditems-box .item-box h4 {width: 70%;} .restricteditems-box .item-box h4:before {width: 84%;} .page-noticenote {padding: 2rem 0 8rem;} .noticenote-box .note-list ul {width: 100%;} .noticenote-box .note-list ul .notesub .img img {width: 100%;} /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .page-driverbanner {padding-top: 8rem;} .driverbanner-box .bann-left {width: 100%;} .driverbanner-box .bann-right {width: 100%;} .page-appservice {padding: 8rem 0; margin-top: 8rem;} .mobile-frame {max-width: 36%; transform: translate(-50%,-61%);} /*모바일 프레임 사이즈 조절*/ .page-appbanner {height: auto; padding: 4rem 2rem;} .app-download {justify-content: center;} .app-download .txtarea {width: 100%; text-align: center;} .page-protocoldriver {padding: 8rem 0;} .driver-list {flex-wrap: wrap;} .driver-list .driver-type {width: 48%; margin-bottom: 5rem;} .driver-list .driver-type:nth-of-type(3), .driver-list .driver-type:nth-of-type(4) {margin-bottom: 0;} .page-corpordrive {padding: 8rem 0;} .corpordrive-list .item-list {width: 48%; margin-bottom: 5rem;} .corpordrive-list .item-list:last-child {margin-bottom: 0;} .corpordrive-process ul li {width: 33.3334%; padding: 2rem;} .corpordrive-process ul li:after {top: 35%; right: -1rem; background-size: 90%;} .corpordrive-process ul li:nth-of-type(3n+3):after {display: none;} .page-edusystem {padding-top: 8rem;} .edusystem-contents .driver-common .left-tit {width: 100%; margin-bottom: 4rem;} .edusystem-contents .driver-common .right-info {width: 100%;} .driver-mind ul li:nth-of-type(-n+2) {margin-bottom: 4rem;} .driver-edc ul li .info {min-height: 28rem;} .driver-edc ul li .info .tittxt {height: 5.5rem; line-height: 1.3;} .driver-evalua .box .left-img {width: 100%;} .driver-evalua .box .right-box {width: 100%; margin-top: 2rem;} .driver-evalua .box .right-box .txt .number-txt p {line-height: 1.4;} .employment-box .box .left-img {width: 100%;} .employment-box .box .left-img figure {height: 60rem;} .employment-box .box .employment-guide {width: 100%; margin-top: 3rem;} .page-corporfee {padding-top: 8rem;} .corporfee-box table.table-layout th {font-size: 2rem;} .corporfee-box table.table-layout td.price {font-size: 2rem;} /* 서브페이지 컨텐츠영역 04 - 고객후기 */ .page-solution .review-morearea .shortcuts-box {padding: 0 2rem;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 02 자주묻는질문 */ .boardsearch-wrap {padding: 2rem 2rem;} .boardsearch-wrap .searchtype {width: 100%;} .boardsearch-wrap .searchtype .searchbox {width: 100%; display: initial;} .boardsearch-wrap .searchtype .searchbox select.formselect {width: 35% !important; height: 6rem; padding-left: 1rem;} .boardsearch-wrap .searchtype .searchbox input.forminput {width: 65% !important; height: 6rem; padding-left: 1rem;} #slide-faqmenu ul li a .itemarea {display: block; height: auto; padding-top: 1.2rem;} #slide-faqmenu ul li.faq-item a .faq-categoay {order: 2; width: auto; padding-top: 0.5rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li.faq-item a .faq-qico {order: 1; margin-right: 1rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li.faq-item a .faq-subject {order: 3; padding-top: 0.5rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li.faq-item .lotate-v {order: 4; position: absolute; top: 45%; right: 2rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li ul.faqnav li {padding: 2rem;} #slide-faqmenu ul li ul.faqnav li .faq-aico {top: 2rem; left: 2rem;} #slide-faqmenu ul li ul.faqnav li p {padding-left: 5rem;} #slide-faqmenu ul li ul.faqnav li p img {max-width: 100%;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 03 보험보상 */ .page-inscoverage {padding-top: 8rem;} .page-insprocess {padding: 8rem 0;} .insprocess-list ul li {width: 50%; padding: 4rem;} .insprocess-list ul li:after {right: -4%;} .insprocess-list ul li:nth-of-type(2n+2):after {display: none;} .page-accident {padding: 8rem 0;} .accident-box table.table-layout th {font-size: 2rem;} .insurance-type {justify-content: space-between;} .insurance-type .safety-logo {width: 48.5%; height: 12rem; padding: 0 3%; border-radius: 1.4rem;} .insurance-type .safety-logo:first-child {margin-right: 0;} .shipcompany-title {padding-top: 8rem; margin-bottom: 0;} .page-shipcompany3 {margin-top: 3rem;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 05 고객서비스연구소 */ .carcare-box ul li {width: 100%; margin-bottom: 3rem;} .carcare-box ul li:last-child {margin-bottom: 0;} .safeoper-list ul li {width: 100%; margin-bottom: 7rem;} .safeoper-list ul li:last-child {margin-bottom: 0;} /* 서브페이지 컨텐츠영역 06 - 회사소개 */ .page-introduce {padding: 8rem 0 8rem;} .page-introduce .page-wrap {margin-top: 0 !important;} .greeting-box .topimg {position: relative; height: 24rem; overflow: hidden;} .greeting-box .topimg img {max-width: none; height: 100%; position: absolute; top: 0; left: 50%; margin-left: -67.5rem;} /* 이미지 재설정값 */ .greeting-box p br:nth-of-type(3), .greeting-box p br:nth-of-type(6), .greeting-box p br:nth-of-type(7) {display: none;} .page-network {padding: 8rem 0;} .page-organization {padding: 8rem 0;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 02 경영비전 */ .page-target {padding: 8rem 0;} .target-box .target-list .targetitem p {font-size: 2rem;} .page-values {padding: 8rem 0;} .values-box .values-list .valuesitem {width: 50%; border-top: 0;} .values-box .values-list .valuesitem:last-child {width: 100%; border-bottom: 1px solid #dfdede; border-left: 1px solid #dfdede;} .values-box .values-list .valuesitem:nth-of-type(3) {border-left: 1px solid #dfdede;} .values-box .values-list .valuesitem .box {min-height: initial /*초기화*/; padding: 4rem 3rem; border-top: 1px solid #dfdede; border-bottom: 0;} .rule-list .ruleitem .box .right-info .txt-box .tittxt {font-size: 2.6rem;} .rule-list .ruleitem .box .right-info .txt-box ul li {font-size: 1.9rem;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 03 연혁 */ .page-history {padding: 8rem 0 8rem;} .page-history .page-wrap {margin-top: 0 !important;} .subpage-common .page-common .page-wrap2 {margin-top: 3rem !important;} .history-content .list-box .year {padding-right: 10rem;} .history-content .list-box .year:after {width: 8rem;} .history-content .list-box .time-con {padding-left: 3rem;} .history-content .list-box .time-con dl {align-items: initial /*초기화*/;} .history-content .list-box .time-con dl dd {width: 70%;} .history-content .list-box:nth-of-type(even) .year {padding-left: 10rem;} .history-content .list-box:nth-of-type(even) .time-con {float: right; padding-right: 3rem;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 04 오시는길 */ .page-location {padding: 8rem 0 8rem;} .location-box .map-canvas {height: 45rem;} .location-box .map-canvas img {top: -20%;} .location-box .map-info .left-contents {flex-wrap: initial /*초기화*/;} .location-box .map-info .left-contents .callcenter p {font-size: 1.7rem;} .location-box .map-info .left-contents .callcenter .callnumber {margin-top: 1rem;} .location-box .map-info .left-contents .callcenter .callnumber span {font-size: 3rem;} .location-box .map-info .left-contents .address .txtarea {align-items: initial /*초기화*/; line-height: 1.2;} .location-box .map-info .left-contents .address p {padding-left: 6rem;} .location-box .map-info .mapbtn {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; margin-top: 3rem;} .location-box .map-info .mapbtn a {width: 48%;} .location-box .map-info .mapbtn a.naver {margin-right: 0;} /* 서브페이지 컨텐츠영역 07 - 예약하기 */ .reservation-process-re ul li:after {top: 45%; right: -1rem;} .page-reservation {padding: 8rem 0;} .reservation-form {padding: 0 4rem;} .form-box .form-table .table-layout th {width: 28%; font-size: 1.8rem; padding: 1.5rem 2rem 1.5rem 2rem;} .form-box .form-table .table-layout th p {font-size: 1.8rem;} .form-box .form-table .table-layout td input.style-input-code {width: 40%;} .form-box .form-table .table-layout td input.style-input-calendar {margin-bottom: 1rem;} .form-box .form-table .table-layout td input.style-input-arrdess {width: 100%; margin-top: 1rem;} .form-box .form-table .table-layout td input.style-input-addr {width: 100% !important;} /* 개인정보동의 레이어팝업 layerpop */ .popup-contents {width: 90%;} /*가로사이즈 조절*/ /* 서브페이지 컨텐츠영역 07 - 예약하기 - 02 예약조회 */ .page-reservationcheck {padding: 8rem 0;} .reservationcheck-box {padding: 0;} .reservationcheck-box .recheck-box {padding: 5rem 5rem 30rem; background-position: center bottom; background-size: 100%;} } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Tablet 768,1023 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:768px) and (max-width:1023px) { /* 레이아웃 공통 영역 */ .subpage-common .page-common .page-title {padding: 0 4rem;} .subpage-common .page-common .page-wrap {padding: 0 4rem; margin-top: 5rem;} /* PC용 서브 하단 고정 고객센터 공통 영역 */ .subfoot-common .left-colortbg:before {width: 80%;} .subfoot-common .left-colortbg:after {top: -160%; right: 0;} .subfootcustomer-box .left .conbox p {font-size: 2rem;} .subfootcustomer-box .right .conbox .subfoot-map {width: 30%;} .subfootcustomer-box .right .conbox .subfoot-slogan {width: 70%; padding-left: 1rem;} .subfootcustomer-box .right .conbox .subfoot-slogan .tittxt {font-size: 2rem; word-break: keep-all;} .subfootcustomer-box .right .conbox .subfoot-slogan p span {height: 3.2rem; font-size: 1.3rem; line-height: 3.3rem; padding: 0 1.5rem; margin: 0.25rem 0.25rem;} /* 서브 sub-visual 배경이미지 영역 */ .sub-visual {height: 300px; margin-top: 70px; background-position: center;} .sub-visual:before {position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; background-color: rgba(0,0,0,0.2);} .sub-visual-shadow:before {background-color: rgba(0,0,0,0.08);} /* 서브 대메뉴 타이틀 영역 */ .subtitle-area {padding: 0 4rem;} .subtitle-area p {padding-right: 5rem;} .subtitle-area p span {display: inline;} /* Mobile용 서브하위매뉴 스크롤고정 높이값 */ .mo-sub-gnb.roll {top: 70px;} .mo-sub-gnb ul li a {font-size: 1.6rem; line-height: 40px;} .mo-sub-gnbtab {top: 70px;} .mo-sub-gnbtab .tabs-container ul li a {font-size: 1.8rem;} /* PC용 서브하위매뉴 삭제 */ .sub-gnb {display: none;} .sub-gnbtab {display: none;} /* 서브페이지 컨텐츠영역 01 - 전국차량탁송 */ .page-servicetype {padding-top: 8rem;} .service-type2 {margin-top: 3rem;} .service-type .itemtype .item-info h3 {font-size: 3rem;} .service-type .itemtype .item-info p {font-size: 2rem;} .service-type .itemtype .item-info p span {display: inline;} .service-contents .service-list {flex-wrap: wrap;} .service-contents .service-list .service-item {width: 48%; margin-bottom: 5rem;} .service-contents .service-list .service-item:nth-of-type(3), .service-contents .service-list .service-item:nth-of-type(4) {margin-bottom: 0;} .tagsongbigyo-box {padding: 3rem 3rem;} .tagsongbigyo-box h4 {font-size: 2.4rem;} .tagsongbigyo-box .tablebox {display: flex;} .tagsongbigyo-box .tablebox .table-layout th {height: auto;font-size: 2rem; padding: 3% 0;} .tagsongbigyo-box .tablebox .table-layout th span {display: inline;} .tagsongbigyo-box .tablebox .table-layout td {font-size: 1.6rem; padding: 2% 1%;} .tagsongbigyo-box .tablebox .table-layout td.tit {font-size: 1.65rem;} .tagsongbigyo-box .tablebox .table-layout td.mark i {display: inline-block; width: 1.5rem;} .tagsongbigyo-box .tablebox .table-layout td.mark i img {width: 100%;} .tagsongbigyo-box .tablebox:after {top: -2px; height: 100.5%; border: 3px solid #d53331;} .page-progress {padding-top: 8rem;} .progress-list {padding: 4rem;} .progress-list .liststep {width: 48%; margin-bottom: 3rem;} .progress-list .liststep .stepbox .stepinfo {padding: 0 2rem;} .page-recommend {padding: 8rem 0; margin-top: 8rem;} .recommend-list .item-list {width: 48%;} .bestservice-list {padding: 3rem;} .bestservice-list ul li {width: 50%;} .page-bestservice {padding-top: 8rem;} .page-process {padding: 8rem 0; margin-top: 8rem;} .reservation-process ul {justify-content: center;} .reservation-process ul li {width: 33.3334%; padding: 2rem;} .reservation-process ul li:after {top: 32%; right: -1rem; background-size: 90%;} .reservation-process ul li:nth-of-type(3n+3):after {display: none;} .reservation-process ul li:last-child {margin-bottom: 0;} .reservation-process ul li .listarea .box .step {font-size: 2.2rem; padding-top: 5%;} .reservation-process ul li .listarea .box .icoarea i {width: 36%;} .reservation-process ul li .listarea .box .icoarea p {font-size: 2rem;} .reservation-process .receipt-btns {margin-top: 4rem;} .page-shipcompany {padding: 8rem 0; margin-top: 8rem;} .shipcompany-list {padding: 0;} .shipcompany-list table.table-layout th {font-size: 1.85rem;} .shipcompany-list table.table-layout td {font-size: 1.65rem; line-height: 1.3; padding: 0 0.5%; word-break: keep-all;} .shipcompany-list table.table-layout td.siteurl {padding: 0 2%;} .shiprace-list {padding: 0;} .shiprace-list table.table-layout th {font-size: 1.85rem;} .shiprace-list table.table-layout td {font-size: 1.65rem; padding: 0 0.5%;} /* 서브페이지 컨텐츠영역 02 - 제주탁송 */ .page-restricteditems {padding: 8rem 0;} .restricteditems-box {flex-wrap: wrap;} .restricteditems-box .item-box {width: 100%; height: 100%; margin-bottom: 2rem;} .restricteditems-box .item-box:last-child {margin-bottom: 0;} .restricteditems-box .item-box .infotxt {margin-bottom: 3rem;} .restricteditems-box .item-box h4 {width: 70%;} .restricteditems-box .item-box h4:before {width: 84%;} .page-noticenote {padding: 2rem 0 8rem;} .noticenote-box .note-list ul {width: 100%;} .noticenote-box .note-list ul .notesub .img img {width: 100%;} /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .page-driverbanner {padding-top: 8rem;} .driverbanner-box .bann-left {width: 100%;} .driverbanner-box .bann-right {width: 100%;} .page-appservice {padding: 8rem 0; margin-top: 8rem;} .mobile-frame {max-width: 36%; transform: translate(-50%,-61%);} /*모바일 프레임 사이즈 조절*/ .page-appbanner {height: auto; padding: 4rem 2rem;} .app-download {justify-content: center;} .app-download .txtarea {width: 100%; text-align: center;} .page-protocoldriver {padding: 8rem 0;} .driver-list {flex-wrap: wrap;} .driver-list .driver-type {width: 48%; margin-bottom: 5rem;} .driver-list .driver-type:nth-of-type(3), .driver-list .driver-type:nth-of-type(4) {margin-bottom: 0;} .page-corpordrive {padding: 8rem 0;} .corpordrive-list .item-list {width: 31.12299465240642%; margin-bottom: 5rem;} .corpordrive-list .item-list:last-child {margin-bottom: 0;} .corpordrive-list .item-list .item-info .tit {font-size: 2.4rem;} .corpordrive-process ul li {width: 33.3334%; padding: 2rem;} .corpordrive-process ul li:after {top: 35%; right: -1rem; background-size: 90%;} .corpordrive-process ul li:nth-of-type(3n+3):after {display: none;} .page-edusystem {padding-top: 8rem;} .edusystem-contents .driver-common .left-tit {width: 100%; margin-bottom: 4rem;} .edusystem-contents .driver-common .right-info {width: 100%;} .driver-mind ul li:nth-of-type(-n+2) {margin-bottom: 4rem;} .driver-edc ul li .info {min-height: 28rem;} .driver-edc ul li .info .tittxt {height: 5.5rem; font-size: 2.4rem; line-height: 1.3;} .driver-evalua .box .left-img {width: 100%;} .driver-evalua .box .right-box {width: 100%; margin-top: 2rem;} .driver-evalua .box .right-box .txt .number-txt p {line-height: 1.4;} .employment-box .box .left-img {width: 100%;} .employment-box .box .left-img figure {height: 60rem;} .employment-box .box .employment-guide {width: 100%; margin-top: 3rem;} .page-corporfee {padding-top: 8rem;} .corporfee-box table.table-layout th {font-size: 2rem;} .corporfee-box table.table-layout td.price {font-size: 2rem;} /* 서브페이지 컨텐츠영역 04 - 고객후기 */ .page-solution .review-morearea .shortcuts-box {padding: 0 2rem;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 02 자주묻는질문 */ .boardsearch-wrap {padding: 2rem 2rem;} .boardsearch-wrap .searchtype {width: 100%;} .boardsearch-wrap .searchtype .searchbox {width: 100%; display: initial;} .boardsearch-wrap .searchtype .searchbox select.formselect {width: 35% !important; height: 6rem; padding-left: 1rem;} .boardsearch-wrap .searchtype .searchbox input.forminput {width: 65% !important; height: 6rem; padding-left: 1rem;} #slide-faqmenu ul li a .itemarea {display: block; height: auto; padding-top: 1.2rem;} #slide-faqmenu ul li.faq-item a .faq-categoay {order: 2; width: auto; padding-top: 0.5rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li.faq-item a .faq-qico {order: 1; margin-right: 1rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li.faq-item a .faq-subject {order: 3; padding-top: 0.5rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li.faq-item .lotate-v {order: 4; position: absolute; top: 45%; right: 2rem;} /* 컨텐츠 방향 변경 */ #slide-faqmenu ul li ul.faqnav li {padding: 2rem;} #slide-faqmenu ul li ul.faqnav li .faq-aico {top: 2rem; left: 2rem;} #slide-faqmenu ul li ul.faqnav li p {padding-left: 5rem;} #slide-faqmenu ul li ul.faqnav li p img {max-width: 100%;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 03 보험보상 */ .page-inscoverage {padding-top: 8rem;} .page-insprocess {padding: 8rem 0;} .insprocess-list ul li {width: 50%; padding: 4rem;} .insprocess-list ul li:after {right: -4%;} .insprocess-list ul li:nth-of-type(2n+2):after {display: none;} .page-accident {padding: 8rem 0;} .accident-box table.table-layout th {font-size: 2rem;} .insurance-type {justify-content: space-between;} .insurance-type .safety-logo {width: 48.5%; height: 12rem; padding: 0 3%; border-radius: 1.4rem;} .insurance-type .safety-logo:first-child {margin-right: 0;} .shipcompany-title {padding-top: 8rem; margin-bottom: 0;} .page-shipcompany3 {margin-top: 3rem;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 05 고객서비스연구소 */ .carcare-box ul li {width: 100%; margin-bottom: 3rem;} .carcare-box ul li:last-child {margin-bottom: 0;} .safeoper-list ul li {width: 100%; margin-bottom: 7rem;} .safeoper-list ul li:last-child {margin-bottom: 0;} /* 서브페이지 컨텐츠영역 06 - 회사소개 */ .page-introduce {padding: 8rem 0 8rem;} .page-introduce .page-wrap {margin-top: 0 !important;} .greeting-box .topimg {position: relative; height: 24rem; overflow: hidden;} .greeting-box .topimg img {max-width: none; height: 100%; position: absolute; top: 0; left: 50%; margin-left: -67.5rem;} /* 이미지 재설정값 */ .greeting-box p br:nth-of-type(3), .greeting-box p br:nth-of-type(6), .greeting-box p br:nth-of-type(7) {display: none;} .page-network {padding: 8rem 0;} .page-organization {padding: 8rem 0;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 02 경영비전 */ .page-target {padding: 8rem 0;} .target-box .target-list .targetitem p {font-size: 2rem;} .page-values {padding: 8rem 0;} .values-box .values-list .valuesitem {width: 50%; border-top: 0;} .values-box .values-list .valuesitem:last-child {width: 100%; border-bottom: 1px solid #dfdede; border-left: 1px solid #dfdede;} .values-box .values-list .valuesitem:nth-of-type(3) {border-left: 1px solid #dfdede;} .values-box .values-list .valuesitem .box {min-height: initial /*초기화*/; padding: 4rem 3rem; border-top: 1px solid #dfdede; border-bottom: 0;} .rule-list .ruleitem .box .right-info .txt-box .tittxt {font-size: 2.6rem;} .rule-list .ruleitem .box .right-info .txt-box ul li {font-size: 1.9rem;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 03 연혁 */ .page-history {padding: 8rem 0 8rem;} .page-history .page-wrap {margin-top: 0 !important;} .subpage-common .page-common .page-wrap2 {margin-top: 3rem !important;} .history-content .list-box .year {padding-right: 10rem;} .history-content .list-box .year:after {width: 8rem;} .history-content .list-box .time-con {padding-left: 3rem;} .history-content .list-box .time-con dl {align-items: initial /*초기화*/;} .history-content .list-box .time-con dl dd {width: 70%;} .history-content .list-box:nth-of-type(even) .year {padding-left: 10rem;} .history-content .list-box:nth-of-type(even) .time-con {float: right; padding-right: 3rem;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 04 오시는길 */ .page-location {padding: 8rem 0 8rem;} .location-box .map-canvas {height: 45rem;} .location-box .map-canvas img {top: -20%;} .location-box .map-info .left-contents {flex-wrap: initial /*초기화*/;} .location-box .map-info .left-contents .callcenter p {font-size: 1.7rem;} .location-box .map-info .left-contents .callcenter .callnumber {margin-top: 1rem;} .location-box .map-info .left-contents .callcenter .callnumber span {font-size: 3rem;} .location-box .map-info .left-contents .address .txtarea {align-items: initial /*초기화*/; line-height: 1.2;} .location-box .map-info .left-contents .address p {padding-left: 6rem;} .location-box .map-info .mapbtn {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; margin-top: 3rem;} .location-box .map-info .mapbtn a {width: 48%;} .location-box .map-info .mapbtn a.naver {margin-right: 0;} /* 서브페이지 컨텐츠영역 07 - 예약하기 */ .reservation-process-re ul li:after {top: 45%; right: -1rem;} .page-reservation {padding: 8rem 0;} .reservation-form {padding: 0 4rem;} .form-box .form-table .table-layout th {width: 28%; font-size: 1.8rem; padding: 1.5rem 2rem 1.5rem 2rem;} .form-box .form-table .table-layout th p {font-size: 1.8rem;} .form-box .form-table .table-layout td input.style-input-code {width: 40%;} .form-box .form-table .table-layout td input.style-input-calendar {margin-bottom: 1rem;} .form-box .form-table .table-layout td input.style-input-arrdess {width: 100%; margin-top: 1rem;} .form-box .form-table .table-layout td input.style-input-addr {width: 100% !important;} /* 개인정보동의 레이어팝업 layerpop */ .popup-contents {width: 90%;} /*가로사이즈 조절*/ /* 서브페이지 컨텐츠영역 07 - 예약하기 - 02 예약조회 */ .page-reservationcheck {padding: 8rem 0;} .reservationcheck-box {padding: 0;} .reservationcheck-box .recheck-box {padding: 5rem 5rem 30rem; background-position: center bottom; background-size: 100%;} } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Mobile 821,920 예외처리 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:821px) and (max-width:920px) { /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .mobile-frame {max-width: 37%; transform: translate(-50%,-60%);} /*모바일 프레임 사이즈 조절*/ } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Mobile 921,1023 예외처리 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:921px) and (max-width:1023px) { /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .mobile-frame {max-width: 37%; transform: translate(-50%,-58%);} /*모바일 프레임 사이즈 조절*/ } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 PC 1024,1279 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:1024px) and (max-width:1279px) { /* 레이아웃 공통 영역 */ .subpage-common .page-common .page-title {padding: 0 2rem;} .subpage-common .page-common .page-wrap {padding: 0 2rem;} /* Mobile용 서브 메뉴리스트 영역 */ .mo-sub-gnb {display: none;} .mo-sub-gnbtab {display: none;} /* PC용 서브 하위메뉴 리스트 영역 */ .sub-gnb ul li {padding: 0 1.5rem;} /* PC용 서브 하단 고정 고객센터 공통 영역 */ .subfoot-common .left-colortbg:after {right: 10%;} .subfootcustomer-box .right .conbox .subfoot-slogan {padding-left: 2rem;} .subfootcustomer-box .right .conbox .subfoot-slogan .tittxt {font-size: 3rem;} .subfootcustomer-box .right .conbox .subfoot-slogan p span {font-size: 1.6rem;} /* 서브페이지 컨텐츠영역 01 - 전국차량탁송 */ .service-type2 {margin-top: 5rem;} .service-type .itemtype .item-info p span {display: inline;} .service-contents .service-list .service-item .infotxt p span {display: inline;} .tagsongbigyo-box {padding: 5rem 4rem;} .tagsongbigyo-box .tablebox:after {left: 19.2%;} .progress-list .liststep .stepbox .stepinfo {padding: 0 2rem;} .bestservice-list ul li dl {min-height: 36rem;} .bestservice-list ul li dl dt {font-size: 2.2rem;} .bestservice-list ul li dl dt span {display: inline;} .bestservice-list ul li dl dd span {display: inline;} .bestservice-list ul li dl .review-btn {margin-top: 2rem;} .bestservice-list ul li dl .review-btn a {width: 100%; padding-left: 2rem;} .reservation-process ul li .listarea .box .icoarea i {width: 30%;} .reservation-process ul li:after {top: 28%; right: -2.8rem;} .reservation-process ul li:last-child p.contxt span {display: inline;} .shipcompany-list table.table-layout th {font-size: 2.2rem;} .shipcompany-list table.table-layout td {font-size: 2rem; padding: 0;} .shipcompany-list table.table-layout td.siteurl {padding: 0 2%;} .shiprace-list table.table-layout th {font-size: 2.2rem;} .shiprace-list table.table-layout td {font-size: 2rem;} /* 서브페이지 컨텐츠영역 02 - 제주탁송 */ .restricteditems-box .item-box {height: auto; padding-bottom: 3rem;} .restricteditems-box .item-box h4 {width: 90%;} .restricteditems-box .item-box h4:before {width: 75%;} .restricteditems-box .item-box .guide {font-size: 2.4rem;} .restricteditems-box .item-box .infotxt .tit {height: 7.5rem;} .noticenote-box .note-list ul .notesub .img img {width: 100%;} /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .mobile-frame {max-width: 20.85%; transform: translate(-50%,-63.5%);} /*모바일 프레임 사이즈 조절*/ .app-download {padding: 0 2rem;} .app-download .txtarea p {font-size: 2.4rem;} .page-protocoldriver {padding: 12rem 2rem;} .page-corpordrive {padding: 12rem 2rem;} .corpordrive-process ul li .listarea .box .step {font-size: 1.8rem; padding-top: 0.8rem;} .corpordrive-process ul li .listarea .box .icoarea i {width: 44%; margin-top: 2rem;} .corpordrive-process ul li:after {right: -2.5rem;} .driver-edc ul li .info .tittxt {font-size: 2.3rem;} .driver-evalua .box {align-items: initial /*초기화*/;} .driver-evalua .box .right-box .txt .number-txt p {font-size: 2rem;} .employment-box .box {align-items: initial /*초기화*/;} .employment-box .box .employment-guide ul li .gudie-info p {font-size: 1.8rem;} /* 서브페이지 컨텐츠영역 05 - 고객센터 - 03 보험보상 */ .page-insprocess {padding: 12rem 2rem;} .page-insprocess .page-wrap {padding: 0 !important;} .insprocess-list ul li .circel-box .cbox p {font-size: 2.2rem;} .page-accident {padding: 12rem 0;} .insurance-type .safety-logo img {max-width: 80%;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 02 경영비전 */ .values-box .values-list .valuesitem .box {padding: 2rem; min-height: auto;} /* 서브페이지 컨텐츠영역 06 - 회사소개 - 04 오시는길 */ .location-box .map-info .mapbtn {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; margin-top: 3rem;} .location-box .map-info .mapbtn a {width: 48%;} .location-box .map-info .mapbtn a.naver {margin-right: 0;} /* 서브페이지 컨텐츠영역 07 - 예약하기 */ .page-reservation {padding: 8rem 0;} .reservation-form {padding: 0 2rem;} .reservationcheck-box {padding: 0 10rem; background-size: 100%;} } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 Mobile 1210,1279 예외처리 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:1210px) and (max-width:1279px) { /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .mobile-frame {max-width: 21%; transform: translate(-50%,-61%);} /*모바일 프레임 사이즈 조절*/ } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 PC 1280,1919 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:1280px) and (max-width:1919px) { /* Mobile용 서브 메뉴리스트 영역 */ .mo-sub-gnb {display: none;} .mo-sub-gnbtab {display: none;} /* 서브페이지 컨텐츠영역 03 - 대리운전 */ .page-protocoldriver {padding: 12rem 0;} .page-corpordrive {padding: 12rem 0;} } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** 반응형설정 PC 1920 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:1920px) { /* Mobile용 서브 메뉴리스트 영역 */ .mo-sub-gnb {display: none;} .mo-sub-gnbtab {display: none;} }