/* ================= Fixed ================= */
*,
*::before,
*::after {
padding: 0;
margin: 0;
text-decoration: none;
-webkit-box-sizing: border-box;
box-sizing: border-box;
outline: none;
border: none;
list-style: none;
}
/* ================= Color ================= */
:root {
/* https://www.w3schools.com/colors/colors_picker.asp */
/* === Change Color Here === */
--color-first: #3164af;
--color-first-rgb: 49, 100, 175;
--color-second: #d7e3f4;
--color-second-rgb: 215, 227, 244;
--color-third: #0dc0e9;
--color-third-rgb: 13, 192, 233;
--color-fourth: #d7e3f4;
--color-fourth-rgb: 215, 227, 244;
--color-fifth: #3164af;
--color-fifth-rgb: 49, 100, 175;
/* === Change Color image footer === */
/* นำสีที่ต้องการไปวางที่ลิงค์ด้านล่าง เช่น #000000 แล้วกดปุ่ม Get Filter */
/* ให้ดูค่าที่ Loss: จะต้องมีค่าน้อยกว่า 0.5 ถ้าค่าที่ได้ยังไม่น้อยกว่าให้กดปุ่ม Get Filter ใหม่จนกว่าจะได้ค่าที่ต้องการ */
/* https://angel-rs.github.io/css-color-filter-generator/ */
--color-img-footer: brightness(0) saturate(100%) invert(45%) sepia(22%) saturate(5546%) hue-rotate(359deg) brightness(99%) contrast(109%);
/* === Fixed Color === */
--color-light: #ffffff;
--color-light-rgb: 255, 255, 255;
--color-dark: #000000;
--color-dark-rgb: 0, 0, 0;
--color-black1: #4d4d4d;
--color-black1-rgb: 77, 77, 77;
--color-black2: #404040;
--color-black2-rgb: 64, 64, 64;
--color-black3: #333333;
--color-black3-rgb: 51, 51, 51;
--color-black4: #262626;
--color-black4-rgb: 38, 38, 38;
--color-black5: #1a1a1a;
--color-black5-rgb: 26, 26, 26;
--color-black6: #0d0d0d;
--color-black6-rgb: 13, 13, 13;
--color-txtg: #4d4c4c;
--color-txtg-rgb: 77, 76, 76;
--color-txtg1: #cdcbcb;
--color-txtg1-rgb: 205, 203, 203;
--color-txtg2: #b3b2b2;
--color-txtg2-rgb: 179, 178, 178;
--color-txtg3: #9a9898;
--color-txtg3-rgb: 154, 152, 152;
--color-txtg4: #817e7e;
--color-txtg4-rgb: 129, 126, 126;
--color-txtg5: #676565;
--color-txtg5-rgb: 103, 101, 101;
--color-txtg6: #4d4c4c;
--color-txtg6-rgb: 177, 76, 76;
--color-grey: #f5f5f5;
--color-grey-rgb: 245, 245, 245;
--color-grey1: #f9f9f9;
--color-grey1-rgb: 249, 249, 249;
--color-grey2: #f2f2f2;
--color-grey2-rgb: 242, 242, 242;
--color-grey3: #e6e6e6;
--color-grey3-rgb: 230, 230, 230;
--color-grey4: #d9d9d9;
--color-grey4-rgb: 217, 217, 217;
--color-grey5: #cccccc;
--color-grey5-rgb: 204, 204, 204;
--color-grey6: #b3b3b3;
--color-grey6-rgb: 204, 204, 204;
--color-green: #259b24;
--color-green-rgb: 37, 155, 36;
--color-green1: #adecac;
--color-green1-rgb: 173, 236, 172;
--color-green2: #85e283;
--color-green2-rgb: 133, 226, 131;
--color-green3: #5cd85a;
--color-green3-rgb: 92, 216, 90;
--color-green4: #33cf30;
--color-green4-rgb: 51, 207, 48;
--color-green5: #2eba2c;
--color-green5-rgb: 46, 186, 44;
--color-green6: #1f7c1d;
--color-green6-rgb: 431, 124, 29;
--color-red: #ff0000;
--color-red-rgb: 255, 0, 0;
--color-red1: #ffcccc;
--color-red1-rgb: 255, 204, 204;
--color-red2: #ff8080;
--color-red2-rgb: 255, 128, 128;
--color-red3: #ff4d4d;
--color-red3-rgb: 255, 77, 77;
--color-red4: #f20d0d;
--color-red4-rgb: 242, 13, 13;
--color-red5: #e51c23;
--color-red5-rgb: 229, 28, 35;
--color-red6: #cc0000;
--color-red6-rgb: 204, 0, 0;
--color-red7: #800000;
--color-red7-rgb: 128, 0, 0;
--color-orange: #ff5722;
--color-orange-rgb: 255, 87, 34;
--color-orange1: #ffc3b3;
--color-orange1-rgb: 255, 195, 179;
--color-orange2: #ffaf99;
--color-orange2-rgb: 255, 175, 153;
--color-orange3: #ff9d80;
--color-orange3-rgb: 255, 157, 128;
--color-orange4: #ff8a66;
--color-orange4-rgb: 255, 138, 102;
--color-orange5: #ff764d;
--color-orange5-rgb: 255, 118, 77;
--color-orange6: #ff3c00;
--color-orange6-rgb: 255, 60, 0;
--color-yellow: #ffc107;
--color-yellow-rgb: 255, 193, 7;
--color-yellow1: #fff2cc;
--color-yellow1-rgb: 255, 242, 204;
--color-yellow2: #ffe699;
--color-yellow2-rgb: 255, 230, 153;
--color-yellow3: #ffd966;
--color-yellow3-rgb: 255, 217, 102;
--color-yellow4: #ffd24d;
--color-yellow4-rgb: 255, 210, 77;
--color-yellow5: #ffcc33;
--color-yellow5-rgb: 255, 204, 51;
--color-yellow6: #e6ac00;
--color-yellow6-rgb: 230, 172, 0;
--color-blue: #0000e6;
--color-blue-rgb: 0, 0, 230;
--color-blue1: #8080ff;
--color-blue1-rgb: 128, 128, 255;
--color-blue2: #6666ff;
--color-blue2-rgb: 102, 102, 255;
--color-blue3: #4d4dff;
--color-blue3-rgb: 77, 77, 255;
--color-blue4: #3333ff;
--color-blue4-rgb: 51, 51, 255;
--color-blue5: #1a1aff;
--color-blue5-rgb: 26, 26, 255;
--color-blue6: #0000b3;
--color-blue6-rgb: 0, 0, 179;
--color-brown: #795548;
--color-brown-rgb: 121, 85, 72;
--color-brown1: #e2d4cf;
--color-brown1-rgb: 226, 212, 207;
--color-brown2: #cfb7af;
--color-brown2-rgb: 207, 183, 175;
--color-brown3: #bc9a8f;
--color-brown3-rgb: 188, 154, 143;
--color-brown4: #a97d70;
--color-brown4-rgb: 169, 125, 112;
--color-brown5: #8f6556;
--color-brown5-rgb: 143, 101, 86;
--color-brown6: #604439;
--color-brown6-rgb: 96, 68, 57;
--color-fb: #4267b2;
--color-fb-rgb: 66, 103, 178;
--color-msg: #0099ff;
--color-msg-rgb: 0, 153, 255;
--color-ig: #e4405f;
--color-ig-rgb: 228, 64, 95;
--color-line: #00c300;
--color-line-rgb: 0, 195, 0;
--color-twt: #1da1f2;
--color-twt-rgb: 29, 161, 242;
--color-tt: #000000;
--color-tt-rgb: 0, 0, 0;
--color-wa: #25d366;
--color-wa-rgb: 37, 211, 102;
--color-yt: #cd201f;
--color-yt-rgb: 205, 32, 31;
--color-email: #c71610;
--color-email-rgb: 199, 22, 16;
--color-pdf: #f40f02;
--color-pdf-rgb: 244, 15, 2;
--color-word: #2b579a;
--color-word-rgb: 43, 87, 154;
--color-icon-yl: #ffb61a;
--color-icon-yl-rgb: 255, 182, 26;
--color-bg-yl: #e69d00;
--color-bg-yl-rgb: 230, 157, 0;
--color-bg-ft: #292929;
--color-bg-ft-rgb: 41, 41, 41;
--color-stbk: #292929;
--color-stbk-rgb: 41, 41, 41;
--color-bank-ttb1: #0f50ec;
--color-bank-ttb1-rgb: 15, 80, 236;
--color-bank-ttb2: #f48a31;
--color-bank-ttb2-rgb: 244, 138, 49;
--color-bank-ttb3: #022d61;
--color-bank-ttb3-rgb: 2, 45, 97;
--color-bank-asik: #004ea2;
--color-bank-asik-rgb: 0, 78, 162;
--color-bank-ktb: #01a6e6;
--color-bank-ktb-rgb: 1, 166, 230;
--color-bank-bbl: #1f4396;
--color-bank-bbl-rgb: 31, 67, 150;
--color-bank-kbank: #00a94f;
--color-bank-kbank-rgb: 0, 169, 79;
--color-bank-scb: #4b2885;
--color-bank-scb-rgb: 75, 40, 133;
--color-bank-bay: #ffd229;
--color-bank-bay-rgb: 255, 210, 41;
--color-bank-cimb: #76111c;
--color-bank-cimb-rgb: 118, 17, 28;
--color-bank-uob: #06377b;
--color-bank-uob-rgb: 6, 55, 123;
--color-bank-gsb: #ec098d;
--color-bank-gsb-rgb: 236, 9, 141;
--color-bank-lhbank: #6d7071;
--color-bank-lhbank-rgb: 109, 112, 113;
--color-bank-lhbank: #888a8c;
--color-bank-lhbank-rgb: 136, 138, 140;
--color-bank-lhbank: #ced629;
--color-bank-lhbank-rgb: 206, 214, 41;
--color-bank-lhbank: #47b9c0;
--color-bank-lhbank-rgb: 71, 185, 192;
--color-bank-lhbank: #8b3f92;
--color-bank-lhbank-rgb: 139, 63, 146;
--color-bank-lhbank: #ed8068;
--color-bank-lhbank-rgb: 237, 128, 104;
--color-bank-lhbank: #0080be;
--color-bank-lhbank-rgb: 0, 128, 190;
--color-bank-lhbank: #f5bf0e;
--color-bank-lhbank-rgb: 245, 191, 14;
--color-bank-lhbank: #94988d;
--color-bank-lhbank-rgb: 148, 152, 141;
--color-bank-lhbank: #f08d1d;
--color-bank-lhbank-rgb: 240, 141, 29;
}
/* ================= Size Width ================= */
.container {
margin-left: auto !important;
margin-right: auto !important;
}
@media (min-width: 1200px) {
.container {
width: 1170px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.container {
width: 970px;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.container {
width: 100%;
padding: 0 16px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.container {
width: 100%;
padding: 0 16px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.container {
width: 100%;
padding: 0 16px;
}
}
/* ================= Font ================= */
/* @font-face {
font-family: FCSubjectR;
font-style: normal;
font-weight: 300;
src: url("/fonts/FCSubjectR/FCSubjectRounded-Light.ttf");
}
@font-face {
font-family: FCSubjectR;
font-style: normal;
font-weight: 400;
src: url("/fonts/FCSubjectR/FCSubjectRounded-Regular.ttf");
}
@font-face {
font-family: FCSubjectR;
font-style: normal;
font-weight: 500;
src: url("/fonts/FCSubjectR/FCSubjectRounded-Medium.ttf");
}
@font-face {
font-family: FCSubjectR;
font-style: normal;
font-weight: 600;
src: url("/fonts/FCSubjectR/FCSubjectRounded-SemiBold.ttf");
}
* {
font-family: FCSubjectR, sans-serif;
color: var(--color-txtg);
}
:root {
--font-fc-subject-rounded: FCSubjectR, sans-serif;
} */
/* ================= Tag All ================= */
body {
background-color: rgba(var(--color-grey1-rgb), 1);
}
figure {
font-size: 0;
}
/* ================= ================= */
.box-spr-sc-full-and-half {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-dark);
padding-top: 20px;
padding-bottom: 20px;
}
.box-spr-sc-full-and-half .lines-box-center {
border-top: 2px dashed var(--color-light);
}
/* ================= header ================= */
.box-tab-menu-head-color {
position: relative;
width: 100%;
height: 2.25rem;
/* max-height: 2.25rem; */
/* max-height: 1.75rem; */
/* background-color: var(--color-first); */
border-bottom: 1px solid var(--color-grey5);
/* overflow: hidden; */
display: flex;
align-items: center;
background: #3164AF;
background: linear-gradient(90deg, rgba(49, 100, 175, 1) 0%, rgba(76, 127, 205, 1) 50%, rgba(49, 100, 175, 1) 100%);
}
.b-spr-menu-h {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
}
.b-spr-menu-h .b-change-language {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
}
.b-spr-menu-h .b-change-language .btn-lg {
position: relative;
width: auto;
height: -webkit-fill-available;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
padding: 2px 10px 2px 5px;
cursor: pointer;
}
.b-spr-menu-h .b-change-language .btn-lg a {
position: relative;
width: 100%;
height: 100%;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
}
.b-spr-menu-h .b-change-language .btn-lg figure {
position: relative;
width: auto;
height: auto;
}
.b-spr-menu-h .b-change-language .btn-lg figure .size-img {
position: relative;
width: auto;
height: 1rem;
}
.b-spr-menu-h .b-change-language .btn-lg .b-txt-lg {
position: relative;
width: auto;
height: auto;
padding: 2px 0 0 5px;
}
.b-spr-menu-h .b-change-language .btn-lg .b-txt-lg p {
font-size: 0.75rem;
color: var(--color-light);
font-weight: bold;
}
.b-spr-menu-h .b-change-language .btn-lg:hover {
background-color: var(--color-light);
transition: all 0.3s ease;
}
.b-spr-menu-h .b-change-language .btn-lg:hover:first-child {
border-radius: 5px 0 0 5px;
transition: all 0.3s ease;
}
.b-spr-menu-h .b-change-language .btn-lg:hover:last-child {
border-radius: 0 5px 5px 0;
transition: all 0.3s ease;
}
.b-spr-menu-h .b-change-language .btn-lg:hover .b-txt-lg p {
color: var(--color-first);
transition: all 0.3s ease;
}
.b-spr-menu-h .b-change-language .active {
background-color: var(--color-light);
}
.b-spr-menu-h .b-change-language .active:first-child {
border-radius: 5px 0 0 5px;
}
.b-spr-menu-h .b-change-language .active:last-child {
border-radius: 0 5px 5px 0;
}
.b-spr-menu-h .b-change-language .active .b-txt-lg p {
color: var(--color-first);
}
.b-spr-menu-h .b-login-register {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.b-spr-menu-h .b-login-register .btn-lin-rgt {
position: relative;
width: auto;
height: auto;
padding: 3px 12px;
cursor: pointer;
}
.b-spr-menu-h .b-login-register .btn-lin-rgt:first-child {
border-radius: 5px 0 0 5px;
}
.b-spr-menu-h .b-login-register .btn-lin-rgt:last-child {
border-radius: 0 5px 5px 0;
}
.b-spr-menu-h .b-login-register .btn-lin-rgt a {
position: relative;
width: 100%;
height: 100%;
}
.b-spr-menu-h .b-login-register .btn-lin-rgt p {
font-size: 0.88rem;
color: var(--color-light);
}
.b-spr-menu-h .b-login-register .btn-lin-rgt p i {
color: var(--color-light);
padding-left: 3px;
}
.b-spr-menu-h .b-login-register .color-btn1 {
background-color: var(--color-bg-yl);
border: 1px solid var(--color-bg-yl);
}
.b-spr-menu-h .b-login-register .color-btn2 {
background-color: var(--color-bg-yl);
border: 1px solid var(--color-bg-yl);
}
.b-spr-menu-h .b-login-register .btn-lin-rgt:hover.color-btn1 {
background-color: var(--color-first);
border: 1px solid var(--color-light);
transition: all 0.3s ease;
}
.b-spr-menu-h .b-login-register .btn-lin-rgt:hover.color-btn2 {
background-color: var(--color-first);
border: 1px solid var(--color-light);
transition: all 0.3s ease;
}
.line-spt-hh1 {
position: relative;
width: 2px;
height: 100%;
background-color: var(--color-light);
}
.line-spt-hh2 {
position: relative;
width: 3px;
height: 100%;
background-color: var(--color-light);
}
.box--header {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-light);
box-shadow: 0px -1px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-webkit-box-shadow: 0px -1px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-moz-box-shadow: 0px -1px 5px 2px rgba(var(--color-dark-rgb), 0.1);
}
.b-btn-linrgt {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {}
@media (min-width: 0px) and (max-width: 991px) {
.box-tab-menu-head-color {
display: none;
}
}
/* ================= ================= */
.box--menu-prifile {
position: relative;
width: auto;
height: auto;
}
.box--menu-prifile button {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
align-items: center;
cursor: pointer;
border: none;
background-color: var(--color-first);
border-radius: 5px;
padding: 3px 10px;
}
.box--menu-prifile button .-name- {
position: relative;
width: 6rem;
margin-right: 5px;
}
.box--menu-prifile button .-name- p {
font-size: 0.88rem;
color: var(--color-light);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.box--menu-prifile button .img-pf {
position: relative;
width: auto;
height: auto;
}
.box--menu-prifile button .img-pf figure {
position: relative;
width: 1.6rem;
height: 1.6rem;
border-radius: 100%;
overflow: hidden;
}
.box--menu-prifile button .img-pf figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.box--menu-prifile button .-icon- {
position: relative;
width: auto;
height: auto;
margin-left: 5px;
}
.box--menu-prifile button .-icon- i {
font-size: 0.94rem;
color: var(--color-light);
}
.box--menu-prifile button:hover,
.box--menu-prifile button:focus {
background-color: var(--color-light);
transition: all 0.3s ease;
}
.box--menu-prifile button:hover .-name- p,
.box--menu-prifile button:focus .-name- p {
color: var(--color-first);
transition: all 0.3s ease;
}
.box--menu-prifile button:hover .-icon- i,
.box--menu-prifile button:focus .-icon- i {
color: var(--color-first);
transition: all 0.3s ease;
}
.box--menu-prifile .option--menupf {
position: absolute;
width: auto;
height: auto;
display: none;
z-index: 9909;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px -1px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-webkit-box-shadow: 0px -1px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-moz-box-shadow: 0px -1px 5px 2px rgba(var(--color-dark-rgb), 0.1);
transform: translateY(0.5rem);
transition: all 0.1s cubic-bezier(0.16, 1, 0.5, 1);
margin-top: 6px;
right: 0;
overflow: hidden;
}
.box--menu-prifile .option--menupf .btn--list-optionmnpf {
position: relative;
width: auto;
height: auto;
display: flex;
align-items: center;
display: flex;
justify-content: stretch;
border-bottom: 1px solid var(--color-grey4);
cursor: pointer;
}
.box--menu-prifile .option--menupf .btn--list-optionmnpf:last-child {
border-bottom: none;
}
.box--menu-prifile .option--menupf .btn--list-optionmnpf a {
position: relative;
width: 100%;
height: auto;
display: flex;
align-items: center;
display: flex;
justify-content: stretch;
padding: 5px 16px;
border-radius: 5px;
}
.box--menu-prifile .option--menupf .btn--list-optionmnpf .icon-menu {
position: relative;
width: 1.9rem;
height: auto;
}
.box--menu-prifile .option--menupf .btn--list-optionmnpf .icon-menu i {
font-size: 0.94rem;
color: var(--color-txtg4);
}
.box--menu-prifile .option--menupf .btn--list-optionmnpf .name-menu {
position: relative;
width: auto;
height: auto;
}
.box--menu-prifile .option--menupf .btn--list-optionmnpf .name-menu p {
font-size: 0.94rem;
color: var(--color-txtg4);
white-space: nowrap;
}
.box--menu-prifile .option--menupf .btn--list-optionmnpf:hover {
background-color: var(--color-first);
transition: all 0.3s ease;
}
.box--menu-prifile .option--menupf .btn--list-optionmnpf:hover .icon-menu i {
color: var(--color-light);
transition: all 0.3s ease;
}
.box--menu-prifile .option--menupf .btn--list-optionmnpf:hover .name-menu p {
color: var(--color-light);
transition: all 0.3s ease;
}
.box--menu-prifile .option--menupf .bg-logout-btnmnpf:hover {
background-color: var(--color-red);
transition: all 0.3s ease;
}
.box--menu-prifile .show-ddmnpf {
display: block;
transform: translateY(0rem);
}
.box--menu-prifile button .-icon- .arrow-ddmnpf {
transform: rotate(180deg);
transition: 0.2s ease;
}
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {}
@media (min-width: 0px) and (max-width: 991px) {} */
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {}
@media (min-width: 0px) and (max-width: 991px) {} */
/* ====== logo ct ====== */
.box--logo-ct-h {
position: relative;
width: 100%;
height: auto;
/* padding: 6px 0 6px 0; */
padding: 16px 0 6px 0;
background-color: var(--color-light);
border-bottom: 1px solid var(--color-grey3);
z-index: 998;
}
.box--logo-ct-h .spr--logo-h-ct {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: space-between;
align-items: center;
}
.box--logo-ct-h .spr--logo-h-ct .h--logo {
position: relative;
width: auto;
height: auto;
}
.box--logo-ct-h .spr--logo-h-ct .h--logo figure {
position: relative;
width: auto;
height: 6rem;
/* height: 5rem; */
}
.box--logo-ct-h .spr--logo-h-ct .h--logo figure .size-img-logo-h {
position: relative;
width: auto;
height: 100%;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
align-items: center;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--business-hours-h {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
padding: 0 20px 0 10px;
border-right: 1px solid var(--color-grey4);
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--business-hours-h .icon--l {
position: relative;
width: auto;
height: auto;
padding: 5px 5px 0 0;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--business-hours-h .icon--l p i {
font-size: 1.25rem;
color: var(--color-txtg4);
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--business-hours-h .txt-dt--r {
position: relative;
width: auto;
height: auto;
padding-left: 5px;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--business-hours-h .txt-dt--r p {
font-size: 0.88rem;
color: var(--color-txtg5);
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--business-hours-h .txt-dt--r .title--bsnhu {
position: relative;
width: auto;
height: auto;
padding-bottom: 2px;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--business-hours-h .txt-dt--r .title--bsnhu p {
font-weight: bold;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--business-hours-h .txt-dt--r .b-spr-bsnhu {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--business-hours-h .txt-dt--r .b-spr-bsnhu .txt-day-b {
position: relative;
width: 4.3rem;
height: auto;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--business-hours-h .txt-dt--r .b-spr-bsnhu .txt-time-b {
position: relative;
width: auto;
height: auto;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--hotline-h {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
padding: 0 20px 0 20px;
border-right: 1px solid var(--color-grey4);
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--hotline-h .icon--l {
position: relative;
width: auto;
height: auto;
padding: 5px 5px 0 0;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--hotline-h .icon--l p i {
font-size: 1.25rem;
color: var(--color-txtg4);
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--hotline-h .txt-dt--r {
position: relative;
width: auto;
height: auto;
padding-left: 5px;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--hotline-h .txt-dt--r p a {
font-size: 0.88rem;
color: var(--color-txtg5);
cursor: pointer;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--hotline-h .txt-dt--r .txt--title {
font-size: 0.88rem;
color: var(--color-txtg5);
font-weight: bold;
padding-bottom: 2px;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .ft-box-bsnhu-hl--h .box--hotline-h .txt-dt--r p:hover a {
color: var(--color-first);
transition: all 0.3s ease;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .box--line-tvln-h {
position: relative;
width: auto;
height: auto;
padding: 0 0 0 20px;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .box--line-tvln-h .box--line-h {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
padding-bottom: 5px;
margin-bottom: 5px;
border-bottom: 1px solid var(--color-grey4);
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .box--line-tvln-h .box--line-h .icon--l {
position: relative;
width: auto;
height: auto;
padding: 5px 5px 0 0;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .box--line-tvln-h .box--line-h .icon--l p i {
font-size: 2.2rem;
color: var(--color-line);
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .box--line-tvln-h .box--line-h .txt-dt--r {
position: relative;
width: auto;
height: auto;
padding-left: 5px;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .box--line-tvln-h .box--line-h .txt-dt--r p a {
font-size: 1rem;
color: var(--color-line);
cursor: pointer;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .box--line-tvln-h .box--line-h .txt-dt--r .txt--title {
font-size: 0.88rem;
color: var(--color-txtg5);
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .box--line-tvln-h .box--tvln-h {
position: relative;
width: auto;
height: auto;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct .box--line-tvln-h .box--tvln-h p {
font-size: 0.88rem;
color: var(--color-txtg5);
}
.box--logo-ct-h .spr--logo-h-ct .icon--menu-mbp {
display: none;
}
.box--logo-ct-h .spr--logo-h-ct .box--free-nov {
display: none;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {}
@media (min-width: 0px) and (max-width: 991px) {
.box--logo-ct-h {
padding: 6px 0 6px 0;
}
}
/* ====== menu ====== */
nav {
position: relative;
top: 0;
left: 0;
width: 100%;
height: auto;
z-index: 999;
background-color: var(--color-light);
border-bottom: 1px solid var(--color-grey3);
}
.sticky--navbar {
position: fixed;
top: 0;
background-color: var(--color-light);
box-shadow: 0px -1px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-webkit-box-shadow: 0px -1px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-moz-box-shadow: 0px -1px 5px 2px rgba(var(--color-dark-rgb), 0.1);
}
nav .m-navbar {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: space-between;
margin: auto;
}
/* logo scroll */
nav .m-navbar .s-logo {
position: absolute;
width: 7.9rem;
height: auto;
margin-left: -7.9rem;
display: none;
}
.sticky--navbar .m-navbar .s-logo {
display: block;
transition: all .3s ease;
}
nav .m-navbar .s-logo figure {
position: relative;
width: auto;
height: 3rem;
max-width: 7.89rem;
display: flex;
}
nav .m-navbar .s-logo figure .size-logo-s {
position: relative;
width: auto;
height: 100%;
margin-left: auto;
margin-right: 0;
}
/* navbar */
nav .m-navbar .nav--links {
width: 100%;
height: 100%;
/* line-height: 50px; */
line-height: 3.2rem;
}
nav .m-navbar .nav--links .box--sidebar-logo {
display: none;
}
nav .m-navbar .nav--links .n-links {
position: relative;
width: 100%;
height: auto;
display: flex;
}
nav .m-navbar .nav--links .n-links li {
width: inherit;
height: auto;
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
list-style: none;
}
nav .m-navbar .nav--links .n-links li a {
position: relative;
width: 100%;
height: 100%;
white-space: nowrap;
font-size: 1rem;
margin: 0 auto;
cursor: pointer;
padding: 0 16px;
text-align: center;
}
nav .m-navbar .nav--links .n-links li a:hover span {
color: var(--color-first);
transition: all 0.3s ease;
}
nav .m-navbar .nav--links .n-links li:hover .i-rotate-arrow {
transform: rotate(180deg);
}
nav .m-navbar .nav--links .n-links li .i-arrow {
height: auto;
width: 20px;
text-align: center;
display: inline-block;
transition: all 0.3s ease;
color: var(--color-txtg1);
}
nav .m-navbar .nav--links .n-links li .sub--menu {
position: absolute;
max-height: 40rem;
top: 3.2rem;
left: 0;
z-index: 9;
display: none;
/* display: block; */
line-height: initial;
border-radius: 0 0 5px 5px;
background-color: var(--color-light);
box-shadow: 0px 2px 3px 1px rgba(var(--color-dark-rgb), 0.1);
-webkit-box-shadow: 0px 2px 3px 1px rgba(var(--color-dark-rgb), 0.1);
-moz-box-shadow: 0px 2px 3px 1px rgba(var(--color-dark-rgb), 0.1);
border-top: 2px solid var(--color-first);
overflow: hidden;
/* overflow: scroll; */
}
/* nav .m-navbar .nav--links .n-links li .sub--menu::-webkit-scrollbar {
display: none;
}
nav .m-navbar .nav--links .n-links li .sub--menu {
-ms-overflow-style: none;
scrollbar-width: none;
} */
nav .m-navbar .nav--links .n-links li:hover .drop-sub-menu {
display: block;
transition: all 0.3s ease;
}
nav .m-navbar .nav--links .n-links li .dsm--r {
right: 0;
left: auto;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd {
position: relative;
width: max-content;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 5px 10px 5px 10px;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn {
position: relative;
width: auto;
height: auto;
margin-right: 10px;
padding-right: 10px;
border-right: 1px solid var(--color-grey3);
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn:last-child {
margin-right: 0;
padding-right: 0;
border-right: none;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl {
position: relative;
width: auto;
height: auto;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl a {
position: relative;
width: 100%;
height: 100%;
cursor: pointer;
padding: 0;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn {
position: relative;
width: auto;
height: 2.1rem;
display: flex;
justify-content: stretch;
align-items: center;
padding: 4px 3px;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .img-box-lsmn {
position: relative;
width: 2.2rem;
height: 100%;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .img-box-lsmn figure {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .img-box-lsmn figure .size-img-ct {
position: relative;
width: 100%;
height: 100%;
object-fit: scale-down;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .name-box-lsmn {
position: relative;
width: 8.552rem;
height: 100%;
padding: 0 5px;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .name-box-lsmn p {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-size: 0.94rem;
text-align: left;
position: relative;
top: 50%;
transform: translateY(-50%);
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl:hover .spr-btn-smn .name-box-lsmn p {
color: var(--color-first);
transition: all 0.3s ease;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .name-box-lsmn2 {
position: relative;
width: 10rem;
height: 100%;
padding: 0 5px;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .name-box-lsmn2 p {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-size: 0.94rem;
text-align: left;
position: relative;
top: 50%;
transform: translateY(-50%);
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl:hover .spr-btn-smn .name-box-lsmn2 p {
color: var(--color-first);
transition: all 0.3s ease;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .count-box-lsmn {
position: relative;
width: 2.2rem;
height: 100%;
}
/* nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .count-box-lsmn .box-circle-bg {
position: relative;
top: 50%;
transform: translateY(-50%);
background-color: var(--color-first);
height: 1.6rem;
width: 1.9rem;
border-radius: 100%;
margin-left: 0;
margin-right: auto;
} */
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .count-box-lsmn .box-circle-bg {
position: relative;
top: 50%;
transform: translateY(-50%);
background-color: var(--color-first);
height: 1.6rem;
width: 1.9rem;
margin-left: 0;
margin-right: auto;
border-radius: 5px;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .count-box-lsmn .box-circle-bg::after {
content: '';
position: absolute;
top: 0;
left: 0;
/* background-color: var(--color-first); */
height: 1.6rem;
width: 1.9rem;
transform: skew(340deg);
border-radius: 5px;
z-index: 1;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .count-box-lsmn .box-circle-bg p {
font-size: 0.82rem;
text-align: left;
color: var(--color-light);
position: relative;
top: 50%;
transform: translateY(-50%);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
padding-top: 1px;
z-index: 9;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .box--title-zone {
position: relative;
width: 13.32rem;
height: auto;
padding: 5px 0 5px 0;
margin-bottom: 5px;
border-bottom: 1px solid var(--color-grey3);
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .box--title-zone p {
font-size: 1rem;
text-align: center;
font-weight: bold;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .box--title-zone2 {
position: relative;
width: auto;
height: auto;
padding: 5px 0 5px 0;
margin-bottom: 5px;
border-bottom: 1px solid var(--color-grey3);
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .box--title-zone2 p {
font-size: 1rem;
text-align: center;
font-weight: bold;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.box--dt-zoone-rpt-navbar {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box--dt-zoone-rpt-navbar .box-column-list {
position: relative;
width: auto;
height: auto;
margin-right: 10px;
padding-right: 10px;
border-right: 1px solid var(--color-grey3);
}
.pd-top-title-suffix-navbar {
padding-top: 20px !important;
}
.submenu-mega--li {
position: static !important;
}
@media (min-width: 0px) and (max-width: 991px) {
.submenu-mega--li {
position: relative !important;
}
}
/* ============= */
@media (min-width: 1400px) {
nav .m-navbar {
max-width: 1170px;
}
nav .m-navbar .nav--links .n-links .dd--submenu:hover .s-at-ddsm::before {
opacity: 1;
content: '';
display: block;
position: absolute;
bottom: -2px;
left: 50%;
margin-left: -4px;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-bottom: 8px solid var(--color-first);
}
nav .m-navbar .nav--links .n-links li .full-s-psmn {
position: absolute;
width: fit-content;
max-width: 64rem;
height: auto;
max-height: 40rem;
margin-left: auto;
margin-right: auto;
right: 0;
left: 0;
overflow: hidden;
/* overflow: scroll; */
}
nav .m-navbar .nav--links .n-links li .full-s-psmn::-webkit-scrollbar {
display: none;
}
nav .m-navbar .nav--links .n-links li .full-s-psmn {
-ms-overflow-style: none;
scrollbar-width: none;
}
nav .m-navbar .nav--links .n-links li .full-s-psmn2 {
position: absolute;
width: fit-content;
max-width: 130%;
height: auto;
max-height: 40rem;
margin-left: auto;
margin-right: auto;
right: 0;
/* left: 0; */
overflow: hidden;
left: 50%;
transform: translateX(-50%);
}
.sticky--navbar .m-navbar .nav--links .n-links li .full-s-psmn2 {
/* top: 3.2rem;
width: fit-content;
max-width: 92%;
height: auto;
max-height: 40rem;
position: fixed;
margin-left: auto;
margin-right: auto;
right: 0;
left: 0;
overflow: hidden; */
/* overflow: scroll; */
}
.box--dt-zoone-rpt-navbar .box-column-list:last-child {
margin-right: 0;
padding-right: 0;
border-right: none;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
nav .m-navbar {
max-width: 1170px;
}
nav .m-navbar .nav--links .n-links .dd--submenu:hover .s-at-ddsm::before {
opacity: 1;
content: '';
display: block;
position: absolute;
bottom: -2px;
left: 50%;
margin-left: -4px;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-bottom: 8px solid var(--color-first);
}
nav .m-navbar .nav--links .n-links li .full-s-psmn {
position: absolute;
width: fit-content;
max-width: 64rem;
height: auto;
max-height: 40rem;
margin-left: auto;
margin-right: auto;
right: 0;
left: 0;
overflow: hidden;
overflow: scroll;
}
nav .m-navbar .nav--links .n-links li .full-s-psmn::-webkit-scrollbar {
display: none;
}
nav .m-navbar .nav--links .n-links li .full-s-psmn {
-ms-overflow-style: none;
scrollbar-width: none;
}
nav .m-navbar .nav--links .n-links li .full-s-psmn2 {
position: absolute;
width: fit-content;
max-width: 100%;
height: auto;
max-height: 40rem;
margin-left: auto;
margin-right: auto;
right: 0;
left: 0;
overflow: hidden;
left: 50%;
transform: translateX(-50%);
overflow: scroll;
}
nav .m-navbar .nav--links .n-links li .full-s-psmn2::-webkit-scrollbar {
display: none;
}
nav .m-navbar .nav--links .n-links li .full-s-psmn2 {
-ms-overflow-style: none;
scrollbar-width: none;
}
.sticky--navbar .m-navbar .nav--links .n-links li .full-s-psmn2 {
/* top: 3.2rem;
width: fit-content;
max-width: 92%;
height: auto;
max-height: 40rem;
position: fixed;
margin-left: auto;
margin-right: auto;
right: 0;
left: 0;
overflow: hidden;
overflow: scroll; */
}
.box--dt-zoone-rpt-navbar .box-column-list:last-child {
margin-right: 0;
padding-right: 0;
border-right: none;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
nav .m-navbar {
max-width: 970px;
}
nav .m-navbar .nav--links .n-links li a {
padding: 0 12px;
}
nav .m-navbar .nav--links .n-links li .sub--menu {
max-height: 35rem;
}
nav .m-navbar .nav--links .n-links .dd--submenu:hover .s-at-ddsm::before {
opacity: 1;
content: '';
display: block;
position: absolute;
bottom: -2px;
left: 50%;
margin-left: -4px;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-bottom: 8px solid var(--color-first);
}
nav .m-navbar .nav--links .n-links li .full-s-psmn {
position: absolute;
width: fit-content;
max-width: 54.2rem;
height: auto;
max-height: 35rem;
margin-left: auto;
margin-right: auto;
right: 0;
left: 0;
overflow: hidden;
overflow: scroll;
}
nav .m-navbar .nav--links .n-links li .full-s-psmn::-webkit-scrollbar {
display: none;
}
nav .m-navbar .nav--links .n-links li .full-s-psmn {
-ms-overflow-style: none;
scrollbar-width: none;
}
nav .m-navbar .nav--links .n-links li .full-s-psmn2 {
position: absolute;
width: fit-content;
max-width: 100%;
height: auto;
max-height: 40rem;
margin-left: auto;
margin-right: auto;
right: 0;
left: 0;
overflow: hidden;
left: 50%;
transform: translateX(-50%);
overflow: scroll;
}
nav .m-navbar .nav--links .n-links li .full-s-psmn2::-webkit-scrollbar {
display: none;
}
nav .m-navbar .nav--links .n-links li .full-s-psmn2 {
-ms-overflow-style: none;
scrollbar-width: none;
}
.sticky--navbar .m-navbar .nav--links .n-links li .full-s-psmn2 {
/* top: 3.2rem;
width: fit-content;
max-width: 95%;
height: auto;
max-height: 35rem;
position: fixed;
margin-left: auto;
margin-right: auto;
right: 0;
left: 0;
overflow: hidden;
overflow: scroll; */
}
.sticky--navbar .m-navbar .s-logo {
display: none;
}
}
@media (min-width: 791px) and (max-width: 991px) {
nav .m-navbar .nav--links {
max-width: 60%;
}
.box--dt-zoone-rpt-navbar {
width: 100%;
}
.box--dt-zoone-rpt-navbar .box-column-list {
width: 100%;
margin-right: 0;
padding-right: 0;
border-right: none;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
}
@media (min-width: 501px) and (max-width: 790px) {
nav .m-navbar .nav--links {
max-width: 70%;
}
.box--dt-zoone-rpt-navbar {
width: 100%;
}
.box--dt-zoone-rpt-navbar .box-column-list {
width: 100%;
margin-right: 0;
padding-right: 0;
border-right: none;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
}
@media (min-width: 0px) and (max-width: 500px) {
nav .m-navbar .nav--links {
max-width: 100%;
}
.box--dt-zoone-rpt-navbar {
width: 100%;
}
.box--dt-zoone-rpt-navbar .box-column-list {
width: 100%;
margin-right: 0;
padding-right: 0;
border-right: none;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
}
@media (min-width: 0px) and (max-width: 991px) {
.sticky--logo {
position: fixed;
top: 0;
background-color: var(--color-light);
box-shadow: 0px -1px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-webkit-box-shadow: 0px -1px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-moz-box-shadow: 0px -1px 5px 2px rgba(var(--color-dark-rgb), 0.1);
}
.box--logo-ct-h .spr--logo-h-ct .icon--menu-mbp {
position: relative;
width: auto;
height: auto;
display: flex;
align-items: center;
}
.box--logo-ct-h .spr--logo-h-ct .icon--menu-mbp i {
font-size: 1.5rem;
color: var(--color-txtg6);
cursor: pointer;
}
.box--logo-ct-h .spr--logo-h-ct .icon--menu-mbp i:hover {
color: var(--color-first);
}
.box--logo-ct-h .spr--logo-h-ct .h--logo figure {
height: 3rem;
}
.box--logo-ct-h .spr--logo-h-ct .h--ct {
display: none;
}
.box--logo-ct-h .spr--logo-h-ct .box--free-nov {
position: relative;
width: auto;
height: auto;
display: block;
}
.box--logo-ct-h .spr--logo-h-ct .box--free-nov p i {
font-size: 1.5rem;
color: transparent;
}
nav .m-navbar .nav--links {
position: fixed;
top: 0;
left: -100%;
display: block;
width: 100%;
height: 100%;
line-height: 40px;
transition: all 0.5s ease;
z-index: 1000;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.1);
}
nav .m-navbar .nav--links .box--sidebar-logo {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 16px 10px 16px;
border-bottom: 1px solid var(--color-grey3);
/* margin-bottom: 10px; */
}
nav .m-navbar .nav--links .box--sidebar-logo .b-logo-sidebar {
position: relative;
width: auto;
height: auto;
}
nav .m-navbar .nav--links .box--sidebar-logo .b-logo-sidebar figure {
position: relative;
width: auto;
height: 2.5rem;
}
nav .m-navbar .nav--links .box--sidebar-logo .b-logo-sidebar figure .size-logo-sb {
position: relative;
width: auto;
height: 100%;
}
nav .m-navbar .nav--links .box--sidebar-logo .box--btn-close {
position: relative;
width: auto;
height: auto;
display: flex;
}
nav .m-navbar .nav--links .box--sidebar-logo .box--btn-close i {
font-size: 1.5rem;
color: var(--color-red);
cursor: pointer;
}
nav .m-navbar .nav--links .n-links {
display: block;
padding: 0;
/* padding: 5px 16px; */
/* height: 90%; */
max-height: calc(100% - 4.2rem);
/* max-height: 90%; */
width: 100%;
overflow: scroll;
}
nav .m-navbar .nav--links .n-links::-webkit-scrollbar {
display: none;
}
nav .m-navbar .nav--links .n-links {
-ms-overflow-style: none;
scrollbar-width: none;
}
nav .m-navbar .nav--links .n-links .dd-box-smn {
border-bottom: 1px solid rgba(var(--color-first-rgb), 0.3);
}
nav .m-navbar .nav--links .n-links .dd-box-smn:last-child {
border-bottom: none;
}
nav .m-navbar .nav--links .n-links li {
display: block;
width: auto;
margin: auto 16px;
}
nav .m-navbar .nav--links .n-links li a {
text-align: left;
display: flex;
justify-content: space-between;
}
nav .m-navbar .nav--links .n-links li .sub--menu {
position: relative;
top: 0;
box-shadow: none;
display: none;
border-top: 1px dashed var(--color-grey4);
border-radius: 0;
max-height: 100%;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd {
display: block;
width: 100%;
padding: 5px 5px 5px 15px;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn {
margin-right: 0;
padding-right: 0;
border-right: none;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl {
width: calc((100%/2) - 10px);
margin: 0 5px 0 5px;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .box--title-zone {
/* display: none; */
width: 100%;
margin-top: 5px;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .box--title-zone2 {
/* display: none; */
width: 100%;
margin-top: 5px;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn {
width: 100%;
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .name-box-lsmn {
width: calc(100% - 2.2rem);
}
nav .m-navbar .nav--links .n-links li .sub--menu .box--smn-dd .st--list-smn .btn--box-smnl .spr-btn-smn .count-box-lsmn {
display: none;
/* width: 2.2rem; */
}
nav .m-navbar .nav--links .n-links li:hover .i-rotate-arrow {
transform: rotate(0deg);
}
nav .m-navbar .nav--links .n-links li:hover .drop-sub-menu {
display: none;
}
nav .m-navbar .nav--links .n-links li a.active {
background-color: rgba(var(--color-first-rgb), 0.05);
}
nav .m-navbar .nav--links .n-links li a.active .i-rotate-arrow {
transform: rotate(180deg);
}
.box--dt-zoone-rpt-navbar {
width: 100%;
}
.box--dt-zoone-rpt-navbar .box-column-list {
width: 100%;
margin-right: 0;
padding-right: 0;
border-right: none;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sticky--navbar .m-navbar .s-logo {
display: none;
}
}
/* ============= */
@media (min-width: 1200px) {
.b-mune-mobile-chlg-linrgt {
display: none !important;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.b-mune-mobile-chlg-linrgt {
display: none !important;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.b-mune-mobile-chlg-linrgt {
display: none !important;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.b-mune-mobile-chlg-linrgt {
display: none !important;
}
}
@media (min-width: 0px) and (max-width: 500px) {}
@media (min-width: 0px) and (max-width: 500px) {
.b-mune-mobile-chlg-linrgt {
position: relative;
width: 100%;
height: auto;
padding: 10px 0;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
}
.b-mune-mobile-chlg-linrgt .b-change-language-mobile {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.b-mune-mobile-chlg-linrgt .b-change-language-mobile .btn-lg {
position: relative;
width: auto;
height: auto;
/* height: 1.25rem; */
/* max-height: 1.25rem; */
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
padding: 2px 10px 2px 5px;
cursor: pointer;
}
.b-mune-mobile-chlg-linrgt .b-change-language-mobile .btn-lg a {
position: relative;
width: 100%;
/* height: 100%; */
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
}
.b-mune-mobile-chlg-linrgt .b-change-language-mobile .btn-lg figure {
position: relative;
width: auto;
/* height: 100%; */
display: flex;
}
.b-mune-mobile-chlg-linrgt .b-change-language-mobile .btn-lg figure .size-img {
position: relative;
width: auto;
height: 1rem;
}
.b-mune-mobile-chlg-linrgt .b-change-language-mobile .btn-lg .b-txt-lg {
position: relative;
width: auto;
height: 100%;
padding: 2px 0 0 5px;
}
.b-mune-mobile-chlg-linrgt .b-change-language-mobile .btn-lg .b-txt-lg p {
font-size: 0.75rem;
font-weight: bold;
}
.b-mune-mobile-chlg-linrgt .b-btn-mobile {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.b-mune-mobile-chlg-linrgt .b-btn-mobile .btn-lin-rgt {
position: relative;
width: auto;
height: auto;
padding: 3px 12px;
cursor: pointer;
}
.b-mune-mobile-chlg-linrgt .b-btn-mobile .btn-lin-rgt a {
position: relative;
width: 100%;
height: 100%;
}
.b-mune-mobile-chlg-linrgt .b-btn-mobile .btn-lin-rgt p {
font-size: 0.88rem;
/* color: var(--color-light); */
display: inline;
}
.b-mune-mobile-chlg-linrgt .b-btn-mobile .btn-lin-rgt p i {
/* color: var(--color-light); */
padding-left: 3px;
}
.b-mune-mobile-chlg-linrgt .b-btn-mobile .color-btn1 {
background-color: var(--color-bg-yl);
}
.b-mune-mobile-chlg-linrgt .b-btn-mobile .color-btn2 {
background-color: var(--color-bg-yl);
}
}
/* ============= */
@media (min-width: 1200px) {
.box--mobile-menu-profile {
display: none;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.box--mobile-menu-profile {
display: none;
}
}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {}
@media (min-width: 0px) and (max-width: 991px) {
.box--mobile-menu-profile {
position: relative;
width: 100%;
height: auto;
display: block;
line-height: normal;
padding: 0 0 20px 0;
border-bottom: 1px dotted rgba(var(--color-first-rgb), 0.3);
}
.b-line--spt-hh-mb {
position: relative;
width: 10px;
height: auto;
display: flex;
}
.b-line--spt-hh-mb .lines--sptmb {
position: relative;
width: auto;
height: 100%;
margin: 0 auto;
border-right: 2px solid var(--color-light);
}
.box--mobile-menu-profile .b--btn-mn-lirgt-mb {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 16px;
}
.box--mobile-menu-profile .b--btn-mn-lirgt-mb .btn--login-rgt-mb {
position: relative;
width: calc((100%/2) - 5px);
height: auto;
border-radius: 5px;
background-color: var(--color-bg-yl);
cursor: pointer;
overflow: hidden;
display: flex;
}
.box--mobile-menu-profile .b--btn-mn-lirgt-mb .btn--login-rgt-mb a {
position: relative;
width: 100%;
height: auto;
padding: 7px 12px;
}
.box--mobile-menu-profile .b--btn-mn-lirgt-mb .btn--login-rgt-mb p {
font-size: 0.94rem;
text-align: center;
color: var(--color-light);
}
.box--mobile-menu-profile .b--btn-mn-lirgt-mb .btn--login-rgt-mb p i {
font-size: 0.94rem;
color: var(--color-light);
margin-left: 2px;
}
.box--mobile-menu-profile .b--btn-mn-lirgt-mb .btn--login-rgt-mb:hover {
background-color: var(--color-first);
transition: all 0.3s ease;
}
.box--mobile-menu-profile .b--btn-ch-lg-mb {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
padding-top: 5px;
}
.box--mobile-menu-profile .b--btn-ch-lg-mb .btn--chlg-mb {
position: relative;
width: 5.4rem;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
cursor: pointer;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
}
.box--mobile-menu-profile .b--btn-ch-lg-mb .btn--chlg-mb:first-child {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.box--mobile-menu-profile .b--btn-ch-lg-mb .btn--chlg-mb:last-child {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
.box--mobile-menu-profile .b--btn-ch-lg-mb .btn--chlg-mb a {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
padding: 2px 10px;
}
.box--mobile-menu-profile .b--btn-ch-lg-mb .btn--chlg-mb figure {
position: relative;
width: auto;
height: auto;
display: flex;
}
.box--mobile-menu-profile .b--btn-ch-lg-mb .btn--chlg-mb figure .size-img {
position: relative;
width: auto;
height: 1rem;
}
.box--mobile-menu-profile .b--btn-ch-lg-mb .btn--chlg-mb .name-lg {
position: relative;
width: auto;
height: auto;
padding-left: 5px;
}
.box--mobile-menu-profile .b--btn-ch-lg-mb .btn--chlg-mb .name-lg p {
font-size: 0.88rem;
font-weight: bold;
color: var(--color-txtg5);
}
.box--mobile-menu-profile .b--btn-ch-lg-mb .btn--chlg-mb:hover {
background-color: var(--color-first);
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.box--mobile-menu-profile .b--btn-ch-lg-mb .btn--chlg-mb:hover .name-lg p {
color: var(--color-light);
transition: all 0.3s ease;
}
.box--mobile-menu-profile .b--profile-mb {
position: relative;
width: 100%;
height: auto;
padding: 10px 16px 5px 16px;
overflow: hidden;
}
.box--mobile-menu-profile .b--profile-mb .img-pf {
position: relative;
width: 100%;
height: auto;
display: flex;
z-index: 9;
}
.box--mobile-menu-profile .b--profile-mb .img-pf a {
position: relative;
width: auto;
height: auto;
display: flex;
cursor: pointer;
margin: 0 auto;
border-radius: 100%;
border: 8px solid var(--color-first);
}
.box--mobile-menu-profile .b--profile-mb .img-pf figure {
position: relative;
width: 6.25rem;
height: 6.25rem;
border-radius: 100%;
overflow: hidden;
border: 5px solid var(--color-light);
}
.box--mobile-menu-profile .b--profile-mb .img-pf figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.box--mobile-menu-profile .b--profile-mb .name-pf {
position: relative;
width: 100%;
height: auto;
display: flex;
padding: 5px 0;
z-index: 9;
}
.box--mobile-menu-profile .b--profile-mb .name-pf a {
position: relative;
width: auto;
height: auto;
display: flex;
margin: 0 auto;
}
.box--mobile-menu-profile .b--profile-mb .name-pf p {
font-size: 0.94rem;
color: var(--color-txtg5);
}
.box--mobile-menu-profile .b--profile-mb .name-pf p:hover {
color: var(--color-first);
transition: all 0.3s ease;
}
.box--mobile-menu-profile .b--profile-mb .bg-box-pf-mb {
position: absolute;
width: 100%;
height: 5rem;
top: 0;
left: 0;
background-color: var(--color-first);
z-index: 1;
}
}
/* ============= ============= */
.show--menu-mb {
display: none;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {}
@media (min-width: 0px) and (max-width: 991px) {
.show--menu-mb {
display: block;
}
.menu--login-profile {
position: relative;
width: 100%;
height: auto;
padding: 0 16px 10px 16px;
}
.menu--login-profile .btn--bmnpf {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
border-bottom: 1px solid rgba(var(--color-first-rgb), 0.3);
}
.menu--login-profile .btn--bmnpf:last-child {
border-bottom: none;
}
.menu--login-profile .btn--bmnpf a {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 16px;
cursor: pointer;
}
.menu--login-profile .btn--bmnpf .icon--l {
position: relative;
width: 2rem;
height: auto;
}
.menu--login-profile .btn--bmnpf .icon--l i {
font-size: 1rem;
}
.menu--login-profile .btn--bmnpf .name--r {
position: relative;
width: auto;
height: auto;
}
.menu--login-profile .btn--bmnpf .name--r p {
font-size: 1rem;
}
}
/* */
/* ================= footer ================= */
.box--footer {
position: relative;
width: 100%;
height: auto;
}
.box-bg-footer {
position: relative;
width: 100%;
height: auto;
/* background-color: var(--color-fifth); */
background: #3164AF;
background: linear-gradient(90deg, rgba(49, 100, 175, 1) 0%, rgba(76, 127, 205, 1) 50%, rgba(49, 100, 175, 1) 100%);
}
.box-bg-footer2 {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-bg-ft);
}
.b--spr-ft {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 40px 0 16px 0;
}
.b--spr-ft .b--ft {
position: relative;
width: auto;
height: auto;
padding: 0 10px;
}
.b--spr-ft .size-b1 {
width: 40%;
}
.b--spr-ft .size-b2 {
width: 19%;
}
.b--spr-ft .size-b3 {
width: 19%;
}
.b--spr-ft .size-b4 {
width: 22%;
}
.b--spr-ft .b--ft .b-logo-ft {
position: relative;
width: 60%;
/* width: 50%; */
height: auto;
max-height: 6rem;
/* max-height: 3.5rem; */
display: flex;
/* padding-bottom: 10px; */
}
.b--spr-ft .b--ft .b-logo-ft figure {
position: relative;
width: 100%;
height: auto;
/* max-height: 3.5rem; */
}
.b--spr-ft .b--ft .b-logo-ft figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: contain;
object-position: 0;
}
.b--spr-ft .b--ft .b-address-ft {
position: relative;
width: 100%;
height: auto;
padding: 10px 0;
}
.b--spr-ft .b--ft .b-address-ft p {
font-size: 0.92rem;
color: var(--color-light);
/* color: var(--color-second); */
/* color: var(--color-txtg2); */
}
.b--spr-ft .b--ft .b-address-ft p a {
color: var(--color-light);
/* color: var(--color-second); */
/* color: var(--color-txtg2); */
}
.b--spr-ft .b--ft .b-address-ft .cpn--name-set {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-light);
/* color: var(--color-second); */
}
.b--spr-ft .b--ft .b-social-ft {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 10px 0;
}
.b--spr-ft .b--ft .b-social-ft .b-btn-sc {
position: relative;
width: 2rem;
height: 2rem;
background-color: var(--color-light);
border: 1px solid var(--color-light);
/* background-color: var(--color-txtg6); */
margin: 0 10px 10px 0;
border-radius: 2px;
cursor: pointer;
}
.b--spr-ft .b--ft .b-social-ft .b-btn-sc:last-child {
margin-right: 0;
}
.b--spr-ft .b--ft .b-social-ft .b-btn-sc a {
position: relative;
width: 100%;
height: 100%;
display: block;
}
.b--spr-ft .b--ft .b-social-ft .b-btn-sc i {
font-size: 1.38rem;
color: var(--color-first);
/* color: var(--color-txtg2); */
position: relative;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.b--spr-ft .b--ft .b-social-ft .b-btn-sc:hover {
background-color: var(--color-first);
border: 1px solid var(--color-light);
border-radius: 2px;
/* background-color: var(--color-txtg4); */
transition: all 0.3s ease;
}
.b--spr-ft .b--ft .b-social-ft .b-btn-sc:hover i {
color: var(--color-light);
/* color: var(--color-light); */
transition: all 0.3s ease;
}
.b--spr-ft .b--ft .b-title-ft {
position: relative;
width: 100%;
height: auto;
}
.b--spr-ft .b--ft .b-title-ft p {
font-size: 1.13rem;
font-weight: bold;
color: var(--color-light);
/* color: var(--color-second); */
/* color: var(--color-txtg2); */
}
.b--spr-ft .b--ft .lines-spr {
position: relative;
width: 2.2rem;
height: 2px;
border-radius: 100px;
/* background-color: var(--color-txtg4); */
background-color: var(--color-light);
/* background-color: var(--color-first); */
margin: 3px 0 12px 0;
}
.b--spr-ft .b--ft .b-dt-ft {
position: relative;
width: 100%;
height: auto;
}
.b--spr-ft .b--ft .b-dt-ft p {
font-size: 0.94rem;
color: var(--color-light);
/* color: var(--color-txtg3); */
margin-bottom: 5px;
}
.b--spr-ft .b--ft .b-dt-ft p a {
color: var(--color-light);
/* color: var(--color-second); */
/* color: var(--color-txtg3); */
cursor: pointer;
}
.b--spr-ft .b--ft .b-dt-ft p:hover a {
color: var(--color-light);
text-decoration: underline;
transition: all 0.3s ease;
}
.b--spr-ft .b--ft .b-dt-ft .b-lr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
margin-bottom: 5px;
}
.b--spr-ft .b--ft .b-dt-ft .b-lr .l-icon {
position: relative;
width: 2rem;
height: auto;
}
.b--spr-ft .b--ft .b-dt-ft .b-lr .l-icon i {
font-size: 1rem;
color: var(--color-light);
/* color: var(--color-second); */
/* color: var(--color-txtg2); */
}
.b--spr-ft .b--ft .b-dt-ft .b-lr .r-txt {
position: relative;
width: calc(100% - 2rem);
height: auto;
}
.b--spr-ft .b--ft .b-dt-ft .b-lr .r-txt p {
font-size: 0.92rem;
color: var(--color-light);
/* color: var(--color-second); */
/* color: var(--color-txtg2); */
}
.b--spr-ft .b--ft .b-dt-ft .b-lr .r-txt p a {
color: var(--color-light);
/* color: var(--color-second); */
/* color: var(--color-txtg2); */
margin-bottom: 5px;
}
.b--spr-ft .b--ft .b-dt-ft .b-lr .r-txt p:hover a {
color: var(--color-light);
text-decoration: underline;
transition: all 0.3s ease;
}
.box--copyright {
position: relative;
width: 100%;
height: auto;
margin: 16px 0 0 0;
padding: 16px 0 20px 0;
border-top: 1px solid var(--color-txtg4);
}
.box--copyright .b-spr-cpl {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
align-items: center;
}
.box--copyright .b-spr-cpl .b-cpl-l {
position: relative;
width: 11rem;
height: auto;
}
.box--copyright .b-spr-cpl .b-cpl-c {
position: relative;
width: calc(100% - 22rem);
height: auto;
}
.box--copyright .b-spr-cpl .b-cpl-c p {
font-size: 0.82rem;
text-align: center;
color: var(--color-light);
/* color: var(--color-second); */
/* color: var(--color-txtg4); */
}
.box--copyright .b-spr-cpl .b-cpl-r {
position: relative;
width: 11rem;
height: auto;
padding: 0 10px;
}
.box--copyright .b-spr-cpl .b-cpl-r p {
font-size: 0.82rem;
text-align: right;
color: var(--color-second);
/* color: var(--color-txtg4); */
cursor: pointer;
}
.box--copyright .b-spr-cpl .b-cpl-r p span {
color: var(--color-light);
/* color: var(--color-second); */
/* color: var(--color-txtg4); */
}
.box--copyright .b-spr-cpl .b-cpl-r p span i {
color: var(--color-light);
/* color: var(--color-second); */
/* color: var(--color-txtg4); */
font-size: 1rem;
padding: 0 0 0 2px;
}
.box--copyright .b-spr-cpl .b-cpl-r p:hover span {
color: var(--color-light);
/* color: var(--color-txtg2); */
transition: all 0.3s ease;
}
.box--copyright .b-spr-cpl .b-cpl-r p:hover span i {
color: var(--color-light);
/* color: var(--color-txtg2); */
transition: all 0.3s ease;
}
.size-icon-tel-ft {
padding-top: 6px;
}
.size-txt-tel-ft {
font-size: 1.19rem !important;
font-weight: bold;
}
.pd-b-box-txt-ft {
padding-bottom: 5px;
}
.pd-b-box-txt-ft3 {
padding-bottom: 3px;
}
.pd-b-box-txt-ft5 {
padding-bottom: 5px;
}
.pd-b-box-txt-ft8 {
padding-bottom: 8px;
}
.pd-b-box-txt-ft10 {
padding-bottom: 10px;
}
.txt--pd-b3 {
padding-bottom: 3px;
}
/* ============= */
@media (min-width: 992px) and (max-width: 1199px) {
.b--spr-ft {
justify-content: center;
}
.b--spr-ft .size-b1 {
width: 100%;
margin-bottom: 10px;
}
.b--spr-ft .size-b2 {
width: 25%;
margin-left: 5%;
}
.b--spr-ft .size-b3 {
width: 25%;
}
.b--spr-ft .size-b4 {
width: 30%;
}
.b--spr-ft .b--ft .b-logo-ft {
width: 80%;
height: auto;
max-height: 4rem;
margin: 0 auto;
}
.b--spr-ft .b--ft .b-logo-ft figure .size-img {
object-position: center;
}
.b--spr-ft .b--ft .b-address-ft p {
text-align: center;
}
.b--spr-ft .b--ft .b-social-ft {
justify-content: center;
}
}
@media (min-width: 0px) and (max-width: 991px) {
.b--spr-ft {
padding: 30px 0 5px 0;
}
.b--spr-ft .b--ft {
padding: 0;
margin-bottom: 10px;
}
.b--spr-ft .b--ft:last-child {
margin-bottom: 0;
}
.b--spr-ft .size-b1 {
width: 100%;
}
.b--spr-ft .size-b2 {
display: none;
}
.b--spr-ft .size-b3 {
display: none;
}
.b--spr-ft .size-b4 {
width: 100%;
}
.b--spr-ft .b--ft .b-logo-ft {
width: 80%;
height: auto;
max-height: 5rem;
margin: 0 auto;
}
.b--spr-ft .b--ft .b-logo-ft figure .size-img {
object-position: center;
}
.b--spr-ft .b--ft .b-address-ft p {
text-align: center;
}
.b--spr-ft .b--ft .b-social-ft {
justify-content: center;
}
.b--spr-ft .b--ft .b-title-ft p {
text-align: center;
}
.b--spr-ft .b--ft .lines-spr {
margin: 3px auto 12px auto;
}
.b--spr-ft .b--ft .b-dt-ft {
width: fit-content;
margin: 0 auto;
}
.box--copyright .b-spr-cpl .b-cpl-l {
display: none;
}
.box--copyright .b-spr-cpl .b-cpl-c {
width: 100%;
}
.box--copyright .b-spr-cpl .b-cpl-r {
/* display: none; */
position: absolute;
width: auto;
padding: 0;
bottom: -5px;
right: 0;
}
.box--copyright .b-spr-cpl .b-cpl-r p span i {
font-size: 1.5rem;
}
.dp-none-txt-backtotop {
display: none;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.box-bg-footer {
/* margin: 0 0 5.2rem 0; */
}
.box-bg-footer2 {
margin: 0;
}
}
/* ================= ================= */
.box-btn-ct-ft-mb {
display: none;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-btn-ct-ft-mb {
position: relative;
width: 100%;
height: auto;
display: block;
padding: 8px 5px 10px 5px;
}
.box-btn-ct-ft-mb .btn-ct-mb {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
padding: 5px 12px 3px 12px;
margin: 0 0 12px 0;
border-radius: 5px;
overflow: hidden;
cursor: pointer;
}
.box-btn-ct-ft-mb .btn-ct-mb:last-child {
margin-bottom: 0;
}
.box-btn-ct-ft-mb .btn-ct-mb a {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
}
.box-btn-ct-ft-mb .btn-ct-mb .icon-btn {
position: relative;
width: 3rem;
height: auto;
padding-right: 10px;
border-right: 1px dashed var(--color-light);
}
.box-btn-ct-ft-mb .btn-ct-mb .icon-btn p {
color: var(--color-light);
font-size: 1.38rem;
text-align: center;
}
.box-btn-ct-ft-mb .btn-ct-mb .icon-btn p i {
color: var(--color-light);
}
.box-btn-ct-ft-mb .btn-ct-mb .txt-btn {
position: relative;
width: calc(100% - 3rem);
height: auto;
padding: 0 20px 0 10px;
}
.box-btn-ct-ft-mb .btn-ct-mb .txt-btn p {
color: var(--color-light);
font-size: 1.38rem;
text-align: center;
}
.box-btn-ct-ft-mb .btn-tel-mb {
background-color: var(--color-first);
border: 1px solid var(--color-light);
}
.box-btn-ct-ft-mb .btn-line-mb {
background-color: var(--color-line);
}
}
/* ======= social ======= */
.set-ft-social {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
margin: 16px 0 0 0;
}
.set-ft-social .btn-sc-igm-ft {
position: relative;
width: 2.2rem;
height: auto;
margin: 0 5px 5px 5px;
cursor: pointer;
}
.set-ft-social .btn-sc-igm-ft a {
position: relative;
width: 100%;
height: 100%;
}
.set-ft-social .btn-sc-igm-ft .size-img {
position: relative;
width: 100%;
height: auto;
}
/* hover image */
.set-ft-social .btn-sc-igm-ft .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.set-ft-social .btn-sc-igm-ft:hover .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ================= background ================= */
/* .bg#f0eff3 { background-color: var(--color-light); }
.bg--first { background-color: var(--color-first); }
.bg--first08 { background-color: rgba(var(--color-first-rgb), 0.8); }
.bg--first05 { background-color: rgba(var(--color-first-rgb), 0.5); }
.bg--second { background-color: var(--color-second); }
.bg#ecedf3 { background-color: var(--color-grey); }
.bg#ecedf3-sc { background-color: var(--color-grey4); }
.bg--green { background-color: var(--color-green); }
.bg--green-sc { background-color: var(--color-green5); }
.bg#da2c4d { background-color: var(--color-red); }
.bg#da2c4d-sc { background-color: var(--color-red3); }
.bg--orange { background-color: var(--color-orange); }
.bg--orange-sc { background-color: var(--color-orange5); }
.bg#f8ab37 { background-color: var(--color-yellow); }
.bg#f8ab37-sc { background-color: var(--color-yellow3); }
.bg--blue { background-color: var(--color-blue); }
.bg--blue-sc { background-color: var(--color-blue3); }
.bg--brown { background-color: var(--color-brown); }
.bg--brown-sc { background-color: var(--color-brown4); } */
/* ================= day off ================= */
.b-day-off-all {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
border-top: 1px dashed var(--color-grey3);
padding: 10px 6px 5px 6px;
}
.b-day-off-all .box-df {
position: relative;
border-radius: 50px;
padding: 2px 10px;
margin: 0 3px 5px 3px;
}
.b-day-off-all .box-df p {
font-size: 0.75rem;
color: var(--color-light);
}
.b-day-off-all .color-bg-df1 {
background-color: var(--color-red);
}
.b-day-off-all .color-bg-df2 {
background-color: var(--color-red);
}
.b-day-off-all .color-bg-df3 {
background-color: var(--color-red);
}
.b-day-off-all .color-bg-df4 {
background-color: var(--color-red);
}
/* ================= title ================= */
/* ==== short ==== */
.box--title-full {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 16px 16px;
}
.box--title-full .b-names {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.box--title-full .b-names p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.box--title-full .b-names p span i {
color: var(--color-txtg);
}
.box--title-full .b-names p .c-icon {
padding: 0 3px;
}
.box--title-full .b-names p .c-txt1 {
color: var(--color-txtg);
}
.box--title-full .b-names p .c-txt2 {
color: var(--color-first);
}
.box--title-full .b-names p .c-txt3 {
color: var(--color-txtg);
}
.box--title-full .b-lines-spr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
}
.box--title-full .b-lines-spr .lines {
position: relative;
width: 100px;
height: auto;
border-top: 1px solid var(--color-grey5);
}
.box--title-full .b-lines-spr .circle {
position: relative;
width: 12px;
height: 12px;
border: 1px solid var(--color-icon-yl);
border-radius: 100%;
margin: 0 8px;
}
.box--title-full .b-short {
position: relative;
width: 100%;
height: auto;
padding-top: 5px;
}
.box--title-full .b-short p {
font-size: 1rem;
font-weight: normal;
text-align: center;
color: var(--color-txtg4);
}
/* ==== bg ==== */
.box--title-bg-f {
position: relative;
width: 100%;
height: auto;
/* padding: 5px 16px 16px 16px; */
padding: 5px 0 16px 0;
}
.box--title-bg-f .bg-b-title {
position: relative;
width: 100%;
height: auto;
padding: 13px 10px 10px 15px;
background-color: var(--color-light);
border: 1px solid var(--color-grey2);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
border-radius: 5px;
overflow: hidden;
}
.box--title-bg-f .bg-b-title p {
font-size: 1.25rem;
font-weight: bold;
}
.box--title-bg-f .bg-b-title .s-meet {
font-size: 1rem;
font-weight: normal;
}
.box--title-bg-f .bg-b-title p .cl-country {
color: var(--color-first);
font-weight: bold;
}
.box--title-bg-f .bg-b-title .txt-ct {
text-align: center;
}
.box--title-bg-f .bg-b-title p span {
padding: 0 2px;
}
.box--title-bg-f .bg-b-title .b-names {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.box--title-bg-f .bg-b-title .b-names p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.box--title-bg-f .bg-b-title .b-names p span i {
color: var(--color-txtg);
}
.box--title-bg-f .bg-b-title .b-names p .c-icon {
padding: 0 3px;
}
.box--title-bg-f .bg-b-title .b-names p .c-txt1 {
color: var(--color-txtg);
}
.box--title-bg-f .bg-b-title .b-names p .c-txt2 {
color: var(--color-first);
}
.box--title-bg-f .bg-b-title .b-names p .c-txt3 {
color: var(--color-txtg);
}
.box--title-bg-f .bg-b-title .b-lines-spr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
}
.box--title-bg-f .bg-b-title .b-lines-spr .lines {
position: relative;
width: 100px;
height: auto;
border-top: 1px solid var(--color-grey5);
}
.box--title-bg-f .bg-b-title .b-lines-spr .circle {
position: relative;
width: 12px;
height: 12px;
border: 1px solid var(--color-icon-yl);
border-radius: 100%;
margin: 0 8px;
}
.box--title-bg-f .bg-b-title .b-short {
position: relative;
width: 100%;
height: auto;
padding-top: 5px;
}
.box--title-bg-f .bg-b-title .b-short p {
font-size: 1rem;
font-weight: normal;
text-align: center;
color: var(--color-txtg4);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box--title-bg-f .bg-b-title .s-meet {
font-size: 0.94rem;
}
}
/* ==== not bg ==== */
.box--title--f {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 16px 10px;
}
.title--f2-pd {
padding: 5px 10px 5px 2px;
}
.box--title--f p {
font-size: 1.25rem;
font-weight: bold;
}
.box--title--f .s-meet {
font-size: 1rem;
font-weight: normal;
}
.box--title--f p .cl-country {
color: var(--color-first);
font-weight: bold;
}
.box--title--f .txt-ct {
text-align: center;
}
.box--title--f p span {
padding: 0 2px;
}
.box--title--f .b-names {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.box--title--f .b-names p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.box--title--f .b-names p span i {
color: var(--color-txtg);
}
.box--title--f .b-names p .c-icon {
padding: 0 3px;
}
.box--title--f .b-names p .c-txt1 {
color: var(--color-txtg);
}
.box--title--f .b-names p .c-txt2 {
color: var(--color-first);
}
.box--title--f .b-names p .c-txt3 {
color: var(--color-txtg);
}
.box--title--f .b-names p .c-txt4 {
color: var(--color-first);
}
.box--title--f .b-lines-spr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
}
.box--title--f .b-lines-spr .lines {
position: relative;
width: 100px;
height: auto;
border-top: 1px solid var(--color-grey5);
}
.box--title--f .b-lines-spr .circle {
position: relative;
width: 12px;
height: 12px;
border: 1px solid var(--color-icon-yl);
border-radius: 100%;
margin: 0 8px;
}
.box--title--f .b-short {
position: relative;
width: 100%;
height: auto;
padding-top: 5px;
}
.box--title--f .b-short p {
font-size: 1rem;
font-weight: normal;
text-align: center;
color: var(--color-txtg4);
}
.pd0-n {
padding: 0 !important;
}
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ==== bg 2 ==== */
.box--title-bg-f2 {
position: relative;
width: 100%;
height: auto;
padding: 0 0 16px 0;
}
.box--title-bg-f2 .bg-b-title {
position: relative;
width: 100%;
height: auto;
padding: 13px 10px 10px 15px;
background-color: var(--color-light);
border: 1px solid var(--color-grey2);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
border-radius: 5px;
overflow: hidden;
}
.box--title-bg-f2 .bg-b-title p {
font-size: 1.25rem;
font-weight: bold;
}
.box--title-bg-f2 .bg-b-title .s-meet {
font-size: 1rem;
font-weight: normal;
}
.box--title-bg-f2 .bg-b-title p .cl-country {
color: var(--color-first);
font-weight: bold;
}
.box--title-bg-f2 .bg-b-title .txt-ct {
text-align: center;
}
.box--title-bg-f2 .bg-b-title p span {
padding: 0 2px;
}
.box--title-bg-f2 .bg-b-title .b-names {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.box--title-bg-f2 .bg-b-title .b-names p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.box--title-bg-f2 .bg-b-title .b-names p span i {
color: var(--color-txtg);
}
.box--title-bg-f2 .bg-b-title .b-names p .c-icon {
padding: 0 3px;
}
.box--title-bg-f2 .bg-b-title .b-names p .c-txt1 {
color: var(--color-txtg);
}
.box--title-bg-f2 .bg-b-title .b-names p .c-txt2 {
color: var(--color-first);
}
.box--title-bg-f2 .bg-b-title .b-names p .c-txt3 {
color: var(--color-txtg);
}
.box--title-bg-f2 .bg-b-title .b-lines-spr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
}
.box--title-bg-f2 .bg-b-title .b-lines-spr .lines {
position: relative;
width: 100px;
height: auto;
border-top: 1px solid var(--color-grey5);
}
.box--title-bg-f2 .bg-b-title .b-lines-spr .circle {
position: relative;
width: 12px;
height: 12px;
border: 1px solid var(--color-icon-yl);
border-radius: 100%;
margin: 0 8px;
}
.box--title-bg-f2 .bg-b-title .b-short {
position: relative;
width: 100%;
height: auto;
padding-top: 5px;
}
.box--title-bg-f2 .bg-b-title .b-short p {
font-size: 1rem;
font-weight: normal;
text-align: center;
color: var(--color-txtg4);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box--title-bg-f2 .bg-b-title .s-meet {
font-size: 0.94rem;
}
}
/* ================= main ================= */
.box--main {
position: relative;
width: 100%;
height: auto;
}
.box--main2 {
position: relative;
width: 100%;
height: auto;
}
/* ================= */
.click-txt-link-dt {
text-decoration: underline;
padding: 0 0 0 5px !important;
font-weight: bold;
cursor: pointer;
color: var(--color-blue4);
}
.click-txt-link-dt a {
color: var(--color-blue4);
}
.click-txt-link-dt:hover {
color: var(--color-first);
transition: all 0.3s ease;
}
.click-txt-link-dt:hover a {
color: var(--color-first);
transition: all 0.3s ease;
}
/* ================= tabs menu ================= */
.sc--tabs-menu-view {
position: relative;
width: 100%;
height: auto;
}
.bg-color-tabs {
background-color: var(--color-bg-ft);
border-bottom: 1px solid var(--color-txtg4);
}
.sc--tabs-menu-view .tabs-menu {
position: relative;
width: 100%;
height: auto;
padding: 10px 0;
display: flex;
justify-content: end;
}
.sc--tabs-menu-view .tabs-menu p {
font-size: 0.88rem;
color: var(--color-light);
padding: 0 2px;
}
.sc--tabs-menu-view .tabs-menu p:last-child {
padding-right: 0;
}
.sc--tabs-menu-view .tabs-menu p a {
color: var(--color-txtg3);
cursor: pointer;
}
.sc--tabs-menu-view .tabs-menu p a:hover {
color: var(--color-light);
transition: all 0.3s ease;
}
.sc--tabs-menu-view .tabs-menu .cl-sp {
color: var(--color-txtg3);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.sc--tabs-menu-view {
display: none;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--tabs-menu-view {
display: none;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--tabs-menu-view {
display: none;
}
}
/* ====== image slider ====== */
.sc--img-slider {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.1);
}
.sc--img-slider .box--imgslider {
position: relative;
width: 100%;
height: auto;
}
.sc--img-slider .box--imgslider ul li a {
position: relative;
width: 100%;
height: 100%;
}
.sc--img-slider .box--imgslider ul li figure {
position: relative;
width: 100%;
height: 100%;
}
.sc--img-slider .box--imgslider ul li figure .size--imgsl {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--img-slider .box--imgslider .box-btn-back-isl,
.sc--img-slider .box--imgslider .box-btn-next-isl {
position: absolute;
width: 50px;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
}
.sc--img-slider .box--imgslider .box-btn-back-isl i,
.sc--img-slider .box--imgslider .box-btn-next-isl i {
font-size: 2rem;
color: var(--color-light);
}
.sc--img-slider .box--imgslider .box-btn-back-isl:hover i,
.sc--img-slider .box--imgslider .box-btn-next-isl:hover i {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--img-slider .box--imgslider .box--dots {
position: absolute;
display: flex;
justify-content: center;
}
#isliderb {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
#islideheight100rb {
height: inherit;
}
#isliderb #lineslisl {
position: absolute;
width: 100%;
height: 1px;
z-index: 1;
bottom: 0;
left: 0;
background-color: rgba(var(--color-first-rgb), 0.5);
}
@keyframes line {
0% {
width: 0%;
}
100% {
width: 100%;
}
}
ul.moveheight100isl {
height: 100% !important;
}
ul#moveisl {
width: 100%;
height: auto;
display: flex;
background-color: var(--color-light);
}
ul#moveisl li {
position: relative;
width: 100%;
min-width: 100%;
display: flex;
justify-content: center;
align-items: center;
list-style-type: none;
transition: all 0.6s ease;
}
#isliderb #backisl {
top: 0;
bottom: 0;
left: 0;
}
#isliderb #nextisl {
top: 0;
bottom: 0;
right: 0;
}
#isliderb #dotsisl {
left: 0;
right: 0;
bottom: 10px;
}
#isliderb #dotsisl li {
transition: all 0.3s ease;
list-style-type: none;
width: 30px;
height: 7px;
border-radius: 100px;
background-color: rgba(var(--color-dark-rgb), 0.5);
margin: 0 0.3rem;
cursor: pointer;
}
#isliderb #dotsisl li:hover,
#isliderb #dotsisl li.active {
background-color: var(--color-first);
}
/* ============= */
/* @media (min-width: 1200px) {} */
@media (min-width: 4501px) {
.sc--img-slider .box--imgslider ul li figure {
max-height: fit-content;
}
}
@media (min-width: 3901px) and (max-width: 4500px) {
.sc--img-slider .box--imgslider ul li figure {
max-height: 79.466rem;
}
}
@media (min-width: 3001px) and (max-width: 3900px) {
.sc--img-slider .box--imgslider ul li figure {
max-height: 55.099rem;
}
}
@media (min-width: 2201px) and (max-width: 3000px) {
.sc--img-slider .box--imgslider ul li figure {
max-height: 49.667rem;
}
}
@media (min-width: 2001px) and (max-width: 2200px) {
.sc--img-slider .box--imgslider ul li figure {
max-height: 39.733rem;
}
}
@media (min-width: 1900px) and (max-width: 2000px) {
.sc--img-slider .box--imgslider ul li figure {
max-height: 37.25rem;
}
}
@media (min-width: 1600px) and (max-width: 1899px) {
.sc--img-slider .box--imgslider ul li figure {
max-height: 33.77rem;
}
}
@media (min-width: 1360px) and (max-width: 1599px) {
.sc--img-slider .box--imgslider ul li figure {
max-height: 28.62rem;
}
}
@media (min-width: 1200px) and (max-width: 1359px) {
.sc--img-slider .box--imgslider ul li figure {
max-height: 24.77rem;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--img-slider .box--imgslider ul li figure {
height: 23rem;
max-height: 23rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.dpnone-box-imgslider {
display: none;
}
.sc--img-slider .box--imgslider ul li figure {
/* height: 23rem;
max-height: 23rem; */
}
#isliderb #dotsisl {
bottom: 7px;
}
#isliderb #dotsisl li {
margin: 0 0.2rem;
width: 25px;
height: 6px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.dpnone-box-imgslider {
display: none;
}
.sc--img-slider .box--imgslider ul li figure {
/* height: 20rem;
max-height: 20rem; */
}
#isliderb #dotsisl {
bottom: 5px;
}
#isliderb #dotsisl li {
margin: 0 0.2rem;
width: 20px;
height: 5px;
}
.sc--img-slider .box--imgslider .box-btn-back-isl,
.sc--img-slider .box--imgslider .box-btn-next-isl {
width: 40px;
}
.sc--img-slider .box--imgslider .box-btn-back-isl i,
.sc--img-slider .box--imgslider .box-btn-next-isl i {
font-size: 1.8rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.dpnone-box-imgslider {
display: none;
}
.sc--img-slider .box--imgslider ul li figure {
/* height: 12rem;
max-height: 12rem; */
}
#isliderb #dotsisl {
bottom: 5px;
}
#isliderb #dotsisl li {
margin: 0 0.2rem;
width: 20px;
height: 5px;
}
.sc--img-slider .box--imgslider .box-btn-back-isl,
.sc--img-slider .box--imgslider .box-btn-next-isl {
width: 30px;
}
.sc--img-slider .box--imgslider .box-btn-back-isl i,
.sc--img-slider .box--imgslider .box-btn-next-isl i {
font-size: 1.3rem;
}
}
/* ====== banner line promote ====== */
.sc--banner-l-pm {
position: relative;
width: 100%;
height: auto;
}
.sc--banner-l-pm .box--bn-l-pm {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
/* background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05); */
overflow: hidden;
cursor: pointer;
}
.sc--banner-l-pm .box--bn-l-pm a {
width: 100%;
height: 100%;
}
.sc--banner-l-pm .box--bn-l-pm figure {
position: relative;
width: 100%;
height: 100%;
}
.sc--banner-l-pm .box--bn-l-pm figure .size-imgb {
position: relative;
width: 100%;
height: auto;
}
/* ============= */
@media (min-width: 992px) and (max-width: 1199px) {
.sc--banner-l-pm .box--bn-l-pm {
margin-bottom: 20px;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.dpnone-box-banner-l {
display: none;
}
.sc--banner-l-pm {
margin-top: 20px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.dpnone-box-banner-l {
display: none;
}
.sc--banner-l-pm {
margin-top: 16px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.dpnone-box-banner-l {
display: none;
}
.sc--banner-l-pm {
margin-top: 12px;
}
}
/* ================= banner promote ================= */
.sc--banner-promote-sprlr {
position: relative;
width: 100%;
height: auto;
}
.sc--banner-promote-sprlr .box--bn-prom {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
/* border: 1px solid var(--color-grey3); */
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
margin-bottom: 6px;
cursor: pointer;
}
.sc--banner-promote-sprlr .box--bn-prom a {
width: 100%;
height: 100%;
}
.sc--banner-promote-sprlr .box--bn-prom figure {
width: 100%;
height: 100%;
}
.sc--banner-promote-sprlr .box--bn-prom figure .size--img {
position: relative;
width: 100%;
height: auto;
}
/* hover image */
.sc--banner-promote-sprlr .box--bn-prom figure .size--img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--banner-promote-sprlr .box--bn-prom:hover figure .size--img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.sc--banner-promote-sprlr .box--bn-prom {
border-radius: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--banner-promote-sprlr .box--bn-prom {
border-radius: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.dpnone-box-bnpm {
display: none;
}
.sc--banner-promote-sprlr {
padding: 16px 0;
}
.sc--banner-promote-sprlr.mg--t20 {
margin: 0;
}
.sc--banner-promote-sprlr .box--bn-prom {
margin-bottom: 0;
border-radius: 0;
}
.sc--banner-line-sprlr .box--bn-l {
border-radius: 0 !important;
}
}
/* ================= program image size 3 - 4 ================= */
.sc--program-img-sprlr {
position: relative;
width: 100%;
height: auto;
}
.sc--program-img-sprlr .box--bg-pgn {
position: relative;
width: 100%;
height: auto;
padding: 12px 12px 3px 12px;
border-radius: 5px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
overflow: hidden;
}
.sc--program-img-sprlr .box--bg-pgn .title-pg {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
}
.sc--program-img-sprlr .box--bg-pgn .title-pg p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-light);
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .bg--img {
position: relative;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size3-box-pgimg {
width: calc((100%/3) - 6px);
height: 17.28rem;
margin: 0 9px 9px 0;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size4-box-pgimg {
width: calc((100%/4) - 6.75px);
height: 12.821rem;
margin: 0 9px 9px 0;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .bg--img:hover {
border: 1px solid var(--color-light);
transition: all 0.3s ease;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .bg--img a {
position: relative;
width: 100%;
height: 100%;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .bg--img figure {
position: relative;
width: 100%;
height: 100%;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .bg--img figure .size--img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
/* hover image */
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .bg--img figure .size--img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .bg--img:hover figure .size--img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size3-box-pgimg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size4-box-pgimg:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size3-box-pgimg {
height: 19.209rem;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size4-box-pgimg {
height: 14.36rem;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size3-box-pgimg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size4-box-pgimg:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-img-sprlr {
width: auto;
margin: 0 16px;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size3-box-pgimg {
height: 15.542rem;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size4-box-pgimg {
width: calc((100%/3) - 6px);
height: 15.542rem;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size3-box-pgimg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size4-box-pgimg:nth-child(3n+0) {
margin-right: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-img-sprlr {
width: auto;
margin: 0 16px;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size3-box-pgimg {
height: 14.459rem;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size4-box-pgimg {
width: calc((100%/2) - 4.5px);
height: 21.969rem;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size3-box-pgimg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size4-box-pgimg:nth-child(2n+0) {
margin-right: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-img-sprlr.mg--t20 {
margin-top: 0;
}
.sc--program-img-sprlr .box--bg-pgn {
border-radius: 0;
padding: 12px 16px 5px 16px;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size3-box-pgimg {
width: 100%;
height: 24.75rem;
margin: 0 0 9px 0;
}
.sc--program-img-sprlr .box--bg-pgn .box-list-pgn .size4-box-pgimg {
width: 100%;
height: 24.75rem;
margin: 0 0 9px 0;
}
.sc--program-img-sprlr .box--bg-pgn .half-bpgimg-mb {
position: relative;
width: 100%;
height: auto;
}
.sc--program-img-sprlr .box--bg-pgn .half-bpgimg-mb .size3-box-pgimg {
width: calc((100%/2) - 4.5px);
height: 12.094rem;
margin: 0 9px 9px 0;
}
.sc--program-img-sprlr .box--bg-pgn .half-bpgimg-mb .size4-box-pgimg {
width: calc((100%/2) - 4.5px);
height: 12.094rem;
margin: 0 9px 9px 0;
}
.sc--program-img-sprlr .box--bg-pgn .half-bpgimg-mb .size3-box-pgimg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-img-sprlr .box--bg-pgn .half-bpgimg-mb .size4-box-pgimg:nth-child(2n+0) {
margin-right: 0;
}
}
/* ================= banner line ================= */
.sc--banner-line-sprlr {
position: relative;
width: 100%;
height: auto;
}
.sc--banner-line-sprlr .box--bn-l {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
overflow: hidden;
cursor: pointer;
}
.sc--banner-line-sprlr .box--bn-l a {
width: 100%;
height: 100%;
}
.sc--banner-line-sprlr .box--bn-l figure {
width: 100%;
height: 100%;
}
.sc--banner-line-sprlr .box--bn-l figure .size--img {
position: relative;
width: 100%;
height: auto;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.dpnone-box-bnline {
display: none;
}
.sc--banner-line-sprlr {
width: auto;
margin: 0 16px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.dpnone-box-bnline {
display: none;
}
.sc--banner-line-sprlr {
width: auto;
margin: 0 16px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.dpnone-box-bnline {
display: none;
}
.sc--banner-line-sprlr {
padding: 16px 0;
}
.sc--banner-line-sprlr.mg--t20 {
margin-top: 0;
}
}
/* ================= search ================= */
.sc--search-f {
position: relative;
width: 100%;
height: auto;
}
.sc--search-f .box-bg--search {
position: relative;
width: 100%;
height: auto;
padding: 16px 11px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--search-f .box-bg--search p {
font-size: 1rem;
font-weight: bold;
}
.sc--search-f .box-bg--search .mg--bl-title {
margin-bottom: 3px;
margin-left: 5px;
}
.sc--search-f .box-bg--search input {
width: 100%;
background-color: transparent;
}
.sc--search-f .box-bg--search select {
width: 100%;
background-color: transparent;
}
.sc--search-f .box-bg--search .box--txt-sr input,
.sc--search-f .box-bg--search .box--sl-cct input,
.sc--search-f .box-bg--search .box--date-start input,
.sc--search-f .box-bg--search .box--date-end input {
font-size: 0.94rem;
height: 2rem;
font-weight: normal;
padding: 3px 10px;
}
.sc--search-f .box-bg--search .box--txt-sr select,
.sc--search-f .box-bg--search .box--sl-cct select,
.sc--search-f .box-bg--search .box--date-start select,
.sc--search-f .box-bg--search .box--date-end select {
font-size: 0.94rem;
height: 2rem;
font-weight: normal;
padding: 3px 10px;
}
.sc--search-f .box-bg--search .box--txt-sr select option,
.sc--search-f .box-bg--search .box--sl-cct select option,
.sc--search-f .box-bg--search .box--date-start select option,
.sc--search-f .box-bg--search .box--date-end select option {
font-size: 0.94rem;
font-weight: normal;
}
.sc--search-f .box-bg--search .box--txt-sr {
position: relative;
/* width: calc(100%/5); */
/* width: calc(100%/6); */
height: auto;
padding: 5px;
}
.sc--search-f .box-bg--search .size-box--txt-sr-divide3 {
width: calc(100%/3);
}
.sc--search-f .box-bg--search .size-box--txt-sr-divide3 {
width: calc(100%/4);
}
.sc--search-f .box-bg--search .size-box--txt-sr-divide5 {
width: calc(100%/5);
}
.sc--search-f .box-bg--search .size-box--txt-sr-divide6 {
width: calc(100%/6);
}
.sc--search-f .box-bg--search .box--txt-sr .lines--bg-box {
position: relative;
width: 100%;
height: auto;
display: flex;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
}
.sc--search-f .box-bg--search .box--sl-cct {
position: relative;
/* width: calc(100%/5); */
/* width: calc(100%/6); */
height: auto;
padding: 5px;
}
.sc--search-f .box-bg--search .size-box--sl-cct-divide3 {
width: calc(100%/3);
}
.sc--search-f .box-bg--search .size-box--sl-cct-divide3 {
width: calc(100%/4);
}
.sc--search-f .box-bg--search .size-box--sl-cct-divide5 {
width: calc(100%/5);
}
.sc--search-f .box-bg--search .size-box--sl-cct-divide6 {
width: calc(100%/6);
}
.sc--search-f .box-bg--search .box--sl-cct .lines--bg-box {
position: relative;
width: 100%;
height: auto;
display: flex;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
}
.sc--search-f .box-bg--search .box--date-start {
position: relative;
/* width: calc(100%/5); */
/* width: calc(100%/6); */
height: auto;
padding: 5px;
}
.sc--search-f .box-bg--search .size-box--date-start-divide5 {
width: calc(100%/5);
}
.sc--search-f .box-bg--search .size-box--date-start-divide6 {
width: calc(100%/6);
}
.sc--search-f .box-bg--search .box--date-start .lines--bg-box {
position: relative;
width: 100%;
height: auto;
display: flex;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
}
.sc--search-f .box-bg--search .box--date-start .lines--bg-box .bg--icon-cld {
position: relative;
width: auto;
height: auto;
background-color: var(--color-first);
align-items: center;
display: flex;
padding: 2px 5px;
}
.sc--search-f .box-bg--search .box--date-start .lines--bg-box .bg--icon-cld i {
font-size: 1.07rem;
color: var(--color-light);
}
.sc--search-f .box-bg--search .box--date-end {
position: relative;
/* width: calc(100%/5); */
/* width: calc(100%/6); */
height: auto;
padding: 5px;
}
.sc--search-f .box-bg--search .size-box--date-end-divide5 {
width: calc(100%/5);
}
.sc--search-f .box-bg--search .size-box--date-end-divide6 {
width: calc(100%/6);
}
.sc--search-f .box-bg--search .box--date-end .lines--bg-box {
position: relative;
width: 100%;
height: auto;
display: flex;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
}
.sc--search-f .box-bg--search .box--date-end .lines--bg-box .bg--icon-cld {
position: relative;
width: auto;
height: auto;
background-color: var(--color-first);
align-items: center;
display: flex;
padding: 2px 5px;
}
.sc--search-f .box-bg--search .box--date-end .lines--bg-box .bg--icon-cld i {
font-size: 1.07rem;
color: var(--color-light);
}
.sc--search-f .box-bg--search .box--btn-sr {
position: relative;
/* width: calc(100%/5); */
/* width: calc(100%/6); */
height: auto;
padding: 5px;
align-items: end;
display: flex;
}
.sc--search-f .box-bg--search .size-box--btn-sr-divide3 {
width: calc(100%/3);
}
.sc--search-f .box-bg--search .size-box--btn-sr-divide4 {
width: calc(100%/4);
}
.sc--search-f .box-bg--search .size-box--btn-sr-divide5 {
width: calc(100%/5);
}
.sc--search-f .box-bg--search .size-box--btn-sr-divide6 {
width: calc(100%/6);
}
.sc--search-f .box-bg--search .box--btn-sr button {
position: relative;
width: 100%;
height: 2.125rem;
/* font-size: 1rem; */
border-radius: 5px;
background-color: var(--color-first);
overflow: hidden;
padding: 5px 10px 2px 10px;
cursor: pointer;
}
.sc--search-f .box-bg--search .box--btn-sr button .pd-r-ict {
padding-right: 5px;
}
.sc--search-f .box-bg--search .box--btn-sr button span {
color: var(--color-light);
font-size: 1.07rem;
font-weight: 400;
}
.sc--search-f .box-bg--search .box--btn-sr button span i {
color: var(--color-light);
font-size: 1rem;
}
/* ==== 3 ==== */
.size-sh-ct-b3 {
width: 30% !important;
}
.size-sh-ct-b2 {
width: 20% !important;
}
/* ==== range slider ==== */
.sc--search-f .box-bg--search .box--range-sr {
position: relative;
width: 100%;
height: auto;
padding: 5px;
}
.sc--search-f .box-bg--search .box--range-sr input {
padding: 0;
}
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-view {
position: relative;
width: 100%;
height: auto;
padding-top: 10px;
padding-bottom: 12px;
display: flex;
justify-content: center;
align-items: center;
}
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-view input {
height: auto;
font-size: 1.13rem;
font-weight: bold;
}
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-view .nb--inp-min {
position: relative;
width: calc((100%/2) - 2.2rem);
height: auto;
}
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-view .nb--inp-min input {
text-align: right;
}
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-view .txt--separator {
position: relative;
width: 4.4rem;
height: auto;
padding: 2px 10px;
}
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-view .txt--separator p {
font-size: 1rem;
font-weight: normal;
text-align: center;
}
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-view .nb--inp-max {
position: relative;
width: calc((100%/2) - 2.2rem);
height: auto;
}
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 70%;
height: auto;
display: flex;
flex-direction: column;
padding-bottom: 10px;
margin-left: auto;
margin-right: auto;
position: relative;
}
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-slider .control--range-sl {
position: relative;
}
/* ==== input range slider ==== */
#rangeslfrom {
height: 0;
z-index: 1;
}
#rangeslfrom2 {
height: 0;
z-index: 1;
}
#rangeslfrom3 {
height: 0;
z-index: 1;
}
input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
pointer-events: all;
width: 1em;
height: 1em;
background-color: var(--color-second);
border-radius: 50%;
box-shadow: 0 0 0 1px var(--color-first);
cursor: pointer;
}
input[type=range]::-moz-range-thumb {
-webkit-appearance: none;
pointer-events: all;
width: 1em;
height: 1em;
background-color: var(--color-second);
border-radius: 50%;
box-shadow: 0 0 0 1px var(--color-first);
cursor: pointer;
}
input[type=range]::-webkit-slider-thumb:hover {
background-color: var(--color-second);
}
input[type=range]::-webkit-slider-thumb:active {
box-shadow: inset 0 0 3px var(--color-first), 0 0 9px var(--color-first);
-webkit-box-shadow: inset 0 0 3px var(--color-first), 0 0 9px var(--color-first);
}
input[type="range"] {
-webkit-appearance: none;
appearance: none;
height: 6px;
width: 100%;
position: absolute;
background-color: var(--color-second);
pointer-events: none;
border-radius: 50px;
top: 50%;
transform: translateY(-50%);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 80%;
padding-bottom: 5px;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--search-f .box-bg--search .box--txt-sr {
/* width: calc(100%/2); */
order: 1;
}
.sc--search-f .box-bg--search .box--sl-cct {
/* width: calc(100%/2); */
order: 2;
}
.sc--search-f .box-bg--search .box--date-start {
/* width: calc(100%/2); */
order: 3;
}
.sc--search-f .box-bg--search .box--date-end {
/* width: calc(100%/2); */
order: 4;
}
.sc--search-f .box-bg--search .box--btn-sr {
/* width: 100%; */
order: 6;
justify-content: center;
}
.sc--search-f .box-bg--search .size-box--txt-sr-divide5 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--txt-sr-divide6 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--sl-cct-divide5 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--sl-cct-divide6 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--date-start-divide5 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--date-start-divide6 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--date-end-divide5 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--date-end-divide6 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--btn-sr-divide5 {
width: 100%;
}
.sc--search-f .box-bg--search .size-box--btn-sr-divide6 {
width: 100%;
}
.sc--search-f .box-bg--search .box--btn-sr button {
width: 80%;
}
.sc--search-f .box-bg--search .box--range-sr {
order: 5;
padding-bottom: 16px;
}
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 80%;
padding-bottom: 5px;
}
/* ==== 3 ==== */
.size-sh-ct-b3 {
width: 35% !important;
}
.size-sh-ct-b2 {
width: 30% !important;
}
.size-sh-ct-b2 button {
width: 100% !important;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--search-f .box-bg--search .box--txt-sr {
/* width: calc(100%/2); */
order: 1;
}
.sc--search-f .box-bg--search .box--sl-cct {
/* width: calc(100%/2); */
order: 2;
}
.sc--search-f .box-bg--search .box--date-start {
/* width: calc(100%/2); */
order: 3;
}
.sc--search-f .box-bg--search .box--date-end {
/* width: calc(100%/2); */
order: 4;
}
.sc--search-f .box-bg--search .box--btn-sr {
/* width: 100%; */
order: 6;
justify-content: center;
}
.sc--search-f .box-bg--search .size-box--txt-sr-divide5 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--txt-sr-divide6 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--sl-cct-divide5 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--sl-cct-divide6 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--date-start-divide5 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--date-start-divide6 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--date-end-divide5 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--date-end-divide6 {
width: calc(100%/2);
}
.sc--search-f .box-bg--search .size-box--btn-sr-divide5 {
width: 100%;
}
.sc--search-f .box-bg--search .size-box--btn-sr-divide6 {
width: 100%;
}
.sc--search-f .box-bg--search .box--btn-sr button {
width: 90%;
}
.sc--search-f .box-bg--search .box--range-sr {
order: 5;
padding-bottom: 16px;
}
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 90%;
padding-bottom: 5px;
}
/* ==== 3 ==== */
.size-sh-ct-b3 {
width: 35% !important;
}
.size-sh-ct-b2 {
width: 30% !important;
}
.size-sh-ct-b2 button {
width: 100% !important;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--search-f .container {
padding: 0;
}
.sc--search-f .box-bg--search {
border-radius: 0;
padding: 16px;
}
.sc--search-f .box-bg--search .box--txt-sr {
/* width: 100%; */
order: 1;
}
.sc--search-f .box-bg--search .box--sl-cct {
/* width: 100%; */
order: 2;
}
.sc--search-f .box-bg--search .box--date-start {
/* width: 100%; */
order: 3;
}
.sc--search-f .box-bg--search .box--date-end {
/* width: 100%; */
order: 4;
}
.sc--search-f .box-bg--search .box--btn-sr {
/* width: 100%; */
order: 6;
justify-content: center;
}
.sc--search-f .box-bg--search .size-box--txt-sr-divide5 {
width: 100%;
}
.sc--search-f .box-bg--search .size-box--txt-sr-divide6 {
width: 100%;
}
.sc--search-f .box-bg--search .size-box--sl-cct-divide5 {
width: 100%;
}
.sc--search-f .box-bg--search .size-box--sl-cct-divide6 {
width: 100%;
}
.sc--search-f .box-bg--search .size-box--date-start-divide5 {
width: 100%;
}
.sc--search-f .box-bg--search .size-box--date-start-divide6 {
width: 100%;
}
.sc--search-f .box-bg--search .size-box--date-end-divide5 {
width: 100%;
}
.sc--search-f .box-bg--search .size-box--date-end-divide6 {
width: 100%;
}
.sc--search-f .box-bg--search .size-box--btn-sr-divide5 {
width: 100%;
}
.sc--search-f .box-bg--search .size-box--btn-sr-divide6 {
width: 100%;
}
.sc--search-f .box-bg--search .box--btn-sr button {
width: 100%;
}
.sc--search-f .box-bg--search .box--range-sr {
order: 5;
padding-bottom: 16px;
}
.sc--search-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 100%;
padding-bottom: 5px;
}
/* ==== 3 ==== */
.size-sh-ct-b3 {
width: 100% !important;
}
.size-sh-ct-b2 {
width: 100% !important;
}
.size-sh-ct-b2 button {
width: 100% !important;
margin-top: 10px;
}
}
/* ================= search 2 ================= */
.sc--search2-f {
position: relative;
width: 100%;
height: auto;
}
.sc--search2-f .box-bg--search {
position: relative;
width: 100%;
height: auto;
padding: 16px 11px;
display: flex;
/* justify-content: stretch; */
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--search2-f .box-bg--search p {
font-size: 1rem;
font-weight: bold;
}
.sc--search2-f .box-bg--search .mg--bl-title {
margin-bottom: 3px;
margin-left: 5px;
}
.sc--search2-f .box-bg--search input {
width: 100%;
background-color: transparent;
}
.sc--search2-f .box-bg--search select {
width: 100%;
background-color: transparent;
}
.sc--search2-f .box-bg--search .box--inp-s {
position: relative;
width: 30%;
height: auto;
padding: 5px;
}
.sc--search2-f .box-bg--search .order--it1 {
order: 1;
}
.sc--search2-f .box-bg--search .order--it2 {
order: 2;
}
.sc--search2-f .box-bg--search .order--it3 {
order: 3;
}
.sc--search2-f .box-bg--search .order--it4 {
order: 4;
}
.sc--search2-f .box-bg--search .order--it5 {
order: 5;
}
.sc--search2-f .box-bg--search .order--it6 {
order: 6;
}
.sc--search2-f .box-bg--search .order--it7 {
order: 7;
}
.sc--search2-f .box-bg--search .order--it8 {
order: 8;
}
.sc--search2-f .box-bg--search .box--inp-s .lines--bg-box {
position: relative;
width: 100%;
height: auto;
display: flex;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
}
.sc--search2-f .box-bg--search .box--inp-s input {
font-size: 0.94rem;
height: 2rem;
font-weight: normal;
padding: 3px 10px;
}
.sc--search2-f .box-bg--search .box--inp-s select {
font-size: 0.94rem;
height: 2rem;
font-weight: normal;
padding: 3px 10px;
}
.sc--search2-f .box-bg--search .box--inp-s .lines--bg-box .bg--icon-cld {
position: relative;
width: auto;
height: auto;
background-color: var(--color-first);
align-items: center;
display: flex;
padding: 2px 5px;
}
.sc--search2-f .box-bg--search .box--inp-s .lines--bg-box .bg--icon-cld i {
font-size: 1.07rem;
color: var(--color-light);
}
.sc--search2-f .box-bg--search .box--btn-sr {
position: relative;
width: 100%;
height: auto;
padding: 15px 5px 5px 5px;
align-items: end;
display: flex;
}
.sc--search2-f .box-bg--search .box--btn-sr button {
position: relative;
width: 30%;
height: 2.125rem;
border-radius: 5px;
background-color: var(--color-first);
overflow: hidden;
padding: 5px 10px 2px 10px;
cursor: pointer;
margin: 0 auto;
}
.sc--search2-f .box-bg--search .box--btn-sr button .pd-r-ict {
padding-right: 5px;
}
.sc--search2-f .box-bg--search .box--btn-sr button span {
color: var(--color-light);
font-size: 1.07rem;
font-weight: 400;
}
.sc--search2-f .box-bg--search .box--btn-sr button span i {
color: var(--color-light);
font-size: 1rem;
}
/* ==== range slider ==== */
.sc--search2-f .box-bg--search .box--range-sr {
position: relative;
width: 100%;
height: auto;
padding: 5px;
}
.sc--search2-f .box-bg--search .box--range-sr input {
padding: 0;
}
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-view {
position: relative;
width: 100%;
height: auto;
padding-top: 10px;
padding-bottom: 12px;
display: flex;
justify-content: center;
align-items: center;
}
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-view input {
height: auto;
font-size: 1.13rem;
font-weight: bold;
}
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-view .nb--inp-min {
position: relative;
width: calc((100%/2) - 2.2rem);
height: auto;
}
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-view .nb--inp-min input {
text-align: right;
}
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-view .txt--separator {
position: relative;
width: 4.4rem;
height: auto;
padding: 2px 10px;
}
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-view .txt--separator p {
font-size: 1rem;
font-weight: normal;
text-align: center;
}
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-view .nb--inp-max {
position: relative;
width: calc((100%/2) - 2.2rem);
height: auto;
}
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 70%;
height: auto;
display: flex;
flex-direction: column;
padding-bottom: 10px;
margin-left: auto;
margin-right: auto;
position: relative;
}
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-slider .control--range-sl {
position: relative;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 80%;
padding-bottom: 5px;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--search2-f .box-bg--search .box--inp-s {
position: relative;
width: 50%;
height: auto;
padding: 5px;
}
.sc--search2-f .box-bg--search .order--it1 {
order: 1;
}
.sc--search2-f .box-bg--search .order--it2 {
order: 3;
}
.sc--search2-f .box-bg--search .order--it3 {
order: 4;
}
.sc--search2-f .box-bg--search .order--it4 {
order: 2;
}
.sc--search2-f .box-bg--search .order--it5 {
order: 5;
}
.sc--search2-f .box-bg--search .order--it6 {
order: 6;
}
.sc--search2-f .box-bg--search .order--it7 {
order: 7;
}
.sc--search2-f .box-bg--search .order--it8 {
order: 8;
}
.sc--search2-f .box-bg--search .box--btn-sr {
width: 100%;
justify-content: center;
}
.sc--search2-f .box-bg--search .box--btn-sr button {
width: 80%;
}
.sc--search2-f .box-bg--search .box--range-sr {
padding-bottom: 16px;
}
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 80%;
padding-bottom: 5px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--search2-f .box-bg--search .box--inp-s {
position: relative;
width: 50%;
height: auto;
padding: 5px;
}
.sc--search2-f .box-bg--search .order--it1 {
order: 1;
}
.sc--search2-f .box-bg--search .order--it2 {
order: 3;
}
.sc--search2-f .box-bg--search .order--it3 {
order: 4;
}
.sc--search2-f .box-bg--search .order--it4 {
order: 2;
}
.sc--search2-f .box-bg--search .order--it5 {
order: 5;
}
.sc--search2-f .box-bg--search .order--it6 {
order: 6;
}
.sc--search2-f .box-bg--search .order--it7 {
order: 7;
}
.sc--search2-f .box-bg--search .order--it8 {
order: 8;
}
.sc--search2-f .box-bg--search .box--btn-sr {
width: 100%;
justify-content: center;
}
.sc--search2-f .box-bg--search .box--btn-sr button {
width: 90%;
}
.sc--search2-f .box-bg--search .box--range-sr {
padding-bottom: 16px;
}
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 90%;
padding-bottom: 5px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--search2-f .container {
padding: 0;
}
.sc--search2-f .box-bg--search {
border-radius: 0;
padding: 16px;
}
.sc--search2-f .box-bg--search .box--inp-s {
position: relative;
width: 100%;
height: auto;
padding: 5px;
}
.sc--search2-f .box-bg--search .order--it1 {
order: 1;
}
.sc--search2-f .box-bg--search .order--it2 {
order: 3;
}
.sc--search2-f .box-bg--search .order--it3 {
order: 4;
}
.sc--search2-f .box-bg--search .order--it4 {
order: 2;
}
.sc--search2-f .box-bg--search .order--it5 {
order: 5;
}
.sc--search2-f .box-bg--search .order--it6 {
order: 6;
}
.sc--search2-f .box-bg--search .order--it7 {
order: 7;
}
.sc--search2-f .box-bg--search .order--it8 {
order: 8;
}
.sc--search2-f .box-bg--search .box--btn-sr {
width: 100%;
justify-content: center;
}
.sc--search2-f .box-bg--search .box--btn-sr button {
width: 100%;
}
.sc--search2-f .box-bg--search .box--range-sr {
padding-bottom: 16px;
}
.sc--search2-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 100%;
padding-bottom: 5px;
}
}
/* ================= search 3 ================= */
.sc--search3-f {
position: relative;
width: 100%;
height: auto;
}
.sc--search3-f .box-bg--search {
position: relative;
width: 100%;
height: auto;
padding: 16px 11px;
display: flex;
/* justify-content: stretch; */
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--search3-f .box-bg--search p {
font-size: 1rem;
font-weight: bold;
}
.sc--search3-f .box-bg--search .mg--bl-title {
margin-bottom: 3px;
margin-left: 5px;
}
.sc--search3-f .box-bg--search input {
width: 100%;
background-color: transparent;
}
.sc--search3-f .box-bg--search select {
width: 100%;
background-color: transparent;
}
.sc--search3-f .box-bg--search .box--inp-s {
position: relative;
height: auto;
padding: 5px;
}
.sc--search3-f .box-bg--search .size-box-sh20 {
width: 20%;
}
.sc--search3-f .box-bg--search .size-box-sh25 {
width: 25%;
}
.sc--search3-f .box-bg--search .size-box-sh30 {
width: 30%;
}
.sc--search3-f .box-bg--search .order--it1 {
order: 1;
}
.sc--search3-f .box-bg--search .order--it2 {
order: 2;
}
.sc--search3-f .box-bg--search .order--it3 {
order: 3;
}
.sc--search3-f .box-bg--search .order--it4 {
order: 4;
}
.sc--search3-f .box-bg--search .order--it5 {
order: 5;
}
.sc--search3-f .box-bg--search .order--it6 {
order: 6;
}
.sc--search3-f .box-bg--search .order--it7 {
order: 7;
}
.sc--search3-f .box-bg--search .order--it8 {
order: 8;
}
.sc--search3-f .box-bg--search .order--it9 {
order: 9;
}
.sc--search3-f .box-bg--search .order--it10 {
order: 10;
}
.sc--search3-f .box-bg--search .order--it11 {
order: 11;
}
.sc--search3-f .box-bg--search .box--inp-s .lines--bg-box {
position: relative;
width: 100%;
height: auto;
display: flex;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
}
.sc--search3-f .box-bg--search .box--inp-s input {
font-size: 0.94rem;
height: 2rem;
font-weight: normal;
padding: 3px 10px;
}
.sc--search3-f .box-bg--search .box--inp-s select {
font-size: 0.94rem;
height: 2rem;
font-weight: normal;
padding: 3px 10px;
}
.sc--search3-f .box-bg--search .box--inp-s .lines--bg-box .bg--icon-cld {
position: relative;
width: auto;
height: auto;
background-color: var(--color-first);
align-items: center;
display: flex;
padding: 2px 5px;
}
.sc--search3-f .box-bg--search .box--inp-s .lines--bg-box .bg--icon-cld i {
font-size: 1.07rem;
color: var(--color-light);
}
.sc--search3-f .box-bg--search .box--btn-sr {
position: relative;
width: 100%;
height: auto;
padding: 15px 5px 5px 5px;
align-items: end;
display: flex;
}
.sc--search3-f .box-bg--search .box--btn-sr button {
position: relative;
width: 30%;
height: 2.125rem;
border-radius: 5px;
background-color: var(--color-first);
overflow: hidden;
padding: 5px 10px 2px 10px;
cursor: pointer;
margin: 0 auto;
}
.sc--search3-f .box-bg--search .box--btn-sr button .pd-r-ict {
padding-right: 5px;
}
.sc--search3-f .box-bg--search .box--btn-sr button span {
color: var(--color-light);
font-size: 1.07rem;
font-weight: 400;
}
.sc--search3-f .box-bg--search .box--btn-sr button span i {
color: var(--color-light);
font-size: 1rem;
}
/* ==== range slider ==== */
.sc--search3-f .box-bg--search .box--range-sr {
position: relative;
width: 100%;
height: auto;
padding: 5px;
}
.sc--search3-f .box-bg--search .box--range-sr input {
padding: 0;
}
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-view {
position: relative;
width: 100%;
height: auto;
padding-top: 10px;
padding-bottom: 12px;
display: flex;
justify-content: center;
align-items: center;
}
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-view input {
height: auto;
font-size: 1.13rem;
font-weight: bold;
}
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-view .nb--inp-min {
position: relative;
width: calc((100%/2) - 2.2rem);
height: auto;
}
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-view .nb--inp-min input {
text-align: right;
}
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-view .txt--separator {
position: relative;
width: 4.4rem;
height: auto;
padding: 2px 10px;
}
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-view .txt--separator p {
font-size: 1rem;
font-weight: normal;
text-align: center;
}
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-view .nb--inp-max {
position: relative;
width: calc((100%/2) - 2.2rem);
height: auto;
}
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 70%;
height: auto;
display: flex;
flex-direction: column;
padding-bottom: 10px;
margin-left: auto;
margin-right: auto;
position: relative;
}
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-slider .control--range-sl {
position: relative;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 80%;
padding-bottom: 5px;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--search3-f .box-bg--search .size-box-sh20 {
width: 50%;
}
.sc--search3-f .box-bg--search .size-box-sh25 {
width: 50%;
}
.sc--search3-f .box-bg--search .size-box-sh30 {
width: 50%;
}
.sc--search3-f .box-bg--search .order--it1 {
order: 1;
width: 100%;
}
.sc--search3-f .box-bg--search .order--it2 {
order: 2;
}
.sc--search3-f .box-bg--search .order--it3 {
order: 3;
}
.sc--search3-f .box-bg--search .order--it4 {
order: 4;
}
.sc--search3-f .box-bg--search .order--it5 {
order: 5;
}
.sc--search3-f .box-bg--search .order--it6 {
order: 6;
}
.sc--search3-f .box-bg--search .order--it7 {
order: 7;
}
.sc--search3-f .box-bg--search .order--it8 {
order: 8;
}
.sc--search3-f .box-bg--search .order--it9 {
order: 9;
}
.sc--search3-f .box-bg--search .order--it10 {
order: 10;
}
.sc--search3-f .box-bg--search .order--it11 {
order: 11;
}
.sc--search3-f .box-bg--search .box--btn-sr {
width: 100%;
justify-content: center;
}
.sc--search3-f .box-bg--search .box--btn-sr button {
width: 80%;
}
.sc--search3-f .box-bg--search .box--range-sr {
padding-bottom: 16px;
}
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 80%;
padding-bottom: 5px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--search3-f .box-bg--search .size-box-sh20 {
width: 50%;
}
.sc--search3-f .box-bg--search .size-box-sh25 {
width: 50%;
}
.sc--search3-f .box-bg--search .size-box-sh30 {
width: 50%;
}
.sc--search3-f .box-bg--search .order--it1 {
order: 1;
width: 100%;
}
.sc--search3-f .box-bg--search .order--it2 {
order: 2;
}
.sc--search3-f .box-bg--search .order--it3 {
order: 3;
}
.sc--search3-f .box-bg--search .order--it4 {
order: 4;
}
.sc--search3-f .box-bg--search .order--it5 {
order: 5;
}
.sc--search3-f .box-bg--search .order--it6 {
order: 6;
}
.sc--search3-f .box-bg--search .order--it7 {
order: 7;
}
.sc--search3-f .box-bg--search .order--it8 {
order: 8;
}
.sc--search3-f .box-bg--search .order--it9 {
order: 9;
}
.sc--search3-f .box-bg--search .order--it10 {
order: 10;
}
.sc--search3-f .box-bg--search .order--it11 {
order: 11;
}
.sc--search3-f .box-bg--search .box--btn-sr {
width: 100%;
justify-content: center;
}
.sc--search3-f .box-bg--search .box--btn-sr button {
width: 90%;
}
.sc--search3-f .box-bg--search .box--range-sr {
padding-bottom: 16px;
}
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 90%;
padding-bottom: 5px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--search3-f .container {
padding: 0;
}
.sc--search3-f .box-bg--search {
border-radius: 0;
padding: 16px;
}
.sc--search3-f .box-bg--search .size-box-sh20 {
width: 100%;
}
.sc--search3-f .box-bg--search .size-box-sh25 {
width: 100%;
}
.sc--search3-f .box-bg--search .size-box-sh30 {
width: 100%;
}
.sc--search3-f .box-bg--search .order--it1 {
order: 1;
}
.sc--search3-f .box-bg--search .order--it2 {
order: 2;
}
.sc--search3-f .box-bg--search .order--it3 {
order: 3;
}
.sc--search3-f .box-bg--search .order--it4 {
order: 4;
}
.sc--search3-f .box-bg--search .order--it5 {
order: 5;
}
.sc--search3-f .box-bg--search .order--it6 {
order: 6;
}
.sc--search3-f .box-bg--search .order--it7 {
order: 7;
}
.sc--search3-f .box-bg--search .order--it8 {
order: 8;
}
.sc--search3-f .box-bg--search .order--it9 {
order: 9;
}
.sc--search3-f .box-bg--search .order--it10 {
order: 10;
}
.sc--search3-f .box-bg--search .order--it11 {
order: 11;
}
.sc--search3-f .box-bg--search .box--btn-sr {
width: 100%;
justify-content: center;
}
.sc--search3-f .box-bg--search .box--btn-sr button {
width: 100%;
}
.sc--search3-f .box-bg--search .box--range-sr {
padding-bottom: 16px;
}
.sc--search3-f .box-bg--search .box--range-sr .box--nb-range-slider {
width: 100%;
padding-bottom: 5px;
}
}
/* ================= search size mobile ================= */
.box--sh2-ct-ro-smb {
position: relative;
width: 100%;
height: auto;
}
.b-bg-sh2-ct-smb {
position: relative;
width: 100%;
height: auto;
}
.b--sh2 {
position: relative;
width: 100%;
height: auto;
}
.b-search-lines {
display: none;
}
.view-b-sh {
position: relative;
width: 100%;
height: auto;
}
.b-country-hot {
display: none;
}
.bg-bt-size-mobile {
display: none;
}
.b-btn-see-more {
display: none;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.box--sh2-ct-ro-smb {
margin-bottom: 10px;
}
.b-bg-sh2-ct-smb {
background-color: var(--color-first);
padding: 16px 16px 10px 16px;
}
.b--sh2 {
position: relative;
width: 100%;
height: auto;
}
.b--sh2.open {
padding-bottom: 10px;
}
.b-search-lines {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
overflow: hidden;
cursor: pointer;
display: inline-block;
}
.b-search-lines a {
position: relative;
width: 100%;
height: 100%;
display: flex;
justify-content: stretch;
align-items: center;
}
.b-search-lines .b-l {
position: relative;
width: 2rem;
height: auto;
padding: 12px 5px 10px 5px;
}
.b-search-lines .b-l p {
font-size: 1rem;
text-align: center;
}
.b-search-lines .b-l p i {
color: var(--color-first);
}
.b-search-lines .b-c {
position: relative;
width: calc(100% - 5rem);
height: auto;
padding: 12px 5px 10px 5px;
}
.b-search-lines .b-c p {
font-size: 1rem;
color: var(--color-txtg3);
}
.b-search-lines .b-r {
position: relative;
width: 3rem;
height: auto;
padding: 12px 5px 10px 5px;
}
.b-search-lines .b-r p {
font-size: 1rem;
text-align: center;
}
.b-search-lines .b-r p i {
color: var(--color-first);
}
.b--sh2.open .b-search-lines {
min-height: 2.875rem;
}
.view-b-sh {
height: 0;
margin-top: 10px;
border-radius: 5px;
background-color: var(--color-light);
overflow: hidden;
transition: all 0.2s linear;
}
.view-b-sh .mg--t20 {
margin-top: 0;
}
.b-country-hot {
position: relative;
width: 100%;
height: auto;
margin-top: 10px;
display: inline-block;
}
.b-country-hot .box-list {
position: relative;
width: 100%;
height: auto;
}
.b-country-hot .box-list .list-cy {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
white-space: nowrap;
cursor: pointer;
}
.b-country-hot .box-list .list-cy.active {
cursor: grab;
}
.b-country-hot .box-list .list-cy .b-lcy {
position: relative;
width: 4rem;
height: auto;
display: inline-block;
margin-right: 10px;
user-select: none;
}
.b-country-hot .box-list .list-cy .b-lcy:last-child {
margin-right: 0;
}
.b-country-hot .box-list .list-cy .b-lcy a {
position: relative;
width: 100%;
height: 100%;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.b-country-hot .box-list .list-cy .b-lcy .b-img {
position: relative;
width: 100%;
height: 4rem;
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
padding: 5px;
display: flex;
align-items: center;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.b-country-hot .box-list .list-cy .b-lcy .b-img figure {
position: relative;
width: 100%;
height: auto;
}
.b-country-hot .box-list .list-cy .b-lcy .b-img figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.b-country-hot .box-list .list-cy .b-lcy .b-name {
position: relative;
width: 100%;
height: auto;
padding-top: 5px;
white-space: normal;
}
.b-country-hot .box-list .list-cy .b-lcy .b-name p {
font-size: 0.88rem;
text-align: center;
color: var(--color-light);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.bg-bt-size-mobile {
position: relative;
width: 100%;
height: 2.8rem;
display: block;
}
.bg-bt-size-mobile::after {
display: block;
content: "";
position: absolute;
border-left: 100vw solid var(--color-first);
border-bottom: 1.8rem solid transparent;
border-top: 10px solid var(--color-first);
top: -1px;
left: 0;
}
.b-btn-see-more {
position: absolute;
width: 100%;
height: auto;
bottom: 0;
display: flex;
}
.b-btn-see-more button {
position: relative;
padding: 8px 20px 6px 20px;
margin: 0 auto;
border-radius: 100px;
color: var(--color-light);
background-color: var(--color-first);
background: linear-gradient(90deg, rgba(var(--color-third-rgb), 1) 0%, rgba(var(--color-first-rgb), 1) 80%, rgba(var(--color-first-rgb), 1) 100%);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.2);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.2);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.2);
}
.b-btn-see-more button span {
font-size: 1rem;
color: var(--color-light);
}
.b-btn-see-more button span i {
color: var(--color-light);
}
.b-btn-see-more button .pd-r-ict {
padding-left: 2px;
}
}
@media (min-width: 0px) and (max-width: 991px) {
.box--sh2-ct-ro-smb {
margin-bottom: 10px;
}
.b-bg-sh2-ct-smb {
background-color: var(--color-first);
padding: 16px 16px 10px 16px;
}
.b--sh2 {
position: relative;
width: 100%;
height: auto;
}
.b--sh2.open {
padding-bottom: 10px;
}
.b-search-lines {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
overflow: hidden;
cursor: pointer;
display: inline-block;
}
.b-search-lines a {
position: relative;
width: 100%;
height: 100%;
display: flex;
justify-content: stretch;
align-items: center;
}
.b-search-lines .b-l {
position: relative;
width: 2rem;
height: auto;
padding: 12px 5px 10px 5px;
}
.b-search-lines .b-l p {
font-size: 1rem;
text-align: center;
}
.b-search-lines .b-l p i {
color: var(--color-first);
}
.b-search-lines .b-c {
position: relative;
width: calc(100% - 5rem);
height: auto;
padding: 12px 5px 10px 5px;
}
.b-search-lines .b-c p {
font-size: 1rem;
color: var(--color-txtg3);
}
.b-search-lines .b-r {
position: relative;
width: 3rem;
height: auto;
padding: 12px 5px 10px 5px;
}
.b-search-lines .b-r p {
font-size: 1rem;
text-align: center;
}
.b-search-lines .b-r p i {
color: var(--color-first);
}
.b--sh2.open .b-search-lines {
min-height: 2.875rem;
}
.view-b-sh {
height: 0;
margin-top: 10px;
border-radius: 5px;
background-color: var(--color-light);
overflow: hidden;
transition: all 0.2s linear;
}
.view-b-sh .mg--t20 {
margin-top: 0;
}
.b-country-hot {
position: relative;
width: 100%;
height: auto;
margin-top: 10px;
display: inline-block;
}
.b-country-hot .box-list {
position: relative;
width: 100%;
height: auto;
}
.b-country-hot .box-list .list-cy {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
white-space: nowrap;
cursor: pointer;
}
.b-country-hot .box-list .list-cy.active {
cursor: grab;
}
.b-country-hot .box-list .list-cy .b-lcy {
position: relative;
width: 4rem;
height: auto;
display: inline-block;
margin-right: 10px;
user-select: none;
}
.b-country-hot .box-list .list-cy .b-lcy:last-child {
margin-right: 0;
}
.b-country-hot .box-list .list-cy .b-lcy a {
position: relative;
width: 100%;
height: 100%;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.b-country-hot .box-list .list-cy .b-lcy .b-img {
position: relative;
width: 100%;
height: 4rem;
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
padding: 5px;
display: flex;
align-items: center;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.b-country-hot .box-list .list-cy .b-lcy .b-img figure {
position: relative;
width: 100%;
height: auto;
}
.b-country-hot .box-list .list-cy .b-lcy .b-img figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.b-country-hot .box-list .list-cy .b-lcy .b-name {
position: relative;
width: 100%;
height: auto;
padding-top: 5px;
white-space: normal;
}
.b-country-hot .box-list .list-cy .b-lcy .b-name p {
font-size: 0.88rem;
text-align: center;
color: var(--color-light);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.bg-bt-size-mobile {
position: relative;
width: 100%;
height: 2.8rem;
display: block;
}
.bg-bt-size-mobile::after {
display: block;
content: "";
position: absolute;
border-left: 100vw solid var(--color-first);
border-bottom: 1.8rem solid transparent;
border-top: 10px solid var(--color-first);
top: -1px;
left: 0;
}
.b-btn-see-more {
position: absolute;
width: 100%;
height: auto;
bottom: 0;
display: flex;
}
.b-btn-see-more button {
position: relative;
padding: 8px 20px 6px 20px;
margin: 0 auto;
border-radius: 100px;
color: var(--color-light);
background-color: var(--color-first);
background: linear-gradient(90deg, rgba(var(--color-third-rgb), 1) 0%, rgba(var(--color-first-rgb), 1) 80%, rgba(var(--color-first-rgb), 1) 100%);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.2);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.2);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.2);
}
.b-btn-see-more button span {
font-size: 1rem;
color: var(--color-light);
}
.b-btn-see-more button span i {
color: var(--color-light);
}
.b-btn-see-more button .pd-r-ict {
padding-left: 2px;
}
}
/* ================= search row ================= */
.sc--search-ro-sprlr {
position: relative;
width: 100%;
height: auto;
}
.sc--search-ro-sprlr .box--bg-sh-ro {
position: relative;
width: 100%;
height: auto;
padding: 12px 10px;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--title {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--inp-sl-pd {
position: relative;
width: 100%;
height: auto;
margin-bottom: 10px;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--inp-sl-pd p {
font-size: 1rem;
font-weight: bold;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--inp-sl-pd .mg--bl-title {
margin-bottom: 3px;
margin-left: 2px;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--inp-sl-pd .lines--bg-box {
position: relative;
width: 100%;
height: auto;
display: flex;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--inp-sl-pd .lines--bg-box input {
width: 100%;
background-color: transparent;
font-size: 0.94rem;
height: 2rem;
font-weight: normal;
padding: 3px 10px;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--inp-sl-pd .lines--bg-box select {
width: 100%;
background-color: transparent;
font-size: 0.94rem;
height: 2rem;
font-weight: normal;
padding: 3px 10px;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--inp-sl-pd .lines--bg-box select option {
font-size: 0.94rem;
font-weight: normal;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--inp-sl-pd .lines--bg-box .bg--icon-cld {
position: relative;
width: auto;
height: auto;
background-color: var(--color-first);
align-items: center;
display: flex;
padding: 2px 5px;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--inp-sl-pd .lines--bg-box .bg--icon-cld i {
font-size: 1.07rem;
color: var(--color-light);
}
.lines--tb-sl {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey5);
border-bottom: 1px dashed var(--color-grey5);
padding-top: 8px;
padding-bottom: 3px;
margin-top: 15px;
margin-bottom: 10px;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--btn-sr {
position: relative;
width: 100%;
height: auto;
align-items: end;
display: flex;
padding: 20px 0 2px 0;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--btn-sr button {
position: relative;
width: 100%;
height: 2.125rem;
/* font-size: 1rem; */
border-radius: 5px;
background-color: var(--color-first);
overflow: hidden;
padding: 5px 10px 2px 10px;
cursor: pointer;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--btn-sr button .pd-r-ict {
padding-right: 5px;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--btn-sr button span {
color: var(--color-light);
font-size: 1.07rem;
font-weight: 400;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--btn-sr button span i {
color: var(--color-light);
font-size: 1rem;
}
/* ==== range slider ==== */
.sc--search-ro-sprlr .box--bg-sh-ro .box--range-sr {
position: relative;
width: 100%;
height: auto;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--range-sr input {
padding: 0;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--range-sr .box--nb-range-view {
position: relative;
width: 100%;
height: auto;
padding-top: 10px;
padding-bottom: 12px;
display: flex;
justify-content: center;
align-items: center;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--range-sr .box--nb-range-view input {
width: 100%;
height: auto;
font-size: 1.13rem;
font-weight: bold;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--range-sr .box--nb-range-view .nb--inp-min {
position: relative;
width: calc((100%/2) - 2.2rem);
height: auto;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--range-sr .box--nb-range-view .nb--inp-min input {
text-align: right;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--range-sr .box--nb-range-view .txt--separator {
position: relative;
width: 4.4rem;
height: auto;
padding: 2px 10px;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--range-sr .box--nb-range-view .txt--separator p {
font-size: 1rem;
font-weight: normal;
text-align: center;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--range-sr .box--nb-range-view .nb--inp-max {
position: relative;
width: calc((100%/2) - 2.2rem);
height: auto;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--range-sr .box--nb-range-slider {
width: 100%;
height: auto;
display: flex;
flex-direction: column;
padding-bottom: 10px;
margin-left: auto;
margin-right: auto;
position: relative;
}
.sc--search-ro-sprlr .box--bg-sh-ro .box--range-sr .box--nb-range-slider .control--range-sl {
position: relative;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--search-ro-sprlr {
width: auto;
/* margin: 16px; */
}
.sc--search-ro-sprlr .box--bg-sh-ro {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--inp-sl-pd {
width: calc((100%/2) - 10px);
margin: 0 5px 10px 5px;
}
.lines--tb-sl {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--search-ro-sprlr {
width: auto;
margin: 0;
}
.sc--search-ro-sprlr .box--bg-sh-ro {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--inp-sl-pd {
width: calc((100%/2) - 10px);
margin: 0 5px 10px 5px;
}
.lines--tb-sl {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--search-ro-sprlr {
width: auto;
margin: 0;
}
.sc--search-ro-sprlr .box--bg-sh-ro {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--search-ro-sprlr .box--bg-sh-ro .b--inp-sl-pd {
width: calc((100%/2) - 10px);
margin: 0 5px 10px 5px;
}
.lines--tb-sl {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--search-ro-sprlr .box--bg-sh-ro {
padding: 16px;
border-radius: 0;
}
}
/* ================= box separate left right ================= */
.sc--spr-lr {
position: relative;
width: 100%;
height: auto;
}
.sc--spr-lr .box--spr-lr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--spr-lr .box--spr-lr .box-spr-l {
position: relative;
width: 25%;
height: auto;
padding-right: 10px;
margin-bottom: 20px;
}
.sc--spr-lr .box--spr-lr .box-spr-r {
position: relative;
width: 75%;
height: auto;
padding-left: 10px;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--spr-lr.mg--t20 {
margin-top: 0;
}
.sc--spr-lr .container {
width: 100%;
}
.sc--spr-lr .container .box--spr-lr .box-spr-r {
width: 970px;
margin-left: auto;
margin-right: auto;
}
.sc--spr-lr .box--spr-lr .box-spr-l {
width: 100%;
padding-right: 0;
margin-bottom: 20px;
}
.sc--spr-lr .box--spr-lr .box-spr-r {
width: 100%;
padding: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--spr-lr .container {
padding: 0;
}
.sc--spr-lr.mg--t20 {
margin-top: 0;
}
.sc--spr-lr .box--spr-lr .box-spr-l {
width: 100%;
padding-right: 0;
margin-bottom: 0;
}
.sc--spr-lr .box--spr-lr .box-spr-r {
width: 100%;
padding: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--spr-lr .container {
padding: 0;
}
.sc--spr-lr.mg--t20 {
margin-top: 0;
}
.sc--spr-lr .box--spr-lr .box-spr-l {
width: 100%;
padding-right: 0;
margin-bottom: 0;
}
.sc--spr-lr .box--spr-lr .box-spr-r {
width: 100%;
padding: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--spr-lr .container {
padding: 0;
}
.sc--spr-lr.mg--t20 {
margin-top: 0;
}
.sc--spr-lr .box--spr-lr .box-spr-l {
width: 100%;
padding-right: 0;
margin-bottom: 0;
}
.sc--spr-lr .box--spr-lr .box-spr-r {
width: 100%;
padding-left: 0;
/* padding-top: 16px; */
}
}
/* ================= box separate left right 2 ================= */
.sc--spr-rl2 {
position: relative;
width: 100%;
height: auto;
}
.sc--spr-rl2 .box--spr-lr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--spr-rl2 .box--spr-lr .box-spr-l {
position: relative;
width: 75%;
height: auto;
padding-right: 10px;
}
.sc--spr-rl2 .box--spr-lr .box-spr-r {
position: relative;
width: 25%;
height: auto;
padding-left: 10px;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.sc--spr-rl2 .container {
padding-left: 0;
padding-right: 0;
}
.sc--spr-rl2 .box--spr-lr .box-spr-l {
width: 100%;
padding-right: 0;
}
.sc--spr-rl2 .box--spr-lr .box-spr-r {
width: 100%;
padding-left: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--spr-rl2 .container {
padding-left: 0;
padding-right: 0;
}
.sc--spr-rl2 .box--spr-lr .box-spr-l {
width: 100%;
padding-right: 0;
}
.sc--spr-rl2 .box--spr-lr .box-spr-r {
width: 100%;
padding-left: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--spr-rl2 .container {
padding: 0;
}
.sc--spr-rl2.mg--t20 {
margin-top: 0;
}
.sc--spr-rl2 .box--spr-lr .box-spr-l {
width: 100%;
padding-right: 0;
}
.sc--spr-rl2 .box--spr-lr .box-spr-r {
width: 100%;
padding-left: 0;
}
}
/* ================= review 3 - 4 not bg ================= */
.sc--review-nobg-f {
position: relative;
width: 100%;
height: auto;
}
.sc--review-nobg-f .box-bg-rv {
position: relative;
width: 100%;
height: auto;
padding: 1.3rem 0 1.3rem 0;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--review-nobg-f .b-dt-rv {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
}
.sc--review-nobg-f .b-dt-rv .b-rv {
position: relative;
height: auto;
overflow: hidden;
border-radius: 5px;
}
.sc--review-nobg-f .b-dt-rv .size--b3 {
width: calc((100%/3) - 6px);
margin: 0 9px 9px 0;
}
.sc--review-nobg-f .b-dt-rv .size--b4 {
width: calc((100%/4) - 6.75px);
margin: 0 9px 9px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img {
position: relative;
width: 100%;
height: auto;
padding: 2rem 10px 5px 10px;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img figure {
position: relative;
width: auto;
height: auto;
overflow: hidden;
border-radius: 100%;
margin: 0 auto;
border: 5px solid var(--color-light);
z-index: 1;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.1);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.1);
}
.sc--review-nobg-f .b-dt-rv .size--b3 .b-img figure {
width: 11rem;
height: 11rem;
}
.sc--review-nobg-f .b-dt-rv .size--b4 .b-img figure {
width: 9.5rem;
height: 9.5rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 100%;
border: 2px solid var(--color-grey6);
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img .bg-igm {
position: absolute;
width: 100%;
height: auto;
background-color: var(--color-light);
bottom: 0;
left: 0;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.sc--review-nobg-f .b-dt-rv .size--b3 .b-img .bg-igm {
height: 6rem;
}
.sc--review-nobg-f .b-dt-rv .size--b4 .b-img .bg-igm {
height: 5.5rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt {
position: relative;
width: 100%;
height: auto;
padding: 10px;
background-color: var(--color-light);
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .icons-qu {
position: relative;
width: 100%;
height: auto;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .icons-qu p {
font-weight: bold;
text-align: center;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .icons-qu i {
font-size: 2rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .shoet {
position: relative;
width: 100%;
height: 3.813rem;
padding: 5px 0 10px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .shoet p {
font-size: 0.94rem;
font-weight: normal;
text-align: center;
color: var(--color-txtg5);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .names {
position: relative;
width: 100%;
height: auto;
padding: 10px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .names p {
font-size: 1.13rem;
font-weight: bold;
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .name-pg {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 3px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .name-pg p {
font-size: 1rem;
font-weight: bold;
text-align: center;
color: var(--color-first);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
/* ============= */
@media (min-width: 1200px) {
.sc--review-nobg-f .b-dt-rv .size--b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--review-nobg-f .b-dt-rv .size--b4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--review-nobg-f .b-dt-rv .size--b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--review-nobg-f .b-dt-rv .size--b4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--review-nobg-f.mg--t20 {
margin-top: 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv {
display: flex;
justify-content: stretch;
align-items: center;
}
.sc--review-nobg-f .b-dt-rv .size--b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--review-nobg-f .b-dt-rv .size--b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img {
width: 8rem;
height: 100%;
padding: 5px;
display: flex;
align-items: center;
}
.sc--review-nobg-f .b-dt-rv .size--b3 .b-img figure {
width: 7rem;
height: 7rem;
}
.sc--review-nobg-f .b-dt-rv .size--b4 .b-img figure {
width: 7rem;
height: 7rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img .bg-igm {
width: 4rem;
bottom: 0;
left: auto;
right: -2px;
border-top-left-radius: 5px;
border-top-right-radius: 0;
border-bottom-left-radius: 5px;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img .bg--full {
width: 100%;
}
.sc--review-nobg-f .b-dt-rv .size--b3 .b-img .bg-igm {
height: 100%;
}
.sc--review-nobg-f .b-dt-rv .size--b4 .b-img .bg-igm {
height: 100%;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt {
width: calc(100% - 8rem);
height: 100%;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .icons-qu i {
font-size: 1.75rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .shoet {
height: auto;
padding: 2px 0 5px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .shoet p {
font-size: 0.88rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .names {
padding: 5px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .names p {
font-size: 1rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .name-pg {
padding: 5px 0 2px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .name-pg p {
font-size: 0.88rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--review-nobg-f.mg--t20 {
margin-top: 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv {
display: flex;
justify-content: stretch;
align-items: center;
}
.sc--review-nobg-f .b-dt-rv .size--b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--review-nobg-f .b-dt-rv .size--b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img {
width: 8rem;
height: 100%;
padding: 5px;
display: flex;
align-items: center;
}
.sc--review-nobg-f .b-dt-rv .size--b3 .b-img figure {
width: 7rem;
height: 7rem;
}
.sc--review-nobg-f .b-dt-rv .size--b4 .b-img figure {
width: 7rem;
height: 7rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img .bg-igm {
width: 4.5rem;
bottom: 0;
left: auto;
right: -2px;
border-top-left-radius: 5px;
border-top-right-radius: 0;
border-bottom-left-radius: 5px;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img .bg--full {
width: 100%;
}
.sc--review-nobg-f .b-dt-rv .size--b3 .b-img .bg-igm {
height: 100%;
}
.sc--review-nobg-f .b-dt-rv .size--b4 .b-img .bg-igm {
height: 100%;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt {
width: calc(100% - 8rem);
height: 100%;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .icons-qu i {
font-size: 1.75rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .shoet {
height: auto;
padding: 2px 0 5px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .shoet p {
font-size: 0.88rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .names {
padding: 5px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .names p {
font-size: 1rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .name-pg {
padding: 5px 0 2px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .name-pg p {
font-size: 0.88rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--review-nobg-f.mg--t20 {
margin-top: 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv {
display: flex;
justify-content: stretch;
align-items: center;
}
.sc--review-nobg-f .b-dt-rv .size--b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--review-nobg-f .b-dt-rv .size--b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img {
width: 8rem;
height: 100%;
padding: 5px;
display: flex;
align-items: center;
}
.sc--review-nobg-f .b-dt-rv .size--b3 .b-img figure {
width: 7rem;
height: 7rem;
}
.sc--review-nobg-f .b-dt-rv .size--b4 .b-img figure {
width: 7rem;
height: 7rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img .bg-igm {
width: 4.5rem;
bottom: 0;
left: auto;
right: -2px;
border-top-left-radius: 5px;
border-top-right-radius: 0;
border-bottom-left-radius: 5px;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-img .bg--full {
width: 100%;
}
.sc--review-nobg-f .b-dt-rv .size--b3 .b-img .bg-igm {
height: 100%;
}
.sc--review-nobg-f .b-dt-rv .size--b4 .b-img .bg-igm {
height: 100%;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt {
width: calc(100% - 8rem);
height: 100%;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .icons-qu i {
font-size: 1.75rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .shoet {
height: auto;
padding: 2px 0 5px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .shoet p {
font-size: 0.88rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .names {
padding: 5px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .names p {
font-size: 1rem;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .name-pg {
padding: 5px 0 2px 0;
}
.sc--review-nobg-f .b-dt-rv .b-rv .b-dt .name-pg p {
font-size: 0.88rem;
}
}
/* ================= program column size 3 - 4 - 5 ================= */
.sc--program-cl-f {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-f .box-pg-cl {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-f .box-pg-cl .b-title-pg {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 16px 16px;
}
.sc--program-cl-f .box-pg-cl .b-title-pg p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg {
position: relative;
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
cursor: pointer;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 {
width: calc((100%/3) - 6px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 {
width: calc((100%/4) - 6.75px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 {
width: calc((100%/5) - 7.2px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg a {
width: 100%;
height: 100%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-img {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 .b-img {
height: 23.874rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-img {
height: 17.735rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-img {
height: 14.05rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-img figure {
width: 100%;
height: 100%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-name {
position: relative;
width: 100%;
height: 4.575rem;
/* height: 4.25rem; */
padding: 20px 10px 10px 10px;
/* padding: 10px; */
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg:hover .b-dt-smb .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg {
width: 100%;
height: auto;
padding: 10px;
border-top: 1px dashed var(--color-grey3);
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p {
font-size: 0.88rem;
font-weight: normal;
text-align: center;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.82rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p span {
color: var(--color-txtg4);
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p .pd-ic-r {
padding-right: 3px;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p i {
color: var(--color-icon-yl);
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
padding: 10px;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l {
position: relative;
width: 40%;
/* width: 50%; */
height: auto;
display: flex;
justify-content: center;
align-items: center;
padding: 0 5px;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l figure {
position: relative;
width: auto;
height: auto;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 60%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 95%;
/* width: 75%; */
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 85%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r {
position: relative;
width: 60%;
/* width: 50%; */
height: auto;
padding: 0 5px;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
text-align: right;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.88rem;
font-weight: bold;
text-align: right;
color: var(--color-red);
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.88rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.63rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r .txt-start {
margin-bottom: -5px;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r .txt-currency {
margin-top: -8px;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 .icon-crc {
display: none;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 .txt-crc {
display: none;
}
.txt-price-full-box1 {
font-size: 0.75rem;
font-weight: normal;
text-decoration: line-through;
color: var(--color-txtg4);
padding-right: 5px;
}
/* hover image */
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5:nth-child(5n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 {
width: calc((100%/4) - 6.75px);
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 .b-img {
height: 19.709rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-img {
height: 14.61rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-img {
height: 14.61rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 {
width: calc((100%/3) - 6px);
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 {
width: calc((100%/3) - 6px);
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 {
width: calc((100%/3) - 6px);
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 .b-img {
height: 15.917rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-img {
height: 15.917rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-img {
height: 15.917rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 75%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 75%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 75%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r p {
font-size: 0.82rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 {
width: calc((100%/2) - 4.5px);
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 {
width: calc((100%/2) - 4.5px);
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 {
width: calc((100%/2) - 4.5px);
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 .b-img {
height: 21.844rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-img {
height: 21.844rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-img {
height: 21.844rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 60%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 60%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 60%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.88rem;
}
/* row */
/* .dp-none-txt-row-pg-f {
display: none;
} */
.sc--program-cl-f .box-pg-cl .row-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg {
display: flex;
justify-content: stretch;
max-height: initial;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b5 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg a {
display: flex;
justify-content: stretch;
max-height: initial;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-img {
width: 14rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b3 .b-img {
height: 14rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b4 .b-img {
height: 14rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b5 .b-img {
height: 14rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb {
width: calc(100% - 14rem);
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-name {
height: 4.625rem;
padding: 16px 14px 10px 14px;
}
/* .sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
} */
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-dtpg {
padding: 10px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p {
/* font-size: 0.75rem; */
padding: 0 10px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
text-align: left;
width: 50%;
}
/* .sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.75rem;
} */
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price {
padding: 5px 10px;
align-items: end;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l {
width: 50%;
padding: 5px 0 10px 9px;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 100%;
height: 3.5rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 100%;
height: 3.5rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 100%;
height: 3.5rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l figure .size-img {
width: auto;
height: 100%;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r {
/* width: 50%; */
width: fit-content;
padding: 10px 16px 10px 10px;
margin-left: auto;
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r p {
font-size: 0.88rem;
text-align: left;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b3 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
margin-bottom: -5px;
text-align: left;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b4 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
margin-bottom: -5px;
text-align: left;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b5 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
margin-bottom: -5px;
text-align: left;
}
/* .sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r .txt-start {
display: none;
} */
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r .txt-currency {
display: none;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 span {
font-weight: normal;
color: var(--color-txtg4);
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 .icon-crc {
padding-left: 5px;
font-size: 0.88rem;
display: inline-block;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 .txt-crc {
padding-left: 5px;
font-size: 0.88rem;
display: inline-block;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 .b-img {
height: auto;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-img {
height: auto;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-img {
height: auto;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-name {
height: auto;
padding: 16px 12px 10px 12px;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg {
padding: 10px 12px;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p {
font-size: 0.88rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.88rem;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price {
padding: 0;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l {
padding: 8px 6px;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 55%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 55%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 55%;
}
.sc--program-cl-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r {
padding: 8px 12px 8px 6px;
}
/* half */
.sc--program-cl-f .box-pg-cl .half-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b3 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b4 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b5 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b5:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b3 .b-img {
height: 11.969rem;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b4 .b-img {
height: 11.969rem;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b5 .b-img {
height: 11.969rem;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-name {
height: 4.125rem;
padding: 10px 6px;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-name p {
font-size: 0.94rem;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-dtpg {
padding: 10px 6px;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p {
font-size: 0.82rem;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.82rem;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price {
padding: 0;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l {
width: 45%;
padding: 8px 6px 8px 6px;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 85%;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 85%;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 85%;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r {
width: 55%;
padding: 8px 10px 8px 6px;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r p {
font-size: 0.75rem;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b3 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b4 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
}
.sc--program-cl-f .box-pg-cl .half-b-dt-pg .size-b5 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
}
/* row */
.dp-none-txt-row-pg-f {
display: none;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg {
display: flex;
justify-content: stretch;
max-height: 8.563rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b5 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg a {
display: flex;
justify-content: stretch;
max-height: 8.438rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-img {
width: 8.438rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b3 .b-img {
height: 8.438rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b4 .b-img {
height: 8.438rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b5 .b-img {
height: 8.438rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb {
width: calc(100% - 8.438rem);
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-name {
height: 3.5rem;
padding: 5px 10px;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-dtpg {
padding: 5px 10px;
display: flex;
justify-content: stretch;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p {
font-size: 0.75rem;
padding: 0 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.75rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price {
padding: 5px 10px;
align-items: end;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l {
width: 35%;
padding: 0 5px;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 80%;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 80%;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 80%;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r {
width: 65%;
padding: 0 5px;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r p {
font-size: 0.82rem;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b3 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
margin-bottom: -5px;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b4 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
margin-bottom: -5px;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .size-b5 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
margin-bottom: -5px;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r .txt-start {
display: none;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r .txt-currency {
display: none;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 span {
font-weight: normal;
color: var(--color-txtg4);
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 .icon-crc {
padding-left: 2px;
font-size: 0.82rem;
display: inline-block;
}
.sc--program-cl-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 .txt-crc {
padding-left: 2px;
font-size: 0.82rem;
display: inline-block;
}
}
/* ================= promote website ================= */
.sc--promote-ws-f {
position: relative;
width: 100%;
height: auto;
}
.box-bg-pm-ws {
position: relative;
width: 100%;
height: auto;
padding: 32px 0 14px 0;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.bg-img-pmws {
background-image: url(/assets/img/imgpromotebg.png);
background-color: var(--color-light);
background-repeat: no-repeat;
background-size: 100% auto;
background-position: bottom;
}
.sc--promote-ws-f .box-pm-ws {
position: relative;
width: 100%;
height: auto;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-img-l {
position: relative;
width: 50%;
height: auto;
padding: 10px;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-img-l figure {
width: 80%;
height: auto;
margin: 0 auto;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-img-l figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r {
position: relative;
width: 50%;
height: auto;
padding: 10px;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r .b-title {
position: relative;
width: 100%;
height: auto;
padding: 2px 0 10px 0;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r .b-title h1 {
font-size: 1.88rem;
font-weight: bold;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r .b-shoet {
position: relative;
width: 100%;
height: auto;
padding: 2px 0 10px 0;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r .b-shoet p {
font-size: 1rem;
font-weight: normal;
color: var(--color-txtg5);
text-indent: 20px;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r .b-list-txt {
position: relative;
width: 100%;
height: auto;
padding: 2px 0 10px 20px;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r .b-list-txt p {
font-size: 1rem;
font-weight: normal;
color: var(--color-txtg5);
padding-bottom: 2px;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r .b-list-txt p span {
color: var(--color-txtg5);
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r .b-list-txt p span i {
color: var(--color-first);
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r .b-list-txt p .ct-icon {
padding-right: 5px;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.sc--promote-ws-f.mg--t20 {
margin-top: 0;
}
.bg-img-pmws {
background-size: 300% auto;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-img-l {
width: 100%;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-img-l figure {
width: 70%;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r {
width: 100%;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r .b-title h1 {
font-size: 1.63rem;
text-align: center;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r .b-shoet p {
font-size: 0.94rem;
}
.sc--promote-ws-f .box-pm-ws .b-pmws-lr .b-txt-r .b-list-txt p {
font-size: 0.94rem;
}
}
/* ================= download app ================= */
.sc--download-app-f {
position: relative;
width: 100%;
height: auto;
}
.box-bg-dlapp {
position: relative;
width: 100%;
height: auto;
/* padding: 32px 0 14px 0; */
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.bg-img-bg-map {
background-image: url(/assets/img/imgmap.jpg);
background-color: var(--color-light);
background-repeat: no-repeat;
/* background-size: 100% auto; */
/* background-size: auto 100%; */
background-size: cover;
background-position: bottom;
}
.box-spr-dlapp {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box-spr-dlapp .b-dt-txt-l {
position: relative;
width: 65%;
height: auto;
padding: 50px 16px 14px 0;
}
.box-spr-dlapp .b-dt-txt-l .txt-title {
position: relative;
width: 100%;
height: auto;
padding-bottom: 12px;
}
.box-spr-dlapp .b-dt-txt-l .txt-title p {
font-size: 1.38rem;
font-weight: bold;
color: var(--color-light);
/* font-family: 'Sriracha', cursive; */
}
.box-spr-dlapp .b-dt-txt-l .star-rating {
position: relative;
width: 100%;
height: auto;
padding-bottom: 12px;
}
.box-spr-dlapp .b-dt-txt-l .star-rating i {
font-size: 1.13rem;
color: var(--color-bg-yl);
}
.box-spr-dlapp .b-dt-txt-l .list-txt-dt {
position: relative;
width: 100%;
height: auto;
padding: 0 0 16px 25px;
}
.box-spr-dlapp .b-dt-txt-l .list-txt-dt p {
font-size: 0.94rem;
color: var(--color-txtg1);
padding-bottom: 2px;
/* font-family: 'Sriracha', cursive; */
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp {
position: relative;
width: auto;
height: auto;
padding: 0 20px 10px 0;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
cursor: pointer;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app a {
position: relative;
width: 100%;
height: 100%;
display: flex;
justify-content: stretch;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .color-btn-apple-store {
border: 1px solid var(--color-first);
border-radius: 2px;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .color-btn-google-play {
border: 1px solid var(--color-bg-yl);
border-radius: 2px;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .icon-store {
position: relative;
width: 60px;
height: 60px;
padding: 5px;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .icon-store i {
font-size: 2rem;
color: var(--color-light);
/* color: var(--color-black3); */
position: relative;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .color-icon-apple-store {
background-color: var(--color-first);
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .color-icon-apple-store::after {
display: block;
content: "";
position: absolute;
left: 60px;
border-bottom: 60px solid var(--color-first);
border-right: 12px solid transparent;
top: 0;
bottom: 0;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .color-icon-google-play {
background-color: var(--color-bg-yl);
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .color-icon-google-play::after {
display: block;
content: "";
position: absolute;
left: 60px;
border-bottom: 60px solid var(--color-bg-yl);
border-right: 12px solid transparent;
top: 0;
bottom: 0;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .txt-dt {
position: relative;
width: auto;
height: auto;
padding: 5px 20px 5px 30px;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .txt-dt p {
font-size: 0.94rem;
text-transform: uppercase;
color: var(--color-light);
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .txt-dt .txt-color-apple-store {
color: var(--color-txtg3);
font-size: 0.88rem;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .txt-dt .txt-color-google-play {
color: var(--color-txtg3);
font-size: 0.88rem;
}
.box-spr-dlapp .b-img-app-r {
position: relative;
width: 35%;
height: auto;
padding: 50px 0 0 0;
display: flex;
overflow: hidden;
}
.box-spr-dlapp .b-img-app-r figure {
position: relative;
width: auto;
height: auto;
margin-top: auto;
}
.box-spr-dlapp .b-img-app-r figure .size-img {
position: relative;
width: auto;
height: 18rem;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.box-spr-dlapp .b-img-app-r figure .size-img {
height: 15rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.box-spr-dlapp .b-dt-txt-l {
width: 100%;
padding: 50px 16px 14px 16px;
}
.box-spr-dlapp .b-dt-txt-l .txt-title p {
font-size: 1.32rem;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .color-icon-apple-store::after {
left: 59px;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .color-icon-google-play::after {
left: 59px;
}
.box-spr-dlapp .b-img-app-r {
display: none;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box-spr-dlapp .b-dt-txt-l {
width: 100%;
padding: 50px 16px 14px 16px;
}
.box-spr-dlapp .b-dt-txt-l .txt-title p {
font-size: 1.25rem;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .color-icon-apple-store::after {
left: 59px;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .color-icon-google-play::after {
left: 59px;
}
.box-spr-dlapp .b-img-app-r {
display: none;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.box-spr-dlapp .b-dt-txt-l {
width: 100%;
padding: 50px 0 16px 0;
}
.box-spr-dlapp .b-dt-txt-l .txt-title p {
font-size: 1.13rem;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp {
justify-content: center;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp {
padding: 0 20px 10px 20px;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .color-icon-apple-store::after {
left: 59px;
}
.box-spr-dlapp .b-dt-txt-l .box-btn-dlapp .spr-box-dlapp .btn-download-app .color-icon-google-play::after {
left: 59px;
}
.box-spr-dlapp .b-img-app-r {
display: none;
}
}
/* ================= program image size 3 - 4 bg2 ================= */
.sc--program-img-bg2-f {
position: relative;
width: 100%;
height: auto;
}
.sc--program-img-bg2-f .bg-box1 {
background-color: var(--color-first);
}
.b-lines--gd {
position: relative;
width: 100%;
height: auto;
padding: 4px;
border-radius: 5px;
background: linear-gradient(299deg, #f9f295, #e0aa3e 12%, #faf398 36%, #b88a44 66%, #f9f295);
}
.sc--program-img-bg2-f .box--bg-pgf {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
padding: 12px 12px 10px 12px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-img-bg2-f .bg--glitter-box {
background-color: var(--color-dark);
background-image: url(/img/imgGlitterBg.png);
background-size: 100% auto;
background-repeat: no-repeat;
background-position: top;
}
.sc--program-img-bg2-f .box--bg-pgf .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 5px 0 10px 0;
}
.sc--program-img-bg2-f .box--bg-pgf .title-pg p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-light);
}
.sc--program-img-bg2-f .box--bg-pgf .title-pg figure {
width: 100%;
height: 2.5rem;
display: flex;
padding-bottom: 5px;
}
.sc--program-img-bg2-f .box--bg-pgf .title-pg figure .size-imgtitle {
position: relative;
width: auto;
height: 100%;
margin-left: auto;
margin-right: auto;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .b-pg {
position: relative;
height: auto;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .b-pg:hover {
border: 1px solid var(--color-light);
transition: all 0.3s ease;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b3 {
width: calc((100%/3) - 6px);
height: 23.499rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b4 {
width: calc((100%/4) - 6.75px);
height: 17.36rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .b-pg a {
width: 100%;
height: 100%;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .b-pg figure {
width: 100%;
height: 100%;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .b-pg figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
/* hover image */
.sc--program-img-bg2-f .box--bg-pgf .list-pg .b-pg figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .b-pg:hover figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
.pg-img-smb2-f {
display: none;
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-img-bg2-f .box--bg-pgf .title-pg figure {
height: 2.2rem;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b3 {
width: calc((100%/3) - 6px);
height: 19.167rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b4 {
width: calc((100%/4) - 6.75px);
height: 14.235rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.pg-img-smb2-f {
display: block;
}
.pg-img-smb2-f .container {
padding: 0;
margin-bottom: 20px;
}
.pgimg-dp-none-f {
display: none;
}
.sc--program-img-bg2-f .box--bg-pgf .title-pg figure {
height: 2.2rem;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b3 {
width: calc((100%/3) - 6px);
height: 15.374rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b4 {
width: calc((100%/2) - 4.5px);
height: 23.344rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.pg-img-smb2-f {
display: block;
}
.pg-img-smb2-f .container {
padding: 0;
margin-bottom: 20px;
}
.pgimg-dp-none-f {
display: none;
}
.sc--program-img-bg2-f .box--bg-pgf .title-pg figure {
height: 2rem;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b3 {
width: calc((100%/3) - 6px);
height: 14.292rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b4 {
width: calc((100%/2) - 4.5px);
height: 21.719rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.pg-img-smb2-f {
display: block;
}
.pg-img-smb2-f .container {
padding: 0;
}
.pgimg-dp-none-f {
display: none;
}
.sc--program-img-bg2-f .container {
padding: 0;
}
.b-lines--gd {
border-radius: 0;
}
.sc--program-img-bg2-f .box--bg-pgf .title-pg figure {
height: 1.8rem;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b3 {
width: 100%;
height: auto;
margin: 0px 0 9px 0px;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b4 {
width: calc((100%/2) - 4.5px);
height: 12.094rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg2-f .box--bg-pgf .list-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
}
/* ================= article and card size 3 - 4 ================= */
.sc--article-card-f {
position: relative;
width: 100%;
height: auto;
}
.sc--article-card-f .box-atcf {
position: relative;
width: 100%;
height: auto;
}
.sc--article-card-f .box-atcf .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 10px 16px;
}
.sc--article-card-f .box-atcf .title-pg p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--article-card-f .box-atcf .list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-card-f .box-atcf .list-pg .b-pg {
position: relative;
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
cursor: pointer;
}
.sc--article-card-f .box-atcf .list-pg .b-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--article-card-f .box-atcf .list-pg .size-b3 {
width: calc((100%/3) - 6px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--article-card-f .box-atcf .list-pg .size-b4 {
width: calc((100%/4) - 6.75px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--article-card-f .box-atcf .list-pg .b-pg a {
width: 100%;
height: 100%;
display: flex;
flex-flow: column nowrap;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-img {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
.sc--article-card-f .box-atcf .list-pg .size-b3 .b-img {
position: relative;
width: 100%;
height: 15.81rem;
overflow: hidden;
}
.sc--article-card-f .box-atcf .list-pg .size-b4 .b-img {
position: relative;
width: 100%;
height: 11.742rem;
overflow: hidden;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-img figure {
width: 100%;
height: 100%;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta {
position: relative;
width: 100%;
height: auto;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-name {
position: relative;
width: 100%;
height: auto;
padding: 20px 10px 10px 10px;
/* padding: 10px; */
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--article-card-f .box-atcf .list-pg .b-pg:hover .b-dta .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail {
position: relative;
width: 100%;
height: auto;
margin-top: auto;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .dt {
position: relative;
width: 100%;
height: auto;
padding: 10px;
border-top: 1px dashed var(--color-grey3);
border-bottom: 1px dashed var(--color-grey3);
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .dt p {
font-size: 0.88rem;
font-weight: normal;
text-align: center;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .dt p span {
color: var(--color-txtg4);
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .dt p i {
color: var(--color-icon-yl);
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .dt p .pd-ic-r {
padding-right: 3px;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .dt p .sprt-txt {
padding: 0 5px;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price {
position: relative;
width: 100%;
height: auto;
padding: 10px;
display: flex;
justify-content: stretch;
align-items: center;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l {
position: relative;
width: 50%;
height: auto;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 1rem;
font-weight: normal;
color: var(--color-green);
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l figure {
position: relative;
width: 100%;
height: auto;
display: flex;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l figure .size--imgal {
position: relative;
width: 60%;
height: auto;
margin: 0 auto;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l .txt-center-bk {
text-align: center;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r {
position: relative;
width: 50%;
height: auto;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.88rem;
font-weight: bold;
color: var(--color-red);
text-align: right;
margin-bottom: -5px;
}
.sc--article-card-f .box-atcf .list-pg .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
font-weight: bold;
color: var(--color-red);
text-align: right;
margin-bottom: -5px;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 span {
color: var(--color-red);
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
font-size: 0.88rem;
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
}
/* hover image */
.sc--article-card-f .box-atcf .list-pg .b-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--article-card-f .box-atcf .list-pg .b-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--article-card-f .box-atcf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--article-card-f .box-atcf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-name {
height: 4.875rem;
/* height: 4.25rem; */
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--article-card-f .box-atcf .list-pg .size-b3 .b-img {
height: 13.049rem;
}
.sc--article-card-f .box-atcf .list-pg .size-b4 .b-img {
height: 9.672rem;
}
.sc--article-card-f .box-atcf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--article-card-f .box-atcf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--article-card-f .box-atcf .list-pg .size-b4 {
width: calc((100%/3) - 6px);
}
.sc--article-card-f .box-atcf .list-pg .size-b3 .b-img {
height: 10.537rem;
}
.sc--article-card-f .box-atcf .list-pg .size-b4 .b-img {
height: 10.537rem;
}
.sc--article-card-f .box-atcf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--article-card-f .box-atcf .list-pg .size-b4:nth-child(3n+0) {
margin-right: 0;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price {
align-items: end;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.94rem;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.38rem;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
padding-left: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--article-card-f .box-atcf .list-pg .size-b3 {
width: calc((100%/2) - 4.5px);
}
.sc--article-card-f .box-atcf .list-pg .size-b4 {
width: calc((100%/2) - 4.5px);
}
.sc--article-card-f .box-atcf .list-pg .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-card-f .box-atcf .list-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-card-f .box-atcf .list-pg .size-b3 .b-img {
height: 14.959rem;
}
.sc--article-card-f .box-atcf .list-pg .size-b4 .b-img {
height: 14.959rem;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
/* row */
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg {
width: 100%;
max-height: initial;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-right: 0;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg a {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-img {
width: 14rem;
height: 9.269rem;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta {
width: calc(100% - 14rem);
height: auto;
display: grid;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-name {
width: 100%;
height: auto;
padding: 10px 10px 8px 10px;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .dt {
padding: 7px 10px;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price {
padding: 7px 10px;
align-items: end;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 45%;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 55%;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
padding-left: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--article-card-f.mg--t20 {
margin-top: 0;
}
.sc--article-card-f .box-atcf {
padding: 16px 0;
}
.sc--article-card-f .box-atcf .list-pg .size-b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--article-card-f .box-atcf .list-pg .size-b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--article-card-f .box-atcf .list-pg .size-b3 .b-img {
height: auto;
}
.sc--article-card-f .box-atcf .list-pg .size-b4 .b-img {
height: auto;
}
.sc--article-card-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
/* half */
.sc--article-card-f .box-atcf .half-catc-smb .size-b3 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--article-card-f .box-atcf .half-catc-smb .size-b4 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--article-card-f .box-atcf .half-catc-smb .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-card-f .box-atcf .half-catc-smb .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-card-f .box-atcf .half-catc-smb .size-b3 .b-img {
height: 7.924rem;
}
.sc--article-card-f .box-atcf .half-catc-smb .size-b4 .b-img {
height: 7.924rem;
}
.sc--article-card-f .box-atcf .half-catc-smb .b-pg .b-name {
height: 3.688rem;
padding: 8px 10px 5px 10px;
}
.sc--article-card-f .box-atcf .half-catc-smb .b-pg .b-name p {
font-size: 0.94rem;
}
.sc--article-card-f .box-atcf .half-catc-smb .b-pg .b-dta .b-name {
height: 3.688rem;
padding: 8px 10px 5px 10px;
}
.sc--article-card-f .box-atcf .half-catc-smb .b-pg .b-dta .b-name p {
font-size: 0.94rem;
}
.sc--article-card-f .box-atcf .half-catc-smb .b-pg .b-dta .b-detail .dt p {
font-size: 0.75rem;
}
.sc--article-card-f .box-atcf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 45%;
}
.sc--article-card-f .box-atcf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.75rem;
}
.sc--article-card-f .box-atcf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 55%;
}
.sc--article-card-f .box-atcf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.25rem;
text-align: left;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-card-f .box-atcf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
font-size: 0.75rem;
margin-top: -10px;
}
/* row */
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg {
width: 100%;
max-height: 6.745rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg a {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-img {
width: 10rem;
height: 6.62rem;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta {
width: calc(100% - 10rem);
height: auto;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-name {
width: 100%;
height: auto;
padding: 8px 10px 5px 10px;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-name p {
font-size: 0.94rem;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-name .fw-n {
font-weight: normal;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .dt {
/* display: none; */
padding: 5px 10px;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .dt p {
font-size: 0.75rem;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price {
padding: 5px 10px;
align-items: end;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 45%;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.75rem;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 55%;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.25rem;
}
.sc--article-card-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
font-size: 0.75rem;
padding-left: 0;
}
}
/* ================= our service ================= */
.sc--our-service-f {
position: relative;
width: 100%;
height: auto;
}
.sc--our-service-f .box-osv {
position: relative;
width: 100%;
height: auto;
}
.sc--our-service-f .box-osv .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 10px 16px;
}
.sc--our-service-f .box-osv .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--our-service-f .box-osv .b-img-meun-osv {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv {
position: relative;
width: calc((100%/3) - 6px);
height: 7.54rem;
margin: 0 9px 9px 0;
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
cursor: pointer;
}
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv a {
width: 100%;
height: 100%;
}
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv figure {
width: 100%;
height: 100%;
}
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv .b-name-menu {
position: absolute;
width: 100%;
height: 100%;
top: 0;
padding: 8px;
background-color: rgba(var(--color-dark-rgb), 0.45);
display: grid;
align-items: center;
}
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv .b-name-menu p {
font-size: 1.25rem;
color: var(--color-light);
text-align: center;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv:hover .b-name-menu {
background-color: rgba(var(--color-dark-rgb), 0.7);
transition: all 0.3s ease;
}
/* hover image */
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv:hover figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv:nth-child(3n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv:nth-child(3n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv {
height: 5.068rem;
}
.sc--our-service-f .box-osv .b-img-meun-osv .mg-rosv:nth-child(3n+0) {
margin-right: 0;
}
/* half */
.sc--our-service-f .box-osv .half-b-img-meun-osv {
position: relative;
width: 100%;
height: auto;
}
.sc--our-service-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv {
width: calc((100%/2) - 4.5px);
height: 7.647rem;
margin: 0 9px 9px 0;
}
.sc--our-service-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv:nth-child(2n+0) {
margin-right: 0;
}
/* .sc--our-service-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv:nth-child(3n+0) {
margin-right: 9px;
} */
.sc--our-service-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv .b-name-menu p {
font-size: 1rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv {
width: calc((100%/2) - 4.5px);
height: 7.142rem;
}
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv:nth-child(2n+0) {
margin-right: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--our-service-f .box-osv {
padding-bottom: 10px;
}
.sc--our-service-f .box-osv .b-img-meun-osv .b-btn-menu-osv {
width: 100%;
height: auto;
margin: 0 0 9px 0;
}
/* half */
.sc--our-service-f .box-osv .half-b-img-meun-osv {
position: relative;
width: 100%;
height: auto;
}
.sc--our-service-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv {
width: calc((100%/2) - 4.5px);
height: 3.842rem;
margin: 0 9px 9px 0;
}
.sc--our-service-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv:nth-child(2n+0) {
margin-right: 0;
}
.sc--our-service-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv .b-name-menu p {
font-size: 1rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
}
}
/* ================= car rental size 3 - 4 bg ================= */
.sc--car-rental-bg-f {
position: relative;
width: 100%;
height: auto;
}
.sc--car-rental-bg-f .box-crtf {
position: relative;
width: 100%;
height: auto;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
border-radius: 5px;
overflow: hidden;
padding: 12px 12px 3px 12px;
}
.sc--car-rental-bg-f .box-crtf .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 10px 16px;
}
.sc--car-rental-bg-f .box-crtf .title-pg p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--car-rental-bg-f .box-crtf .list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg {
position: relative;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b3 {
width: calc((100%/3) - 6px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4 {
width: calc((100%/4) - 6.75px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg a {
width: 100%;
height: 100%;
display: flex;
flex-flow: column nowrap;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-img {
position: relative;
width: 100%;
height: 15.475rem;
overflow: hidden;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4 .b-img {
position: relative;
width: 100%;
height: 11.493rem;
overflow: hidden;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-img figure {
width: 100%;
height: 100%;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta {
position: relative;
width: 100%;
height: auto;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-name {
position: relative;
width: 100%;
height: auto;
padding: 10px;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg:hover .b-dta .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail {
position: relative;
width: 100%;
height: auto;
margin-top: auto;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .dt {
position: relative;
width: 100%;
height: auto;
padding: 10px;
border-top: 1px dashed var(--color-grey3);
border-bottom: 1px dashed var(--color-grey3);
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .dt p {
font-size: 0.88rem;
font-weight: normal;
text-align: center;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .dt p span {
color: var(--color-txtg4);
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .dt p i {
color: var(--color-icon-yl);
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .dt p .pd-ic-r {
padding-right: 3px;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .dt p .sprt-txt {
padding: 0 5px;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price {
position: relative;
width: 100%;
height: auto;
padding: 10px;
display: flex;
justify-content: stretch;
align-items: center;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l {
position: relative;
width: 50%;
height: auto;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.88rem;
/* font-size: 1rem; */
font-weight: normal;
color: var(--color-green);
text-align: center;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r {
position: relative;
width: 50%;
height: auto;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.88rem;
font-weight: bold;
color: var(--color-red);
text-align: right;
margin-bottom: -5px;
display: grid;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
font-weight: bold;
color: var(--color-red);
text-align: right;
margin-bottom: -5px;
display: grid;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 span {
color: var(--color-red);
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
font-size: 0.72rem;
/* font-size: 0.88rem; */
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
margin-top: -8px;
margin-right: 5px;
}
/* hover image */
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--car-rental-bg-f .box-crtf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
/* .sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
display: grid;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
margin-top: -10px;
margin-right: 5px;
} */
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--car-rental-bg-f .box-crtf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-img {
height: 12.717rem;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4 .b-img {
height: 9.424rem;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.75rem;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4 {
width: calc((100%/3) - 6px);
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4:nth-child(3n+0) {
margin-right: 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-img {
height: 10.207rem;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4 .b-img {
height: 10.207rem;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price {
align-items: end;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 47%;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 53%;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.94rem;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.38rem;
margin-bottom: 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
padding-left: 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
margin-bottom: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--car-rental-bg-f .box-crtf {
padding: 12px 12px 10px 12px;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b3 {
width: calc((100%/2) - 4.5px);
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4 {
width: calc((100%/2) - 4.5px);
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-img {
height: auto;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b3 .b-img {
height: 14.462rem;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4 .b-img {
height: 14.462rem;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
/* row */
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg {
width: 100%;
max-height: initial;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg a {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-img {
width: 14rem;
height: 9.269rem;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .size-b4 .b-img {
width: 14rem;
height: 9.269rem;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta {
width: calc(100% - 14rem);
height: auto;
display: grid;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-name {
width: 100%;
height: auto;
padding: 10px 10px 8px 10px;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .dt {
padding: 7px 10px;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price {
padding: 7px 10px;
align-items: end;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 45%;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 55%;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
padding-left: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--article-card-bg-f.mg--t20 {
margin-top: 0;
}
.sc--car-rental-bg-f .container {
padding: 0;
}
.sc--car-rental-bg-f .box-crtf {
border-radius: 0;
padding: 12px 16px 12px 16px;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b3 {
width: 100%;
height: auto;
margin: 0 0 9px 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4 {
width: 100%;
height: auto;
margin: 0 0 9px 0;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-img {
height: auto;
}
.sc--car-rental-bg-f .box-crtf .list-pg .size-b4 .b-img {
height: auto;
}
.sc--car-rental-bg-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
/* half */
.sc--car-rental-bg-f .box-crtf .half-catc-smb .size-b3 {
width: calc((100%/2) - 4.5px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .size-b4 {
width: calc((100%/2) - 4.5px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .b-pg .b-img {
height: 7.924rem;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .size-b4 .b-img {
height: 7.924rem;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .b-pg .b-dta .b-name {
height: 3.688rem;
padding: 8px 10px 5px 10px;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .b-pg .b-dta .b-name p {
font-size: 0.94rem;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .b-pg .b-dta .b-detail .dt p {
font-size: 0.75rem;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 45%;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.75rem;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 55%;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.25rem;
text-align: left;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.25rem;
text-align: left;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--car-rental-bg-f .box-crtf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
font-size: 0.75rem;
margin-top: -10px;
}
/* row */
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg {
width: 100%;
max-height: 7.375rem;
/* max-height: 6.745rem; */
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg a {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-img {
width: 10rem;
height: 7.25rem;
/* height: 6.62rem; */
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .size-b4 .b-img {
width: 10rem;
height: 7.25rem;
/* height: 6.62rem; */
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta {
width: calc(100% - 10rem);
height: auto;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-name {
width: 100%;
height: auto;
padding: 8px 10px 5px 10px;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-name p {
font-size: 0.94rem;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-name .fw-n {
font-weight: normal;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .dt {
padding: 5px 10px;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .dt p {
font-size: 0.75rem;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price {
padding: 5px 10px 10px 10px;
align-items: end;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 45%;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.75rem;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 55%;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.25rem;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.25rem;
}
.sc--car-rental-bg-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
font-size: 0.75rem;
padding-left: 0;
}
}
/* ================= our service ================= */
.sc--our-service-bg-f {
position: relative;
width: 100%;
height: auto;
}
.sc--our-service-bg-f .box-osv {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
padding: 12px 12px 3px 12px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--our-service-bg-f .box-osv .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 10px 16px;
}
.sc--our-service-bg-f .box-osv .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv {
position: relative;
width: calc((100%/3) - 6px);
height: 7.384rem;
margin: 0 9px 9px 0;
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv a {
width: 100%;
height: 100%;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv figure {
width: 100%;
height: 100%;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv .b-name-menu {
position: absolute;
width: 100%;
height: 100%;
top: 0;
padding: 8px;
background-color: rgba(var(--color-dark-rgb), 0.45);
display: grid;
align-items: center;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv .b-name-menu p {
font-size: 1.25rem;
color: var(--color-light);
text-align: center;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv:hover .b-name-menu {
background-color: rgba(var(--color-dark-rgb), 0.7);
transition: all 0.3s ease;
}
/* hover image */
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv:hover figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv:nth-child(3n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv:nth-child(3n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv {
height: 4.912rem;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .mg-rosv:nth-child(3n+0) {
margin-right: 0;
}
/* half */
.sc--our-service-bg-f .box-osv .half-b-img-meun-osv {
position: relative;
width: 100%;
height: auto;
}
.sc--our-service-bg-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv {
width: calc((100%/2) - 4.5px);
height: 7.414rem;
margin: 0 9px 9px 0;
}
.sc--our-service-bg-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv:nth-child(2n+0) {
margin-right: 0;
}
.sc--our-service-bg-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv .b-name-menu p {
font-size: 1rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--our-service-bg-f .box-osv {
padding: 12px 12px 10px 12px;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv {
width: calc((100%/2) - 4.5px);
height: auto;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv:nth-child(2n+0) {
margin-right: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--our-service-bg-f.mg--t20 {
margin-top: 0;
}
.sc--our-service-bg-f .container {
padding: 0;
}
.sc--our-service-bg-f .box-osv {
border-radius: 0;
padding: 12px 16px 10px 16px;
}
.sc--our-service-bg-f .box-osv .b-img-meun-osv .b-btn-menu-osv {
width: 100%;
height: auto;
margin: 0 9px 9px 0;
}
/* half */
.sc--our-service-bg-f .box-osv .half-b-img-meun-osv {
position: relative;
width: 100%;
height: auto;
}
.sc--our-service-bg-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv {
width: calc((100%/2) - 4.5px);
height: 3.842rem;
margin: 0 9px 9px 0;
}
.sc--our-service-bg-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv:nth-child(2n+0) {
margin-right: 0;
}
.sc--our-service-bg-f .box-osv .half-b-img-meun-osv .b-btn-menu-osv .b-name-menu p {
font-size: 1rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
}
}
/* ================= top countries 5 - 6 ================= */
.sc--top-countries-f {
position: relative;
width: 100%;
height: auto;
}
.sc--top-countries-f .box-tct {
position: relative;
width: 100%;
height: auto;
}
.sc--top-countries-f .box-tct .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 10px 16px;
}
.sc--top-countries-f .box-tct .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-green);
}
.sc--top-countries-f .box-tct .b-title .icon-ct {
margin-bottom: -5px;
}
.sc--top-countries-f .box-tct .b-title p i {
font-size: 1.75rem;
color: var(--color-green);
margin-bottom: -5px;
}
.sc--top-countries-f .box-tct .b-dt-tct {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
}
.sc--top-countries-f .box-tct .b-dt-tct .b-ct-n {
position: relative;
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
cursor: pointer;
}
.sc--top-countries-f .box-tct .b-dt-tct .b-ct-n:hover {
border: 1px solid var(--color-green);
transition: all 0.3s ease;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b5 {
width: calc((100%/5) - 7.2px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6 {
width: calc((100%/6) - 7.5px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--top-countries-f .box-tct .b-dt-tct .b-ct-n a {
width: 100%;
height: 100%;
}
.sc--top-countries-f .box-tct .b-dt-tct .b-ct-n figure {
width: 100%;
height: auto;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b5 figure {
height: 8.325rem;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6 figure {
height: 6.869rem;
}
.sc--top-countries-f .box-tct .b-dt-tct .b-ct-n figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--top-countries-f .box-tct .b-dt-tct .b-ct-n .name-country {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 5px 10px;
background-color: var(--color-green);
}
.sc--top-countries-f .box-tct .b-dt-tct .b-ct-n .name-country p {
font-size: 1rem;
text-align: center;
color: var(--color-light);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
/* hover image */
.sc--top-countries-f .box-tct .b-dt-tct .b-ct-n figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--top-countries-f .box-tct .b-dt-tct .b-ct-n:hover figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--top-countries-f .box-tct .b-dt-tct .size-b5:nth-child(5n+0) {
margin-right: 0;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6:nth-child(6n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--top-countries-f .box-tct .b-dt-tct .size-b5:nth-child(5n+0) {
margin-right: 0;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6:nth-child(6n+0) {
margin-right: 0;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b5 figure {
height: 6.844rem;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6 figure {
height: 5.635rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--top-countries-f .box-tct .b-dt-tct .size-b5 {
width: calc((100%/4) - 6.75px);
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6 {
width: calc((100%/4) - 6.75px);
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b5:nth-child(4n+0) {
margin-right: 0;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6:nth-child(4n+0) {
margin-right: 0;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b5 figure {
height: 6.972rem;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6 figure {
height: 6.972rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--top-countries-f .box-tct .b-dt-tct .size-b5 {
width: calc((100%/3) - 6px);
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6 {
width: calc((100%/3) - 7.5px);
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b5:nth-child(3n+0) {
margin-right: 0;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6:nth-child(3n+0) {
margin-right: 0;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b5 figure {
height: 8.78rem;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6 figure {
height: 8.78rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--top-countries-f .box-tct {
padding-bottom: 10px;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b5 {
width: calc((100%/2) - 4.5px);
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6 {
width: calc((100%/2) - 4.5px);
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b5:nth-child(2n+0) {
margin-right: 0;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6:nth-child(2n+0) {
margin-right: 0;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b5 figure {
height: 7.092rem;
}
.sc--top-countries-f .box-tct .b-dt-tct .size-b6 figure {
height: 7.092rem;
}
}
/* ================= top countries 5 - 6 bg ================= */
.sc--top-countries-bg-f {
position: relative;
width: 100%;
height: auto;
}
.sc--top-countries-bg-f .box-tct {
position: relative;
width: 100%;
height: auto;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
border-radius: 5px;
overflow: hidden;
padding: 12px 12px 3px 12px;
}
.sc--top-countries-bg-f .box-tct .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 10px 16px;
}
.sc--top-countries-bg-f .box-tct .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-green);
}
.sc--top-countries-bg-f .box-tct .b-title .icon-ct {
margin-bottom: -5px;
}
.sc--top-countries-bg-f .box-tct .b-title p i {
font-size: 1.75rem;
color: var(--color-green);
margin-bottom: -5px;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .b-ct-n {
position: relative;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .b-ct-n:hover {
border: 1px solid var(--color-green);
transition: all 0.3s ease;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5 {
width: calc((100%/5) - 7.2px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6 {
width: calc((100%/6) - 7.5px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .b-ct-n a {
width: 100%;
height: 100%;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .b-ct-n figure {
width: 100%;
height: auto;
overflow: hidden;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5 figure {
height: 8.148rem;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6 figure {
height: 6.721rem;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .b-ct-n figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .b-ct-n .name-country {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 5px 10px;
background-color: var(--color-green);
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .b-ct-n .name-country p {
font-size: 1rem;
text-align: center;
color: var(--color-light);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
/* hover image */
.sc--top-countries-bg-f .box-tct .b-dt-tct .b-ct-n figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .b-ct-n:hover figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5:nth-child(5n+0) {
margin-right: 0;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6:nth-child(6n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5:nth-child(5n+0) {
margin-right: 0;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6:nth-child(6n+0) {
margin-right: 0;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5 figure {
height: 6.667rem;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6 figure {
height: 5.487rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5 {
width: calc((100%/4) - 6.75px);
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6 {
width: calc((100%/4) - 6.75px);
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5:nth-child(4n+0) {
margin-right: 0;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6:nth-child(4n+0) {
margin-right: 0;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5 figure {
height: 6.75rem;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6 figure {
height: 6.75rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--top-countries-bg-f .box-tct {
padding: 12px 12px 10px 12px;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5 {
width: calc((100%/3) - 6px);
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6 {
width: calc((100%/3) - 6px);
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5:nth-child(3n+0) {
margin-right: 0;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6:nth-child(3n+0) {
margin-right: 0;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5 figure {
height: 8.494rem;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6 figure {
height: 8.494rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--top-countries-bg-f.mg--t20 {
/* margin-top: 0; */
}
.sc--top-countries-bg-f .container {
padding: 0;
}
.sc--top-countries-bg-f .box-tct {
border-radius: 0;
padding: 12px 16px 10px 16px;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5 {
width: calc((100%/2) - 4.5px);
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6 {
width: calc((100%/2) - 4.5px);
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5:nth-child(2n+0) {
margin-right: 0;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6:nth-child(2n+0) {
margin-right: 0;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b5 figure {
height: 7.092rem;
}
.sc--top-countries-bg-f .box-tct .b-dt-tct .size-b6 figure {
height: 7.092rem;
}
}
/* ================= program fire promotion 4 - 5 ================= */
.sc--program-fire-f {
position: relative;
width: 100%;
height: auto;
}
.sc--program-fire-f .box--pgf {
position: relative;
width: 100%;
height: auto;
}
.sc--program-fire-f .box--pgf .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 10px 16px;
}
.sc--program-fire-f .box--pgf .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--program-fire-f .box--pgf .b-title p span i {
color: var(--color-red6);
}
.sc--program-fire-f .box--pgf .b-title p .pd-lr-icon {
padding: 0 3px;
}
.sc--program-fire-f .box--pgf .b-dt-pgf {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf {
position: relative;
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
cursor: pointer;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4 {
width: calc((100%/4) - 6.75px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5 {
width: calc((100%/5) - 7.2px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf a {
width: 100%;
height: 100%;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf .b-img {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4 .b-img {
height: 17.735rem;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5 .b-img {
height: 14.05rem;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf .b-img figure {
width: 100%;
height: 100%;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf .b-name {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf:hover .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
/* hover image */
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5:nth-child(5n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5:nth-child(5n+0) {
margin-right: 0;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4 .b-img {
height: 14.61rem;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5 .b-img {
height: 11.55rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4 {
width: calc((100%/3) - 6px);
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5 {
width: calc((100%/3) - 6px);
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4 .b-img {
height: 15.354rem;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5 .b-img {
height: 15.354rem;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf .b-name {
padding: 10px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4 {
width: calc((100%/2) - 4.5px);
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5 {
width: calc((100%/2) - 4.5px);
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4 .b-img {
height: 22.594rem;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5 .b-img {
height: 22.594rem;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .b-pgf .b-name {
padding: 10px;
}
/* row */
.sc--program-fire-f .box--pgf .row-b-dt-pgf {
position: relative;
width: 100%;
height: auto;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .b-pgf {
display: flex;
justify-content: stretch;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .size-b4 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .size-b5 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .size-b5:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .b-pgf a {
display: flex;
justify-content: stretch;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .b-pgf .b-img {
width: 9rem;
height: 9rem;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .size-b4 .b-img {
height: 9rem;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .size-b5 .b-img {
height: 9rem;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .b-pgf .b-name {
width: calc(100% - 9rem);
padding: 10px 12px 5px 12px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-fire-f .box--pgf {
padding-bottom: 10px;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b4 .b-img {
height: auto;
}
.sc--program-fire-f .box--pgf .b-dt-pgf .size-b5 .b-img {
height: auto;
}
/* half */
.sc--program-fire-f .box--pgf .half-b-dt-pgf {
position: relative;
width: 100%;
height: auto;
}
.sc--program-fire-f .box--pgf .half-b-dt-pgf .size-b4 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-fire-f .box--pgf .half-b-dt-pgf .size-b5 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-fire-f .box--pgf .half-b-dt-pgf .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-fire-f .box--pgf .half-b-dt-pgf .size-b5:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-fire-f .box--pgf .half-b-dt-pgf .size-b4 .b-img {
height: 11.969rem;
}
.sc--program-fire-f .box--pgf .half-b-dt-pgf .size-b5 .b-img {
height: 11.969rem;
}
/* row */
.sc--program-fire-f .box--pgf .row-b-dt-pgf {
position: relative;
width: 100%;
height: auto;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .b-pgf {
display: flex;
justify-content: stretch;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .size-b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .size-b5 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .b-pgf a {
display: flex;
justify-content: stretch;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .b-pgf .b-img {
width: 8.438rem;
height: 8.438rem;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .size-b4 .b-img {
height: 8.438rem;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .size-b5 .b-img {
height: 8.438rem;
}
.sc--program-fire-f .box--pgf .row-b-dt-pgf .b-pgf .b-name {
width: calc(100% - 8.438rem);
padding: 10px 12px 5px 12px;
}
}
/* ================= program fire promotion 4 - 5 bg ================= */
.sc--program-fire-bg-f {
position: relative;
width: 100%;
height: auto;
}
.sc--program-fire-bg-f .box--pgf {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
overflow: hidden;
padding: 12px 12px 3px 12px;
}
.sc--program-fire-bg-f .box--pgf .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 10px 16px;
}
.sc--program-fire-bg-f .box--pgf .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--program-fire-bg-f .box--pgf .b-title p span i {
color: var(--color-red6);
}
.sc--program-fire-bg-f .box--pgf .b-title p .pd-lr-icon {
padding: 0 3px;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .b-pgf {
position: relative;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .b-pgf:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4 {
width: calc((100%/4) - 6.75px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5 {
width: calc((100%/5) - 7.2px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .b-pgf a {
width: 100%;
height: 100%;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .b-pgf .b-img {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4 .b-img {
height: 17.36rem;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5 .b-img {
height: 13.75rem;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .b-pgf .b-img figure {
width: 100%;
height: 100%;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .b-pgf .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .b-pgf .b-name {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .b-pgf .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .b-pgf:hover .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
/* hover image */
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .b-pgf .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .b-pgf:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5:nth-child(5n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5:nth-child(5n+0) {
margin-right: 0;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4 .b-img {
height: 14.235rem;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5 .b-img {
height: 11.25rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4 {
width: calc((100%/3) - 6px);
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5 {
width: calc((100%/3) - 6px);
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4 .b-img {
height: 15.417rem;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5 .b-img {
height: 15.417rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-fire-bg-f .box--pgf {
padding: 12px 12px 10px 12px;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4 {
width: calc((100%/2) - 4.5px);
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5 {
width: calc((100%/2) - 4.5px);
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4 .b-img {
height: 21.844rem;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5 .b-img {
height: 21.844rem;
}
/* row */
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf {
position: relative;
width: 100%;
height: auto;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .b-pgf {
display: flex;
justify-content: stretch;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .size-b4 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .size-b5 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .size-b5:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .b-pgf a {
display: flex;
justify-content: stretch;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .b-pgf .b-img {
width: 9rem;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .size-b4 .b-img {
height: 9rem;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .size-b5 .b-img {
height: 9rem;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .b-pgf .b-name {
width: calc(100% - 9rem);
padding: 10px 12px 5px 12px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-fire-bg-f.mg--t20 {
margin-top: 0;
}
.sc--program-fire-bg-f .container {
padding: 0;
}
.sc--program-fire-bg-f .box--pgf {
border-radius: 0;
padding: 12px 16px 10px 16px;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b4 .b-img {
height: auto;
}
.sc--program-fire-bg-f .box--pgf .b-dt-pgf .size-b5 .b-img {
height: auto;
}
/* half */
.sc--program-fire-bg-f .box--pgf .half-b-dt-pgf {
position: relative;
width: 100%;
height: auto;
}
.sc--program-fire-bg-f .box--pgf .half-b-dt-pgf .size-b4 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-fire-bg-f .box--pgf .half-b-dt-pgf .size-b5 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-fire-bg-f .box--pgf .half-b-dt-pgf .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-fire-bg-f .box--pgf .half-b-dt-pgf .size-b5:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-fire-bg-f .box--pgf .half-b-dt-pgf .size-b4 .b-img {
height: 11.969rem;
}
.sc--program-fire-bg-f .box--pgf .half-b-dt-pgf .size-b5 .b-img {
height: 11.969rem;
}
/* row */
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf {
position: relative;
width: 100%;
height: auto;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .b-pgf {
display: flex;
justify-content: stretch;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .size-b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .size-b5 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .b-pgf a {
display: flex;
justify-content: stretch;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .b-pgf .b-img {
width: 8.438rem;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .size-b4 .b-img {
height: 8.438rem;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .size-b5 .b-img {
height: 8.438rem;
}
.sc--program-fire-bg-f .box--pgf .row-b-dt-pgf .b-pgf .b-name {
width: calc(100% - 8.438rem);
padding: 10px 12px 5px 12px;
}
}
/* ================= review 3 - 4 ================= */
.sc--review-f {
position: relative;
width: 100%;
height: auto;
}
.sc--review-f .box-bg-rv {
position: relative;
width: 100%;
height: auto;
padding: 2.5rem 0 1.3rem 0;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--review-f .b-dt-rv {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
}
.sc--review-f .b-dt-rv .b-rv {
position: relative;
height: auto;
background-color: var(--color-light);
overflow: hidden;
border-radius: 5px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--review-f .b-title {
display: none;
}
.sc--review-f .b-dt-rv .size--b3 {
width: calc((100%/3) - 6px);
margin: 0 9px 9px 0;
}
.sc--review-f .b-dt-rv .size--b4 {
width: calc((100%/4) - 6.75px);
margin: 0 9px 9px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-img {
position: relative;
width: 100%;
height: auto;
padding: 2rem 10px 5px 10px;
}
.sc--review-f .b-dt-rv .b-rv .b-img figure {
position: relative;
width: auto;
height: auto;
overflow: hidden;
border-radius: 100%;
margin: 0 auto;
border: 4px solid var(--color-first);
z-index: 1;
}
.sc--review-f .b-dt-rv .size--b3 .b-img figure {
width: 11rem;
height: 11rem;
}
.sc--review-f .b-dt-rv .size--b4 .b-img figure {
width: 9.5rem;
height: 9.5rem;
overflow: hidden;
}
.sc--review-f .b-dt-rv .b-rv .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 100%;
border: 2px solid var(--color-light);
}
.sc--review-f .b-dt-rv .b-rv .b-img .bg-igm {
position: absolute;
width: 100%;
height: auto;
background-color: var(--color-first);
top: 0;
left: 0;
}
.sc--review-f .b-dt-rv .size--b3 .b-img .bg-igm {
height: 11rem;
}
.sc--review-f .b-dt-rv .size--b4 .b-img .bg-igm {
height: 9.5rem;
}
.sc--review-f .b-dt-rv .b-rv .b-dt {
position: relative;
width: 100%;
height: auto;
padding: 10px;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .icons-qu {
position: relative;
width: 100%;
height: auto;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .icons-qu p {
font-weight: bold;
text-align: center;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .icons-qu i {
font-size: 2rem;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .shoet {
position: relative;
width: 100%;
height: 3.813rem;
padding: 5px 0 10px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .shoet p {
font-size: 0.94rem;
font-weight: normal;
text-align: center;
color: var(--color-txtg5);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .names {
position: relative;
width: 100%;
height: auto;
padding: 10px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .names p {
font-size: 1.13rem;
font-weight: bold;
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .name-pg {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 3px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .name-pg p {
font-size: 1rem;
font-weight: bold;
text-align: center;
color: var(--color-first);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
/* ============= */
@media (min-width: 1200px) {
.sc--review-f .b-dt-rv .size--b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--review-f .b-dt-rv .size--b4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--review-f .b-dt-rv .size--b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--review-f .b-dt-rv .size--b4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--review-f .b-dt-rv {
justify-content: stretch;
}
.sc--review-f .b-dt-rv .b-rv {
display: flex;
justify-content: stretch;
align-items: center;
}
.sc--review-f .b-dt-rv .size--b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--review-f .b-dt-rv .size--b4 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--review-f .b-dt-rv .size--b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--review-f .b-dt-rv .b-rv .b-img {
width: 8rem;
height: 100%;
padding: 5px;
display: flex;
align-items: center;
}
.sc--review-f .b-dt-rv .size--b3 .b-img figure {
width: 7rem;
height: 7rem;
}
.sc--review-f .b-dt-rv .size--b3 .b-img .bg-igm {
width: 5.5rem;
height: 100%;
}
.sc--review-f .b-dt-rv .size--b4 .b-img figure {
width: 7rem;
height: 7rem;
}
.sc--review-f .b-dt-rv .size--b4 .b-img .bg-igm {
width: 5.5rem;
height: 100%;
}
.sc--review-f .b-dt-rv .b-rv .b-dt {
width: calc(100% - 8rem);
height: 100%;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .icons-qu i {
font-size: 1.75rem;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .shoet {
height: auto;
padding: 2px 0 5px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .shoet p {
font-size: 0.88rem;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .names {
padding: 5px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .names p {
font-size: 1rem;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .name-pg {
padding: 5px 0 2px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .name-pg p {
font-size: 0.88rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--review-f.mg--t20 {
margin-top: 0;
}
.sc--review-f .b-dt-rv {
justify-content: stretch;
}
.sc--review-f .b-dt-rv .b-rv {
display: flex;
justify-content: stretch;
align-items: center;
}
.sc--review-f .b-dt-rv .size--b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--review-f .b-dt-rv .size--b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-img {
width: 8rem;
height: 100%;
padding: 5px;
display: flex;
align-items: center;
}
.sc--review-f .b-dt-rv .size--b3 .b-img figure {
width: 7rem;
height: 7rem;
}
.sc--review-f .b-dt-rv .size--b3 .b-img .bg-igm {
width: 5.5rem;
height: 100%;
}
.sc--review-f .b-dt-rv .size--b4 .b-img figure {
width: 7rem;
height: 7rem;
}
.sc--review-f .b-dt-rv .size--b4 .b-img .bg-igm {
width: 5.5rem;
height: 100%;
}
.sc--review-f .b-dt-rv .b-rv .b-dt {
width: calc(100% - 8rem);
height: 100%;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .icons-qu i {
font-size: 1.75rem;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .shoet {
height: auto;
padding: 2px 0 5px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .shoet p {
font-size: 0.88rem;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .names {
padding: 5px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .names p {
font-size: 1rem;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .name-pg {
padding: 5px 0 2px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .name-pg p {
font-size: 0.88rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--review-f.mg--t20 {
margin-top: 0;
}
.sc--review-f .box-bg-rv {
padding: 1.2rem 0 2rem 0;
}
.sc--review-f .b-title {
position: relative;
width: 100%;
height: auto;
padding: 0 10px 8px 5px;
display: inline-block;
}
.sc--review-f .b-title p {
font-size: 1.25rem;
font-weight: bold;
}
.sc--review-f .b-dt-rv .b-rv {
display: flex;
justify-content: stretch;
align-items: center;
}
.sc--review-f .b-dt-rv .size--b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--review-f .b-dt-rv .size--b3:last-child {
margin-bottom: 0;
}
.sc--review-f .b-dt-rv .size--b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--review-f .b-dt-rv .size--b4:last-child {
margin-bottom: 0;
}
.sc--review-f .b-dt-rv .b-rv .b-img {
width: 8rem;
height: 100%;
padding: 5px;
display: flex;
align-items: center;
}
.sc--review-f .b-dt-rv .size--b3 .b-img figure {
width: 7rem;
height: 7rem;
}
.sc--review-f .b-dt-rv .size--b3 .b-img .bg-igm {
width: 5.5rem;
height: 100%;
}
.sc--review-f .b-dt-rv .size--b4 .b-img figure {
width: 7rem;
height: 7rem;
}
.sc--review-f .b-dt-rv .size--b4 .b-img .bg-igm {
width: 5.5rem;
height: 100%;
}
.sc--review-f .b-dt-rv .b-rv .b-dt {
width: calc(100% - 8rem);
height: 100%;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .icons-qu i {
font-size: 1.75rem;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .shoet {
height: auto;
padding: 2px 0 5px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .shoet p {
font-size: 0.88rem;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .names {
padding: 5px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .names p {
font-size: 1rem;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .name-pg {
padding: 5px 0 2px 0;
}
.sc--review-f .b-dt-rv .b-rv .b-dt .name-pg p {
font-size: 0.88rem;
}
}
/* ================= program column size 3 - 4 - 5 bg ================= */
.sc--program-cl-bg-f {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-bg-f .box-pg-cl {
position: relative;
width: 100%;
height: auto;
padding: 12px 12px 3px 12px;
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-cl-bg-f .box-pg-cl .b-title-pg {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 16px 16px;
}
.sc--program-cl-bg-f .box-pg-cl .b-title-pg p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg {
position: relative;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 {
width: calc((100%/3) - 6px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 {
width: calc((100%/4) - 6.75px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 {
width: calc((100%/5) - 7.2px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg a {
width: 100%;
height: 100%;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-img {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 .b-img {
height: 23.369rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-img {
height: 17.36rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-img {
height: 13.75rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-img figure {
width: 100%;
height: 100%;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-name {
position: relative;
width: 100%;
height: 4.25rem;
padding: 10px;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg:hover .b-dt-smb .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg {
width: 100%;
height: auto;
padding: 10px;
border-top: 1px dashed var(--color-grey3);
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p {
font-size: 0.88rem;
font-weight: normal;
text-align: center;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.82rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p span {
color: var(--color-txtg4);
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p .pd-ic-r {
padding-right: 3px;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p i {
color: var(--color-icon-yl);
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
padding: 10px;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l {
position: relative;
width: 50%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
padding: 0 5px;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l figure {
position: relative;
width: auto;
height: auto;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 60%;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 75%;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 85%;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r {
position: relative;
width: 50%;
height: auto;
padding: 0 5px;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
text-align: right;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.88rem;
font-weight: bold;
text-align: right;
color: var(--color-red);
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.88rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.63rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r .txt-start {
margin-bottom: -5px;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r .txt-currency {
margin-top: -8px;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 .icon-crc {
display: none;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 .txt-crc {
display: none;
}
/* hover image */
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5:nth-child(5n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 {
width: calc((100%/4) - 6.75px);
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 .b-img {
height: 19.209rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-img {
height: 14.235rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-img {
height: 14.235rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-cl-bg-f .box-pg-cl {
padding: 12px 12px 10px 12px;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 {
width: calc((100%/3) - 6px);
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 {
width: calc((100%/3) - 6px);
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 .b-img {
height: 15.417rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-img {
height: 15.417rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-img {
height: 15.417rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p {
font-size: 0.82rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.82rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r p {
font-size: 0.82rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 75%;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 75%;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 75%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-cl-bg-f .box-pg-cl {
padding: 12px 12px 10px 12px;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 {
width: calc((100%/2) - 4.5px);
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 {
width: calc((100%/2) - 4.5px);
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 {
width: calc((100%/2) - 4.5px);
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 .b-img {
height: 21.844rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-img {
height: 21.844rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-img {
height: 21.844rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.88rem;
}
/* row */
/* .dp-none-txt-row-pg-f {
display: none;
} */
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg {
display: flex;
justify-content: stretch;
max-height: initial;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b5 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg a {
display: flex;
justify-content: stretch;
max-height: initial;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-img {
width: 14rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b3 .b-img {
height: 14rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b4 .b-img {
height: 14rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b5 .b-img {
height: 14rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb {
width: calc(100% - 14rem);
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-name {
height: 4.625rem;
padding: 16px 14px 10px 14px;
}
/* .sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
} */
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-dtpg {
padding: 10px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p {
/* font-size: 0.75rem; */
padding: 0 10px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
text-align: left;
width: 50%;
}
/* .sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.75rem;
} */
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price {
padding: 5px 10px;
align-items: end;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l {
width: 50%;
padding: 5px 0 10px 9px;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 100%;
height: 3.5rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 100%;
height: 3.5rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 100%;
height: 3.5rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l figure .size-img {
width: auto;
height: 100%;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r {
/* width: 50%; */
width: fit-content;
padding: 10px 16px 10px 10px;
margin-left: auto;
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r p {
font-size: 0.88rem;
text-align: left;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b3 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
margin-bottom: -5px;
text-align: left;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b4 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
margin-bottom: -5px;
text-align: left;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b5 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.44rem;
margin-bottom: -5px;
text-align: left;
}
/* .sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r .txt-start {
display: none;
} */
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r .txt-currency {
display: none;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 span {
font-weight: normal;
color: var(--color-txtg4);
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 .icon-crc {
padding-left: 5px;
font-size: 0.88rem;
display: inline-block;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 .txt-crc {
padding-left: 5px;
font-size: 0.88rem;
display: inline-block;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-cl-bg-f.mg--t20 {
margin-top: 0;
}
.sc--program-cl-bg-f .container {
padding: 0;
}
.sc--program-cl-bg-f .box-pg-cl {
border-radius: 0;
padding: 12px 16px 10px 16px;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 .b-img {
height: auto;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-img {
height: auto;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-img {
height: auto;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-name {
height: auto;
padding: 10px 12px;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg {
padding: 10px 12px;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p {
font-size: 0.88rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.88rem;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price {
padding: 0;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l {
padding: 8px 6px;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 55%;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 55%;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 55%;
}
.sc--program-cl-bg-f .box-pg-cl .b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r {
padding: 8px 12px 8px 6px;
}
/* half */
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b3 {
width: calc((100%/2) - 4.5px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b4 {
width: calc((100%/2) - 4.5px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b5 {
width: calc((100%/2) - 4.5px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b5:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b3 .b-img {
height: 11.969rem;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b4 .b-img {
height: 11.969rem;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b5 .b-img {
height: 11.969rem;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-name {
height: 4.125rem;
padding: 10px 6px;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-name p {
font-size: 0.94rem;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-dtpg {
padding: 10px 6px;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p {
font-size: 0.82rem;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.82rem;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price {
padding: 0;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l {
width: 45%;
padding: 8px 6px 8px 6px;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 85%;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 85%;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 85%;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r {
width: 55%;
padding: 8px 10px 8px 6px;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r p {
font-size: 0.75rem;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b3 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b4 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
}
.sc--program-cl-bg-f .box-pg-cl .half-b-dt-pg .size-b5 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
}
/* row */
.dp-none-txt-row-pg-bf {
display: none;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg {
display: flex;
justify-content: stretch;
max-height: 8.563rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b5 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg a {
display: flex;
justify-content: stretch;
max-height: 8.438rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-img {
width: 8.438rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b3 .b-img {
height: 8.438rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b4 .b-img {
height: 8.438rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b5 .b-img {
height: 8.438rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb {
width: calc(100% - 8.438rem);
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-name {
height: 3.5rem;
padding: 5px 10px;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-dtpg {
padding: 5px 10px;
display: flex;
justify-content: stretch;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-dtpg p {
font-size: 0.75rem;
padding: 0 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b4 .b-dt-smb .b-dtpg p,
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b5 .b-dt-smb .b-dtpg p {
font-size: 0.75rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price {
padding: 5px 10px;
align-items: end;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .img-al-l {
width: 35%;
padding: 0 5px;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b3 .b-dt-smb .b-airline-price .img-al-l figure {
width: 80%;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b4 .b-dt-smb .b-airline-price .img-al-l figure {
width: 80%;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b5 .b-dt-smb .b-airline-price .img-al-l figure {
width: 80%;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r {
width: 65%;
padding: 0 5px;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r p {
font-size: 0.82rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
margin-bottom: -5px;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b3 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b4 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .size-b5 .b-dt-smb .b-airline-price .price-r h1 {
font-size: 1.25rem;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r .txt-start {
display: none;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r .txt-currency {
display: none;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 span {
font-weight: normal;
color: var(--color-txtg4);
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 .icon-crc {
padding-left: 2px;
font-size: 0.82rem;
display: inline-block;
}
.sc--program-cl-bg-f .box-pg-cl .row-b-dt-pg .b-one-pg .b-dt-smb .b-airline-price .price-r h1 .txt-crc {
padding-left: 2px;
font-size: 0.82rem;
display: inline-block;
}
}
/* ================= program rows half ================= */
.sc--program-rw-half-f {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-half-f .box-bg-pgrh {
position: relative;
width: 100%;
height: auto;
padding: 2rem 0 1.3rem 0;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-rw-half-f .box-pg-rw-h {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 16px 16px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg {
position: relative;
width: calc((100%/2) - 4.5px);
height: auto;
max-height: 14rem;
margin: 0 9px 9px 0;
overflow: hidden;
cursor: pointer;
border-radius: 5px;
background-color: var(--color-light);
border: 1px solid var(--color-grey3);
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg a {
width: 100%;
height: 100%;
max-height: 14rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-img {
position: relative;
width: 14rem;
height: 14rem;
overflow: hidden;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-img figure {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r {
position: relative;
width: calc(100% - 14rem);
height: auto;
padding: 5px 12px 5px 12px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .names {
position: relative;
width: 100%;
height: 4.568rem;
/* height: 3.63rem; */
padding: 20px 0 5px 0;
/* padding: 5px 0; */
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .names p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg:hover .b-dt-r .names p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
position: relative;
width: 45%;
height: auto;
padding: 5px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
position: relative;
width: 55%;
height: auto;
padding: 5px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.82rem;
font-weight: normal;
color: var(--color-txtg4);
padding-bottom: 2px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p span,
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p span {
color: var(--color-txtg4);
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p .pd-ic-c,
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p .pd-ic-c {
padding-right: 3px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p i,
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p i {
color: var(--color-icon-yl);
}
/* ================== */
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-price {
position: relative;
width: 100%;
height: auto;
padding: 5px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-price p {
font-size: 0.88rem;
color: var(--color-txtg4);
margin-bottom: -5px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-price h1 {
font-size: 1.63rem;
font-weight: bold;
color: var(--color-red);
margin-bottom: -5px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-price h1 span {
color: var(--color-red);
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-price h1 .txt-currency {
font-size: 0.88rem;
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
}
/* ================== */
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price {
position: relative;
width: 100%;
height: auto;
padding: 5px 0;
display: flex;
justify-content: stretch;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
position: relative;
width: 50%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
position: relative;
width: 50%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
position: relative;
width: 50%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r p {
font-size: 0.88rem;
color: var(--color-txtg4);
margin-bottom: -5px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.63rem;
font-weight: bold;
color: var(--color-red);
margin-bottom: -5px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 span {
color: var(--color-red);
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 .txt-currency {
font-size: 0.88rem;
font-weight: normal;
padding-left: 2px;
color: var(--color-txtg4);
}
/* hover image */
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg {
width: 100%;
max-height: initial;
margin: 0 0 9px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r {
padding: 0 14px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .names {
height: 4.625rem;
padding: 16px 0 10px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
width: 50%;
padding: 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
width: 50%;
padding: 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.94rem;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price {
align-items: end;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
padding: 10px 0 10px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
width: 100%;
height: 3.5rem;
display: flex;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure .size-img {
width: auto;
height: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
padding: 10px 0 10px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.50rem;
}
/* column */
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg {
width: calc((100%/3) - 6px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: 19.709rem;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r {
width: 100%;
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .names {
width: 100%;
height: 4.25rem;
padding: 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .names p {
font-size: 1.13rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: wrap;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
width: 100%;
padding: 10px 10px 0 10px;
display: block;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
width: 100%;
padding: 0 10px 10px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.94rem;
text-align: center;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r .dpn-txt-ct {
display: none;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price {
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
width: 50%;
padding: 8px 10px 10px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
width: 100%;
height: 3rem;
display: flex;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure .size-img {
width: auto;
height: 100%;
margin: 0 auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
width: 50%;
padding: 8px 16px 10px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r p {
font-size: 0.94rem;
display: block;
text-align: right;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.50rem;
text-align: right;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 span {
width: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 .txt-currency {
font-size: 0.94rem;
margin-top: -8px;
}
/* column half */
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg {
width: calc((100%/3) - 6px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: 19.709rem;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r {
width: 100%;
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .names {
width: 100%;
height: 4.25rem;
padding: 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .names p {
font-size: 1.13rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: wrap;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
width: 100%;
padding: 10px 10px 0 10px;
display: block;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
width: 100%;
padding: 0 10px 10px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.94rem;
text-align: center;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r .dpn-txt-ct {
display: none;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price {
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
width: 50%;
padding: 8px 10px 10px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
width: 100%;
height: 3rem;
display: flex;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure .size-img {
width: auto;
height: 100%;
margin: 0 auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
width: 50%;
padding: 8px 16px 10px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r p {
font-size: 0.94rem;
display: block;
text-align: right;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.50rem;
text-align: right;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 span {
width: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 .txt-currency {
font-size: 0.94rem;
margin-top: -8px;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg {
width: 100%;
max-height: initial;
margin: 0 0 9px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r {
padding: 0 14px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .names {
height: 4.625rem;
padding: 16px 0 10px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
width: 50%;
padding: 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
width: 50%;
padding: 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.88rem;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price {
align-items: end;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
padding: 10px 0 10px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
width: 100%;
height: 3.5rem;
display: flex;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure .size-img {
width: auto;
height: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
padding: 10px 0 10px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
/* column */
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg {
width: calc((100%/3) - 6px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: 15.197rem;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r {
width: 100%;
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .names {
width: 100%;
height: 4.25rem;
padding: 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .names p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: wrap;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
width: 100%;
padding: 10px 10px 0 10px;
display: block;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
width: 100%;
padding: 0 10px 10px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.82rem;
text-align: center;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r .dpn-txt-ct {
display: none;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price {
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
width: 50%;
padding: 8px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
width: 100%;
height: 3rem;
display: flex;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure .size-img {
width: auto;
height: 100%;
margin: 0 auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
width: 50%;
padding: 8px 16px 8px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r p {
font-size: 0.82rem;
display: block;
text-align: right;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.44rem;
text-align: right;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 span {
width: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 .txt-currency {
font-size: 0.82rem;
margin-top: -8px;
}
/* column half */
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg {
width: calc((100%/3) - 6px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: 15.197rem;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r {
width: 100%;
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .names {
width: 100%;
height: 4.25rem;
padding: 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .names p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: wrap;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
width: 100%;
padding: 10px 10px 0 10px;
display: block;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
width: 100%;
padding: 0 10px 10px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.82rem;
text-align: center;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r .dpn-txt-ct {
display: none;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price {
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
width: 50%;
padding: 8px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
width: 100%;
height: 3rem;
display: flex;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure .size-img {
width: auto;
height: 100%;
margin: 0 auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
width: 50%;
padding: 8px 16px 8px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r p {
font-size: 0.82rem;
display: block;
text-align: right;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.44rem;
text-align: right;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 span {
width: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 .txt-currency {
font-size: 0.82rem;
margin-top: -8px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg {
width: 100%;
max-height: initial;
margin: 0 0 9px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r {
padding: 0 14px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .names {
height: 4.625rem;
padding: 16px 0 10px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
width: 50%;
padding: 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
width: 50%;
padding: 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.88rem;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price {
align-items: end;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
padding: 10px 0 10px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
width: 100%;
height: 3.5rem;
display: flex;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure .size-img {
width: auto;
height: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
padding: 10px 0 10px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.44rem;
}
/* column */
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: 22.594rem;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r {
width: 100%;
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .names {
width: 100%;
height: 4.25rem;
padding: 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .names p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: wrap;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
width: 100%;
padding: 10px 10px 0 10px;
display: block;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
width: 100%;
padding: 0 10px 10px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.88rem;
text-align: center;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r .dpn-txt-ct {
display: none;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price {
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
width: 50%;
padding: 8px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
width: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure .size-img {
margin: 0 auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
width: 50%;
padding: 8px 16px 8px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r p {
font-size: 0.88rem;
display: block;
text-align: right;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.44rem;
text-align: right;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 span {
width: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 .txt-currency {
margin-top: -8px;
}
/* column half */
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: 22.594rem;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r {
width: 100%;
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .names {
width: 100%;
height: 4.25rem;
padding: 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .names p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: wrap;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
width: 100%;
padding: 10px 10px 0 10px;
display: block;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
width: 100%;
padding: 0 10px 10px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.88rem;
text-align: center;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r .dpn-txt-ct {
display: none;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price {
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
width: 50%;
padding: 8px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
width: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure .size-img {
margin: 0 auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
width: 50%;
padding: 8px 16px 8px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r p {
font-size: 0.88rem;
display: block;
text-align: right;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.44rem;
text-align: right;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 span {
width: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 .txt-currency {
margin-top: -8px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-rw-half-f.mg--t20 {
margin-top: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg {
width: 100%;
max-height: 8.563rem;
margin: 0 0 9px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg a {
max-height: 8.438rem;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-img {
width: 8.438rem;
height: 8.438rem;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r {
width: calc(100% - 8.438rem);
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .names {
height: auto;
padding: 5px 10px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .names p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
width: 100%;
padding: 5px 10px 1px 10px;
display: flex;
justify-content: stretch;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
width: 100%;
padding: 1px 10px 5px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.75rem;
padding: 0 5px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r .dpn-txt-ct {
display: none;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price {
padding: 5px 10px;
align-items: end;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
width: 35%;
padding: 0 5px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
width: 80%;
margin: 0 auto;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
width: 65%;
padding: 0 5px;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r p {
display: none;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.25rem;
margin-bottom: -5px;
text-align: right;
}
.sc--program-rw-half-f .box-pg-rw-h .b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 .txt-currency {
font-size: 0.82rem;
display: inline-block;
}
/* column */
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg {
width: 100%;
max-height: initial;
margin: 0 0 9px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r {
width: 100%;
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .names {
height: auto;
padding: 10px 12px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .names p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: wrap;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
width: 100%;
padding: 10px 12px 0 12px;
display: block;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
width: 100%;
padding: 0 12px 10px 12px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.82rem;
text-align: center;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r .dpn-txt-ct {
display: none;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
width: 40%;
padding: 0 6px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
width: 65%;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
width: 60%;
padding: 0 12px 0 6px;
display: grid;
justify-content: flex-end;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r p {
font-size: 0.88rem;
text-align: left;
display: block;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.63rem;
text-align: right;
margin-bottom: 0;
/* display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row; */
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 span {
width: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .column-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 .txt-currency {
margin-top: 0;
padding-left: 0;
display: initial;
}
/* column half */
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: 11.969rem;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r {
width: 100%;
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .names {
width: 100%;
height: 4.125rem;
padding: 10px 6px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .names p {
font-size: 0.94rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: wrap;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l {
width: 100%;
padding: 10px 6px 0 6px;
display: block;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r {
width: 100%;
padding: 0 6px 10px 6px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-l p,
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r p {
font-size: 0.82rem;
text-align: center;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .dtpg .dt-r .dpn-txt-ct {
display: none;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price {
padding: 0;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l {
width: 45%;
padding: 8px 6px 8px 6px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .img-al-l figure {
width: 85%;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r {
width: 55%;
padding: 8px 10px 8px 6px;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r p {
font-size: 0.75rem;
display: block;
text-align: right;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 {
font-size: 1.25rem;
text-align: right;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 span {
width: 100%;
}
.sc--program-rw-half-f .box-pg-rw-h .column-half-b-dt-pg .b-one-pg .b-dt-r .b-airline-price .price-r h1 .txt-currency {
margin-top: -8px;
}
}
/* ================= box slide ================= */
.sc--program-slidebox-f {
position: relative;
width: 100%;
height: auto;
}
.box-bg-slb-f {
position: relative;
width: 100%;
height: auto;
padding: 2rem 0 1rem 0;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.not-shadow-box-bg-slb-f {
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
}
.box-bg-slb {
position: relative;
width: 100%;
height: auto;
padding: 12px 12px 3px 12px;
border-radius: 5px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-slidebox-f .box-pg-slb {
position: relative;
width: 100%;
height: auto;
}
.sc--program-slidebox-f .box-pg-slb .b-title {
position: relative;
width: 100%;
height: auto;
}
.sc--program-slidebox-f .box-pg-slb .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full {
position: relative;
width: 100%;
height: auto;
margin-bottom: 30px;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
cursor: pointer;
border: 1px solid var(--color-grey4);
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg a {
width: 100%;
height: 100%;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-img {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3-f {
height: 23.875rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3 {
height: 23.375rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4-f {
height: 17.735rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4 {
height: 17.36rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-img figure {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb {
position: relative;
width: 100%;
height: auto;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-name {
position: relative;
width: 100%;
height: auto;
padding: 18px 12px 10px 12px;
/* padding: 12px 12px 10px 12px; */
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg:hover .b-dt-smb .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg {
position: relative;
width: 100%;
height: auto;
padding: 10px 12px;
border-top: 1px dashed var(--color-grey3);
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p {
font-size: 0.88rem;
font-weight: normal;
text-align: center;
padding-bottom: 3px;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p span {
color: var(--color-txtg4);
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p span i {
color: var(--color-icon-yl);
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p .pd-ic-r {
padding-right: 3px;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p .sprt-txt {
padding: 0 5px;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
padding: 10px 12px;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .img-tv-l {
position: relative;
width: 50%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
padding: 0 5px;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .img-tv-l figure {
position: relative;
width: 60%;
height: auto;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .img-tv-l figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r {
position: relative;
width: 50%;
height: auto;
padding: 0 5px;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
text-align: right;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 {
/*font-size: 1.88rem;*/
font-size: 1.63rem;
font-weight: bold;
text-align: right;
color: var(--color-red);
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r .txt-start {
margin-bottom: -5px;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r .txt-currency {
margin-top: -8px;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 .icon-crc {
display: none;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 .txt-crc {
display: none;
}
/* ============= */
.ct-swp-btn-next,
.ct-swp-btn-prev {
position: absolute;
cursor: pointer;
color: var(--color-light);
transition: color 0.3s ease;
text-shadow: 0px 0px 5px rgba(var(--color-dark-rgb), 0.7);
display: flex;
align-items: center;
justify-content: center;
top: 50%;
transform: translateY(-50%);
z-index: 10;
padding: 6px;
}
.ct-swp-btn-next {
left: auto;
}
.ct-swp-btn-prev {
right: auto;
}
.next-btn-swp-m2 {
right: -2.2rem;
}
.prev-btn-swp-m2 {
left: -2.2rem;
}
.next-btn-swp-m3 {
right: -3rem;
}
.prev-btn-swp-m3 {
left: -3rem;
}
.ct-swp-btn-next:after,
.ct-swp-btn-prev:after {
font-size: 1.88rem;
}
.ct-swp-btn-pagination {
cursor: pointer;
bottom: -25px !important;
}
.ct-swp-btn-pagination span {
width: 30px;
height: 7px;
border-radius: 100px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.color-pagination-first span {
background-color: var(--color-first);
}
.color-pagination-light span {
background-color: var(--color-light);
}
.color-pagination-dark span {
background-color: var(--color-dark);
}
/* hover image */
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3-f {
height: 19.709rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3 {
height: 19.209rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4-f {
height: 14.61rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4 {
height: 14.235rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 {
font-size: 1.44rem;
}
.next-btn-swp-m2 {
right: -1.8rem;
}
.prev-btn-swp-m2 {
left: -1.8rem;
}
.next-btn-swp-m3 {
right: -2.2rem;
}
.prev-btn-swp-m3 {
left: -2.2rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3-f {
height: 15.917rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3 {
height: 15.417rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4-f {
height: 15.917rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4 {
height: 15.417rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p {
font-size: 0.82rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r p {
font-size: 0.82rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 {
font-size: 1.44rem;
}
/* ============= */
.next-btn-swp-m2 {
display: none;
}
.prev-btn-swp-m2 {
display: none;
}
.next-btn-swp-m3 {
display: none;
}
.prev-btn-swp-m3 {
display: none;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box-bg-slb {
padding: 12px 16px 10px 16px;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3-f {
height: 22.594rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3 {
height: 21.844rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4-f {
height: 22.594rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4 {
height: 21.844rem;
}
/* ============= */
.next-btn-swp-m2 {
display: none;
}
.prev-btn-swp-m2 {
display: none;
}
.next-btn-swp-m3 {
display: none;
}
.prev-btn-swp-m3 {
display: none;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-slidebox-f.mg--t20 {
margin-top: 0;
}
.sc--program-slidebox-f .container {
padding: 0;
}
.box-bg-slb {
padding: 16px;
border-radius: 0;
}
.box-bg-slb-f {
padding: 16px;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3-f {
height: 24.625rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3 {
height: 24.625rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4-f {
height: 24.625rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4 {
height: 24.625rem;
}
/* ============= */
.next-btn-swp-m2 {
display: none;
}
.prev-btn-swp-m2 {
display: none;
}
.next-btn-swp-m3 {
display: none;
}
.prev-btn-swp-m3 {
display: none;
}
/* ============= */
.dp-none-date-slb {
display: none;
}
.dpnone-pgnt {
display: none;
}
.mg-b0-sw-box {
margin-bottom: 0 !important;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg {
display: flex;
justify-content: stretch;
max-height: inherit;
/* max-height: 8.563rem; */
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg a {
display: flex;
justify-content: stretch;
max-height: 9.4rem;
/* max-height: 8.438rem; */
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-img {
width: 9.4rem;
/* width: 8.438rem; */
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .sbimg-sw3-f {
height: 8.438rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .sbimg-sw3 {
height: 8.438rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .sbimg-sw4-f {
height: 8.438rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .sbimg-sw4 {
height: 9.4rem;
/* height: 8.438rem; */
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb {
width: calc(100% - 9.4rem);
/* width: calc(100% - 8.438rem); */
display: flex;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-name {
padding: 18px 10px 5px 10px;
/* padding: 8px 10px 5px 10px; */
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-name p {
font-size: 0.88rem;
/* font-size: 0.94rem; */
font-weight: normal;
color: var(--color-txtg5);
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-dtpg {
padding: 8px 10px 5px 10px;
display: flex;
justify-content: stretch;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p {
font-size: 0.75rem;
padding: 0 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p:first-child {
padding-left: 0;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-travel-price {
padding: 5px 10px 5px 10px;
/* padding: 8px 10px 5px 10px; */
align-items: end;
margin-top: auto;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .img-tv-l {
width: 35%;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .img-tv-l figure {
width: 80%;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r {
width: 65%;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r p {
font-size: 0.75rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 {
font-size: 1.25rem;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 span {
display: inline-block;
font-weight: normal;
color: var(--color-txtg4);
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 .icon-crc {
padding-right: 2px;
font-size: 0.94rem;
display: inline-block;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 .txt-crc {
padding-left: 2px;
font-size: 0.82rem;
display: inline-block;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r .txt-start {
display: none;
}
.sc--program-slidebox-f .box-pg-slb .b-swiper-full .part-b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r .txt-currency {
display: none;
}
}
/* ================= box slide custom ================= */
.b-slb-bg--mb {
position: relative;
width: 100%;
height: auto;
}
.sc--slidebox-ct-f {
position: relative;
width: 100%;
height: auto;
}
.box-bg-slb-ct-f {
position: relative;
width: 100%;
height: auto;
padding: 2rem 0 1rem 0;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.box-bg-slb-ct {
position: relative;
width: 100%;
height: auto;
padding: 12px 12px 3px 12px;
border-radius: 5px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--slidebox-ct-f .box-pg-slb {
position: relative;
width: 100%;
height: auto;
}
.sc--slidebox-ct-f .box-pg-slb .b-title {
position: relative;
width: 100%;
height: auto;
padding: 0 0 10px 0;
}
.sc--slidebox-ct-f .box-pg-slb .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-light);
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full {
position: relative;
width: 100%;
height: auto;
margin-bottom: 30px;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
cursor: pointer;
border: 1px solid var(--color-grey4);
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg a {
width: 100%;
height: 100%;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-img {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3-f {
height: 23.875rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3 {
height: 23.375rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4-f {
height: 17.735rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4 {
height: 17.36rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-img figure {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb {
position: relative;
width: 100%;
height: auto;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-name {
position: relative;
width: 100%;
height: auto;
padding: 12px 12px 10px 12px;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg:hover .b-dt-smb .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg {
position: relative;
width: 100%;
height: auto;
padding: 10px 12px;
border-top: 1px dashed var(--color-grey3);
border-bottom: 1px dashed var(--color-grey3);
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p {
font-size: 0.88rem;
font-weight: normal;
text-align: center;
padding-bottom: 3px;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p span {
color: var(--color-txtg4);
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p span i {
color: var(--color-icon-yl);
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p .pd-ic-r {
padding-right: 3px;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p .sprt-txt {
padding: 0 5px;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
padding: 10px 12px;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .img-tv-l {
position: relative;
width: 40%;
/* width: 50%; */
height: auto;
display: flex;
justify-content: center;
align-items: center;
padding: 0 5px;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .img-tv-l figure {
position: relative;
width: 70%;
/* width: 60%; */
height: auto;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .img-tv-l figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r {
position: relative;
width: 60%;
/* width: 50%; */
height: auto;
padding: 0 5px;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
text-align: right;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 {
font-size: 1.88rem;
font-weight: bold;
text-align: right;
color: var(--color-red);
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 .icon-crc {
display: none;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 .txt-crc {
display: none;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r .txt-start {
margin-bottom: -5px;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r .txt-currency {
margin-top: -8px;
}
/* ============= */
.btn-next-ct,
.btn-prev-ct {
position: absolute;
cursor: pointer;
color: var(--color-light);
transition: color 0.3s ease;
text-shadow: 0px 0px 5px rgba(var(--color-dark-rgb), 0.7);
display: flex;
align-items: center;
justify-content: center;
top: 50%;
transform: translateY(-50%);
z-index: 10;
padding: 6px;
}
.btn-next-ct {
left: auto;
right: -2.2rem;
}
.btn-prev-ct {
right: auto;
left: -2.2rem;
}
.btn-next-ct:after,
.btn-prev-ct:after {
font-size: 1.88rem;
}
.btn-pagination-ct {
cursor: pointer;
bottom: -25px !important;
}
.btn-pagination-ct span {
width: 30px;
height: 7px;
border-radius: 100px;
background-color: var(--color-first);
border: 1px solid var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.btn-next2-ct,
.btn-prev2-ct {
position: absolute;
cursor: pointer;
color: var(--color-light);
transition: color 0.3s ease;
text-shadow: 0px 0px 5px rgba(var(--color-dark-rgb), 0.7);
display: flex;
align-items: center;
justify-content: center;
top: 50%;
transform: translateY(-50%);
z-index: 10;
padding: 6px;
}
.btn-next2-ct {
left: auto;
right: -3rem;
}
.btn-prev2-ct {
right: auto;
left: -3rem;
}
.btn-next2-ct:after,
.btn-prev2-ct:after {
font-size: 1.88rem;
}
.btn-pagination2-ct {
cursor: pointer;
bottom: -25px !important;
}
.btn-pagination2-ct span {
width: 30px;
height: 7px;
border-radius: 100px;
background-color: var(--color-light);
border: 1px solid var(--color-first);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
/* hover image */
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-name {
height: 4.375rem;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3-f {
height: 19.709rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3 {
height: 19.209rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4-f {
height: 14.61rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4 {
height: 14.235rem;
}
.btn-next-ct {
right: -1.8rem;
}
.btn-prev-ct {
left: -1.8rem;
}
.btn-next2-ct {
right: -2.2rem;
}
.btn-prev2-ct {
left: -2.2rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3-f {
height: 15.917rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3 {
height: 15.417rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4-f {
height: 15.917rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4 {
height: 15.417rem;
}
/* ============= */
.btn-next-ct {
display: none;
}
.btn-prev-ct {
display: none;
}
.btn-next2-ct {
display: none;
}
.btn-prev2-ct {
display: none;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3-f {
height: 22.594rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3 {
height: 21.844rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4-f {
height: 22.594rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4 {
height: 21.844rem;
}
/* ============= */
.btn-next-ct {
display: none;
}
.btn-prev-ct {
display: none;
}
.btn-next2-ct {
display: none;
}
.btn-prev2-ct {
display: none;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.dp-none-txt-slb {
display: none;
}
.b-slb-bg--mb {
position: relative;
width: 100%;
height: auto;
/* margin-top: 20px; */
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.box-bg-slb-ct {
border-radius: 0;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
padding: 16px;
border-bottom: 1px solid var(--color-grey5);
}
.box-bg-slb-ct.bg--third {
background-color: var(--color-light);
}
.bg-scslb-nf .container {
padding: 0;
}
.sc--slidebox-ct-f.mg--t20 {
margin-top: 0;
}
.sc--slidebox-ct-f .box-pg-slb .b-title {
padding: 0 0 5px 5px;
}
.sc--slidebox-ct-f .box-pg-slb .b-title p {
text-align: left;
color: var(--color-txtg);
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full {
margin-bottom: 0;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg {
display: flex;
justify-content: stretch;
max-height: 8.563rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg a {
display: flex;
justify-content: stretch;
max-height: 8.438rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-img {
width: 8.438rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3-f {
height: 8.438rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw3 {
height: 8.438rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4-f {
height: 8.438rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .sbimg-sw4 {
height: 8.438rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb {
width: calc(100% - 8.438rem);
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-name {
padding: 8px 10px 5px 10px;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg {
padding: 8px 10px 5px 10px;
display: flex;
justify-content: stretch;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p {
font-size: 0.75rem;
padding: 0 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-dtpg p:first-child {
padding-left: 0;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price {
padding: 8px 10px 5px 10px;
align-items: end;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .img-tv-l {
width: 35%;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .img-tv-l figure {
width: 80%;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r {
width: 65%;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r p {
font-size: 0.75rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 {
font-size: 1.25rem;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 span {
display: inline-block;
font-weight: normal;
color: var(--color-txtg4);
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 .icon-crc {
padding-right: 2px;
font-size: 0.94rem;
display: inline-block;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r h1 .txt-crc {
padding-left: 2px;
font-size: 0.82rem;
display: inline-block;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r .txt-start {
display: none;
}
.sc--slidebox-ct-f .box-pg-slb .b-swiper-full .b-dt-pg .b-list-pg .b-dt-smb .b-travel-price .price-r .txt-currency {
display: none;
}
/* ============= */
.btn-next-ct {
display: none;
}
.btn-prev-ct {
display: none;
}
.btn-pagination-ct {
display: none;
}
.btn-next2-ct {
display: none;
}
.btn-prev2-ct {
display: none;
}
.btn-pagination2-ct {
display: none;
}
}
/* ================= footage data ================= */
.sc--footage-data-f {
position: relative;
width: 100%;
height: auto;
}
.box-bg-ft-dt {
position: relative;
width: 100%;
height: auto;
padding: 32px 0 22px 0;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--footage-data-f .box-ft-dt {
position: relative;
width: 100%;
height: auto;
}
.sc--footage-data-f .box-ft-dt .b-ftdt {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft {
position: relative;
width: calc((100%/4) - 12px);
height: auto;
margin: 0 16px 10px 0;
overflow: hidden;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
/* .sc--footage-data-f .box-ft-dt .b-ftdt .size-bftdt1 {}
.sc--footage-data-f .box-ft-dt .b-ftdt .size-bftdt2 {}
.sc--footage-data-f .box-ft-dt .b-ftdt .size-bftdt3 {}
.sc--footage-data-f .box-ft-dt .b-ftdt .size-bftdt4 {} */
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l {
position: relative;
width: 4rem;
height: auto;
padding-top: 6px;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l .bg-icon {
position: relative;
width: 3.8rem;
height: 3.8rem;
border-radius: 10px;
background-color: var(--color-bg-yl);
display: flex;
justify-content: center;
align-items: center;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l .bg-icon i {
font-size: 1.82rem;
font-weight: bold;
text-align: center;
color: var(--color-light);
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r {
position: relative;
width: calc(100% - 4rem);
height: auto;
padding-left: 5px;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-names {
width: 100%;
height: auto;
padding-bottom: 1px;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-names p {
font-size: 1rem;
font-weight: bold;
color: var(--color-light);
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-shoet {
width: 100%;
height: auto;
padding-top: 1px;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-shoet p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg1);
}
/* ============= */
@media (min-width: 1200px) {
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft {
height: fit-content;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft:nth-child(4n+0) {
margin-right: 0;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l {
width: 100%;
padding: 0 0 10px 0;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l .bg-icon {
margin: 0 auto;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r {
width: 100%;
padding: 0;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-names p {
text-align: center;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-shoet p {
text-align: center;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft {
height: fit-content;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft:nth-child(4n+0) {
margin-right: 0;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l {
width: 100%;
padding: 0 0 10px 0;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l .bg-icon {
margin: 0 auto;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r {
width: 100%;
padding: 0;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-names p {
text-align: center;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-shoet p {
text-align: center;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft:nth-child(4n+0) {
margin-right: 0;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l {
width: 100%;
padding: 0 0 10px 0;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l .bg-icon {
margin: 0 auto;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r {
width: 100%;
padding: 0;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-names p {
text-align: center;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-shoet p {
text-align: center;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--footage-data-f.mg--t20 {
margin-top: 0;
}
.box-bg-ft-dt {
padding: 32px 0 32px 0;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft {
width: 100%;
margin: 0 0 10px 0;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft:last-child {
margin-bottom: 0;
}
.sc--footage-data-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r {
padding-left: 10px;
}
}
/* ================= footage data 2 ================= */
.sc--footage-data2-f {
position: relative;
width: 100%;
height: auto;
}
.box-bg-ft-dt {
position: relative;
width: 100%;
height: auto;
padding: 32px 0 14px 0;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--footage-data2-f .box-ft-dt {
position: relative;
width: 100%;
height: auto;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft {
position: relative;
width: calc((100%/4) - 12px);
margin: 0 16px 10px 0;
overflow: hidden;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft:nth-child(4n+0) {
margin-right: 0;
}
/* .sc--footage-data2-f .box-ft-dt .b-ftdt .size-bftdt1 {}
.sc--footage-data2-f .box-ft-dt .b-ftdt .size-bftdt2 {}
.sc--footage-data2-f .box-ft-dt .b-ftdt .size-bftdt3 {}
.sc--footage-data2-f .box-ft-dt .b-ftdt .size-bftdt4 {} */
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l .bg-icon {
position: relative;
width: 3.8rem;
height: 3.8rem;
border-radius: 10px;
background-color: var(--color-bg-yl);
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l .bg-icon i {
font-size: 1.82rem;
font-weight: bold;
text-align: center;
color: var(--color-light);
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r {
position: relative;
width: 100%;
height: auto;
/* padding-left: 5px; */
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-names {
width: 100%;
height: auto;
padding-bottom: 1px;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-names p {
font-size: 1rem;
font-weight: bold;
color: var(--color-light);
text-align: center;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-shoet {
width: 100%;
height: auto;
padding-top: 1px;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-shoet p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg1);
text-align: center;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.sc--footage-data2-f.mg--t20 {
margin-top: 0;
}
.box-bg-ft-dt {
padding: 32px 0 32px 0;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft {
width: 100%;
margin: 0 0 10px 0;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft:last-child {
margin-bottom: 0;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft .b-icon-l {
position: relative;
width: 4rem;
height: auto;
padding-top: 6px;
padding: 6px 0 0 0;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r {
width: calc(100% - 4rem);
padding-left: 10px;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-names p {
text-align: left;
}
.sc--footage-data2-f .box-ft-dt .b-ftdt .b-list-ft .b-txt-r .b-shoet p {
text-align: left;
}
}
/* ================= article list ================= */
.sc--article-list-bg-lr {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-bg-lr .box-atc-l {
position: relative;
width: 100%;
height: auto;
padding: 12px 12px 3px 12px;
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--article-list-bg-lr .box-atc-l .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 5px 16px 5px;
}
.sc--article-list-bg-lr .box-atc-l .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg {
position: relative;
width: 100%;
height: auto;
max-height: 9.625rem;
border-radius: 5px;
overflow: hidden;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
cursor: pointer;
border: 1px solid var(--color-grey4);
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg a {
position: relative;
width: 100%;
height: 100%;
max-height: 9.5rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-img {
position: relative;
width: 14rem;
height: 9.5rem;
overflow: hidden;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-img figure {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail {
position: relative;
width: calc(100% - 14rem);
height: auto;
padding: 12px 16px;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
padding-bottom: 8px;
margin-bottom: 8px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
position: relative;
width: calc(100% - 4rem);
height: auto;
padding-right: 5px;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg:hover .b-detail .b-name-view .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: relative;
width: 4rem;
height: auto;
padding: 3px 0 0 5px;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.82rem;
text-align: right;
color: var(--color-txtg4);
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-txtg4);
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-first);
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p .pd-ic {
padding-right: 2px;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-dt {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.88rem;
color: var(--color-txtg4);
text-indent: 25px;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
/* hover image */
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.sc--article-list-bg-lr {
width: auto;
margin: 0 16px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--article-list-bg-lr {
width: auto;
margin: 0 16px;
}
/* column */
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg a {
max-height: initial;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-img {
width: 100%;
height: 14.959rem;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail {
width: 100%;
height: 100%;
padding: 10px 12px;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view {
padding-bottom: 5px;
height: 3.25rem;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 5px;
top: -2.3rem;
left: auto;
right: -6px;
z-index: 1;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.88rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
/* column half */
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg a {
max-height: initial;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-img {
width: 100%;
height: 14.959rem;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail {
width: 100%;
height: 100%;
padding: 10px 12px;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view {
padding-bottom: 5px;
height: 3.25rem;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 5px;
top: -2.3rem;
left: auto;
right: -6px;
z-index: 1;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.88rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--article-list-bg-lr.mg--t20 {
margin-top: 0;
}
.sc--article-list-bg-lr .box-atc-l {
border-radius: 0;
padding: 12px 16px 5px 16px;
}
.sc--article-list-bg-lr .box-atc-l .b-title {
padding: 5px;
}
.sc--article-list-bg-lr .box-atc-l .title-left-mb {
padding: 5px;
}
.sc--article-list-bg-lr .box-atc-l .title-left-mb p {
text-align: left;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg {
max-height: 7.408rem;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg a {
max-height: 7.283rem;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-img {
width: 11rem;
height: 7.283rem;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail {
width: calc(100% - 11rem);
padding: 6px;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view {
padding-bottom: 5px;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg);
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 3px;
z-index: 1;
top: -5px;
left: -11.2rem;
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.75rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.82rem;
text-indent: 20px;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
/* column */
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg {
max-height: initial;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg a {
max-height: initial;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-img {
width: 100%;
height: auto;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail {
width: 100%;
height: 100%;
padding: 10px 12px;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view {
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 1rem;
font-weight: bold;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 5px;
top: -2.3rem;
left: auto;
right: -6px;
z-index: 1;
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.75rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.88rem;
text-indent: 25px;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
/* column half */
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg a {
max-height: initial;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-img {
width: 100%;
height: 7.924rem;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail {
width: 100%;
height: 100%;
padding: 10px 12px;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view {
padding-bottom: 5px;
height: 3.25rem;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg);
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 5px;
top: -2.3rem;
left: auto;
right: -6px;
z-index: 1;
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.75rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
.sc--article-list-bg-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.82rem;
text-indent: 20px;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
}
/* ================= program image size 3 - 4 ================= */
.sc--program-img-f {
position: relative;
width: 100%;
height: auto;
}
.sc--program-img-f .bg-box1 {
background-color: var(--color-first);
}
.sc--program-img-f .box--bg-pgf {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
}
.sc--program-img-f .box--bg-pgf .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 5px 0 10px 0;
}
.sc--program-img-f .box--bg-pgf .title-pg p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--program-img-f .box--bg-pgf .list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-img-f .box--bg-pgf .list-pg .b-pg {
position: relative;
height: auto;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-img-f .box--bg-pgf .list-pg .b-pg:hover {
border: 1px solid var(--color-light);
transition: all 0.3s ease;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b3 {
width: calc((100%/3) - 6px);
height: 23.9991rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b4 {
width: calc((100%/4) - 6.75px);
height: 17.86rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-f .box--bg-pgf .list-pg .b-pg a {
width: 100%;
height: 100%;
}
.sc--program-img-f .box--bg-pgf .list-pg .b-pg figure {
width: 100%;
height: 100%;
}
.sc--program-img-f .box--bg-pgf .list-pg .b-pg figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
/* hover image */
.sc--program-img-f .box--bg-pgf .list-pg .b-pg figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-img-f .box--bg-pgf .list-pg .b-pg:hover figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-img-f .box--bg-pgf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-img-f .box--bg-pgf .list-pg .size-b3 {
height: 19.834rem;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b4 {
height: 14.745rem;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-img-f .box--bg-pgf .list-pg .size-b3 {
height: 16.042rem;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b4 {
height: 11.891rem;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-img-f .box--bg-pgf .list-pg .size-b3 {
width: calc((100%/3) - 6px);
height: 14.959rem;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b4 {
width: calc((100%/2) - 4.5px);
height: 22.719rem;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
/* half */
.sc--program-img-f .box--bg-pgf .half-pgimg-mb {
position: relative;
width: 100%;
height: auto;
}
.sc--program-img-f .box--bg-pgf .half-pgimg-mb .size-b3 {
width: calc((100%/2) - 4.5px);
height: 22.719rem;
}
.sc--program-img-f .box--bg-pgf .half-pgimg-mb .size-b4 {
width: calc((100%/2) - 4.5px);
height: 22.719rem;
}
.sc--program-img-f .box--bg-pgf .half-pgimg-mb .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-img-f .box--bg-pgf .half-pgimg-mb .size-b4:nth-child(2n+0) {
margin-right: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-img-f .box--bg-pgf .list-pg .size-b3 {
width: 100%;
height: auto;
margin: 0px 0 9px 0px;
}
.sc--program-img-f .box--bg-pgf .list-pg .size-b4 {
width: 100%;
height: auto;
margin: 0px 0 9px 0px;
}
/* half */
.sc--program-img-f .box--bg-pgf .half-pgimg-mb {
position: relative;
width: 100%;
height: auto;
}
.sc--program-img-f .box--bg-pgf .half-pgimg-mb .size-b3 {
width: calc((100%/2) - 4.5px);
height: 12.094rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-f .box--bg-pgf .half-pgimg-mb .size-b4 {
width: calc((100%/2) - 4.5px);
height: 12.094rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-f .box--bg-pgf .half-pgimg-mb .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-img-f .box--bg-pgf .half-pgimg-mb .size-b4:nth-child(2n+0) {
margin-right: 0;
}
}
/* ================= program image size 3 - 4 bg ================= */
.sc--program-img-bg-f {
position: relative;
width: 100%;
height: auto;
}
.sc--program-img-bg-f .bg-box1 {
background-color: var(--color-first);
}
.sc--program-img-bg-f .box--bg-pgf {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
padding: 12px 12px 5px 12px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-img-bg-f .box--bg-pgf .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 5px 0 10px 0;
}
.sc--program-img-bg-f .box--bg-pgf .title-pg p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-light);
}
.sc--program-img-bg-f .box--bg-pgf .title-pg figure {
width: 100%;
height: 2.5rem;
display: flex;
padding-bottom: 5px;
}
.sc--program-img-bg-f .box--bg-pgf .title-pg figure .size-imgtitle {
position: relative;
width: auto;
height: 100%;
margin-left: auto;
margin-right: auto;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .b-pg {
position: relative;
height: auto;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .b-pg:hover {
border: 1px solid var(--color-light);
transition: all 0.3s ease;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b3 {
width: calc((100%/3) - 6px);
height: 23.499rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b4 {
width: calc((100%/4) - 6.75px);
height: 17.485rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .b-pg a {
width: 100%;
height: 100%;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .b-pg figure {
width: 100%;
height: 100%;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .b-pg figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
/* hover image */
.sc--program-img-bg-f .box--bg-pgf .list-pg .b-pg figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .b-pg:hover figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b3 {
height: 19.334rem;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b4 {
height: 14.36rem;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b3 {
height: 15.542rem;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b4 {
height: 11.516rem;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b3 {
width: calc((100%/3) - 6px);
height: 14.459rem;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b4 {
width: calc((100%/2) - 4.5px);
height: 21.969rem;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
/* half */
.sc--program-img-bg-f .box--bg-pgf .half-pgimg-bg-mb .size-b3 {
width: calc((100%/2) - 4.5px);
height: 21.969rem;
}
.sc--program-img-bg-f .box--bg-pgf .half-pgimg-bg-mb .size-b4 {
width: calc((100%/2) - 4.5px);
height: 21.969rem;
}
.sc--program-img-bg-f .box--bg-pgf .half-pgimg-bg-mb .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-img-bg-f .box--bg-pgf .half-pgimg-bg-mb .size-b4:nth-child(2n+0) {
margin-right: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-img-bg-f {
display: none;
}
.sc--program-img-bg-f.mg--t20 {
/* margin-top: 0; */
}
.sc--program-img-bg-f .container {
padding: 0;
}
.sc--program-img-bg-f .box--bg-pgf {
border-radius: 0;
padding: 12px 16px 5px 16px;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b3 {
width: 100%;
height: auto;
margin: 0px 0 9px 0px;
}
.sc--program-img-bg-f .box--bg-pgf .list-pg .size-b4 {
width: 100%;
height: auto;
margin: 0px 0 9px 0px;
}
/* half */
.sc--program-img-bg-f .box--bg-pgf .half-pgimg-bg-mb .size-b3 {
width: calc((100%/2) - 4.5px);
height: 12.094rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg-f .box--bg-pgf .half-pgimg-bg-mb .size-b4 {
width: calc((100%/2) - 4.5px);
height: 12.094rem;
margin: 0px 9px 9px 0px;
}
.sc--program-img-bg-f .box--bg-pgf .half-pgimg-bg-mb .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-img-bg-f .box--bg-pgf .half-pgimg-bg-mb .size-b4:nth-child(2n+0) {
margin-right: 0;
}
}
/* ================= country not background ================= */
.sc--country-nbg-sprlr {
position: relative;
width: 100%;
height: auto;
}
.sc--country-nbg-sprlr .box--not-bg-ct {
position: relative;
width: 100%;
height: auto;
padding: 0;
}
.sc--country-nbg-sprlr .box--not-bg-ct .b--title {
position: relative;
width: 100%;
height: auto;
padding: 7px 10px 5px 10px;
margin-bottom: 10px;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--country-nbg-sprlr .box--not-bg-ct .b--title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--country-nbg-sprlr .box--not-bg-ct .b--lines-ct-list {
position: relative;
width: 100%;
height: auto;
padding: 3px;
border-radius: 5px;
border: 1px solid var(--color-grey2);
overflow: hidden;
display: flex;
justify-content: stretch;
align-items: center;
margin-bottom: 10px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
cursor: pointer;
}
.sc--country-nbg-sprlr .box--not-bg-ct .b--lines-ct-list:last-child {
margin-bottom: 0;
}
.sc--country-nbg-sprlr .box--not-bg-ct .b--lines-ct-list:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--country-nbg-sprlr .box--not-bg-ct .b--lines-ct-list a {
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
align-items: center;
}
.sc--country-nbg-sprlr .box--not-bg-ct .b--lines-ct-list .img--l {
position: relative;
/* width: 3.13rem; */
width: 2rem;
height: auto;
}
.sc--country-nbg-sprlr .box--not-bg-ct .b--lines-ct-list .img--l figure {
width: 100%;
height: 100%;
}
.sc--country-nbg-sprlr .box--not-bg-ct .b--lines-ct-list .img--l figure .size-img-ct {
position: relative;
width: 100%;
height: auto;
/* object-fit: cover; */
}
.sc--country-nbg-sprlr .box--not-bg-ct .b--lines-ct-list .txt--r {
position: relative;
width: calc(100% - 2rem);
height: auto;
padding: 7px 5px 5px 5px;
}
.sc--country-nbg-sprlr .box--not-bg-ct .b--lines-ct-list .txt--r p {
font-size: 0.94rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--country-nbg-sprlr .box--not-bg-ct .b--lines-ct-list:hover .txt--r p {
color: var(--color-first);
transition: all 0.3s ease;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.sc--country-nbg-sprlr {
width: auto;
margin: 16px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--country-nbg-sprlr {
width: auto;
margin: 16px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--country-nbg-sprlr {
padding: 0 16px;
}
}
/* ================= banner menu ================= */
.sc--banner-mn-sprlr {
position: relative;
width: 100%;
height: auto;
}
.sc--banner-mn-sprlr .box--bn-mn {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
/* border: 1px solid var(--color-grey3); */
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
margin-bottom: 6px;
cursor: pointer;
}
.sc--banner-mn-sprlr .box--bn-mn a {
width: 100%;
height: 100%;
}
.sc--banner-mn-sprlr .box--bn-mn figure {
width: 100%;
height: 100%;
}
.sc--banner-mn-sprlr .box--bn-mn figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.sc--banner-mn-sprlr .box--bn-mn .name--mn {
position: absolute;
width: 100%;
height: 100%;
top: 0;
padding: 8px;
background-color: rgba(var(--color-dark-rgb), 0.45);
display: grid;
align-items: center;
}
.sc--banner-mn-sprlr .box--bn-mn .name--mn p {
font-size: 1.25rem;
color: var(--color-light);
text-align: center;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
/* hover image */
.sc--banner-mn-sprlr .box--bn-mn figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--banner-mn-sprlr .box--bn-mn:hover figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--banner-mn-sprlr .box--bn-mn:last-child {
margin-bottom: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--banner-mn-sprlr {
width: auto;
margin: 0;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--banner-mn-sprlr .box--bn-mn {
width: calc((100%/3) - 6px);
margin: 0 9px 9px 0;
}
.sc--banner-mn-sprlr .box--bn-mn:nth-child(3n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--banner-mn-sprlr {
width: auto;
margin: 0 16px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--banner-mn-sprlr .box--bn-mn {
width: calc((100%/3) - 6px);
margin: 0 9px 9px 0;
}
.sc--banner-mn-sprlr .box--bn-mn:nth-child(3n+0) {
margin-right: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--banner-mn-sprlr {
width: auto;
margin: 0 16px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
display: none;
}
.sc--banner-mn-sprlr .box--bn-mn {
width: calc((100%/3) - 6px);
margin: 0 9px 9px 0;
}
.sc--banner-mn-sprlr .box--bn-mn:nth-child(3n+0) {
margin-right: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--banner-mn-sprlr {
padding: 0 16px;
display: none;
}
.sc--banner-mn-sprlr .box--bn-mn:last-child {
margin-bottom: 0;
}
}
/* ================= program column bg size 3 - 4 ================= */
.sc--program-cl-sprlr-bg-lr {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg {
position: relative;
width: 100%;
height: auto;
padding: 12px 12px 3px 12px;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 10px 10px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .title-pg p {
font-size: 1.25rem;
font-weight: bold;
/* text-align: center; */
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg {
position: relative;
border: 1px solid var(--color-grey4);
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size3-box-pg {
width: calc((100%/3) - 6px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg {
width: calc((100%/4) - 6.75px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg a {
width: 100%;
height: 100%;
/* display: flex;
flex-flow: column nowrap; */
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-img {
position: relative;
width: 100%;
overflow: hidden;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size3-box-pg .b-img {
height: 17.155rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg .b-img {
height: 12.696rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-img figure {
width: 100%;
height: 100%;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-name-pg {
width: 100%;
height: 4.25rem;
/* height: auto; */
padding: 10px 6px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-name-pg p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg:hover .b-dt-smb .b-name-pg p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg {
width: 100%;
height: auto;
margin-top: auto;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg {
width: 100%;
height: auto;
padding: 10px 6px;
border-top: 1px dashed var(--color-grey3);
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p {
font-size: 0.88rem;
font-weight: normal;
text-align: center;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .dt-pg p {
font-size: 0.82rem;
font-weight: normal;
text-align: center;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p span {
color: var(--color-txtg4);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p .pd-ic-r {
padding-right: 3px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p .sprt-txt {
padding: 0 5px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p i {
color: var(--color-icon-yl);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l {
position: relative;
width: 50%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .img-al-l {
position: relative;
width: 40%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure {
position: relative;
width: 80%;
height: auto;
position: relative;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r {
position: relative;
width: 50%;
height: auto;
padding: 8px 10px 8px 6px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r {
position: relative;
width: 60%;
height: auto;
padding: 8px 10px 8px 6px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
text-align: right;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r p {
font-size: 0.84rem;
font-weight: normal;
color: var(--color-txtg4);
text-align: right;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.88rem;
font-weight: bold;
text-align: right;
color: var(--color-red);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.44rem;
font-weight: bold;
text-align: right;
color: var(--color-red);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 .icon-crc {
display: none;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 .txt-crc {
display: none;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r .txt-start {
margin-bottom: -5px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r .txt-currency {
margin-top: -8px;
}
/* hover image */
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size3-box-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size3-box-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size3-box-pg .b-img {
height: 19.209rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg .b-img {
height: 14.235rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-cl-sprlr-bg-lr {
width: auto;
margin: 0 16px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg {
width: calc((100%/3) - 6px);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size3-box-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size3-box-pg .b-img {
height: 15.417rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg .b-img {
height: 15.417rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-name-pg {
padding: 10px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure {
width: 60%;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r p {
font-size: 0.84rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.44rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-cl-sprlr-bg-lr {
width: auto;
margin: 0 16px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size3-box-pg {
width: calc((100%/2) - 4.5px);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg {
width: calc((100%/2) - 4.5px);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size3-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size3-box-pg .b-img {
height: 21.844rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg .b-img {
height: 21.844rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-name-pg {
padding: 10px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure {
width: 60%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-cl-sprlr-bg-lr.mg--t20 {
margin: 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg {
border-radius: 0;
padding: 12px 16px 16px 16px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 10px 5px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size3-box-pg {
width: 100%;
margin-right: 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg {
width: 100%;
margin-right: 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size3-box-pg .b-img {
height: auto;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg .b-img {
height: auto;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-name-pg {
height: auto;
padding: 10px 12px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg {
padding: 10px 12px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l {
padding: 8px 6px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .img-al-l {
width: 50%;
padding: 8px 6px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure {
width: 55%;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r {
padding: 8px 12px 8px 6px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r {
width: 50%;
}
/* half */
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .size3-box-pg {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .size4-box-pg {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .size3-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .size4-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .size3-box-pg .b-img {
height: 11.969rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .size4-box-pg .b-img {
height: 11.969rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-name-pg {
height: 4.125rem;
padding: 10px 6px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-name-pg p {
font-size: 0.94rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg {
padding: 10px 6px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p {
font-size: 0.82rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l {
width: 45%;
padding: 8px 6px 8px 6px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .img-al-l {
width: 45%;
padding: 8px 6px 8px 6px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure {
width: 85%;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r {
width: 55%;
padding: 8px 10px 8px 6px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r {
width: 55%;
padding: 8px 10px 8px 6px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r p {
font-size: 0.75rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r p {
font-size: 0.75rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.25rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .half-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.25rem;
}
/* row */
.dp-none-txt-row-pg {
display: none;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg {
display: flex;
justify-content: stretch;
max-height: 8.563rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .size3-box-pg {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .size4-box-pg {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg a {
display: flex;
justify-content: stretch;
max-height: 8.438rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-img {
width: 8.438rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .size3-box-pg .b-img {
height: 8.438rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .size4-box-pg .b-img {
height: 8.438rem;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb {
width: calc(100% - 8.438rem);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-name-pg {
height: 3.5rem;
padding: 5px 10px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-name-pg p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg {
padding: 5px 10px;
display: flex;
justify-content: stretch;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p {
font-size: 0.75rem;
padding: 0 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .dt-pg p {
font-size: 0.75rem;
padding: 0 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price {
padding: 5px 10px;
align-items: end;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l {
width: 35%;
padding: 0 5px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .img-al-l {
width: 35%;
padding: 0 5px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure {
width: 80%;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r {
width: 65%;
padding: 0 5px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r {
width: 65%;
padding: 0 5px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.25rem;
margin-bottom: -5px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.25rem;
margin-bottom: -5px;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 span {
display: inline-block;
font-weight: normal;
color: var(--color-txtg4);
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 .icon-crc {
padding-right: 2px;
font-size: 0.94rem;
display: inline-block;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 .txt-crc {
padding-left: 2px;
font-size: 0.82rem;
display: inline-block;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r .txt-start {
display: none;
}
.sc--program-cl-sprlr-bg-lr .box--bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r .txt-currency {
display: none;
}
}
/* ================= program column not bg size 3 - 4 ================= */
.sc--program-cl-sprlr-lr {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 13px 10px 10px 10px;
margin-bottom: 10px;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .title-pg p {
font-size: 1.25rem;
font-weight: bold;
/* text-align: center; */
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg {
position: relative;
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg {
width: calc((100%/3) - 6px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg {
width: calc((100%/4) - 6.75px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg a {
width: 100%;
height: 100%;
/* display: flex;
flex-flow: column nowrap; */
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-img {
position: relative;
width: 100%;
overflow: hidden;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg .b-img {
height: 17.573rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg .b-img {
height: 13.008rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-img figure {
width: 100%;
height: 100%;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-name-pg {
width: 100%;
height: 4.25rem;
/* height: auto; */
padding: 10px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-name-pg p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg:hover .b-dt-smb .b-name-pg p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg {
width: 100%;
height: auto;
margin-top: auto;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg {
width: 100%;
height: auto;
padding: 10px 6px;
border-top: 1px dashed var(--color-grey3);
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p {
font-size: 0.88rem;
font-weight: normal;
text-align: center;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .dt-pg p {
font-size: 0.82rem;
font-weight: normal;
text-align: center;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p span {
color: var(--color-txtg4);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p .pd-ic-r {
padding-right: 3px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p .sprt-txt {
padding: 0 5px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p i {
color: var(--color-icon-yl);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l {
position: relative;
width: 50%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .img-al-l {
position: relative;
width: 40%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure {
position: relative;
width: 80%;
height: auto;
position: relative;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r {
position: relative;
width: 50%;
height: auto;
padding: 8px 10px 8px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r {
position: relative;
width: 60%;
height: auto;
padding: 8px 10px 8px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
text-align: right;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r p {
font-size: 0.82rem;
font-weight: normal;
color: var(--color-txtg4);
text-align: right;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.88rem;
font-weight: bold;
text-align: right;
color: var(--color-red);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-p .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.44rem;
font-weight: bold;
text-align: right;
color: var(--color-red);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 .icon-crc {
display: none;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 .txt-crc {
display: none;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r .txt-start {
margin-bottom: -5px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r .txt-currency {
margin-top: -8px;
}
/* hover image */
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg .b-img {
height: 19.709rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg .b-img {
height: 14.61rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-cl-sprlr-lr {
width: auto;
margin: 0 16px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg {
width: calc((100%/3) - 6px);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg .b-img {
height: 15.917rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg .b-img {
height: 15.917rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure {
width: 60%;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r p {
font-size: 0.82rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.44rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-cl-sprlr-lr {
width: auto;
margin: 0 16px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg {
width: calc((100%/2) - 4.5px);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg {
width: calc((100%/2) - 4.5px);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg .b-img {
height: 21.844rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg .b-img {
height: 21.844rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-name-pg {
padding: 10px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure {
width: 60%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-cl-sprlr-lr .box--not-bg-pg {
padding: 5px 16px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg {
width: 100%;
margin: 0 0 9px 0;
}
/* .sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg:last-child {
margin: 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg:last-child {
margin: 0;
} */
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size3-box-pg .b-img {
height: auto;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg .b-img {
height: auto;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-name-pg {
height: auto;
padding: 10px 12px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg {
padding: 10px 12px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l {
padding: 8px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .img-al-l {
width: 50%;
padding: 8px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure {
width: 55%;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r {
padding: 8px 12px 8px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r {
width: 50%;
padding: 8px 12px 8px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r p {
font-size: 0.84rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r p {
font-size: 0.84rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.44rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .box--list-pg .size4-box-p .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.44rem;
}
/* half */
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .size3-box-pg {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .size4-box-pg {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .size3-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .size4-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .size3-box-pg .b-img {
height: auto;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .size4-box-pg .b-img {
height: auto;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-name-pg {
height: 4.125rem;
padding: 10px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-name-pg p {
font-size: 0.94rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg {
padding: 10px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p {
font-size: 0.82rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .dt-pg p {
font-size: 0.82rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l {
width: 45%;
padding: 8px 6px 8px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .img-al-l {
width: 45%;
padding: 8px 6px 8px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure {
width: 85%;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r {
width: 55%;
padding: 8px 10px 8px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r {
width: 55%;
padding: 8px 10px 8px 6px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r p {
font-size: 0.75rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r p {
font-size: 0.75rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.25rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .half-box-list-pg .size4-box-p .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.25rem;
}
/* row */
.dp-none-txt-row-nbg-pg {
display: none;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg {
display: flex;
justify-content: stretch;
max-height: 8.563rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .size3-box-pg {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .size4-box-pg {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg a {
display: flex;
justify-content: stretch;
max-height: 8.438rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-img {
width: 8.438rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .size3-box-pg .b-img {
height: 8.438rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .size4-box-pg .b-img {
height: 8.438rem;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb {
width: calc(100% - 8.438rem);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-name-pg {
height: 3.5rem;
padding: 5px 10px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-name-pg p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg {
padding: 5px 10px;
display: flex;
justify-content: stretch;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .dt-pg p {
font-size: 0.75rem;
padding: 0 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .dt-pg p {
font-size: 0.75rem;
padding: 0 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price {
padding: 5px 10px;
align-items: end;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l {
width: 35%;
padding: 0 5px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .img-al-l {
width: 35%;
padding: 0 5px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .img-al-l figure {
width: 80%;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r {
width: 65%;
padding: 0 5px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .size4-box-pg .b-dt-smb .b-dtpg .al-price .price-r {
width: 65%;
padding: 0 5px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.25rem;
margin-bottom: -5px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .size4-box-p .b-dt-smb .b-dtpg .al-price .price-r h1 {
font-size: 1.25rem;
margin-bottom: -5px;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 span {
display: inline-block;
font-weight: normal;
color: var(--color-txtg4);
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 .icon-crc {
padding-right: 2px;
font-size: 0.94rem;
display: inline-block;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r h1 .txt-crc {
padding-left: 2px;
font-size: 0.82rem;
display: inline-block;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r .txt-start {
display: none;
}
.sc--program-cl-sprlr-lr .box--not-bg-pg .row-box-list-pg .box-one-lpg .b-dt-smb .b-dtpg .al-price .price-r .txt-currency {
display: none;
}
}
/* ================= program image and name ================= */
.sc--program-imgadn-sprlr-lr {
position: relative;
width: 100%;
height: auto;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn {
position: relative;
width: 100%;
height: auto;
padding: 12px 12px 3px 12px;
border-radius: 5px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
overflow: hidden;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 0 0 10px 10px;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .title-pg p {
font-size: 1.25rem;
font-weight: bold;
/* text-align: center; */
color: var(--color-light);
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .bg--imgn {
position: relative;
height: auto;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
border: 1px solid var(--color-grey4);
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size3-box-pg {
width: calc((100%/3) - 6px);
margin: 0 9px 9px 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size4-box-pg {
width: calc((100%/4) - 6.75px);
margin: 0 9px 9px 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .bg--imgn:hover {
border: 1px solid var(--color-light);
transition: all 0.3s ease;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .bg--imgn a {
position: relative;
width: 100%;
height: 100%;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .bg--imgn figure {
position: relative;
width: 100%;
overflow: hidden;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size3-box-pg figure {
height: 17.155rem;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size4-box-pg figure {
height: 12.696rem;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .bg--imgn figure .size--img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .bg--imgn .name-pgn {
position: relative;
width: 100%;
height: auto;
padding: 10px 10px 5px 10px;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .bg--imgn .name-pgn p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .bg--imgn:hover .name-pgn p {
color: var(--color-first);
transition: all 0.3s ease;
}
/* hover image */
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .bg--imgn figure .size--img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .bg--imgn:hover figure .size--img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size3-box-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size4-box-pg:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size3-box-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size4-box-pg:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size3-box-pg figure {
height: 19.209rem;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size4-box-pg figure {
height: 14.235rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-imgadn-sprlr-lr {
width: auto;
margin: 0 16px;
}
.sc--program-imgadn-sprlr-lr.mg--t20 {
margin-top: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size3-box-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size4-box-pg:nth-child(4n+0) {
margin-right: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size3-box-pg figure {
height: 15.417rem;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size4-box-pg figure {
height: 11.391rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-imgadn-sprlr-lr {
width: auto;
margin: 0 16px;
}
.sc--program-imgadn-sprlr-lr.mg--t20 {
margin-top: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size4-box-pg {
width: calc((100%/2) - 4.5px);
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size3-box-pg:nth-child(3n+0) {
margin-right: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size4-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size3-box-pg figure {
height: 14.334rem;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size4-box-pg figure {
height: 21.844rem;
}
/* row */
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .bg--imgn {
display: flex;
justify-content: stretch;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .size3-box-pg {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .size4-box-pg {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .size3-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .size4-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .bg--imgn a {
display: flex;
justify-content: stretch;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .size3-box-pg figure {
width: 9rem;
height: 9rem;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .size4-box-pg figure {
width: 9rem;
height: 9rem;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .bg--imgn .name-pgn {
width: calc(100% - 9rem);
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .bg--imgn .name-pgn p {
font-size: 1rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-imgadn-sprlr-lr.mg--t20 {
/* margin-top: 0; */
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn {
border-radius: 0;
padding: 12px 16px 5px 16px;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .title-pg {
padding: 0 0 10px 5px;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size3-box-pg {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size4-box-pg {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size3-box-pg figure {
height: auto;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .size4-box-pg figure {
height: auto;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .box-list-pgn .bg--imgn .name-pgn {
padding: 10px 12px 5px 12px;
}
/* half */
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .half-box-list-pgn {
position: relative;
width: 100%;
height: auto;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .half-box-list-pgn .size3-box-pg {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .half-box-list-pgn .size4-box-pg {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .half-box-list-pgn .size3-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .half-box-list-pgn .size4-box-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .half-box-list-pgn .size3-box-pg figure {
height: 11.969rem;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .half-box-list-pgn .size4-box-pg figure {
height: 11.969rem;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .half-box-list-pgn .bg--imgn .name-pgn p {
font-size: 0.94rem;
}
/* row */
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn {
position: relative;
width: 100%;
height: auto;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .bg--imgn {
display: flex;
justify-content: stretch;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .size3-box-pg {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .size4-box-pg {
width: 100%;
margin: 0 0 9px 0;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .bg--imgn a {
display: flex;
justify-content: stretch;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .size3-box-pg figure {
width: 8.438rem;
height: 8.438rem;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .size4-box-pg figure {
width: 8.438rem;
height: 8.438rem;
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .bg--imgn .name-pgn {
width: calc(100% - 8.438rem);
}
.sc--program-imgadn-sprlr-lr .box--bg-pg-imgn .row-box-list-pgn .bg--imgn .name-pgn p {
font-size: 0.94rem;
}
}
/* ================= program image and name price ================= */
.sc--program-r-npri-sprlr {
position: relative;
width: 100%;
height: auto;
}
.hg100-max-wfab-box-hf {
height: 100%;
max-height: -webkit-fill-available;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri {
position: relative;
width: 100%;
height: auto;
padding: 12px 10px 10px 10px;
border-radius: 5px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
overflow: hidden;
}
.sc--program-r-npri-sprlr .hg-inherit-box-bg-r-hf {
height: inherit;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 0 0 10px 10px;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .title-pg p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-light);
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn {
position: relative;
width: 100%;
height: auto;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
display: flex;
margin-bottom: 10px;
border: 1px solid var(--color-grey4);
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri:hover {
border: 1px solid var(--color-light);
transition: all 0.3s ease;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri a {
position: relative;
width: 100%;
height: 100%;
display: flex;
justify-content: stretch;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-img {
position: relative;
width: 6.6rem;
height: 6.6rem;
overflow: hidden;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-img figure {
position: relative;
width: 100%;
height: 100%;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-dt {
position: relative;
width: calc(100% - 6.6rem);
height: auto;
padding: 6px 10px 3px 10px;
display: flex;
flex-flow: column nowrap;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-dt p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri:hover .b-dt p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-dt h1 {
font-size: 1.32rem;
font-weight: bold;
margin-top: auto;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-dt h1 span {
color: var(--color-red);
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-dt h1 .txt-currency {
font-size: 0.82rem;
font-weight: normal;
color: var(--color-txtg4);
padding-left: 2px;
}
/* hover image */
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri:last-child {
margin-bottom: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri {
width: calc((100%/2) - 4.5px);
margin-right: 9px;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-img {
width: 9rem;
height: 9rem;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-dt {
width: calc(100% - 9rem);
}
/* .sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri:last-child {
margin-bottom: 0;
} */
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-r-npri-sprlr {
width: auto;
margin: 16px;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri {
width: calc((100%/2) - 4.5px);
margin-right: 9px;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-img {
width: 9rem;
height: 9rem;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-dt {
width: calc(100% - 9rem);
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-r-npri-sprlr {
width: auto;
margin: 16px;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri {
width: calc((100%/2) - 4.5px);
margin-right: 9px;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-img {
width: 9rem;
height: 9rem;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-dt {
width: calc(100% - 9rem);
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--program-r-npri-sprlr .box-bg-pg-rnpri {
border-radius: 0;
padding: 12px 16px 16px 16px;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri:last-child {
margin-bottom: 0;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-img {
width: 8rem;
height: 8rem;
}
.sc--program-r-npri-sprlr .box-bg-pg-rnpri .box-list-pgn .bg--pg-rnpri .b-dt {
width: calc(100% - 8rem);
}
}
/* ================= program row bg ================= */
.sc--program-row-sprlr-bg-lr {
position: relative;
width: 100%;
height: auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg {
position: relative;
width: 100%;
height: auto;
padding: 12px 10px 18px 10px;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 10px 10px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .title-pg p {
font-size: 1rem;
font-weight: normal;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .title-pg p span {
color: var(--color-txtg5);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .title-pg p .focus-ct {
color: var(--color-first);
font-weight: bold;
padding: 0 3px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg {
position: relative;
width: 100%;
height: auto;
/* max-height: 14.125rem; */
border: 1px solid var(--color-grey4);
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
/* cursor: pointer; */
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
/* .sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
} */
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg a {
position: relative;
width: 100%;
height: 100%;
max-height: 14rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-img {
position: relative;
width: 14rem;
height: 14rem;
overflow: hidden;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-img figure {
width: 100%;
height: 100%;
max-height: 14rem;
overflow: hidden;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details {
position: relative;
width: calc(100% - 14rem);
height: fit-content;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 14px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-name {
position: relative;
width: 100%;
height: auto;
padding: 10px 0;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-name p {
font-size: 1rem;
font-weight: bold;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-name p:hover {
color: var(--color-first);
transition: all 0.3s ease;
}
/* .sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg:hover .b-details .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
} */
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt {
position: relative;
height: auto;
padding: 10px;
display: grid;
align-items: center;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt p span {
color: var(--color-txtg4);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt p .pd-ic-r {
padding-right: 3px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt p span i {
color: var(--color-icon-yl);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .sb-dt1 {
width: 32%;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .sb-dt2 {
width: 38%;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline {
position: relative;
width: 30%;
height: auto;
padding: 10px 0 10px 10px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline figure {
width: 100%;
height: 3.5rem;
display: flex;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline figure .size-img {
position: relative;
width: auto;
height: 100%;
margin: 0 auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-shoetdt {
position: relative;
width: 65%;
height: auto;
padding: 10px;
margin-top: auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-shoetdt p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg5);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price {
position: relative;
width: 35%;
height: auto;
display: flex;
justify-content: stretch;
padding: 10px 0 10px 10px;
align-items: end;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-full-price {
position: relative;
width: 33%;
height: auto;
padding-right: 5px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-full-price p {
font-size: 0.75rem;
color: var(--color-txtg4);
text-align: right;
text-decoration: line-through;
/* text-decoration-color: var(--color-red); */
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price {
position: relative;
width: 67%;
height: auto;
padding-left: 5px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price .txt-startprice {
font-size: 0.75rem;
color: var(--color-txtg4);
margin-bottom: -5px;
}
/* .sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p {
font-size: 0.75rem;
color: var(--color-txtg4);
margin-bottom: -5px;
} */
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 {
font-size: 1.44rem;
font-weight: bold;
color: var(--color-red);
margin-bottom: -5px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 span {
color: var(--color-red);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 .txt-currency {
font-size: 0.75rem;
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
}
/* hover image */
/* .sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-img figure .size-img { */
.b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
/* .sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg:hover .b-img figure .size-img { */
.b-img:hover figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-row-sprlr-bg-lr {
width: auto;
margin: 0 16px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg {
padding: 12px 10px 10px 10px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline figure {
height: 3.2rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-shoetdt {
width: 60%;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price {
width: 40%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-row-sprlr-bg-lr {
width: auto;
margin: 0 16px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-name {
height: 4.625rem;
padding: 16px 0 10px 0;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-name p {
white-space: wrap;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .sb-dt1 {
width: 50%;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .sb-dt2 {
width: 50%;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline {
width: 50%;
padding: 10px 0 10px 10px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline figure .size-img {
margin: 0;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-shoetdt {
display: none;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price {
width: 50%;
padding: 10px 0 10px 10px;
}
/* column */
/* .sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-dt .dp-none-txt-start-pbg,
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-dt .dp-none-txt-start-pbg {
display: none;
} */
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-dt .dp-none-txt-country-bg,
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-dt .dp-none-txt-country-bg {
display: none;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg {
max-height: initial;
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg a {
max-height: initial;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-img {
width: 100%;
height: 21.969rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-img figure {
max-height: initial;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details {
width: 100%;
padding: 0;
align-items: end;
justify-content: space-between;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-name {
padding: 10px 12px;
height: 4.625rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
color: var(--color-txtg);
white-space: wrap;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-dt {
display: block;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .sb-dt1 {
width: 100%;
padding: 5px 10px 2px 10px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .sb-dt2 {
width: 100%;
padding: 2px 10px 5px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-dt p {
font-size: 0.82rem;
font-weight: normal;
text-align: center;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-airline {
width: 40%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-airline figure {
width: 65%;
margin: 0 auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price {
width: 60%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price {
width: auto;
padding-right: 10px;
margin-bottom: 0;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price p {
font-size: 0.84rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price {
width: auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p {
font-size: 0.84rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 {
font-size: 1.44rem;
text-align: left;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 .txt-currency {
font-size: 0.84rem;
}
/* column half */
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg {
max-height: initial;
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg a {
height: fit-content;
max-height: initial;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-img {
width: 100%;
height: 21.969rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-img figure {
max-height: initial;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details {
width: 100%;
padding: 0;
align-items: center;
justify-content: space-between;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-name {
padding: 10px 12px;
height: 4.625rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-name p {
font-size: 1rem;
font-weight: normal;
color: var(--color-txtg);
white-space: wrap;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-dt {
display: block;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .sb-dt1 {
width: 100%;
padding: 5px 10px 2px 10px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .sb-dt2 {
width: 100%;
padding: 2px 10px 5px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-dt p {
font-size: 0.82rem;
font-weight: normal;
text-align: center;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-airline {
width: 40%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-airline figure {
width: 65%;
margin: 0 auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price {
width: 60%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price {
width: auto;
padding-right: 0;
/* margin-bottom: -5px; */
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price p {
font-size: 0.84rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price {
width: auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p {
font-size: 0.84rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 {
font-size: 1.44rem;
text-align: left;
/* display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row; */
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 .txt-currency {
font-size: 0.84rem;
/* margin-top: -10px; */
}
}
@media (min-width: 0px) and (max-width: 500px) {
.dp-none-txt-start-pbg {
display: none;
}
.dp-none-txt-country-bg {
display: none;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg {
border-radius: 0;
padding: 12px 16px 18px 16px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg {
max-height: 8.563rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg a {
max-height: 8.438rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-img {
width: 8.438rem;
height: 8.438rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-img figure {
max-height: 8.438rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details {
width: calc(100% - 8.438rem);
padding: 0;
align-items: flex-end;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-name {
padding: 5px 10px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt {
padding: 0;
display: flex;
justify-content: stretch;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .sb-dt1 {
width: 100%;
padding: 5px 10px 2px 10px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .sb-dt2 {
width: 100%;
padding: 2px 10px 5px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt p {
font-size: 0.75rem;
padding: 0 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-shoetdt {
display: none;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline {
width: 35%;
padding: 5px 5px 5px 15px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline figure {
width: 80%;
height: auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline figure .size-img {
width: 100%;
height: auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price {
width: 65%;
padding: 5px 15px 5px 5px;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-full-price {
width: 100%;
padding-right: 0;
margin-bottom: -5px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-full-price p {
font-size: 0.82rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price {
width: 100%;
padding-left: 0;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 {
font-size: 1.25rem;
text-align: right;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 .txt-currency {
padding-left: 2px;
font-size: 0.82rem;
}
/* column */
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg {
max-height: initial;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg a {
max-height: initial;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-img {
width: 100%;
height: auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-img figure {
max-height: initial;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details {
width: 100%;
align-items: end;
justify-content: space-between;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-name {
padding: 10px 12px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
color: var(--color-txtg);
white-space: wrap;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-dt {
display: block;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .sb-dt1 {
padding: 10px 12px 0 12px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .sb-dt2 {
padding: 0 12px 10px 12px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-dt p {
font-size: 0.82rem;
font-weight: normal;
text-align: center;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-airline {
width: 40%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-airline figure {
width: 65%;
margin: 0 auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price {
width: 60%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price {
width: auto;
padding-right: 10px;
margin-bottom: 0;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price p {
font-size: 0.84rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price {
width: auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p {
font-size: 0.84rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 {
font-size: 1.44rem;
text-align: left;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 .txt-currency {
font-size: 0.84rem;
}
/* column half */
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg {
max-height: initial;
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg a {
height: fit-content;
max-height: initial;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-img {
width: 100%;
height: 11.969rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-img figure {
max-height: initial;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details {
width: 100%;
align-items: center;
justify-content: space-between;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-name {
height: 3.625rem;
padding: 6px 12px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg);
white-space: wrap;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-dt {
display: block;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .sb-dt1 {
padding: 6px 12px 0 12px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .sb-dt2 {
padding: 0 12px 6px 12px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-dt p {
font-size: 0.75rem;
font-weight: normal;
text-align: center;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-airline {
width: 45%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-airline figure {
width: 85%;
margin: 0 auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price {
width: 55%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price {
width: 100%;
padding-right: 0;
margin-bottom: -5px;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price p {
font-size: 0.75rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price {
width: auto;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p {
font-size: 0.75rem;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 {
font-size: 1.25rem;
text-align: left;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-bg-lr .box-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 .txt-currency {
font-size: 0.75rem;
margin-top: -10px;
}
}
/* ================= program row ================= */
.sc--program-row-sprlr-lr {
position: relative;
width: 100%;
height: auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 13px 10px 10px 15px;
margin-bottom: 10px;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .title-pg p {
font-size: 1rem;
font-weight: normal;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .title-pg p span {
color: var(--color-txtg5);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .title-pg p .focus-ct {
color: var(--color-first);
font-weight: bold;
padding: 0 3px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg {
position: relative;
width: 100%;
height: auto;
/* max-height: 14.125rem; */
border: 1px solid var(--color-grey3);
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
/* cursor: pointer; */
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
/* .sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg:last-child {
margin-bottom: 0;
} */
/* .sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
} */
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg a {
position: relative;
width: 100%;
height: 100%;
max-height: 14rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-img {
position: relative;
width: 14rem;
height: 14rem;
overflow: hidden;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-img figure {
width: 100%;
height: 100%;
max-height: 14rem;
overflow: hidden;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details {
position: relative;
width: calc(100% - 14rem);
height: fit-content;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 14px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-name {
position: relative;
width: 100%;
height: auto;
padding: 10px 0;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-name p {
font-size: 1rem;
font-weight: bold;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-name p:hover {
color: var(--color-first);
transition: all 0.3s ease;
}
/* .sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg:hover .b-details .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
} */
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt {
position: relative;
height: auto;
padding: 10px;
display: grid;
align-items: center;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt p span {
color: var(--color-txtg4);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt p .pd-ic-r {
padding-right: 3px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt p span i {
color: var(--color-icon-yl);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt p .color-txt--hs {
color: var(--color-first);
font-weight: bold;
text-decoration: underline;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .sb-dt1 {
width: 28%;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .sb-dt2 {
width: 42%;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline {
position: relative;
width: 30%;
height: auto;
padding: 10px 0 10px 10px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline figure {
width: 100%;
height: 3.5rem;
display: flex;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline figure .size-img {
position: relative;
width: auto;
height: 100%;
margin: 0 auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-shoetdt {
position: relative;
width: 65%;
height: auto;
padding: 10px;
margin-top: auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-shoetdt p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg5);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price {
position: relative;
width: 35%;
height: auto;
display: flex;
justify-content: stretch;
padding: 10px 0 10px 10px;
align-items: end;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-full-price {
position: relative;
width: 33%;
height: auto;
padding-right: 5px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-full-price p {
font-size: 0.88rem;
color: var(--color-txtg4);
text-align: right;
text-decoration: line-through;
/* text-decoration-color: var(--color-red); */
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price {
position: relative;
width: 67%;
height: auto;
padding-left: 5px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p {
font-size: 0.88rem;
color: var(--color-txtg4);
margin-bottom: -5px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price .txt-startprice {
font-size: 0.88rem;
color: var(--color-txtg4);
margin-bottom: -5px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 {
font-size: 1.44rem;
font-weight: bold;
color: var(--color-red);
margin-bottom: -5px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 span {
color: var(--color-red);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 .txt-currency {
font-size: 0.88rem;
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
}
/* .sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p {
font-size: 1.44rem;
font-weight: bold;
color: var(--color-red);
margin-bottom: -5px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p span {
color: var(--color-red);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p .txt-currency {
font-size: 0.88rem;
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
} */
/* hover image */
/* .sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-img figure .size-img { */
.b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
/* .sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg:hover .b-img figure .size-img { */
.b-img:hover figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.sc--program-row-sprlr-lr {
width: auto;
margin: 0 16px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-shoetdt {
width: 60%;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price {
width: 40%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-row-sprlr-lr {
width: auto;
margin: 0 16px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-name {
height: 4.625rem;
padding: 16px 0 10px 0;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-name p {
white-space: wrap;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .sb-dt1 {
width: 50%;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .sb-dt2 {
width: 50%;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline {
width: 50%;
padding: 10px 0 10px 10px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline figure .size-img {
margin: 0;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-shoetdt {
display: none;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price {
width: 50%;
padding: 10px 0 10px 10px;
}
/* column */
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-dt .dp-none-txt-start-p,
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-dt .dp-none-txt-start-p {
display: none;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-dt .dp-none-txt-country,
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-dt .dp-none-txt-country {
display: none;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg {
max-height: initial;
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg a {
max-height: initial;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-img {
width: 100%;
height: 21.969rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-img figure {
max-height: initial;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details {
width: 100%;
padding: 0;
align-items: end;
justify-content: space-between;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-name {
padding: 16px 12px 10px 12px;
height: 4.625rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
color: var(--color-txtg);
white-space: wrap;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-dt {
display: block;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .sb-dt1 {
width: 100%;
padding: 5px 10px 2px 10px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .sb-dt2 {
width: 100%;
padding: 2px 10px 5px 10px;
border-bottom: 1px dashed var(--color-grey3);
display: flex;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-dt p {
font-size: 0.82rem;
font-weight: normal;
text-align: center;
width: 100%;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-airline {
width: 40%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-airline figure {
width: 65%;
margin: 0 auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price {
width: 60%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price {
width: auto;
padding-right: 10px;
margin-bottom: 0;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price p {
font-size: 0.84rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price {
width: auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p {
font-size: 0.84rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 {
font-size: 1.44rem;
text-align: left;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 .txt-currency {
font-size: 0.84rem;
}
/* column half */
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg {
max-height: initial;
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg a {
height: fit-content;
max-height: initial;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-img {
width: 100%;
height: 21.969rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-img figure {
max-height: initial;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details {
width: 100%;
padding: 0;
align-items: center;
justify-content: space-between;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-name {
padding: 10px 12px;
height: 4.625rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-name p {
font-size: 1rem;
font-weight: normal;
color: var(--color-txtg);
white-space: wrap;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-dt {
display: block;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .sb-dt1 {
width: 100%;
padding: 5px 10px 2px 10px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .sb-dt2 {
width: 100%;
padding: 2px 10px 5px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-dt p {
font-size: 0.82rem;
font-weight: normal;
text-align: center;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-airline {
width: 40%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-airline figure {
width: 65%;
margin: 0 auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price {
width: 60%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price {
width: auto;
padding-right: 0;
/* margin-bottom: -5px; */
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price p {
font-size: 0.84rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price {
width: auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p {
font-size: 0.84rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 {
font-size: 1.44rem;
text-align: left;
/* display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row; */
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 .txt-currency {
font-size: 0.84rem;
/* margin-top: -10px; */
}
}
@media (min-width: 0px) and (max-width: 500px) {
.dp-none-txt-start-p {
display: none;
}
.dp-none-txt-country {
display: none;
}
.sc--program-row-sprlr-lr .box--not-bg-pg {
padding: 0 16px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg {
max-height: 8.563rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg a {
max-height: 8.438rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-img {
width: 8.438rem;
height: 8.438rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-img figure {
max-height: 8.438rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details {
width: calc(100% - 8.438rem);
padding: 0;
align-items: flex-end;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-name {
padding: 5px 10px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt {
padding: 0;
display: flex;
justify-content: stretch;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .sb-dt1 {
width: 100%;
padding: 5px 10px 2px 10px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .sb-dt2 {
width: 100%;
padding: 2px 10px 5px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-dt p {
font-size: 0.75rem;
padding: 0 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-shoetdt {
display: none;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline {
width: 35%;
padding: 5px 5px 5px 15px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline figure {
width: 80%;
height: auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-airline figure .size-img {
width: 100%;
height: auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price {
width: 65%;
padding: 5px 15px 5px 5px;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-full-price {
width: 100%;
padding-right: 1.875rem;
margin-bottom: -5px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-full-price p {
font-size: 0.82rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price {
width: 100%;
padding-left: 0;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p {
font-size: 0.82rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 {
font-size: 1.25rem;
text-align: right;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 .txt-currency {
padding-left: 2px;
font-size: 0.82rem;
}
/* column */
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg {
max-height: initial;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg a {
max-height: initial;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-img {
width: 100%;
height: auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-img figure {
max-height: initial;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details {
width: 100%;
align-items: end;
justify-content: space-between;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-name {
padding: 16px 12px 10px 12px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
color: var(--color-txtg);
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-dt {
display: block;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .sb-dt1 {
padding: 10px 12px 0 12px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .sb-dt2 {
padding: 0 12px 10px 12px;
display: flex;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-dt p {
font-size: 0.82rem;
font-weight: normal;
text-align: center;
width: 100%;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-airline {
width: 40%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-airline figure {
width: 65%;
margin: 0 auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price {
width: 60%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price {
width: auto;
padding-right: 10px;
margin-bottom: 0;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price p {
font-size: 0.84rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price {
width: auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p {
font-size: 0.84rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 {
font-size: 1.44rem;
text-align: left;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 .txt-currency {
font-size: 0.84rem;
}
/* column half */
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg {
max-height: initial;
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg a {
height: fit-content;
max-height: initial;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-img {
width: 100%;
height: 11.969rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-img figure {
max-height: initial;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details {
width: 100%;
align-items: center;
justify-content: space-between;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-name {
height: 3.625rem;
padding: 6px 12px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg);
white-space: wrap;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-dt {
display: block;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .sb-dt1 {
padding: 6px 12px 0 12px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .sb-dt2 {
padding: 0 12px 6px 12px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-dt p {
font-size: 0.75rem;
font-weight: normal;
text-align: center;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-airline {
width: 45%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-airline figure {
width: 85%;
margin: 0 auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price {
width: 55%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price {
width: 100%;
padding-right: 0;
margin-bottom: -5px;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-full-price p {
font-size: 0.75rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price {
width: auto;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price p {
font-size: 0.75rem;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 {
font-size: 1.25rem;
text-align: left;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .column-half-box--list-pg .box--one-lpg .b-details .b-price .spr-net-price h1 .txt-currency {
font-size: 0.75rem;
margin-top: -10px;
}
}
@media (min-width: 0px) and (max-width: 991px) {
.sc--program-row-sprlr-lr {
margin-top: 16px;
}
}
/* ================= Image Slide ================= */
.sc--img-slider-lr {
position: relative;
width: 100%;
height: auto;
}
.sc--img-slider-height100-lr {
height: 100%;
}
.sc--img-slider-lr .box--imgslider {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--img-slider-lr .box--imgslider ul li a {
position: relative;
width: 100%;
height: 100%;
}
.sc--img-slider-lr .box--imgslider ul li figure {
position: relative;
width: 100%;
height: 100%;
}
.sc--img-slider-lr .box--imgslider ul li figure .size--imgsl {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--img-slider-lr .box--imgslider .box-btn-back-isl,
.sc--img-slider-lr .box--imgslider .box-btn-next-isl {
position: absolute;
width: 50px;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
}
.sc--img-slider-lr .box--imgslider .box-btn-back-isl i,
.sc--img-slider-lr .box--imgslider .box-btn-next-isl i {
font-size: 2rem;
color: var(--color-light);
}
.sc--img-slider-lr .box--imgslider .box-btn-back-isl:hover i,
.sc--img-slider-lr .box--imgslider .box-btn-next-isl:hover i {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--img-slider-lr .box--imgslider .box--dots {
position: absolute;
display: flex;
justify-content: center;
}
#isliderb2 {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
#isliderb2 #lineslisl2 {
position: absolute;
width: 100%;
height: 1px;
z-index: 1;
bottom: 0;
left: 0;
background-color: rgba(var(--color-first-rgb), 0.5);
}
@keyframes line {
0% {
width: 0%;
}
100% {
width: 100%;
}
}
ul#moveisl2 {
width: 100%;
height: auto;
display: flex;
background-color: var(--color-light);
}
ul#moveisl2 li {
position: relative;
width: 100%;
min-width: 100%;
display: flex;
justify-content: center;
align-items: center;
list-style-type: none;
transition: all 0.6s ease;
}
#isliderb2 #backisl2 {
top: 0;
bottom: 0;
left: 0;
}
#isliderb2 #nextisl2 {
top: 0;
bottom: 0;
right: 0;
}
#isliderb2 #dotsisl2 {
left: 0;
right: 0;
bottom: 10px;
}
#isliderb2 #dotsisl2 li {
transition: all 0.3s ease;
list-style-type: none;
width: 25px;
height: 6px;
border-radius: 100px;
background-color: rgba(var(--color-dark-rgb), 0.5);
margin: 0 0.2rem;
cursor: pointer;
}
#isliderb2 #dotsisl2 li:hover,
#isliderb2 #dotsisl2 li.active {
background-color: var(--color-first);
}
.sc--img-slider-lr .height100-imgslider {
height: inherit !important;
}
@media (min-width: 1900px) {
.sc--img-slider-lr .box--imgslider ul li figure {
height: 29rem;
max-height: 29rem;
}
.sc--img-slider-lr .height100-imgslider ul li figure {
height: 100%;
max-height: max-content;
}
}
@media (min-width: 1600px) and (max-width: 1899px) {
.sc--img-slider-lr .box--imgslider ul li figure {
height: 29rem;
max-height: 29rem;
}
.sc--img-slider-lr .height100-imgslider ul li figure {
height: 100%;
max-height: max-content;
}
}
@media (min-width: 1360px) and (max-width: 1599px) {
.sc--img-slider-lr .box--imgslider ul li figure {
height: 29rem;
max-height: 29rem;
}
.sc--img-slider-lr .height100-imgslider ul li figure {
height: 100%;
max-height: max-content;
}
}
@media (min-width: 1200px) and (max-width: 1359px) {
.sc--img-slider-lr .box--imgslider ul li figure {
height: 25rem;
max-height: 25rem;
}
.sc--img-slider-lr .height100-imgslider ul li figure {
height: 100%;
max-height: max-content;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--img-slider-lr .box--imgslider ul li figure {
height: 24rem;
max-height: 24rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--img-slider-lr .box--imgslider {
border-radius: 0;
}
.sc--img-slider-lr .box--imgslider ul li figure {
height: 23rem;
max-height: 23rem;
}
#isliderb2 #dotsisl2 {
bottom: 7px;
}
#isliderb2 #dotsisl2 li {
margin: 0 0.2rem;
width: 25px;
height: 6px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--img-slider-lr .box--imgslider {
border-radius: 0;
}
.sc--img-slider-lr .box--imgslider ul li figure {
height: 20rem;
max-height: 20rem;
}
#isliderb2 #dotsisl2 {
bottom: 5px;
}
#isliderb2 #dotsisl2 li {
margin: 0 0.2rem;
width: 20px;
height: 5px;
}
.sc--img-slider-lr .box--imgslider .box-btn-back-isl,
.sc--img-slider-lr .box--imgslider .box-btn-next-isl {
width: 40px;
}
.sc--img-slider-lr .box--imgslider .box-btn-back-isl i,
.sc--img-slider-lr .box--imgslider .box-btn-next-isl i {
font-size: 1.8rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--img-slider-lr .box--imgslider {
border-radius: 0;
}
.sc--img-slider-lr .box--imgslider ul li figure {
height: 12rem;
max-height: 12rem;
}
#isliderb2 #dotsisl2 {
bottom: 5px;
}
#isliderb2 #dotsisl2 li {
margin: 0 0.2rem;
width: 20px;
height: 5px;
}
.sc--img-slider-lr .box--imgslider .box-btn-back-isl,
.sc--img-slider-lr .box--imgslider .box-btn-next-isl {
width: 30px;
}
.sc--img-slider-lr .box--imgslider .box-btn-back-isl i,
.sc--img-slider-lr .box--imgslider .box-btn-next-isl i {
font-size: 1.3rem;
}
}
/* ================= article and card size 3 - 4 bg ================= */
.sc--article-card-bg-f {
position: relative;
width: 100%;
height: auto;
}
.sc--article-card-bg-f .box-atcf {
position: relative;
width: 100%;
height: auto;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
border-radius: 5px;
overflow: hidden;
padding: 12px 12px 3px 12px;
}
.sc--article-card-bg-f .box-atcf .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 10px 16px;
}
.sc--article-card-bg-f .box-atcf .title-pg p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--article-card-bg-f .box-atcf .list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg {
position: relative;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b3 {
width: calc((100%/3) - 6px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4 {
width: calc((100%/4) - 6.75px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg a {
width: 100%;
height: 100%;
display: flex;
flex-flow: column nowrap;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-img {
position: relative;
width: 100%;
height: 15.475rem;
overflow: hidden;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4 .b-img {
position: relative;
width: 100%;
height: 11.493rem;
overflow: hidden;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-img figure {
width: 100%;
height: 100%;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta {
position: relative;
width: 100%;
height: auto;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-name {
position: relative;
width: 100%;
height: auto;
padding: 10px;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg:hover .b-dta .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail {
position: relative;
width: 100%;
height: auto;
margin-top: auto;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .dt {
position: relative;
width: 100%;
height: auto;
padding: 10px;
border-top: 1px dashed var(--color-grey3);
border-bottom: 1px dashed var(--color-grey3);
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .dt p {
font-size: 0.88rem;
font-weight: normal;
text-align: center;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .dt p span {
color: var(--color-txtg4);
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .dt p i {
color: var(--color-icon-yl);
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .dt p .pd-ic-r {
padding-right: 3px;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .dt p .sprt-txt {
padding: 0 5px;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price {
position: relative;
width: 100%;
height: auto;
padding: 10px;
display: flex;
justify-content: stretch;
align-items: center;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l {
position: relative;
width: 50%;
height: auto;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 1rem;
font-weight: normal;
color: var(--color-green);
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r {
position: relative;
width: 50%;
height: auto;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.88rem;
font-weight: bold;
color: var(--color-red);
text-align: right;
margin-bottom: -5px;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
font-weight: bold;
color: var(--color-red);
text-align: right;
margin-bottom: -5px;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 span {
color: var(--color-red);
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
font-size: 0.88rem;
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
}
/* hover image */
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--article-card-bg-f .box-atcf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--article-card-bg-f .box-atcf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-img {
height: 12.717rem;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4 .b-img {
height: 9.424rem;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--article-card-bg-f .box-atcf .list-pg .size-b4 {
width: calc((100%/3) - 6px);
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4:nth-child(3n+0) {
margin-right: 0;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-img {
height: 10.207rem;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4 .b-img {
height: 10.207rem;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price {
align-items: end;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 47%;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 53%;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.94rem;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.38rem;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
padding-left: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--article-card-bg-f .box-atcf {
padding: 12px 12px 10px 12px;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b3 {
width: calc((100%/2) - 4.5px);
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4 {
width: calc((100%/2) - 4.5px);
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-img {
height: auto;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b3 .b-img {
height: 14.462rem;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4 .b-img {
height: 14.462rem;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
/* row */
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg {
width: 100%;
max-height: initial;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg a {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-img {
width: 14rem;
height: 9.269rem;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .size-b4 .b-img {
width: 14rem;
height: 9.269rem;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta {
width: calc(100% - 14rem);
height: auto;
display: grid;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-name {
width: 100%;
height: auto;
padding: 10px 10px 8px 10px;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .dt {
padding: 7px 10px;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price {
padding: 7px 10px;
align-items: end;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 45%;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 55%;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
padding-left: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--article-card-bg-f.mg--t20 {
margin-top: 0;
}
.sc--article-card-bg-f .container {
padding: 0;
}
.sc--article-card-bg-f .box-atcf {
border-radius: 0;
padding: 12px 16px 12px 16px;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b3 {
width: 100%;
height: auto;
margin: 0 0 9px 0;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4 {
width: 100%;
height: auto;
margin: 0 0 9px 0;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-img {
height: auto;
}
.sc--article-card-bg-f .box-atcf .list-pg .size-b4 .b-img {
height: auto;
}
.sc--article-card-bg-f .box-atcf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
/* half */
.sc--article-card-bg-f .box-atcf .half-catc-smb .size-b3 {
width: calc((100%/2) - 4.5px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .size-b4 {
width: calc((100%/2) - 4.5px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .b-pg .b-img {
height: 7.924rem;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .size-b4 .b-img {
height: 7.924rem;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .b-pg .b-dta .b-name {
height: 3.688rem;
padding: 8px 10px 5px 10px;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .b-pg .b-dta .b-name p {
font-size: 0.94rem;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .b-pg .b-dta .b-detail .dt p {
font-size: 0.75rem;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 45%;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.75rem;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 55%;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.25rem;
text-align: left;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.25rem;
text-align: left;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-card-bg-f .box-atcf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
font-size: 0.75rem;
margin-top: -10px;
}
/* row */
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg {
width: 100%;
max-height: 6.745rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg a {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-img {
width: 10rem;
height: 6.62rem;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .size-b4 .b-img {
width: 10rem;
height: 6.62rem;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta {
width: calc(100% - 10rem);
height: auto;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-name {
width: 100%;
height: auto;
padding: 8px 10px 5px 10px;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-name p {
font-size: 0.94rem;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-name .fw-n {
font-weight: normal;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .dt {
padding: 5px 10px;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .dt p {
font-size: 0.75rem;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price {
padding: 5px 10px;
align-items: end;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 45%;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.75rem;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 55%;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.25rem;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.25rem;
}
.sc--article-card-bg-f .box-atcf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
font-size: 0.75rem;
padding-left: 0;
}
}
/* ================= car rental size 3 - 4 ================= */
.sc--car-rental-f {
position: relative;
width: 100%;
height: auto;
}
.sc--car-rental-f .box-crtf {
position: relative;
width: 100%;
height: auto;
}
.sc--car-rental-f .box-crtf .title-pg {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 10px 16px;
}
.sc--car-rental-f .box-crtf .title-pg p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--car-rental-f .box-crtf .list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg {
position: relative;
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
cursor: pointer;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--car-rental-f .box-crtf .list-pg .size-b3 {
width: calc((100%/3) - 6px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4 {
width: calc((100%/4) - 6.75px);
height: auto;
margin: 0 9px 9px 0;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg a {
width: 100%;
height: 100%;
display: flex;
flex-flow: column nowrap;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-img {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
.sc--car-rental-f .box-crtf .list-pg .size-b3 .b-img {
position: relative;
width: 100%;
height: 15.81rem;
overflow: hidden;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4 .b-img {
position: relative;
width: 100%;
height: 11.742rem;
overflow: hidden;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-img figure {
width: 100%;
height: 100%;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta {
position: relative;
width: 100%;
height: auto;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-name {
position: relative;
width: 100%;
height: auto;
padding: 10px;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg:hover .b-dta .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail {
position: relative;
width: 100%;
height: auto;
margin-top: auto;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .dt {
position: relative;
width: 100%;
height: auto;
padding: 10px;
border-top: 1px dashed var(--color-grey3);
border-bottom: 1px dashed var(--color-grey3);
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .dt p {
font-size: 0.88rem;
font-weight: normal;
text-align: center;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .dt p span {
color: var(--color-txtg4);
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .dt p i {
color: var(--color-icon-yl);
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .dt p .pd-ic-r {
padding-right: 3px;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .dt p .sprt-txt {
padding: 0 5px;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price {
position: relative;
width: 100%;
height: auto;
padding: 10px;
display: flex;
justify-content: stretch;
align-items: center;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l {
position: relative;
width: 50%;
height: auto;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l p {
/* font-size: 1rem; */
font-size: 0.88rem;
font-weight: normal;
color: var(--color-green);
text-align: center;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l figure {
position: relative;
width: 100%;
height: auto;
display: flex;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l figure .size--imgal {
position: relative;
width: 60%;
height: auto;
margin: 0 auto;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l .txt-center-bk {
text-align: center;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r {
position: relative;
width: 50%;
height: auto;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.88rem;
font-weight: bold;
color: var(--color-red);
text-align: right;
margin-bottom: -5px;
display: grid;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
font-weight: bold;
color: var(--color-red);
text-align: right;
margin-bottom: -5px;
display: grid;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 span {
color: var(--color-red);
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
/* font-size: 0.88rem; */
font-size: 0.72rem;
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
margin-top: -8px;
margin-right: 5px;
}
.b-img-logo-carrt {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 0;
}
.b-img-logo-carrt figure {
position: relative;
width: 40% !important;
height: auto;
margin: 0 auto;
}
.b-img-logo-carrt figure .size-imgs {
position: relative;
width: 100%;
height: auto;
}
/* hover image */
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.sc--car-rental-f .box-crtf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
/* .sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
display: grid;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
margin-top: -10px;
margin-right: 5px;
} */
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--car-rental-f .box-crtf .list-pg .size-b3 .b-img {
height: 13.049rem;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4 .b-img {
height: 9.672rem;
}
.sc--car-rental-f .box-crtf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4:nth-child(4n+0) {
margin-right: 0;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.75rem;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--car-rental-f .box-crtf .list-pg .size-b4 {
width: calc((100%/3) - 6px);
}
.sc--car-rental-f .box-crtf .list-pg .size-b3 .b-img {
height: 10.537rem;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4 .b-img {
height: 10.537rem;
}
.sc--car-rental-f .box-crtf .list-pg .size-b3:nth-child(3n+0) {
margin-right: 0;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4:nth-child(3n+0) {
margin-right: 0;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price {
align-items: end;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.94rem;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.38rem;
margin-bottom: 0;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
padding-left: 0;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4 .b-dta .b-detail .txtbk-price .b-r h1 {
margin-bottom: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--car-rental-f .box-crtf .list-pg .size-b3 {
width: calc((100%/2) - 4.5px);
}
.sc--car-rental-f .box-crtf .list-pg .size-b4 {
width: calc((100%/2) - 4.5px);
}
.sc--car-rental-f .box-crtf .list-pg .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--car-rental-f .box-crtf .list-pg .size-b3 .b-img {
height: 14.959rem;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4 .b-img {
height: 14.959rem;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-name {
height: 4.25rem;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
/* row */
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg {
width: 100%;
max-height: initial;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-right: 0;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg a {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-img {
width: 14rem;
height: 9.269rem;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta {
width: calc(100% - 14rem);
height: auto;
display: grid;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-name {
width: 100%;
height: auto;
padding: 10px 10px 8px 10px;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .dt {
padding: 7px 10px;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price {
padding: 7px 10px;
align-items: end;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 45%;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 55%;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
padding-left: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--article-card-f.mg--t20 {
margin-top: 0;
}
.sc--car-rental-f .box-crtf {
padding: 16px 0;
}
.sc--car-rental-f .box-crtf .list-pg .size-b3 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4 {
width: 100%;
margin: 0 0 9px 0;
}
.sc--car-rental-f .box-crtf .list-pg .size-b3 .b-img {
height: auto;
}
.sc--car-rental-f .box-crtf .list-pg .size-b4 .b-img {
height: auto;
}
.sc--car-rental-f .box-crtf .list-pg .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.44rem;
}
/* half */
.sc--car-rental-f .box-crtf .half-catc-smb .size-b3 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--car-rental-f .box-crtf .half-catc-smb .size-b4 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.sc--car-rental-f .box-crtf .half-catc-smb .size-b3:nth-child(2n+0) {
margin-right: 0;
}
.sc--car-rental-f .box-crtf .half-catc-smb .size-b4:nth-child(2n+0) {
margin-right: 0;
}
.sc--car-rental-f .box-crtf .half-catc-smb .size-b3 .b-img {
height: 7.924rem;
}
.sc--car-rental-f .box-crtf .half-catc-smb .size-b4 .b-img {
height: 7.924rem;
}
.sc--car-rental-f .box-crtf .half-catc-smb .b-pg .b-name {
height: 3.688rem;
padding: 8px 10px 5px 10px;
}
.sc--car-rental-f .box-crtf .half-catc-smb .b-pg .b-name p {
font-size: 0.94rem;
}
.sc--car-rental-f .box-crtf .half-catc-smb .b-pg .b-dta .b-name {
height: 3.688rem;
padding: 8px 10px 5px 10px;
}
.sc--car-rental-f .box-crtf .half-catc-smb .b-pg .b-dta .b-name p {
font-size: 0.94rem;
}
.sc--car-rental-f .box-crtf .half-catc-smb .b-pg .b-dta .b-detail .dt p {
font-size: 0.75rem;
}
.sc--car-rental-f .box-crtf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 45%;
}
.sc--car-rental-f .box-crtf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.75rem;
}
.sc--car-rental-f .box-crtf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 55%;
}
.sc--car-rental-f .box-crtf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.25rem;
text-align: left;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
}
.sc--car-rental-f .box-crtf .half-catc-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
font-size: 0.75rem;
margin-top: -10px;
}
/* row */
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg {
width: 100%;
max-height: 7.375rem;
/* max-height: 6.745rem; */
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg a {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-img {
width: 10rem;
height: 7.25rem;
/* height: 6.62rem; */
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta {
width: calc(100% - 10rem);
height: auto;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-name {
width: 100%;
height: auto;
padding: 8px 10px 5px 10px;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-name p {
font-size: 0.94rem;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-name .fw-n {
font-weight: normal;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .dt {
/* display: none; */
padding: 5px 10px;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .dt p {
font-size: 0.75rem;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price {
padding: 5px 10px 10px 10px;
align-items: end;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-l {
width: 45%;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-l p {
font-size: 0.75rem;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r {
width: 55%;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 {
font-size: 1.25rem;
}
.sc--car-rental-f .box-crtf .fsize-blr-smb .b-pg .b-dta .b-detail .txtbk-price .b-r h1 .txt-currency {
font-size: 0.75rem;
padding-left: 0;
}
}
/* ================= country background ================= */
.sc--country-sprlr {
position: relative;
width: 100%;
height: auto;
}
.sc--country-sprlr .box--bg-ct {
position: relative;
width: 100%;
height: auto;
padding: 12px 10px;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--country-sprlr .box--bg-ct .b--title {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
}
.sc--country-sprlr .box--bg-ct .b--title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--country-sprlr .box--bg-ct .b--lines-ct-list {
position: relative;
width: 100%;
height: auto;
padding: 3px;
border-radius: 5px;
border: 1px solid var(--color-grey4);
overflow: hidden;
display: flex;
justify-content: stretch;
align-items: center;
margin-bottom: 10px;
cursor: pointer;
}
.sc--country-sprlr .box--bg-ct .b--lines-ct-list:last-child {
margin-bottom: 0;
}
.sc--country-sprlr .box--bg-ct .b--lines-ct-list:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--country-sprlr .box--bg-ct .b--lines-ct-list a {
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
align-items: center;
}
.sc--country-sprlr .box--bg-ct .b--lines-ct-list .img--l {
position: relative;
/* width: 3.13rem; */
width: 2rem;
height: auto;
}
.sc--country-sprlr .box--bg-ct .b--lines-ct-list .img--l figure {
width: 100%;
height: 100%;
}
.sc--country-sprlr .box--bg-ct .b--lines-ct-list .img--l figure .size-img-ct {
position: relative;
width: 100%;
height: auto;
/* object-fit: cover; */
}
.sc--country-sprlr .box--bg-ct .b--lines-ct-list .txt--r {
position: relative;
width: calc(100% - 2rem);
height: auto;
padding: 7px 5px 5px 10px;
}
.sc--country-sprlr .box--bg-ct .b--lines-ct-list .txt--r p {
font-size: 0.94rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--country-sprlr .box--bg-ct .b--lines-ct-list:hover .txt--r p {
color: var(--color-first);
transition: all 0.3s ease;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.dpnone-box-ct {
display: none;
}
.sc--country-sprlr {
width: auto;
margin: 16px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.dpnone-box-ct {
display: none;
}
.sc--country-sprlr {
width: auto;
margin: 16px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.dpnone-box-ct {
display: none;
}
.sc--country-sprlr .box--bg-ct {
padding: 16px;
border-radius: 0;
}
}
/* ================= article list ================= */
.sc--article-list-lr {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-lr .box-atc-l {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-lr .box-atc-l .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 5px 16px 5px;
}
.sc--article-list-lr .box-atc-l .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--article-list-lr .box-atc-l .box-list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg {
position: relative;
width: 100%;
height: auto;
max-height: 9.625rem;
border-radius: 5px;
overflow: hidden;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
cursor: pointer;
border: 1px solid var(--color-grey3);
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg a {
position: relative;
width: 100%;
height: 100%;
max-height: 9.5rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-img {
position: relative;
width: 14rem;
height: 9.5rem;
overflow: hidden;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-img figure {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail {
position: relative;
width: calc(100% - 14rem);
height: auto;
padding: 12px 16px;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
padding-bottom: 8px;
margin-bottom: 8px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
position: relative;
width: calc(100% - 5.2rem);
height: auto;
padding-right: 5px;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg:hover .b-detail .b-name-view .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: relative;
width: 5.2rem;
height: auto;
padding: 3px 0 0 5px;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.82rem;
text-align: right;
color: var(--color-txtg4);
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-txtg4);
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-first);
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p .pd-ic {
padding-right: 2px;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-dt {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.88rem;
color: var(--color-txtg4);
text-indent: 25px;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
/* hover image */
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.sc--article-list-lr {
width: auto;
margin: 0 16px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--article-list-lr {
width: auto;
margin: 0 16px;
}
/* column */
.sc--article-list-lr .box-atc-l .column-box-list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg a {
max-height: initial;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-img {
width: 100%;
height: 14.959rem;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail {
width: 100%;
height: 100%;
padding: 10px 12px;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view {
padding-bottom: 5px;
height: 3.25rem;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 5px;
top: -2.3rem;
left: auto;
right: -6px;
z-index: 1;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.88rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
/* column half */
.sc--article-list-lr .box-atc-l .column-half-box-list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg a {
max-height: initial;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-img {
width: 100%;
height: 14.959rem;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail {
width: 100%;
height: 100%;
padding: 10px 12px;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view {
padding-bottom: 5px;
height: 3.25rem;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 5px;
top: -2.3rem;
left: auto;
right: -6px;
z-index: 1;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.88rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--article-list-lr .box-atc-l {
padding: 0 16px;
}
.sc--article-list-lr .box-atc-l .b-title {
padding: 8px;
}
.sc--article-list-lr .box-atc-l .title-left-mb {
padding: 5px;
}
.sc--article-list-lr .box-atc-l .title-left-mb p {
text-align: left;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg {
max-height: 7.408rem;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg a {
max-height: 7.283rem;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-img {
width: 11rem;
height: 7.283rem;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail {
width: calc(100% - 11rem);
padding: 6px;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view {
padding-bottom: 5px;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg);
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 3px;
z-index: 1;
top: -5px;
left: -11.2rem;
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.75rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.82rem;
text-indent: 20px;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
/* column */
.sc--article-list-lr .box-atc-l .column-box-list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg {
max-height: initial;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg a {
max-height: initial;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-img {
width: 100%;
height: auto;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail {
width: 100%;
height: 100%;
padding: 10px 12px;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view {
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 1rem;
font-weight: bold;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 5px;
top: -2.3rem;
left: auto;
right: -6px;
z-index: 1;
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.75rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.88rem;
text-indent: 25px;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
/* column half */
.sc--article-list-lr .box-atc-l .column-half-box-list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg a {
max-height: initial;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-img {
width: 100%;
height: 7.924rem;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail {
width: 100%;
height: 100%;
padding: 10px 12px;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view {
padding-bottom: 5px;
height: 3.25rem;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg);
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 5px;
top: -2.3rem;
left: auto;
right: -6px;
z-index: 1;
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.75rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
.sc--article-list-lr .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.82rem;
text-indent: 20px;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
}
/* ================= program rows ================= */
.sc--program-rw-f {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-f .box-pg-rw {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-f .box-pg-rw .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 5px 16px 5px;
}
.sc--program-rw-f .box-pg-rw .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg {
position: relative;
width: 100%;
height: auto;
max-height: 16.25rem;
border: 1px solid var(--color-grey3);
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg a {
position: relative;
width: 100%;
height: 100%;
max-height: 16.25rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-img {
position: relative;
width: 16.25rem;
height: 16.25rem;
overflow: hidden;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-img figure {
width: 100%;
height: 100%;
max-height: 16.25rem;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail {
position: relative;
width: calc(100% - 16.25rem);
height: fit-content;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 5px 14px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-name {
position: relative;
width: 100%;
height: 4.25rem;
padding: 10px 0;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg:hover .b-detail .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-dt {
position: relative;
height: auto;
padding: 10px;
display: grid;
align-items: center;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 32%;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 38%;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 p,
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 p span,
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 p span {
color: var(--color-txtg4);
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 p .pd-ic-r,
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 p .pd-ic-r {
padding-right: 3px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 p i,
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 p i {
color: var(--color-icon-yl);
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline {
position: relative;
width: 30%;
height: auto;
padding: 10px 0 10px 10px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure {
width: 100%;
height: 3.5rem;
display: flex;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
position: relative;
width: auto;
height: 100%;
margin: 0 auto;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-shoetdt {
position: relative;
width: 65%;
height: auto;
padding: 10px;
margin-top: auto;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-shoetdt p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg5);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price {
position: relative;
width: 35%;
height: auto;
display: flex;
justify-content: stretch;
padding: 10px 0 10px 10px;
align-items: end;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
position: relative;
width: 40%;
height: auto;
padding-right: 5px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price p {
font-size: 0.88rem;
color: var(--color-txtg4);
text-align: right;
text-decoration: line-through;
/* text-decoration-color: var(--color-red); */
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
position: relative;
width: 60%;
height: auto;
padding-left: 5px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price p {
font-size: 0.88rem;
color: var(--color-txtg4);
margin-bottom: -5px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 {
font-size: 1.44rem;
font-weight: bold;
color: var(--color-red);
margin-bottom: -5px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 span {
color: var(--color-red);
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 .txt-currency {
font-size: 0.88rem;
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
}
/* hover image */
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
/* .dp-none-txt-country-f {
display: none;
} */
/* .dp-none-txt-start-pf {
display: none;
} */
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-img {
width: 14rem;
height: 14rem;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-img figure {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail {
width: calc(100% - 14rem);
padding: 0 14px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-name {
height: 4.625rem;
padding: 16px 0 10px 0;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 50%;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 50%;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline {
width: 50%;
padding: 10px 0 10px 10px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
margin: 0;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-shoetdt {
display: none;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price {
width: 50%;
padding: 10px 0 10px 10px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
width: 33%;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
width: 67%;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-dt .dp-none-txt-country-f,
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-dt .dp-none-txt-country-f {
display: none;
}
}
@media (min-width: 501px) and (max-width: 790px) {
/* .dp-none-txt-country-f {
display: none;
} */
/* .dp-none-txt-start-pf {
display: none;
} */
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-img {
width: 14rem;
height: 14rem;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-img figure {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail {
width: calc(100% - 14rem);
padding: 0 14px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-name {
height: 4.625rem;
padding: 16px 0 10px 0;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 50%;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 50%;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline {
width: 50%;
padding: 10px 0 10px 10px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
margin: 0;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-shoetdt {
display: none;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price {
width: 50%;
padding: 10px 0 10px 10px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
width: 33%;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
width: 67%;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-dt .dp-none-txt-country-f,
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-dt .dp-none-txt-country-f {
display: none;
}
/* column */
/* .sc--program-rw-f .box-pg-rw .column-b-dt-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: 21.969rem;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-img figure {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail {
width: 100%;
padding: 0;
align-items: center;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-name {
padding: 10px 12px;
height: 4.625rem;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
color: var(--color-txtg);
white-space: wrap;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-dt {
display: block;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 100%;
padding: 5px 10px 2px 10px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 100%;
padding: 2px 10px 5px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .sb-dt1 p,
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .sb-dt2 p {
font-size: 0.82rem;
font-weight: normal;
text-align: center;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-airline {
width: 40%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-airline figure {
width: 65%;
height: auto;
margin: 0 auto;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
width: 100%;
height: auto;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-shoetdt {
display: none;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price {
width: 60%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
width: auto;
padding-right: 10px;
margin-bottom: 0;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price p {
font-size: 0.84rem;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
width: auto;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price p {
font-size: 0.84rem;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 {
font-size: 1.44rem;
text-align: left;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 .txt-currency {
font-size: 0.84rem;
} */
/* column half */
/* .sc--program-rw-f .box-pg-rw .column-half-b-dt-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: 21.969rem;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-img figure {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail {
width: 100%;
padding: 0;
align-items: center;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-name {
padding: 10px 12px;
height: 4.625rem;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
color: var(--color-txtg);
white-space: wrap;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-dt {
display: block;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 100%;
padding: 5px 10px 2px 10px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 100%;
padding: 2px 10px 5px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .sb-dt1 p,
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .sb-dt2 p {
font-size: 0.82rem;
font-weight: normal;
text-align: center;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-airline {
width: 40%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-airline figure {
width: 65%;
height: auto;
margin: 0 auto;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
width: 100%;
height: auto;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-shoetdt {
display: none;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price {
width: 60%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
width: auto;
padding-right: 10px;
margin-bottom: 0;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price p {
font-size: 0.84rem;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
width: auto;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price p {
font-size: 0.84rem;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 {
font-size: 1.44rem;
text-align: left;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 .txt-currency {
font-size: 0.84rem;
} */
}
@media (min-width: 0px) and (max-width: 500px) {
.dp-none-txt-country-f {
display: none;
}
.dp-none-txt-start-pf {
display: none;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg {
max-height: 8.563rem;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg a {
max-height: 8.438rem;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-img {
width: 8.438rem;
height: 8.438rem;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-img figure {
max-height: 8.438rem;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail {
width: calc(100% - 8.438rem);
padding: 0;
align-items: flex-end;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-name {
padding: 5px 10px;
height: auto;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-dt {
padding: 0;
display: flex;
justify-content: stretch;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 100%;
padding: 5px 10px 2px 10px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 100%;
padding: 2px 10px 5px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 p,
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 p {
font-size: 0.75rem;
padding: 0 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline {
width: 35%;
padding: 5px 5px 5px 15px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure {
width: 80%;
height: auto;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
width: 100%;
height: auto;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-shoetdt {
display: none;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price {
width: 65%;
padding: 5px 15px 5px 5px;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
width: 100%;
padding-right: 1.875rem;
margin-bottom: -5px;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price p {
font-size: 0.82rem;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
width: 100%;
padding-left: 0;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price p {
font-size: 0.82rem;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 {
font-size: 1.25rem;
text-align: right;
}
.sc--program-rw-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 .txt-currency {
padding-left: 2px;
font-size: 0.82rem;
}
/* column */
.sc--program-rw-f .box-pg-rw .column-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: auto;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-img figure {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail {
width: 100%;
/* align-items: end;
justify-content: space-between; */
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-name {
padding: 10px 12px;
height: auto;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: wrap;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-dt {
display: block;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 100%;
padding: 10px 12px 0 12px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 100%;
padding: 0 12px 10px 12px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .sb-dt1 p,
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .sb-dt2 p {
font-size: 0.82rem;
text-align: center;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-airline {
width: 40%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-airline figure {
width: 65%;
height: auto;
margin: 0 auto;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
width: 100%;
height: auto;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-shoetdt {
display: none;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price {
width: 60%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
width: auto;
padding-right: 10px;
margin-bottom: 0;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price p {
font-size: 0.84rem;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
width: auto;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price p {
font-size: 0.84rem;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 {
font-size: 1.44rem;
text-align: left;
}
.sc--program-rw-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 .txt-currency {
font-size: 0.84rem;
}
/* column half */
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: 11.969rem;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-img figure {
max-height: initial;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail {
width: 100%;
padding: 0;
align-items: center;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-name {
height: 3.625rem;
padding: 6px 12px;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-name p {
font-size: 0.94rem;
font-weight: normal;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: wrap;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-dt {
display: block;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 100%;
padding: 6px 12px 0 12px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 100%;
padding: 0 12px 6px 12px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .sb-dt1 p,
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .sb-dt2 p {
font-size: 0.75rem;
text-align: center;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-airline {
width: 45%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-airline figure {
width: 85%;
height: auto;
margin: 0 auto;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
width: 100%;
height: auto;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-shoetdt {
display: none;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price {
width: 55%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
width: 100%;
padding-right: 0;
margin-bottom: -5px;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price p {
font-size: 0.75rem;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
width: auto;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price p {
font-size: 0.75rem;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 {
font-size: 1.25rem;
text-align: left;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 0;
}
.sc--program-rw-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 .txt-currency {
font-size: 0.75rem;
margin-top: -10px;
}
}
/* ================= program rows bg ================= */
.sc--program-rw-bg-f {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-bg-f .box-pg-rw {
position: relative;
width: 100%;
height: auto;
padding: 12px 12px 3px 12px;
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-rw-bg-f .box-pg-rw .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 5px 16px 5px;
}
.sc--program-rw-bg-f .box-pg-rw .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg {
position: relative;
width: 100%;
height: auto;
max-height: 16.25rem;
border: 1px solid var(--color-grey4);
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg a {
position: relative;
width: 100%;
height: 100%;
max-height: 16.25rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-img {
position: relative;
width: 16.25rem;
height: 16.25rem;
overflow: hidden;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-img figure {
width: 100%;
height: 100%;
max-height: 16.25rem;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail {
position: relative;
width: calc(100% - 16.25rem);
height: fit-content;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 5px 14px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-name {
position: relative;
width: 100%;
height: 4.25rem;
padding: 10px 0;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg:hover .b-detail .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-dt {
position: relative;
height: auto;
padding: 10px;
display: grid;
align-items: center;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 32%;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 38%;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 p,
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 p span,
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 p span {
color: var(--color-txtg4);
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 p .pd-ic-r,
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 p .pd-ic-r {
padding-right: 3px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 p i,
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 p i {
color: var(--color-icon-yl);
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline {
position: relative;
width: 30%;
height: auto;
padding: 10px 0 10px 10px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure {
width: 100%;
height: 3.5rem;
display: flex;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
position: relative;
width: auto;
height: 100%;
margin: 0 auto;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-shoetdt {
position: relative;
width: 65%;
height: auto;
padding: 10px;
margin-top: auto;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-shoetdt p {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg5);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price {
position: relative;
width: 35%;
height: auto;
display: flex;
justify-content: stretch;
padding: 10px 0 10px 10px;
align-items: end;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
position: relative;
width: 40%;
height: auto;
padding-right: 5px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price p {
font-size: 0.88rem;
color: var(--color-txtg4);
text-align: right;
text-decoration: line-through;
/* text-decoration-color: var(--color-red); */
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
position: relative;
width: 60%;
height: auto;
padding-left: 5px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price p {
font-size: 0.88rem;
color: var(--color-txtg4);
margin-bottom: -5px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 {
font-size: 1.44rem;
font-weight: bold;
color: var(--color-red);
margin-bottom: -5px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 span {
color: var(--color-red);
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 .txt-currency {
font-size: 0.88rem;
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
}
/* hover image */
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
/* .dp-none-txt-country-bgf {
display: none;
} */
/* .dp-none-txt-start-pbgf {
display: none;
} */
.sc--program-rw-bg-f .box-pg-rw {
padding: 12px 12px 10px 12px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg {
max-height: initial;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-img {
width: 14rem;
height: 14rem;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-img figure {
max-height: initial;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail {
width: calc(100% - 14rem);
padding: 0 14px;
align-items: flex-end;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-name {
height: 4.625rem;
padding: 16px 0 10px 0;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 50%;
padding: 10px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 50%;
padding: 10px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline {
width: 50%;
padding: 10px 0 10px 10px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure {
width: 100%;
height: 3.5rem;
display: flex;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
margin: 0;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-shoetdt {
display: none;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price {
width: 50%;
padding: 10px 0 10px 10px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
width: 33%;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
width: 67%;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .dp-none-txt-country-bgf,
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .dp-none-txt-country-bgf {
display: none;
}
}
@media (min-width: 501px) and (max-width: 790px) {
/* .dp-none-txt-country-bgf {
display: none;
} */
/* .dp-none-txt-start-pbgf {
display: none;
} */
.sc--program-rw-bg-f .box-pg-rw {
padding: 12px 12px 10px 12px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg {
max-height: initial;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-img {
width: 14rem;
height: 14rem;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-img figure {
max-height: initial;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail {
width: calc(100% - 14rem);
padding: 0 14px;
align-items: flex-end;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-name {
height: 4.625rem;
padding: 16px 0 10px 0;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 50%;
padding: 10px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 50%;
padding: 10px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline {
width: 50%;
padding: 10px 0 10px 10px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure {
width: 100%;
height: 3.5rem;
display: flex;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
margin: 0;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-shoetdt {
display: none;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price {
width: 50%;
padding: 10px 0 10px 10px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
width: 33%;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
width: 67%;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .dp-none-txt-country-bgf,
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .dp-none-txt-country-bgf {
display: none;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.dp-none-txt-country-bgf {
display: none;
}
.dp-none-txt-start-pbgf {
display: none;
}
.sc--program-rw-bg-f.mg--t20 {
margin-top: 0;
}
.sc--program-rw-bg-f .container {
padding: 0;
}
.sc--program-rw-bg-f .box-pg-rw {
border-radius: 0;
padding: 12px 16px 10px 16px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg {
max-height: 8.563rem;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg a {
max-height: 8.438rem;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-img {
width: 8.438rem;
height: 8.438rem;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-img figure {
max-height: 8.438rem;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail {
width: calc(100% - 8.438rem);
padding: 0;
align-items: flex-end;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-name {
padding: 5px 10px;
height: auto;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-dt {
padding: 0;
display: flex;
justify-content: stretch;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 100%;
padding: 5px 10px 2px 10px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 100%;
padding: 2px 10px 5px 10px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt1 p,
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .sb-dt2 p {
font-size: 0.75rem;
padding: 0 5px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline {
width: 35%;
padding: 5px 5px 5px 15px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure {
width: 80%;
height: auto;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
width: 100%;
height: auto;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-shoetdt {
display: none;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price {
width: 65%;
padding: 5px 15px 5px 5px;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
width: 100%;
padding-right: 1.875rem;
margin-bottom: -5px;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price p {
font-size: 0.82rem;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
width: 100%;
padding-left: 0;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price p {
font-size: 0.82rem;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 {
font-size: 1.25rem;
text-align: right;
}
.sc--program-rw-bg-f .box-pg-rw .b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 .txt-currency {
padding-left: 2px;
font-size: 0.82rem;
}
/* column */
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg {
max-height: initial;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: auto;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-img figure {
max-height: initial;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail {
width: 100%;
padding: 0;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-name {
padding: 10px 12px;
height: auto;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: wrap;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-dt {
display: block;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 100%;
padding: 10px 12px 0 12px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 100%;
padding: 0 12px 10px 12px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .sb-dt1 p,
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .sb-dt2 p {
font-size: 0.82rem;
text-align: center;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-airline {
width: 40%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-airline figure {
width: 65%;
height: auto;
margin: 0 auto;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
width: 100%;
height: auto;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-shoetdt {
display: none;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price {
width: 60%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
width: auto;
padding-right: 10px;
margin-bottom: 0;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price p {
font-size: 0.84rem;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
width: auto;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price p {
font-size: 0.84rem;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 {
font-size: 1.44rem;
text-align: left;
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 span {
color: var(--color-red);
}
.sc--program-rw-bg-f .box-pg-rw .column-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 .txt-currency {
font-size: 0.84rem;
}
/* column half */
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg a {
max-height: initial;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-img {
width: 100%;
height: 11.969rem;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-img figure {
max-height: initial;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail {
width: 100%;
padding: 0;
align-items: center;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-name {
height: 3.625rem;
padding: 6px 12px;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-name p {
font-size: 0.94rem;
font-weight: normal;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
white-space: wrap;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-dt {
display: block;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .sb-dt1 {
width: 100%;
padding: 6px 12px 0 12px;
border-top: 1px dashed var(--color-grey3);
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .sb-dt2 {
width: 100%;
padding: 0 12px 6px 12px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .sb-dt1 p,
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .sb-dt2 p {
font-size: 0.75rem;
text-align: center;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-airline {
width: 45%;
padding: 8px 6px;
display: flex;
align-items: center;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-airline figure {
width: 85%;
height: auto;
margin: 0 auto;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-airline figure .size-img {
width: 100%;
height: auto;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-shoetdt {
display: none;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price {
width: 55%;
padding: 8px 12px 8px 6px;
justify-content: flex-end;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price {
width: 100%;
padding-right: 0;
margin-bottom: -5px;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-full-price p {
font-size: 0.75rem;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price {
width: auto;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price p {
font-size: 0.75rem;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 {
font-size: 1.25rem;
text-align: left;
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 0;
}
.sc--program-rw-bg-f .box-pg-rw .column-half-b-dt-pg .b-one-pg .b-detail .b-price .spr-net-price h1 .txt-currency {
font-size: 0.75rem;
margin-top: -10px;
}
}
/* ================= article list ================= */
.sc--article-list-f {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-f .box-atc-l {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-f .box-atc-l .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 5px 16px 5px;
}
.sc--article-list-f .box-atc-l .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--article-list-f .box-atc-l .box-list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg {
position: relative;
width: 100%;
height: auto;
max-height: 10.938rem;
border-radius: 5px;
overflow: hidden;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
cursor: pointer;
border: 1px solid var(--color-grey3);
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg a {
position: relative;
width: 100%;
height: 100%;
max-height: 10.813rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-img {
position: relative;
width: 16.25rem;
height: 10.813rem;
overflow: hidden;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-img figure {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail {
position: relative;
width: calc(100% - 16.25rem);
height: auto;
padding: 12px 16px;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
padding-bottom: 8px;
margin-bottom: 8px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
position: relative;
width: calc(100% - 4rem);
height: auto;
padding-right: 5px;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg:hover .b-detail .b-name-view .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: relative;
width: 4rem;
height: auto;
padding: 3px 0 0 5px;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.82rem;
text-align: right;
color: var(--color-txtg4);
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-txtg4);
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-first);
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p .pd-ic {
padding-right: 2px;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-dt {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.88rem;
color: var(--color-txtg4);
text-indent: 25px;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 4;
}
/* hover image */
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.sc--article-list-f .box-atc-l .b-title {
padding: 8px;
}
.sc--article-list-f .box-atc-l .title-left-mb {
padding: 5px;
}
.sc--article-list-f .box-atc-l .title-left-mb p {
text-align: left;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg {
max-height: 7.408rem;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg a {
max-height: 7.283rem;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-img {
width: 11rem;
height: 7.283rem;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail {
width: calc(100% - 11rem);
padding: 6px;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view {
padding-bottom: 5px;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg);
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 3px;
z-index: 1;
top: -5px;
left: -11.2rem;
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.75rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
.sc--article-list-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.82rem;
text-indent: 20px;
-webkit-line-clamp: 2;
}
/* column */
.sc--article-list-f .box-atc-l .column-box-list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg {
max-height: initial;
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg a {
max-height: initial;
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg .b-img {
width: 100%;
height: auto;
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail {
width: 100%;
height: 100%;
padding: 10px 12px;
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view {
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 1rem;
font-weight: bold;
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 5px;
top: -2.3rem;
left: auto;
right: -6px;
z-index: 1;
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.75rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-dt {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.88rem;
text-indent: 25px;
-webkit-line-clamp: 3;
}
/* column half */
.sc--article-list-f .box-atc-l .column-half-box-list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg a {
max-height: initial;
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-img {
width: 100%;
height: 7.924rem;
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail {
width: 100%;
height: 100%;
padding: 10px 12px;
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view {
padding-bottom: 5px;
height: 3.25rem;
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg);
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 5px;
top: -2.3rem;
left: auto;
right: -6px;
z-index: 1;
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.75rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
.sc--article-list-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.82rem;
text-indent: 20px;
-webkit-line-clamp: 3;
}
}
/* ================= article list ================= */
.sc--article-list-bg-f {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-bg-f .box-atc-l {
position: relative;
width: 100%;
height: auto;
padding: 12px 12px 3px 12px;
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--article-list-bg-f .box-atc-l .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 5px 16px 5px;
}
.sc--article-list-bg-f .box-atc-l .b-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg {
position: relative;
width: 100%;
height: auto;
max-height: 10.938rem;
border-radius: 5px;
overflow: hidden;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
cursor: pointer;
border: 1px solid var(--color-grey4);
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg a {
position: relative;
width: 100%;
height: 100%;
max-height: 10.813rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-img {
position: relative;
width: 16.25rem;
height: 10.813rem;
overflow: hidden;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-img figure {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail {
position: relative;
width: calc(100% - 16.25rem);
height: auto;
padding: 12px 16px;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
padding-bottom: 8px;
margin-bottom: 8px;
border-bottom: 1px dashed var(--color-grey3);
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
position: relative;
width: calc(100% - 4rem);
height: auto;
padding-right: 5px;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg:hover .b-detail .b-name-view .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: relative;
width: 4rem;
height: auto;
padding: 3px 0 0 5px;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.82rem;
text-align: right;
color: var(--color-txtg4);
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-txtg4);
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-first);
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p .pd-ic {
padding-right: 2px;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-dt {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.88rem;
color: var(--color-txtg4);
text-indent: 25px;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 4;
}
/* hover image */
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.sc--article-list-bg-f .box-atc-l {
padding: 12px 16px 10px 16px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--article-list-bg-f .box-atc-l {
padding: 12px 16px 10px 16px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--article-list-bg-f.mg--t20 {
margin-top: 0;
}
.sc--article-list-bg-f .container {
padding: 0;
}
.sc--article-list-bg-f .box-atc-l {
border-radius: 0;
padding: 12px 16px 10px 16px;
}
.sc--article-list-bg-f .box-atc-l .b-title {
padding: 5px;
}
.sc--article-list-bg-f .box-atc-l .title-left-mb {
padding: 5px;
}
.sc--article-list-bg-f .box-atc-l .title-left-mb p {
text-align: left;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg {
max-height: 7.408rem;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg a {
max-height: 7.283rem;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-img {
width: 11rem;
height: 7.283rem;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail {
width: calc(100% - 11rem);
padding: 6px;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view {
padding-bottom: 5px;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg);
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 3px;
z-index: 1;
top: -5px;
left: -11.2rem;
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.75rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
.sc--article-list-bg-f .box-atc-l .box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.82rem;
text-indent: 20px;
-webkit-line-clamp: 2;
}
/* column */
.sc--article-list-bg-f .box-atc-l .column-box-list-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg {
max-height: initial;
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg a {
max-height: initial;
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg .b-img {
width: 100%;
height: auto;
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail {
width: 100%;
height: 100%;
padding: 10px 12px;
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view {
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 1rem;
font-weight: bold;
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 5px;
top: -2.3rem;
left: auto;
right: -6px;
z-index: 1;
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.75rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-dt {
position: relative;
width: 100%;
height: auto;
}
.sc--article-list-bg-f .box-atc-l .column-box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.88rem;
text-indent: 25px;
-webkit-line-clamp: 3;
}
/* column half */
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg {
width: calc((100%/2) - 4.5px);
max-height: initial;
margin: 0 9px 9px 0;
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg:nth-child(2n+0) {
margin-right: 0;
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg a {
max-height: initial;
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-img {
width: 100%;
height: 7.924rem;
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail {
width: 100%;
height: 100%;
padding: 10px 12px;
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view {
padding-bottom: 5px;
height: 3.25rem;
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-name {
width: 100%;
padding-right: 0;
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-name p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg);
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view {
position: absolute;
width: auto;
padding: 5px;
top: -2.3rem;
left: auto;
right: -6px;
z-index: 1;
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p {
font-size: 0.75rem;
text-align: left;
color: var(--color-light);
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p span {
color: var(--color-light);
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-name-view .b-view p i {
color: var(--color-light);
}
.sc--article-list-bg-f .box-atc-l .column-half-box-list-pg .b-one-pg .b-detail .b-dt p {
font-size: 0.82rem;
text-indent: 20px;
-webkit-line-clamp: 3;
}
}
/* ================= booking ================= */
.sc--spr-lrbk {
position: relative;
width: 100%;
height: auto;
}
.sc--spr-lrbk .box--bk-lr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l {
position: relative;
width: 70%;
height: auto;
padding-right: 6px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip {
position: relative;
width: 100%;
height: auto;
padding: 16px;
background-color: var(--color-light);
border-radius: 5px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.lines-b-box-bk {
padding-bottom: 16px;
margin-bottom: 18px;
border-bottom: 1px dashed var(--color-grey4);
}
.lines-t-box-bk {
padding-top: 16px;
margin-top: 18px;
border-top: 1px dashed var(--color-grey4);
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk {
position: relative;
width: 100%;
height: auto;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .title-bk {
position: relative;
width: 100%;
height: auto;
padding: 0 0 10px 0;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .title-bk p {
font-size: 1.13rem;
font-weight: bold;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-fill-in-infor {
position: relative;
height: auto;
padding: 2px 5px 10px 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-fill-in-infor .name-ip {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 2px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-fill-in-infor .name-ip p {
font-size: 0.94rem;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-fill-in-infor .name-ip p span {
color: var(--color-red);
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-fill-in-infor .line-ip {
position: relative;
width: 100%;
height: auto;
border: 1px solid var(--color-grey4);
border-radius: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-fill-in-infor .line-ip select {
width: 100%;
background-color: transparent;
font-size: 0.94rem;
height: 2rem;
font-weight: normal;
padding: 3px 10px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-fill-in-infor .line-ip input {
width: 100%;
background-color: transparent;
font-size: 0.94rem;
height: 2rem;
font-weight: normal;
padding: 3px 10px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-fill-in-infor .line-ip textarea {
width: 100%;
background-color: transparent;
font-size: 0.94rem;
font-weight: normal;
padding: 3px 10px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-bk100 {
width: 100%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-bk50 {
width: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-bk1 {
width: 100%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-bk2 {
width: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-bk3 {
width: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-bk4 {
width: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-bk5 {
width: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-bk6 {
width: 100%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk {
position: relative;
height: auto;
padding: 2px 5px 16px 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk:nth-child(odd) {
padding-right: 15px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk:nth-child(even) {
padding-left: 15px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .name-ip {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 2px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .name-ip .txt-l {
position: relative;
width: 50%;
height: auto;
padding: 0 5px 0 1.6rem;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .name-ip .txt-l p {
font-size: 0.94rem;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .name-ip .price-r {
position: relative;
width: 50%;
height: auto;
padding: 0 1.6rem 0 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .name-ip .price-r p {
font-size: 1rem;
font-weight: bold;
text-align: right;
color: var(--color-red);
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .name-ip .price-r p span {
font-weight: normal;
font-size: 0.82rem;
color: var(--color-txtg4);
padding-left: 3px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .box-ip {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .box-ip .btn-nbbk-size {
position: relative;
width: 2.5rem;
height: auto;
display: flex;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .box-ip .btn-nbbk-size .btn {
position: relative;
width: 2rem;
height: 2rem;
border-radius: 100%;
border: 1px solid var(--color-grey4);
cursor: pointer;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .box-ip .btn-nbbk-size .btn a {
position: relative;
width: 100%;
height: 100%;
display: block;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .box-ip .btn-nbbk-size .btn a i {
font-size: 1rem;
position: relative;
top: 40%;
transform: translate(-50%, -50%);
left: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .box-ip .btn-nbbk-size .minus- {
margin-right: auto;
margin-left: 0;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .box-ip .btn-nbbk-size .plus- {
margin-right: 0;
margin-left: auto;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .box-ip .line-ip {
position: relative;
width: calc(100% - 5rem);
height: auto;
border: 1px solid var(--color-grey4);
border-radius: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk .box-ip .line-ip input {
width: 100%;
background-color: transparent;
font-size: 0.94rem;
height: 2rem;
font-weight: normal;
padding: 3px 10px;
text-align: center;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-nbtvbk {
width: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r {
position: relative;
width: 30%;
height: auto;
padding-left: 6px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view {
position: relative;
width: 100%;
height: auto;
padding: 16px;
background-color: var(--color-light);
border-radius: 5px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .title-bk {
position: relative;
width: 100%;
height: auto;
padding: 0 0 10px 0;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .title-bk p {
font-size: 1.13rem;
font-weight: bold;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk {
position: relative;
width: 100%;
height: auto;
border-bottom: 1px dashed var(--color-grey4);
padding-bottom: 10px;
margin-bottom: 10px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .img-pg {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .img-pg figure {
position: relative;
width: 100%;
height: auto;
margin: 0 auto;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .img-pg figure .size-img {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .dt-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .dt-pg .name {
position: relative;
width: 100%;
height: auto;
padding: 1px 0 5px 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .dt-pg .name p {
font-size: 0.94rem;
font-weight: bold;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .dt-pg .dt {
position: relative;
width: 100%;
height: auto;
padding: 3px 0 2px 16px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .dt-pg .dt p {
font-size: 0.88rem;
padding-bottom: 2px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .dt-pg .dt .code-pg {
color: var(--color-first);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .dt-pg .dt p span {
font-weight: bold;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk .title-price {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk .title-price p {
font-size: 1rem;
font-weight: bold;
color: var(--color-txtg3);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk .dt-price {
position: relative;
width: 100%;
height: auto;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk .dt-price .list-price {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
border-bottom: 1px solid var(--color-grey3);
padding-bottom: 6px;
margin-bottom: 6px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk .dt-price .list-price:last-child {
border-bottom: none;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk .dt-price .list-price .name-l {
position: relative;
width: 30%;
height: auto;
padding-right: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk .dt-price .list-price .name-l p {
font-size: 0.88rem;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk .dt-price .list-price .price-r {
position: relative;
width: 70%;
height: auto;
padding-left: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk .dt-price .list-price .price-r p {
font-size: 0.88rem;
text-align: right;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk .dt-price .list-price .price-r p span {
font-size: 0.94rem;
font-weight: bold;
/* color: var(--color-red); */
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk .dt-price .list-price .price-r p .txt-currency {
font-size: 0.75rem;
font-weight: normal;
color: var(--color-txtg4);
padding-left: 2px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .commission-bk {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .commission-bk .title-commission {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .commission-bk .title-commission p {
font-size: 1rem;
font-weight: bold;
color: var(--color-txtg3);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .commission-bk .list-commission {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
border-bottom: 1px solid var(--color-grey3);
padding-bottom: 6px;
margin-bottom: 6px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .commission-bk .list-commission:last-child {
border-bottom: none;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .commission-bk .list-commission .name-l {
position: relative;
width: 30%;
height: auto;
padding-right: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .commission-bk .list-commission .name-l p {
font-size: 0.88rem;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .commission-bk .list-commission .price-r {
position: relative;
width: 70%;
height: auto;
padding-left: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .commission-bk .list-commission .price-r p {
font-size: 0.88rem;
text-align: right;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .commission-bk .list-commission .price-r p span {
font-size: 0.94rem;
font-weight: bold;
/* color: var(--color-red); */
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .commission-bk .list-commission .price-r p .txt-currency {
font-size: 0.75rem;
font-weight: normal;
color: var(--color-txtg4);
padding-left: 2px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk {
position: relative;
width: 100%;
height: auto;
padding: 5px 0 5px 0;
margin-bottom: 10px;
border-bottom: 1px solid var(--color-grey4);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price .b-seat {
position: relative;
width: 20%;
height: auto;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price .b-seat p {
font-size: 1.13rem;
font-weight: bold;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price .b-seat p span {
font-size: 0.75rem;
font-weight: normal;
color: var(--color-txtg4);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price .b-seat .txt-name {
font-size: 0.88rem;
font-weight: normal;
padding-bottom: 3px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price .b-discount {
position: relative;
width: 37%;
height: auto;
padding: 0 16px 0 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price .b-discount p {
font-size: 1.13rem;
font-weight: bold;
text-align: right;
color: var(--color-red);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price .b-discount p span {
font-size: 0.75rem;
font-weight: normal;
color: var(--color-txtg4);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price .b-discount .txt-name {
font-size: 0.88rem;
font-weight: normal;
padding-bottom: 3px;
color: var(--color-txtg);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price .b-total {
position: relative;
width: 43%;
height: auto;
border-left: 1px dashed var(--color-grey4);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price .b-total p {
font-size: 1.13rem;
font-weight: bold;
text-align: right;
padding-left: 5px;
color: var(--color-first);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price .b-total p span {
font-size: 0.75rem;
font-weight: normal;
color: var(--color-txtg4);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk .b-sum-price .b-total .txt-name {
font-size: 0.88rem;
font-weight: normal;
padding-bottom: 3px;
color: var(--color-txtg);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 0 0;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding-bottom: 8px;
margin-bottom: 8px;
border-bottom: 1px solid var(--color-grey3);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate:last-child {
border-bottom: none;
padding-bottom: 0;
margin-bottom: 0;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate .b-name {
position: relative;
width: 100%;
height: auto;
padding-bottom: 2px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate .b-name p {
font-size: 1rem;
font-weight: bold;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate .b-name p span {
font-size: 0.88rem;
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate .b-due-date {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: end;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate .b-due-date .b-txt-due {
position: relative;
width: 60%;
height: auto;
padding-right: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate .b-due-date .b-txt-due p {
font-size: 0.88rem;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate .b-due-date .b-txt-due p span {
font-size: 0.94rem;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate .b-due-date .b-txt-due p .color-date1 {
color: var(--color-red);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate .b-due-date .b-txt-due p .color-date2 {
color: var(--color-first);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate .b-due-date .b-price-due {
position: relative;
width: 40%;
height: auto;
padding-right: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate .b-due-date .b-price-due p {
font-size: 1.13rem;
font-weight: bold;
/* color: var(--color-red2); */
text-align: right;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price .b-spr-duedate .b-due-date .b-price-due p span {
font-size: 0.75rem;
font-weight: normal;
color: var(--color-txtg3);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .total-price-bk {
position: relative;
width: 100%;
height: auto;
display: flex;
flex-wrap: wrap;
flex-direction: row;
align-items: end;
padding-top: 10px;
margin-top: 16px;
border-top: 1px solid var(--color-grey4);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .total-price-bk .name-total {
position: relative;
width: 35%;
height: auto;
padding-right: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .total-price-bk .name-total p {
font-size: 1rem;
font-weight: bold;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .total-price-bk .price-total {
position: relative;
width: 65%;
height: auto;
padding-left: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .total-price-bk .price-total p {
font-size: 1.25rem;
font-weight: bold;
text-align: right;
margin-bottom: -5px;
color: var(--color-red);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .total-price-bk .price-total p span {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg3);
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .b-btn-bk-now {
position: relative;
width: 100%;
height: auto;
padding: 30px 5px 5px 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .b-btn-bk-now .btn-bk {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-green);
border-radius: 5px;
padding: 5px 16px 5px 16px;
cursor: pointer;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .b-btn-bk-now .btn-bk a {
position: relative;
width: 100%;
height: 100%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .b-btn-bk-now .btn-bk p {
font-size: 1.13rem;
font-weight: bold;
color: var(--color-light);
text-align: center;
}
/* ================= warning ================= */
.sc--bk-warning {
position: relative;
width: 100%;
height: auto;
}
.box-pd-wing-bk {
position: relative;
width: 100%;
height: auto;
padding: 16px 0;
}
.box-pd-wing-bk .bg-box-bkwing {
position: relative;
width: 100%;
height: auto;
padding: 12px 16px 12px 16px;
border-radius: 5px;
background-color: var(--color-red1);
border: 1px dashed var(--color-red3);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.box-pd-wing-bk .bg-box-bkwing .title-wing {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.box-pd-wing-bk .bg-box-bkwing .title-wing p {
font-size: 1.13rem;
font-weight: bold;
color: var(--color-red7);
}
.box-pd-wing-bk .bg-box-bkwing .title-wing p i {
color: var(--color-red7);
padding-right: 3px;
}
.box-pd-wing-bk .bg-box-bkwing .dt-wing {
position: relative;
width: 100%;
height: auto;
padding-top: 3px;
}
.box-pd-wing-bk .bg-box-bkwing .dt-wing p {
font-size: 0.88rem;
color: var(--color-red7);
text-indent: 25px;
}
.size--mb-pg-bk {
display: none;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--spr-lrbk .box--bk-lr .b-bk-l {
width: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r {
width: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-bk50 {
width: 100%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-nbtvbk {
width: 100%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk:nth-child(odd) {
padding-right: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk:nth-child(even) {
padding-left: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .img-pg figure {
width: 70%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--spr-lrbk .box--bk-lr .b-bk-l {
width: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r {
width: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-bk50 {
width: 100%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-nbtvbk {
width: 100%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk:nth-child(odd) {
padding-right: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk:nth-child(even) {
padding-left: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .img-pg figure {
width: 80%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--spr-lrbk .box--bk-lr .b-bk-l {
width: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r {
width: 50%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-bk50 {
width: 100%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-nbtvbk {
width: 100%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk:nth-child(odd) {
padding-right: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk:nth-child(even) {
padding-left: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .img-pg figure {
width: 80%;
}
/* .sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip {
margin-bottom: 16px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view {
display: grid;
grid-template-columns: 1fr 1fr;
grid-auto-flow: dense;
grid-gap: 0 10px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
grid-column-end: span 2;
grid-row-end: span 1;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .img-pg {
width: 30%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk .dt-pg {
width: 70%;
padding-left: 12px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .price-bk {
padding: 0 10px;
grid-column-end: span 1;
grid-row-end: span 2;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .commission-bk {
padding: 0 10px;
grid-column-end: span 1;
grid-row-end: span 1;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .sum-price-bk {
padding: 10px 10px 0 10px;
grid-column-end: span 1;
grid-row-end: span 1;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .duedate-price {
grid-column-end: span 2;
grid-row-end: span 1;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .total-price-bk {
grid-column-end: span 2;
grid-row-end: span 1;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .b-btn-bk-now {
grid-column-end: span 2;
grid-row-end: span 1;
} */
}
@media (min-width: 0px) and (max-width: 500px) {
.box-pd-wing-bk {
padding-bottom: 0;
width: calc();
}
.sc--spr-lrbk .box--bk-lr .b-bk-l {
width: 100%;
padding-right: 0;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r {
width: 100%;
padding-left: 0;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-bk50 {
width: 100%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .size-nbtvbk {
width: 100%;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk:nth-child(odd) {
padding-right: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip .b-view-bk .view-dt .b-nb-tv-bk:nth-child(even) {
padding-left: 5px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-l .b-bg-bk-ip {
margin-bottom: 16px;
}
.sc--spr-lrbk .box--bk-lr .b-bk-r .b-bg-bk-view .dt-pg-bk {
display: none;
}
.size--mb-pg-bk {
display: block;
position: relative;
width: auto;
height: auto;
margin: 16px 16px 5px 16px;
padding: 16px;
background-color: var(--color-light);
border-radius: 5px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.size--mb-pg-bk .dt-pg-bk {
position: relative;
width: 100%;
height: auto;
/* padding-bottom: 10px;
margin-bottom: 10px; */
}
.size--mb-pg-bk .dt-pg-bk .img-pg {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
}
.size--mb-pg-bk .dt-pg-bk .img-pg figure {
position: relative;
width: 100%;
height: auto;
margin: 0 auto;
}
.size--mb-pg-bk .dt-pg-bk .img-pg figure .size-img {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
}
.size--mb-pg-bk .dt-pg-bk .dt-pg {
position: relative;
width: 100%;
height: auto;
}
.size--mb-pg-bk .dt-pg-bk .dt-pg .name {
position: relative;
width: 100%;
height: auto;
padding: 1px 0 5px 5px;
}
.size--mb-pg-bk .dt-pg-bk .dt-pg .name p {
font-size: 0.94rem;
font-weight: bold;
}
.size--mb-pg-bk .dt-pg-bk .dt-pg .dt {
position: relative;
width: 100%;
height: auto;
padding: 3px 0 2px 16px;
}
.size--mb-pg-bk .dt-pg-bk .dt-pg .dt p {
font-size: 0.88rem;
padding-bottom: 2px;
}
.size--mb-pg-bk .dt-pg-bk .dt-pg .dt .code-pg {
color: var(--color-first);
}
.size--mb-pg-bk .dt-pg-bk .dt-pg .dt p span {
font-weight: bold;
}
}
/* ================= warning 2 ================= */
.sc--bk-warning2 {
position: relative;
width: 100%;
height: auto;
}
.box-pd-wing-bk2 {
position: relative;
width: 100%;
height: auto;
padding: 0 0 16px 0;
}
.box-pd-wing-bk2 .bg-box-bkwing {
position: relative;
width: 100%;
height: auto;
padding: 12px 16px 12px 16px;
border-radius: 5px;
background-color: var(--color-red1);
border: 1px dashed var(--color-red3);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.box-pd-wing-bk2 .bg-box-bkwing .title-wing {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.box-pd-wing-bk2 .bg-box-bkwing .title-wing p {
font-size: 1.13rem;
font-weight: bold;
color: var(--color-red7);
}
.box-pd-wing-bk2 .bg-box-bkwing .title-wing p i {
color: var(--color-red7);
padding-right: 3px;
}
.box-pd-wing-bk2 .bg-box-bkwing .dt-wing {
position: relative;
width: 100%;
height: auto;
padding-top: 3px;
}
.box-pd-wing-bk2 .bg-box-bkwing .dt-wing p {
font-size: 0.88rem;
color: var(--color-red7);
text-indent: 25px;
}
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
.pdtb-box-wing-16 {
padding: 16px 0;
}
.pdb-box-wing-16 {
padding: 0 0 16px 0;
}
/* ================= warning 3 ================= */
.sc--bk-warning3 {
position: relative;
width: 100%;
height: auto;
}
.box-pd-wing-bk3 {
position: relative;
width: 100%;
height: auto;
}
.box-pd-wing-bk3 .bg-box-bkwing {
position: relative;
width: 100%;
height: auto;
padding: 12px 16px 12px 16px;
border-radius: 5px;
background-color: rgba(var(--color-fourth-rgb), 0.2);
border: 1px dashed var(--color-fourth);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.box-pd-wing-bk3 .bg-box-bkwing .title-wing {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.box-pd-wing-bk3 .bg-box-bkwing .title-wing p {
font-size: 1.13rem;
font-weight: bold;
color: var(--color-fifth);
}
.box-pd-wing-bk3 .bg-box-bkwing .title-wing p i {
color: var(--color-fifth);
padding-right: 3px;
}
.box-pd-wing-bk3 .bg-box-bkwing .dt-wing {
position: relative;
width: 100%;
height: auto;
padding-top: 3px;
}
.box-pd-wing-bk3 .bg-box-bkwing .dt-wing p {
font-size: 0.88rem;
color: var(--color-txtg);
text-indent: 25px;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.pdtb-box-wing-16 {
padding-bottom: 0;
}
}
/* ================= warning 4 ================= */
.sc--bk-warning4 {
position: relative;
width: 100%;
height: auto;
}
.box-pd-wing-bk4 {
position: relative;
width: 100%;
height: auto;
padding: 0 0 16px 0;
}
.box-pd-wing-bk4 .bg-box-bkwing {
position: relative;
width: 100%;
height: auto;
padding: 12px 16px 12px 16px;
border-radius: 5px;
background-color: rgba(var(--color-green-rgb), 0.15);
border: 1px dashed var(--color-green);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.box-pd-wing-bk4 .bg-box-bkwing .title-wing {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.box-pd-wing-bk4 .bg-box-bkwing .title-wing p {
font-size: 1.13rem;
font-weight: bold;
color: var(--color-green);
}
.box-pd-wing-bk4 .bg-box-bkwing .title-wing p i {
color: var(--color-green);
padding-right: 3px;
}
.box-pd-wing-bk4 .bg-box-bkwing .dt-wing {
position: relative;
width: 100%;
height: auto;
padding-top: 3px;
}
.box-pd-wing-bk4 .bg-box-bkwing .dt-wing p {
font-size: 0.88rem;
color: var(--color-txtg);
text-indent: 25px;
}
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ================= list booking ================= */
.sc--list-booking {
position: relative;
width: 100%;
height: auto;
}
.sc--list-booking .box--bg-lbk {
position: relative;
width: 100%;
height: auto;
}
.sc--list-booking .box--bg-lbk .box-list-bk {
position: relative;
width: 100%;
height: auto;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk {
position: relative;
width: 100%;
height: auto;
max-height: 14.125rem;
border: 1px solid var(--color-grey3);
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
cursor: pointer;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
cursor: pointer;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk a {
position: relative;
width: 100%;
height: 100%;
max-height: 14rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-img {
position: relative;
width: 14rem;
height: 14rem;
overflow: hidden;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-img figure {
width: 100%;
height: 100%;
max-height: 14rem;
overflow: hidden;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details {
position: relative;
width: calc(100% - 14rem);
height: fit-content;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 14px;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-status-datebk {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
padding: 10px 0 5px 0;
margin-bottom: 3px;
border-bottom: 1px dashed var(--color-grey4);
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-status-datebk .b-status {
position: relative;
width: auto;
height: auto;
padding-right: 10px;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-status-datebk .b-status p {
font-size: 0.94rem;
color: var(--color-txtg5);
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-status-datebk .b-status p span {
font-weight: bold;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-status-datebk .b-datebk {
position: relative;
width: auto;
height: auto;
padding-left: 10px;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-status-datebk .b-datebk p {
font-size: 0.82rem;
color: var(--color-txtg4);
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-name {
position: relative;
width: 100%;
height: auto;
margin: 10px 0;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-name p {
font-size: 1rem;
font-weight: bold;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk:hover .b-details .b-name p {
color: var(--color-first);
transition: all 0.3s ease;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-dt {
position: relative;
height: auto;
padding: 0 5px;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-dt p {
font-size: 0.88rem;
padding-bottom: 5px;
font-weight: bold;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-dt p .txt-name-tl {
font-weight: normal;
color: var(--color-txtg5);
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .sb-dt1 {
width: 50%;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .sb-dt2 {
width: 50%;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-price {
position: relative;
width: 100%;
height: auto;
padding: 10px 5px 0 5px;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-price p {
font-size: 0.75rem;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-price .number-price {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-red);
margin-top: -5px;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-price p span {
font-size: 0.75rem;
font-weight: normal;
color: var(--color-txtg4);
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-details .b-price p .price-full {
font-size: 0.75rem;
font-weight: normal;
color: var(--color-txtg5);
padding-left: 5px;
text-decoration: line-through;
}
.color-status-query {
color: var(--color-yellow);
}
.color-status-inprogress {
color: var(--color-blue4);
}
.color-status-deposit {
color: var(--color-blue6);
}
.color-status-fullprice {
color: var(--color-green6);
}
.color-status-cancelbooking {
color: var(--color-red);
}
.color-status-reserve {
color: var(--color-yellow6);
}
.color-status-confirmbooking {
color: var(--color-green4);
}
/* hover image */
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk .b-img figure .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.sc--list-booking .box--bg-lbk .box-list-bk .list-bk:hover .b-img figure .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ================= status list bookings ================= */
.sc--status-list-bk {
position: relative;
width: 100%;
height: auto;
}
.sc--status-list-bk .b-bg-st-list-bg {
position: relative;
width: 100%;
height: auto;
padding: 16px;
background-color: var(--color-light);
border-radius: 5px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--status-list-bk .b-bg-st-list-bg .title-st {
position: relative;
width: 100%;
height: auto;
padding: 0 0 10px 3px;
}
.sc--status-list-bk .b-bg-st-list-bg .title-st p {
font-size: 1.13rem;
font-weight: bold;
text-align: center;
}
.sc--status-list-bk .b-bg-st-list-bg .list-st {
position: relative;
width: 100%;
height: auto;
}
.sc--status-list-bk .b-bg-st-list-bg .list-st .btn-st {
position: relative;
width: 100%;
height: auto;
padding: 5px 12px 5px 12px;
border: 1px solid var(--color-grey4);
border-radius: 5px;
margin-bottom: 7px;
cursor: pointer;
}
.sc--status-list-bk .b-bg-st-list-bg .list-st .btn-st a {
position: relative;
width: 100%;
height: auto;
}
.sc--status-list-bk .b-bg-st-list-bg .list-st .btn-st p {
font-size: 0.94rem;
}
.sc--status-list-bk .b-bg-st-list-bg .list-st .btn-st:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.sc--status-list-bk .b-bg-st-list-bg .list-st .btn-st:hover p {
color: var(--color-first);
transition: all 0.3s ease;
}
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ================= booking list ================= */
.bg--w-bookinglist {
background-color: var(--color-light);
}
.title--mbkl-b {
position: relative;
width: 100%;
height: auto;
margin: 10px 0 8px 5px;
}
.title--mbkl-b p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-txtg);
}
.box--total-booking-all {
position: relative;
width: 100%;
height: auto;
margin: 5px 0 20px 0;
}
.spr--box-total-bk {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box--bk-spr {
position: relative;
width: calc((100%/3) - 10px);
height: auto;
border: 1px solid var(--color-first);
border-radius: 5px;
background-color: var(--color-light);
margin-right: 15px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
display: flex;
flex-wrap: nowrap;
flex-direction: column;
}
.box--bk-spr:last-child {
margin-right: 0;
}
.box--bk-spr .box--title-head {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-first);
padding: 5px 12px 4px 12px;
}
.box--bk-spr .box--title-head p {
font-size: 1rem;
font-weight: bold;
color: var(--color-light);
}
.box--bk-spr .box--dt-total {
position: relative;
width: 100%;
height: auto;
padding: 6px;
margin: auto 0;
}
.box--bk-spr .box--dt-total .list--dt-tt {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
margin: 10px 0;
align-items: flex-end;
}
.box--bk-spr .box--dt-total .list--dt-tt:first-child {
margin-top: 2px;
}
.box--bk-spr .box--dt-total .list--dt-tt:last-child {
margin-bottom: 5px;
}
.box--bk-spr .box--dt-total .list--dt-tt .b-txt-l {
position: relative;
width: auto;
max-width: 40%;
height: auto;
}
.box--bk-spr .box--dt-total .list--dt-tt .b-txt-l p {
font-size: 0.94rem;
color: var(--color-txtg);
}
.box--bk-spr .box--dt-total .list--dt-tt .b-number-r {
position: relative;
width: auto;
max-width: 60%;
height: auto;
}
.box--bk-spr .box--dt-total .list--dt-tt .b-number-r p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-red);
margin-bottom: -5px;
}
.box--bk-spr .box--dt-total .list--dt-tt .b-number-r p .txt--currency {
font-size: 0.81rem;
font-weight: normal;
}
.box--bk-spr .box--dt-total .list--dt-overdue {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
margin: 10px 0;
align-items: flex-end;
}
.box--bk-spr .box--dt-total .list--dt-overdue .b-txt-l {
position: relative;
width: auto;
max-width: 40%;
height: auto;
}
.box--bk-spr .box--dt-total .list--dt-overdue .b-txt-l p {
font-size: 0.94rem;
color: var(--color-txtg);
}
.box--bk-spr .box--dt-total .list--dt-overdue .b-number-r {
position: relative;
width: auto;
max-width: 60%;
height: auto;
}
.box--bk-spr .box--dt-total .list--dt-overdue .b-number-r p {
font-size: 1.5rem;
font-weight: bold;
color: var(--color-red);
margin-bottom: -8px;
}
.box--bk-spr .box--dt-total .list--dt-overdue .b-number-r p .txt--currency {
font-size: 0.81rem;
font-weight: normal;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.box--bk-spr {
width: calc((100%/2) - 7.5px);
margin-bottom: 10px;
}
.box--bk-spr:first-child {
width: 100%;
margin-right: 0;
}
.box--bk-spr:last-child {
margin-right: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box--bk-spr {
width: 100%;
margin-right: 0;
margin-bottom: 10px;
}
.box--bk-spr:last-child {
margin-bottom: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.box--bk-spr {
width: 100%;
margin-right: 0;
margin-bottom: 10px;
}
.box--bk-spr:last-child {
margin-bottom: 0;
}
}
.box--bkl-status-search {
position: relative;
width: 100%;
height: auto;
margin: 30px 0 16px 0;
}
.box--search-bkl {
position: relative;
width: 100%;
height: auto;
margin: 0 0 20px 0;
}
.b--txt-search-bkl {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
padding: 0 0 16px 0;
}
.b--txt-search-bkl .txt--l {
position: relative;
width: auto;
max-width: 3.5rem;
height: auto;
padding: 0 5px 0 0;
}
.b--txt-search-bkl .txt--l p {
font-size: 0.94rem;
color: var(--color-txtg);
margin-bottom: -3px;
}
.b--txt-search-bkl .input--r {
position: relative;
width: auto;
max-width: calc(100% - 3.5rem);
height: auto;
padding: 0 16px 0 5px;
}
.b--txt-search-bkl .input--r input {
position: relative;
border: 1px solid var(--color-first);
border-radius: 5px;
font-size: 0.94rem;
color: var(--color-txtg);
background-color: var(--color-light);
padding: 5px 12px 4px 12px;
width: 35rem;
height: auto;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.b--date-bkl {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
}
.b--date-bkl .b--cb-rdo-shbkl {
position: relative;
width: auto;
height: auto;
display: flex;
align-items: center;
padding: 0 16px 0 0;
}
.b--date-bkl .b--cb-rdo-shbkl input {
font-size: 1rem;
color: var(--color-first);
accent-color: var(--color-first);
cursor: pointer;
}
.b--date-bkl .b--cb-rdo-shbkl label {
position: relative;
font-size: 0.94rem;
padding: 0 0 0 5px;
cursor: pointer;
color: var(--color-txtg);
}
.b--date-bkl .b--cb-rdo-shbkl-rdo {
position: relative;
width: auto;
height: auto;
display: flex;
align-items: center;
padding: 0 16px 0 5px;
}
.b--date-bkl .b--cb-rdo-shbkl-rdo input {
font-size: 1rem;
color: var(--color-first);
accent-color: var(--color-first);
cursor: pointer;
}
.b--date-bkl .b--cb-rdo-shbkl-rdo label {
position: relative;
font-size: 0.94rem;
padding: 0 0 0 5px;
cursor: pointer;
color: var(--color-txtg);
}
.b--date-bkl .b--cb-rdo-shbkl-date {
position: relative;
width: auto;
height: auto;
display: flex;
align-items: center;
padding: 0 5px 0 10px;
}
.b--date-bkl .b--cb-rdo-shbkl-date p {
font-size: 0.94rem;
padding: 0 6px 0 6px;
color: var(--color-txtg);
}
.b--date-bkl .b--cb-rdo-shbkl-date .bg--input-date-bkl {
position: relative;
width: auto;
height: auto;
border: 1px solid var(--color-first);
border-radius: 5px;
background-color: var(--color-light);
align-items: center;
display: flex;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.b--date-bkl .b--cb-rdo-shbkl-date .bg--input-date-bkl input {
position: relative;
width: 12rem;
height: auto;
border-radius: 5px;
font-size: 0.94rem;
padding: 4px 8px 2px 8px;
}
.b--date-bkl .b--cb-rdo-shbkl-date .bg--input-date-bkl label {
font-size: 1.38rem;
background-color: var(--color-first);
padding: 0 5px 0 7px;
cursor: pointer;
}
.b--date-bkl .b--cb-rdo-shbkl-date .bg--input-date-bkl label i {
color: var(--color-light);
}
.b--date-bkl .b--cb-rdo-shbkl-btn {
position: relative;
width: auto;
height: auto;
padding: 0 0 0 30px;
}
.b--date-bkl .b--cb-rdo-shbkl-btn button {
position: relative;
width: auto;
height: auto;
font-size: 1.13rem;
font-weight: bold;
color: var(--color-light);
background-color: var(--color-first);
border: 1px solid var(--color-first);
border-radius: 5px;
padding: 5px 36px 4px 36px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
cursor: pointer;
}
.b--date-bkl .b--cb-rdo-shbkl-btn button:hover {
color: var(--color-first);
background-color: var(--color-light);
transition: all 0.3s ease;
}
.lines--crusher-bkl {
position: relative;
width: 100%;
height: auto;
border-right: 0;
border-left: 0;
border-top: 0;
border-bottom: 1px;
border-style: solid;
border-image: linear-gradient(to left, rgba(var(--color-light-rgb), 0), var(--color-first), rgba(var(--color-light-rgb), 0)) 100% 1;
}
.box--status-bkl {
position: relative;
width: 100%;
height: auto;
/* margin: 20px 0 0 0; */
}
.box--status-bkl .bg--btn-status-bkl {
position: relative;
width: fit-content;
height: auto;
display: flex;
align-items: center;
background-color: var(--color-second);
border-radius: 5px;
}
.box--status-bkl .bg--btn-status-bkl [type="radio"]:checked,
.box--status-bkl .bg--btn-status-bkl [type="radio"]:not(:checked) {
position: absolute;
left: -9999px;
width: 0;
height: 0;
visibility: hidden;
}
.box--status-bkl .bg--btn-status-bkl .set--radio-checkbox:checked + label,
.box--status-bkl .bg--btn-status-bkl .set--radio-checkbox:not(:checked) + label {
position: relative;
width: auto;
height: auto;
font-size: 0.94rem;
display: inline-block;
border-radius: 5px;
padding: 5px 16px 4px 16px;
overflow: hidden;
cursor: pointer;
text-transform: uppercase;
color: var(--color-first);
-webkit-transition: all 300ms linear;
transition: all 300ms linear;
}
.box--status-bkl .bg--btn-status-bkl .set--radio-checkbox:not(:checked) + label {
background-color: transparent;
}
.box--status-bkl .bg--btn-status-bkl .set--radio-checkbox:checked + label {
background-color: var(--color-first);
color: var(--color-light);
box-shadow: 0 5px 8px 0 rgba(var(--color-dark-rgb), 0.1);
}
.box--status-bkl .bg--btn-status-bkl .set--radio-checkbox:not(:checked) + label:hover {
background-color: rgba(var(--color-first-rgb), 0.7);
color: var(--color-light);
transition: all 0.3s ease;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.b--date-bkl .b--cb-rdo-shbkl-btn {
width: 100%;
padding: 0 16px;
display: flex;
margin-top: 16px;
}
.b--date-bkl .b--cb-rdo-shbkl-btn button {
margin: 0 auto;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.b--date-bkl .b--cb-rdo-shbkl-btn {
width: 100%;
padding: 0 16px;
display: flex;
margin-top: 16px;
}
.b--date-bkl .b--cb-rdo-shbkl-btn button {
margin: 0 auto;
}
.b--date-bkl .b--cb-rdo-shbkl-date .bg--input-date-bkl input {
width: 8rem;
}
/* .box--status-bkl .bg--btn-status-bkl {
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box--status-bkl .bg--btn-status-bkl .set--radio-checkbox:checked + label,
.box--status-bkl .bg--btn-status-bkl .set--radio-checkbox:not(:checked) + label {
width: calc(100%/5);
border: 1px solid rgba(var(--color-grey-rgb), 1);
text-align: center;
} */
}
@media (min-width: 501px) and (max-width: 790px) {
.b--date-bkl .b--cb-rdo-shbkl-btn {
width: 100%;
padding: 0 16px;
display: flex;
margin-top: 16px;
}
.b--date-bkl .b--cb-rdo-shbkl-btn button {
margin: 0 auto;
}
.b--date-bkl .b--cb-rdo-shbkl-date .bg--input-date-bkl input {
width: 7rem;
}
.box--status-bkl .bg--btn-status-bkl {
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box--status-bkl .bg--btn-status-bkl .set--radio-checkbox:checked + label,
.box--status-bkl .bg--btn-status-bkl .set--radio-checkbox:not(:checked) + label {
width: calc(100%/4);
border: 1px solid rgba(var(--color-grey-rgb), 1);
text-align: center;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.b--txt-search-bkl .txt--l {
width: 3.8rem;
max-width: 100%;
}
.b--txt-search-bkl .input--r {
width: calc(100% - 3.8rem);
}
.b--txt-search-bkl .input--r input {
width: 100%;
}
.b--txt-search-bkl .txt--l p {
padding: 0 6px;
}
.b--date-bkl {
justify-content: center;
}
.b--date-bkl .b--cb-rdo-shbkl {
width: calc(100%/3);
padding: 0 10px 12px 10px;
}
.b--date-bkl .b--cb-rdo-shbkl-rdo {
width: calc(100%/3);
padding: 0 10px 12px 10px;
}
.b--date-bkl .b--cb-rdo-shbkl-date {
width: 100%;
padding: 0px;
margin-bottom: 12px;
}
.b--date-bkl .b--cb-rdo-shbkl-date p {
width: 3.8rem;
}
.b--date-bkl .b--cb-rdo-shbkl-date .bg--input-date-bkl {
width: calc(100% - 3.8rem);
}
.b--date-bkl .b--cb-rdo-shbkl-date .bg--input-date-bkl input {
width: 100%;
}
.b--date-bkl .b--cb-rdo-shbkl-btn {
width: 100%;
padding: 0 16px;
display: flex;
margin-top: 5px;
}
.b--date-bkl .b--cb-rdo-shbkl-btn button {
margin: 0 auto;
}
.box--status-bkl .bg--btn-status-bkl {
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box--status-bkl .bg--btn-status-bkl .set--radio-checkbox:checked + label,
.box--status-bkl .bg--btn-status-bkl .set--radio-checkbox:not(:checked) + label {
width: calc(100%/3);
border: 1px solid rgba(var(--color-grey-rgb), 1);
text-align: center;
}
}
.box--bk-history-list {
position: relative;
width: 100%;
height: auto;
margin-bottom: 30px;
}
.list--card-hsr-kb {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-light);
border: 1px solid var(--color-grey2);
border-radius: 5px;
margin: 0 0 12px 0;
padding: 12px 16px;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.list--card-hsr-kb .name--bk-hsr {
position: relative;
width: 100%;
height: auto;
padding: 2px 0 3px 0;
}
.list--card-hsr-kb .name--bk-hsr p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name {
position: relative;
width: 29.5%;
height: auto;
border-right: 1px;
border-left: 0;
border-style: solid;
padding: 0 16px 0 0;
border-image: linear-gradient(to bottom, rgba(var(--color-dark-rgb), 0), var(--color-grey4), rgba(var(--color-dark-rgb), 0)) 1 100%;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .txt--tour-code {
position: relative;
width: auto;
height: auto;
padding: 0 0 5px 0;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .txt--tour-code p {
font-size: 0.86rem;
color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .txt--tour-code p span {
color: var(--color-first);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .txt--bk-code-person {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
padding: 0 0 10px 0;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .txt--bk-code-person .b--code-bk {
position: relative;
width: fit-content;
height: auto;
background-color: var(--color-red);
border-radius: 5px;
padding: 5px 12px 2px 12px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .txt--bk-code-person .b--code-bk p {
font-size: 0.94rem;
color: var(--color-light);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .txt--bk-code-person .b--number-person {
position: relative;
width: fit-content;
height: auto;
padding: 0 0 0 12px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .txt--bk-code-person .b--number-person p {
font-size: 0.88rem;
color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .txt--bk-code-person .b--number-person p i {
font-size: 0.81rem;
color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .b--name-reserve {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-grey2);
border-radius: 5px;
padding: 3px 12px 2px 12px;
margin-bottom: 8px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .b--name-reserve p {
font-size: 0.81rem;
color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .b--name-reserve p span {
color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .b--name-customer {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-grey2);
border-radius: 5px;
padding: 3px 12px 2px 12px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .b--name-customer p {
font-size: 0.81rem;
color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .b--name-customer p span {
color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-period {
position: relative;
width: 13%;
height: auto;
border-right: 1px;
border-left: 0;
border-style: solid;
padding: 0 16px;
display: flex;
border-image: linear-gradient(to bottom, rgba(var(--color-dark-rgb), 0), var(--color-grey4), rgba(var(--color-dark-rgb), 0)) 1 100%;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-period .card--c-pr {
position: relative;
width: auto;
height: auto;
margin: auto;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-period .card--c-pr p {
font-size: 1rem;
text-align: center;
font-weight: bold;
color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-period .card--c-pr .txt-title-pr-bk {
font-size: 0.88rem;
padding-bottom: 3px;
font-weight: normal;
color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-period .card--c-pr p .txt-smb-s {
display: none;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date {
position: relative;
width: 16%;
height: auto;
border-right: 1px;
border-left: 0;
border-style: solid;
padding: 0 16px;
display: flex;
border-image: linear-gradient(to bottom, rgba(var(--color-dark-rgb), 0), var(--color-grey4), rgba(var(--color-dark-rgb), 0)) 1 100%;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date .card--c-pr {
position: relative;
width: auto;
height: auto;
margin: auto;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date .card--c-pr p {
font-size: 1rem;
text-align: center;
color: var(--color-light);
font-weight: bold;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date .card--c-pr .txt-title-pr-bk {
font-size: 0.88rem;
font-weight: normal;
padding-bottom: 3px;
color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date .card--c-pr p span {
position: relative;
width: auto;
height: auto;
padding: 0 16px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date .card--c-pr p .txt-smb-s {
display: none;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date .card--c-pr .b--stt-bk {
position: relative;
width: auto;
height: auto;
border-radius: 5px;
padding: 2px 12px 1px 12px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date .card--c-pr .b--stt-bk p {
font-size: 1rem;
color: var(--color-light);
font-weight: bold;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date .card--c-pr .date-color-b {
background-color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status {
position: relative;
width: 16%;
height: auto;
border-right: 1px;
border-left: 0;
border-style: solid;
padding: 0 16px;
display: flex;
border-image: linear-gradient(to bottom, rgba(var(--color-dark-rgb), 0), var(--color-grey4), rgba(var(--color-dark-rgb), 0)) 1 100%;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr {
position: relative;
width: auto;
height: auto;
margin: auto;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr p {
font-size: 1rem;
font-weight: bold;
text-align: center;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .txt-title-pr-bk {
font-size: 0.88rem;
font-weight: normal;
padding-bottom: 3px;
color: var(--color-txtg);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr p .txt-smb-s {
display: none;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .b--stt-bk {
position: relative;
width: auto;
height: auto;
border-radius: 5px;
padding: 2px 12px 1px 12px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .b--stt-bk p {
font-size: 1rem;
text-align: center;
color: var(--color-light);
font-weight: bold;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .stt-color-bkquery {
background-color: var(--color-icon-yl);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .stt-color-bkinprogress {
background-color: var(--color-blue4);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .stt-color-bkreserve {
background-color: var(--color-yellow6);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .stt-color-bkcfbooking {
background-color: var(--color-green);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .stt-color-bkdeposit {
background-color: var(--color-blue);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .stt-color-bkpaidinfull {
background-color: var(--color-green6);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .stt-color-bkccbooking {
background-color: var(--color-red);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu {
position: relative;
width: 25%;
height: auto;
display: flex;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl {
position: relative;
width: auto;
height: auto;
padding: 0 0 0 16px;
margin: auto 0 auto auto;
align-items: center;
display: flex;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl button {
position: relative;
width: 3rem;
height: 3rem;
cursor: pointer;
padding: 12px 12px 8px 12px;
border-radius: 5px;
margin-right: 8px;
text-align: center;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl button:last-child {
margin-right: 0;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl button i {
font-size: 1.19rem;
font-weight: bold;
color: var(--color-light);
text-align: center;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl button .tooltiptext {
visibility: hidden;
position: absolute;
width: auto;
background-color: var(--color-dark);
color: var(--color-light);
font-size: 0.75rem;
text-align: center;
padding-top: 3px;
padding-bottom: 1px;
padding-left: 10px;
padding-right: 10px;
border-radius: 5px;
z-index: 1;
bottom: 115%;
left: 50%;
transform: translate(-50%, 0);
white-space: nowrap;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl button .tooltiptext::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: var(--color-dark) transparent transparent transparent;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl button:hover .tooltiptext {
visibility: visible;
transition: .3s linear;
}
.pdbtn-mnbkl {
padding: 12px 12px 8px 12px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .b-btn-mn-opmd {
position: relative;
width: 3rem;
height: 3rem;
cursor: pointer;
/* padding: 12px 12px 8px 12px; */
border-radius: 5px;
margin-right: 8px;
text-align: center;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .b-btn-mn-opmd:last-child {
margin-right: 0;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .b-btn-mn-opmd i {
font-size: 1.19rem;
font-weight: bold;
color: var(--color-light);
text-align: center;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .b-btn-mn-opmd a {
position: relative;
width: 100%;
height: 100%;
display: flex;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .b-btn-mn-opmd a i {
margin: auto;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .b-btn-mn-opmd .tooltiptext {
visibility: hidden;
position: absolute;
width: auto;
background-color: var(--color-dark);
color: var(--color-light);
font-size: 0.75rem;
text-align: center;
padding-top: 3px;
padding-bottom: 1px;
padding-left: 10px;
padding-right: 10px;
border-radius: 5px;
z-index: 1;
bottom: 115%;
left: 50%;
transform: translate(-50%, 0);
white-space: nowrap;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .b-btn-mn-opmd .tooltiptext::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: var(--color-dark) transparent transparent transparent;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .b-btn-mn-opmd:hover .tooltiptext {
visibility: visible;
transition: .3s linear;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .b-btn-mn-opmd.disabled {
pointer-events: none;
cursor: default;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menuvt {
background-color: var(--color-green);
border: 1px solid var(--color-green);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menuiv {
background-color: var(--color-red);
border: 1px solid var(--color-red);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menupg {
background-color: var(--color-icon-yl);
border: 1px solid var(--color-icon-yl);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menupm {
background-color: var(--color-blue);
border: 1px solid var(--color-blue);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menucc {
background-color: var(--color-txtg5);
border: 1px solid var(--color-txtg5);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menutvl {
background-color: var(--color-first);
border: 1px solid var(--color-first);
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menuvt:hover {
background-color: var(--color-light);
border: 1px solid var(--color-green);
color: var(--color-green);
transition: all 0.3s ease;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menuvt:hover i {
color: var(--color-green);
transition: all 0.3s ease;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menuiv:hover {
background-color: var(--color-light);
border: 1px solid var(--color-red);
color: var(--color-red);
transition: all 0.3s ease;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menuiv:hover i {
color: var(--color-red);
transition: all 0.3s ease;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menupg:hover {
background-color: var(--color-light);
border: 1px solid var(--color-icon-yl);
color: var(--color-icon-yl);
transition: all 0.3s ease;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menupg:hover i {
color: var(--color-icon-yl);
transition: all 0.3s ease;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menupm:hover {
background-color: var(--color-light);
border: 1px solid var(--color-blue);
color: var(--color-blue);
transition: all 0.3s ease;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menupm:hover i {
color: var(--color-blue);
transition: all 0.3s ease;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menucc:hover {
background-color: var(--color-light);
border: 1px solid var(--color-txtg5);
color: var(--color-txtg5);
transition: all 0.3s ease;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menucc:hover i {
color: var(--color-txtg5);
transition: all 0.3s ease;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menutvl:hover {
background-color: var(--color-light);
border: 1px solid var(--color-first);
color: var(--color-first);
transition: all 0.3s ease;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl .color-btn-menutvl:hover i {
color: var(--color-first);
transition: all 0.3s ease;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name {
width: 40%;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-period {
width: 20%;
padding: 0 12px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date {
width: 20%;
padding: 0 12px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status {
width: 20%;
padding: 0 12px;
border-right: none;
border-style: none;
border-image: none;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu {
width: 100%;
padding-top: 16px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl {
margin: 0 auto;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-period .card--c-pr p,
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date .card--c-pr .b--stt-bk p,
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .b--stt-bk p {
font-size: 0.94rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name {
width: 40%;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-period {
width: 20%;
padding: 0 12px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date {
width: 20%;
padding: 0 12px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status {
width: 20%;
padding: 0 12px;
border-right: none;
border-style: none;
border-image: none;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu {
width: 100%;
padding-top: 16px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl {
margin: 0 auto;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-period .card--c-pr p,
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date .card--c-pr .b--stt-bk p,
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .b--stt-bk p {
font-size: 0.94rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.list--card-hsr-kb .name--bk-hsr {
padding-bottom: 5px;
}
.list--card-hsr-kb .name--bk-hsr p {
font-size: 1.13rem;
text-align: center;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .txt--bk-code-person .b--code-bk p {
font-size: 0.81rem;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name {
width: 100%;
padding: 0;
border-right: none;
border-style: none;
border-image: none;
padding-bottom: 10px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-period .card--c-pr .txt-title-pr-bk {
font-size: 0.81rem;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-period .card--c-pr p {
font-size: 0.81rem;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-period {
width: calc(100%/3);
padding: 0 12px 10px 12px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date {
width: calc(100%/3);
padding: 0 12px 10px 12px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date .card--c-pr .txt-title-pr-bk {
font-size: 0.81rem;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-date .card--c-pr .b--stt-bk p {
font-size: 0.81rem;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status {
width: calc(100%/3);
padding: 0 12px 10px 12px;
border-right: none;
border-style: none;
border-image: none;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .txt-title-pr-bk {
font-size: 0.81rem;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-status .card--c-pr .b--stt-bk p {
font-size: 0.81rem;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu {
width: 100%;
padding-top: 16px;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-menu .b--btn-menu-bkl {
margin: 0 auto;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .txt--tour-code p {
text-align: center;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .txt--bk-code-person {
justify-content: center;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .b--name-reserve p {
text-align: center;
}
.list--card-hsr-kb .dt--bk-hsr .spr--dt-name .b--name-customer p {
text-align: center;
}
}
/* ================= modal ================= */
.set--modal--bk--all {
position: relative;
width: 100%;
height: auto;
}
.modal--dt-box {
position: fixed;
top: 0;
left: 0;
display: flex;
align-items: center;
justify-content: center;
height: 0vh;
background-color: transparent;
overflow: hidden;
transition: background-color 0.25s ease;
z-index: 9999;
}
.modal--dt-box.open {
position: fixed;
width: 100%;
height: 100%;
background-color: rgba(var(--color-dark-rgb), 0.5);
transition: background-color 0.25s;
}
.modal--dt-box.open>.b--open-md-bkl {
transform: scale(1);
}
.modal--dt-box .b--open-md-bkl {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
width: 70%;
height: 95%;
margin: 0;
background-color: var(--color-grey1);
box-shadow: 0 0 2.5rem rgba(var(--color-dark-rgb), 0.5);
transform: scale(0);
transition: transform 0.25s;
transition-delay: 0.15s;
border-radius: 10px;
overflow: hidden;
}
.head--modal-bkl {
position: relative;
width: 100%;
height: auto;
padding-left: 20px;
padding-right: 10px;
padding-top: 6px;
padding-bottom: 4px;
}
.head--modal-bkl .spr--head-md-bkl {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
align-items: center;
}
.head--modal-bkl .spr--head-md-bkl .txt-title-head-md-l {
position: relative;
width: calc(100% - 50px);
height: auto;
}
.head--modal-bkl .spr--head-md-bkl .txt-title-head-md-l p {
font-size: 1.25rem;
color: var(--color-light);
font-weight: bold;
}
.head--modal-bkl .spr--head-md-bkl .txt-title-head-md-l p span {
font-size: 1rem;
color: var(--color-light);
font-weight: normal;
}
.head--modal-bkl .spr--head-md-bkl .btn-close-md-r {
position: relative;
width: 50px;
height: auto;
display: flex;
}
.head--modal-bkl .spr--head-md-bkl .btn-close-md-r p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-light);
text-align: right;
display: flex;
margin: 0 0 0 auto;
padding: 6px;
}
.head--modal-bkl .spr--head-md-bkl .btn-close-md-r p i {
color: var(--color-light);
cursor: pointer;
}
.bg--color-head-bkl1 {
background-color: var(--color-first);
}
.bg--color-head-bkl2 {
background-color: var(--color-first);
}
.bg--color-head-bkl3 {
background-color: var(--color-first);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.modal--dt-box .b--open-md-bkl {
width: 90%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.modal--dt-box .b--open-md-bkl {
width: 90%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.modal--dt-box .b--open-md-bkl {
width: 90%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.modal--dt-box .b--open-md-bkl {
width: 100%;
height: 100%;
border-radius: 0;
}
}
.scroll-box-md-y-bkl {
overflow-y: scroll;
}
.scroll-box-md-y-bkl::-webkit-scrollbar {
display: none;
}
.scroll-box-md-y-bkl {
-ms-overflow-style: none;
scrollbar-width: none;
}
.content--modal-bkl {
position: relative;
width: 100%;
height: auto;
padding: 20px;
}
.content--modal-bkl .box--view-dt-list {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
padding: 10px 16px;
margin: 0 0 12px 0;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.content--modal-bkl .box--view-dt-list .title--list {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
}
.content--modal-bkl .box--view-dt-list .title--list p {
font-size: 1.07rem;
font-weight: bold;
color: var(--color-txtg);
text-decoration: underline;
text-align: center;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list {
position: relative;
width: 50%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 5px;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .txt--name {
position: relative;
width: auto;
height: auto;
padding: 0 10px 0 0;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .txt--name p {
font-size: 0.94rem;
color: var(--color-txtg6);
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .--spr-- {
position: relative;
width: 20px;
height: auto;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .--spr-- p {
font-size: 0.94rem;
color: var(--color-txtg6);
text-align: center;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .txt--dt {
position: relative;
width: auto;
height: auto;
padding: 0 20px 0 5px;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .txt--dt p {
font-size: 0.94rem;
color: var(--color-first);
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .size--wset1t-bkl {
width: 18%;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .size--wset1d-bkl {
width: calc(82% - 20px);
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .size--wset2t-bkl {
width: 23.5%;
/* width: 22%; */
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .size--wset2d-bkl {
width: calc(76.5% - 20px);
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .txt--name {
position: relative;
width: auto;
height: auto;
padding: 0 10px 0 0;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .txt--name p {
font-size: 0.94rem;
color: var(--color-txtg6);
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .--spr-- {
position: relative;
width: 20px;
height: auto;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .--spr-- p {
font-size: 0.94rem;
color: var(--color-txtg6);
text-align: center;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .txt--dt {
position: relative;
width: auto;
height: auto;
padding: 0 20px 0 5px;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .txt--dt p {
font-size: 0.94rem;
color: var(--color-first);
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .size--wset1t-bkl {
width: 11.75%;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .size--wset1d-bkl {
width: calc(88.25% - 20px);
}
.content--modal-bkl .box--view-dt-list .dt--tv-list {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list {
position: relative;
width: 50%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 5px;
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .txt--name {
position: relative;
width: auto;
height: auto;
padding: 0 10px 0 0;
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .txt--name p {
font-size: 0.94rem;
color: var(--color-txtg6);
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .--spr-- {
position: relative;
width: 20px;
height: auto;
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .--spr-- p {
font-size: 0.94rem;
color: var(--color-txtg6);
text-align: center;
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .txt--dt {
position: relative;
width: auto;
height: auto;
padding: 0 20px 0 5px;
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .txt--dt p {
font-size: 0.94rem;
color: var(--color-first);
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .size--wset1t-bkl {
width: 18%;
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .size--wset1d-bkl {
width: calc(82% - 20px);
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .size--wset2t-bkl {
width: 22%;
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .size--wset2d-bkl {
width: calc(78% - 20px);
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list {
position: relative;
width: 100%;
height: auto;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
align-items: flex-end;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--name {
position: relative;
width: 30%;
height: auto;
padding: 0 12px 0 0;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--name p {
font-size: 0.94rem;
color: var(--color-txtg5);
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--price {
position: relative;
width: 20%;
height: auto;
padding: 0 12px 0 12px;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--price p {
font-size: 1rem;
font-weight: bold;
color: var(--color-first);
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--price p span {
font-size: 0.75rem;
color: var(--color-txtg5);
font-weight: normal;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--person {
position: relative;
width: 20%;
height: auto;
padding: 0 12px 0 12px;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--person p {
font-size: 1rem;
font-weight: bold;
color: var(--color-first);
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--person p span {
font-size: 0.75rem;
color: var(--color-txtg5);
font-weight: normal;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--total {
position: relative;
width: 30%;
height: auto;
padding: 0 0 0 12px;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--total p {
font-size: 1rem;
font-weight: bold;
color: var(--color-first);
text-align: right;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--total p span {
font-size: 0.75rem;
color: var(--color-txtg5);
font-weight: normal;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
align-items: flex-end;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--name {
position: relative;
width: 30%;
height: auto;
padding: 0 12px 0 0;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--name p {
font-size: 0.94rem;
color: var(--color-red);
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--price {
position: relative;
width: 20%;
height: auto;
padding: 0 12px 0 12px;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--price p {
font-size: 1rem;
font-weight: bold;
color: var(--color-red);
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--price p span {
font-size: 0.75rem;
color: var(--color-txtg5);
font-weight: normal;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--person {
position: relative;
width: 20%;
height: auto;
padding: 0 12px 0 12px;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--person p {
font-size: 1rem;
font-weight: bold;
color: var(--color-red);
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--person p span {
font-size: 0.75rem;
color: var(--color-txtg5);
font-weight: normal;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--total {
position: relative;
width: 30%;
height: auto;
padding: 0 0 0 12px;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--total p {
font-size: 1rem;
font-weight: bold;
color: var(--color-red);
text-align: right;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--total p span {
font-size: 0.75rem;
color: var(--color-txtg5);
font-weight: normal;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-discount {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
align-items: flex-end;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-discount .txt--name {
position: relative;
width: 50%;
height: auto;
padding: 0 12px 0 0;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-discount .txt--name p {
font-size: 0.94rem;
color: var(--color-red);
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-discount .txt--total {
position: relative;
width: 50%;
height: auto;
padding: 0 0 0 12px;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-discount .txt--total p {
font-size: 1rem;
font-weight: bold;
color: var(--color-red);
text-align: right;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-discount .txt--total p span {
font-size: 0.75rem;
color: var(--color-txtg5);
font-weight: normal;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-netprice {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 10px;
align-items: flex-end;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-netprice .txt--name {
position: relative;
width: 50%;
height: auto;
padding: 0 12px 0 0;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-netprice .txt--name p {
font-size: 0.94rem;
color: var(--color-green6);
font-weight: bold;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-netprice .txt--total {
position: relative;
width: 50%;
height: auto;
padding: 0 0 0 12px;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-netprice .txt--total p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-green6);
text-align: right;
margin-bottom: -5px;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-netprice .txt--total p span {
font-size: 0.75rem;
color: var(--color-txtg5);
font-weight: normal;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .lines--spr-md-- {
position: relative;
margin: 12px 0;
border-right: 0;
border-left: 0;
border-top: 0;
border-bottom: 1px;
border-style: solid;
border-image: linear-gradient(to left, rgba(var(--color-dark-rgb), 0), var(--color-grey5), rgba(var(--color-dark-rgb), 0)) 100% 1;
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file {
position: relative;
width: calc(100%/3);
height: auto;
padding: 5px 16px;
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file button {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
color: var(--color-light);
font-size: 1rem;
padding: 5px 10px 3px 10px;
cursor: pointer;
font-weight: bold;
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file button i {
color: var(--color-light);
padding-right: 5px;
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file .color--btn-dl-file1 {
background-color: var(--color-red);
border: 1px solid var(--color-red);
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file .color--btn-dl-file2 {
background-color: var(--color-blue);
border: 1px solid var(--color-blue);
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file .color--btn-dl-file3 {
background-color: var(--color-orange);
border: 1px solid var(--color-orange);
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file .color--btn-dl-file1:hover {
background-color: var(--color-light);
color: var(--color-red);
transition: all 0.3s ease;
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file .color--btn-dl-file1:hover i {
color: var(--color-red);
transition: all 0.3s ease;
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file .color--btn-dl-file2:hover {
background-color: var(--color-light);
color: var(--color-blue);
transition: all 0.3s ease;
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file .color--btn-dl-file2:hover i {
color: var(--color-blue);
transition: all 0.3s ease;
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file .color--btn-dl-file3:hover {
background-color: var(--color-light);
color: var(--color-orange);
transition: all 0.3s ease;
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file .color--btn-dl-file3:hover i {
color: var(--color-orange);
transition: all 0.3s ease;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .size--wset2t-bkl {
width: 30%;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .size--wset2d-bkl {
width: calc(70% - 20px);
padding: 0 6px;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .size--wset1t-bkl {
width: 15%;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .size--wset1d-bkl {
width: calc(85% - 20px);
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .size--wset1t-bkl {
width: 24%;
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .size--wset1d-bkl {
width: calc(76% - 20px);
}
}
@media (min-width: 0px) and (max-width: 500px) {
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list {
width: 100%;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .size--wset2t-bkl {
width: 26%;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list .size--wset2d-bkl {
width: calc(74% - 20px);
padding: 0 6px;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .size--wset1t-bkl {
width: 26%;
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .size--wset1d-bkl {
width: calc(74% - 20px);
}
.content--modal-bkl .box--view-dt-list .dt--bk-list .spr--list-note .txt--dt {
padding: 0 6px;
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list {
width: 100%;
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .size--wset1t-bkl,
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .size--wset2t-bkl {
width: 26%;
}
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .size--wset1d-bkl,
.content--modal-bkl .box--view-dt-list .dt--tv-list .spr--list .size--wset2d-bkl {
width: calc(74% - 20px);
padding: 0 6px;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--name,
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--price,
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--person,
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--total {
width: 50%;
padding: 0 6px;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list .txt--price p {
text-align: right;
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--name,
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--price,
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--person,
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--total {
width: 50%;
padding: 0 6px;
}
.content--modal-bkl .box--view-dt-list .dt--nbtv-list .spr--list-com .txt--price p {
text-align: right;
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
}
.content--modal-bkl .box--view-dt-list .dt--dlf-list .spr--btn-dl-file {
width: 100%;
padding: 5px;
}
}
.dp--ct-pg {
display: contents;
}
.content--pg-modal-bkl {
position: relative;
width: 100%;
height: auto;
}
.content--pg-modal-bkl .box--precautions-bkl {
position: relative;
width: 100%;
height: auto;
padding: 20px 0 20px 0;
}
.content--pg-modal-bkl .box--precautions-bkl .bg--b-pct-f {
position: absolute;
width: 100%;
height: 5rem;
top: 0;
left: 0;
background-color: var(--color-first);
z-index: 9;
}
.content--pg-modal-bkl .box--precautions-bkl .b--pct {
position: relative;
width: 85%;
height: auto;
background-color: var(--color-red6);
border-radius: 5px;
padding: 10px 16px 12px 16px;
margin: 0 auto;
z-index: 10;
}
.content--pg-modal-bkl .box--precautions-bkl .b--pct .title--pct {
position: relative;
width: 100%;
height: auto;
padding-bottom: 1px;
}
.content--pg-modal-bkl .box--precautions-bkl .b--pct .title--pct p {
font-size: 1.06rem;
font-weight: bold;
color: var(--color-light);
}
.content--pg-modal-bkl .box--precautions-bkl .b--pct .dt--pct {
position: relative;
width: 100%;
height: auto;
padding-left: 12px;
}
.content--pg-modal-bkl .box--precautions-bkl .b--pct .dt--pct p {
font-size: 0.88rem;
color: var(--color-light);
}
.content--pg-modal-bkl .dt--list-pg {
position: relative;
width: 100%;
height: 100%;
padding: 6px 20px 20px 20px;
overflow-y: scroll;
}
.content--pg-modal-bkl .dt--list-pg::-webkit-scrollbar {
display: none;
}
.content--pg-modal-bkl .dt--list-pg {
-ms-overflow-style: none;
scrollbar-width: none;
}
.content--pg-modal-bkl .dt--list-pg .list--pg {
position: relative;
width: 100%;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
border-radius: 5px;
margin-bottom: 10px;
overflow: hidden;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.content--pg-modal-bkl .dt--list-pg .list--pg .img--pg-l {
position: relative;
width: 132px;
height: auto;
padding: 10px 16px;
display: flex;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .img--pg-l figure {
position: relative;
width: 100px;
height: 100px;
margin: auto 0;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .img--pg-l figure .size-img {
position: relative;
width: 100%;
height: 100%;
margin-left: auto;
margin-right: auto;
border-radius: 5px;
object-fit: cover;
cursor: pointer;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r {
position: relative;
width: calc(100% - 132px);
height: auto;
padding: 10px 16px;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r .box--passport-no {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 0 0;
margin-bottom: 12px;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r .box--passport-no .title--ppno {
position: absolute;
width: auto;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
top: 0;
left: 5px;
padding: 0 10px 2px 10px;
z-index: 10;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r .box--passport-no .title--ppno p {
font-size: 0.75rem;
color: var(--color-txtg5);
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r .box--passport-no .input--ppno {
position: relative;
width: 100%;
height: auto;
padding: 7px 12px 5px 12px;
border: 1px solid var(--color-grey4);
border-radius: 5px;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r .box--passport-no .input--ppno input {
position: relative;
width: 100%;
height: auto;
font-size: 0.94rem;
color: var(--color-txtg);
cursor: default;
font-weight: bold;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r .box--passenger-remark {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 0 0;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r .box--passenger-remark .title--psnrm {
position: absolute;
width: auto;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
top: 0;
left: 5px;
padding: 0 10px 2px 10px;
z-index: 10;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r .box--passenger-remark .title--psnrm p {
font-size: 0.75rem;
color: var(--color-txtg5);
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r .box--passenger-remark .input--psnrm {
position: relative;
width: 100%;
height: auto;
padding: 7px 12px 5px 12px;
border: 1px solid var(--color-grey4);
border-radius: 5px;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r .box--passenger-remark .input--psnrm textarea {
position: relative;
width: 100%;
height: auto;
font-size: 0.88rem;
color: var(--color-txtg);
resize: none;
cursor: default;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r ::placeholder {
font-size: 0.81rem;
font-weight: 300;
color: var(--color-txtg1);
}
.content--pg-modal-bkl .footer--pg {
position: relative;
width: 100%;
height: auto;
padding: 16px 16px 10px 16px;
}
.content--pg-modal-bkl .footer--pg .b--btn-upload--pg {
position: relative;
width: 70%;
height: auto;
margin: auto;
}
.content--pg-modal-bkl .footer--pg .b--btn-upload--pg button {
position: relative;
width: 100%;
height: auto;
font-size: 1rem;
border-radius: 5px;
font-weight: bold;
padding: 8px 12px 6px 12px;
color: var(--color-light);
background-color: var(--color-first);
border: 1px solid var(--color-first);
cursor: pointer;
}
.content--pg-modal-bkl .footer--pg .b--btn-upload--pg button i {
font-size: 1rem;
font-weight: bold;
padding-right: 2px;
color: var(--color-light);
}
.content--pg-modal-bkl .footer--pg .b--btn-upload--pg button:hover {
color: var(--color-first);
background-color: var(--color-light);
transition: all 0.3s ease;
}
.content--pg-modal-bkl .footer--pg .b--btn-upload--pg button:hover i {
color: var(--color-first);
transition: all 0.3s ease;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.content--pg-modal-bkl .dt--list-pg .list--pg .img--pg-l {
width: 120px;
padding: 10px;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r {
width: calc(100% - 120px);
padding: 10px;
}
.content--pg-modal-bkl .box--precautions-bkl .b--pct {
width: 93%;
}
}
.modal--dt-box2 {
position: fixed;
top: 0;
left: 0;
display: flex;
align-items: center;
justify-content: center;
height: 0vh;
background-color: transparent;
overflow: hidden;
transition: background-color 0.25s ease;
z-index: 9999;
}
.modal--dt-box2.open {
position: fixed;
width: 100%;
height: 100%;
background-color: rgba(var(--color-dark-rgb), 0.5);
transition: background-color 0.25s;
}
.modal--dt-box2.open>.b--open-md-bkl2 {
transform: scale(1);
}
.modal--dt-box2 .b--open-md-bkl2 {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
width: 60%;
height: 95%;
margin: 0;
background-color: var(--color-grey1);
box-shadow: 0 0 2.5rem rgba(var(--color-dark-rgb), 0.5);
transform: scale(0);
transition: transform 0.25s;
transition-delay: 0.15s;
border-radius: 10px;
overflow: hidden;
}
.dp--ct-pm {
display: contents;
}
.content--pm-modal-bkl {
position: relative;
width: 100%;
height: auto;
}
.content--pm-modal-bkl .box--note-bkl-pm {
position: relative;
width: 100%;
height: auto;
padding: 20px 12px 10px 12px;
background-color: var(--color-first);
}
.content--pm-modal-bkl .box--note-bkl-pm .b--note-pm {
position: relative;
width: 85%;
height: auto;
padding: 10px 16px 12px 16px;
margin: 0 auto;
border-radius: 5px;
background-color: var(--color-red6);
}
.content--pm-modal-bkl .box--note-bkl-pm .b--note-pm .title--npm {
position: relative;
width: 100%;
height: auto;
padding-bottom: 3px;
}
.content--pm-modal-bkl .box--note-bkl-pm .b--note-pm .title--npm p {
font-size: 1.06rem;
font-weight: bold;
color: var(--color-light);
}
.content--pm-modal-bkl .box--note-bkl-pm .b--note-pm .dt--npm {
position: relative;
width: 100%;
height: auto;
padding-left: 12px;
}
.content--pm-modal-bkl .box--note-bkl-pm .b--note-pm .dt--npm p {
font-size: 0.88rem;
color: var(--color-light);
}
.content--pm-modal-bkl .box--total-bkl-pm {
position: relative;
width: 100%;
height: auto;
padding: 10px 12px 20px 12px;
background-color: var(--color-first);
}
.content--pm-modal-bkl .box--total-bkl-pm .total--pm {
position: relative;
width: fit-content;
height: auto;
padding: 5px 16px 4px 16px;
border-radius: 5px;
margin: 0 auto;
}
.content--pm-modal-bkl .box--total-bkl-pm .total--pm .txt-sum {
font-size: 0.81rem;
color: var(--color-light);
margin-bottom: -15px;
}
.content--pm-modal-bkl .box--total-bkl-pm .total--pm .n-total {
font-size: 3rem;
font-weight: bold;
color: var(--color-light);
}
.content--pm-modal-bkl .box--total-bkl-pm .total--pm .txt-currency {
font-size: 0.81rem;
color: var(--color-light);
text-align: right;
margin-top: -15px;
margin-right: 5px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list {
position: relative;
width: 100%;
height: 100%;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
overflow-y: scroll;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list::-webkit-scrollbar {
display: none;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list {
-ms-overflow-style: none;
scrollbar-width: none;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due {
position: relative;
width: calc(40% - 3px);
height: 100%;
padding: 16px;
overflow-y: scroll;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due::-webkit-scrollbar {
display: none;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due {
-ms-overflow-style: none;
scrollbar-width: none;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due {
position: relative;
width: 100%;
height: auto;
padding: 12px 12px 8px 12px;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-ottbl {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-ottbl .paid {
position: relative;
width: calc(50% - 3px);
height: auto;
padding: 10px 12px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-ottbl .paid .txt-paid {
font-size: 0.88rem;
text-align: center;
color: var(--color-txtg);
margin-bottom: -3px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-ottbl .paid .nb-paid {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-green);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-ottbl .paid .nb-paid .currency {
font-size: 0.81rem;
font-weight: normal;
color: var(--color-txtg6);
}
.lines-spr-paid-ottbl {
position: relative;
width: 6px;
height: auto;
display: flex;
}
.lines-spr-paid-ottbl .lines-- {
margin: 0 auto;
height: 100%;
border-right: 0;
border-left: 1px;
border-style: solid;
border-image: linear-gradient(to bottom, rgba(var(--color-dark-rgb), 0), var(--color-grey5), rgba(var(--color-dark-rgb), 0)) 1 100%;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-ottbl .ottbl {
position: relative;
width: calc(50% - 3px);
height: auto;
padding: 10px 12px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-ottbl .ottbl .txt-ottbl {
font-size: 0.88rem;
text-align: center;
color: var(--color-txtg);
margin-bottom: -3px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-ottbl .ottbl .nb-ottbl {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-red);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-ottbl .ottbl .nb-ottbl .currency {
font-size: 0.81rem;
font-weight: normal;
color: var(--color-txtg6);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-due {
position: relative;
width: 100%;
height: auto;
padding: 25px 0 0 0;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-due .list-due {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 6px 8px 6px;
margin-bottom: 12px;
border-top: 0;
border-bottom: 1px;
border-right: 0;
border-left: 0;
border-style: solid;
border-image: linear-gradient(to left, rgba(var(--color-dark-rgb), 0), var(--color-grey5), rgba(var(--color-dark-rgb), 0)) 100% 1;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-due .list-due:last-child {
margin-bottom: 5px;
border-top: 0;
border-bottom: 0;
border-right: 0;
border-left: 0;
border-style: solid;
border-image: linear-gradient(to left, rgba(var(--color-dark-rgb), 0), var(--color-bg7), rgba(var(--color-dark-rgb), 0)) 100% 1;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-due .list-due .txt-pm-due {
position: relative;
width: 50%;
height: auto;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-due .list-due .txt-pm-due p {
font-size: 0.88rem;
color: var(--color-txtg);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-due .list-due .txt-pm-due .txt-date {
font-size: 0.94rem;
font-weight: bold;
color: var(--color-first);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-due .list-due .nb-pm-due {
position: relative;
width: 50%;
height: auto;
display: flex;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-due .list-due .nb-pm-due p {
font-size: 1.25rem;
font-weight: bold;
text-align: right;
color: var(--color-first);
margin: auto 0 auto auto;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due .b--bg-ottbl-due .b-due .list-due .nb-pm-due p .currency {
font-size: 0.81rem;
font-weight: normal;
color: var(--color-txtg5);
}
.box--lines-due-slip {
position: relative;
width: 6px;
height: auto;
display: flex;
}
.box--lines-due-slip .lines--due--slip {
height: 100%;
border-right: 0;
border-left: 1px;
border-style: solid;
border-image: linear-gradient(to bottom, rgba(var(--color-dark-rgb), 0), var(--color-grey6), rgba(var(--color-dark-rgb), 0)) 1 100%;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip {
position: relative;
width: calc(60% - 3px);
height: 100%;
padding: 16px;
overflow-y: scroll;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip::-webkit-scrollbar {
display: none;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip {
-ms-overflow-style: none;
scrollbar-width: none;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip {
position: relative;
width: 100%;
height: auto;
margin-bottom: 12px;
padding: 12px 12px 8px 12px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip:last-child {
margin-bottom: 0;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .name-bank {
position: relative;
width: 100%;
height: auto;
margin-bottom: 5px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .name-bank .b-bg-bank {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
padding: 3px 16px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .name-bank .b-bg-bank p {
font-size: 1.19rem;
font-weight: bold;
color: var(--color-light);
text-align: center;
text-shadow: 3px 2px 6px rgba(var(--color-dark-rgb), 0.3);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .name-bank .color-bank-all {
background-color: var(--color-blue6);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .name-bank .color-bank-ttb {
background: var(--color-bank-ttb1);
background: linear-gradient(90deg, rgba(var(--color-bank-ttb1-rgb),1) 10%, rgba(var(--color-bank-ttb2-rgb),1) 50%, rgba(var(--color-bank-ttb3-rgb),1) 90%);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .name-bank .color-bank-asik {
background-color: var(--color-bank-asik);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .name-bank .color-bank-ktb {
background-color: var(--color-bank-ktb);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .name-bank .color-bank-bbl {
background-color: var(--color-bank-bbl);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .name-bank .color-bank-kbank {
background-color: var(--color-bank-kbank);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .name-bank .color-bank-scb {
background-color: var(--color-bank-scb);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .name-bank .color-bank-bay {
background-color: var(--color-bank-bay);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .img-slip {
position: relative;
width: 116px;
height: auto;
display: flex;
padding: 0 16px 0 0;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .img-slip figure {
position: relative;
width: 100px;
height: 100px;
margin: auto 0;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .img-slip figure .size-img {
position: relative;
width: 100%;
height: 100%;
margin-left: auto;
margin-right: auto;
border-radius: 5px;
object-fit: cover;
cursor: pointer;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm {
position: relative;
width: calc(100% - 116px);
height: auto;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm {
position: relative;
width: 100%;
height: auto;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm .stt-date-refno-spr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm .stt-date-refno-spr .stt-date {
position: relative;
width: calc(50% - 3px);
height: auto;
padding: 12px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm .stt-date-refno-spr .stt-date .b-stt {
position: relative;
width: fit-content;
height: auto;
background-color: var(--color-black6);
border-radius: 5px;
padding: 2px 16px;
margin: 0 auto;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm .stt-date-refno-spr .stt-date .b-stt p {
font-size: 0.81rem;
color: var(--color-light);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm .stt-date-refno-spr .stt-date .b-date {
position: relative;
width: 100%;
height: auto;
padding-top: 8px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm .stt-date-refno-spr .stt-date .b-date p {
font-size: 0.94rem;
font-weight: bold;
color: var(--color-first);
text-align: center;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm .stt-date-refno-spr .stt-date .b-date p .txt--date-pmdue {
font-size: 0.81rem;
font-weight: normal;
color: var(--color-txtg6);
}
.lines-stt-date-refno {
position: relative;
width: 6px;
height: auto;
display: flex;
}
.lines-stt-date-refno .lines-- {
margin: 0 auto;
height: 100%;
border-right: 0;
border-left: 1px;
border-style: solid;
border-image: linear-gradient(to bottom, rgba(var(--color-dark-rgb), 0), var(--color-grey5), rgba(var(--color-dark-rgb), 0)) 1 100%;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm .stt-date-refno-spr .refno {
position: relative;
width: calc(50% - 3px);
height: auto;
padding: 12px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm .stt-date-refno-spr .refno .b-txt-refno {
position: relative;
width: 100%;
height: auto;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm .stt-date-refno-spr .refno .b-txt-refno p {
font-size: 0.88rem;
color: var(--color-txtg6);
text-align: center;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm .stt-date-refno-spr .refno .b-refno {
position: relative;
width: 100%;
height: auto;
padding-top: 8px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .dt-pm .stt-date-refno-spr .refno .b-refno p {
font-size: 1rem;
color: var(--color-first);
font-weight: bold;
text-align: center;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .b-nb-pm {
position: relative;
width: 100%;
height: auto;
margin: 5px 0 5px 0;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .b-nb-pm p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-first);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .b--dtpm .b-nb-pm p span {
font-size: 0.81rem;
font-weight: normal;
color: var(--color-txtg6);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .check--status-pm-slip {
position: relative;
width: 100%;
height: auto;
margin-top: 5px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .check--status-pm-slip .b-stt-pm-slip {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
padding: 4px 16px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .check--status-pm-slip .b-stt-pm-slip p {
font-size: 1rem;
color: var(--color-light);
text-align: center;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .check--status-pm-slip .color-bg-sttpmslip-inspecting {
background-color: var(--color-bg-yl);
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip .list-pm-slip .check--status-pm-slip .color-bg-sttpmslip-confirm {
background-color: var(--color-green);
}
.content--pm-modal-bkl .footer--pm {
position: relative;
width: 100%;
height: auto;
padding: 16px 16px 10px 16px;
}
.content--pm-modal-bkl .footer--pm .b--btn-upload--pm {
position: relative;
width: 70%;
height: auto;
margin: auto;
}
.content--pm-modal-bkl .footer--pm .b--btn-upload--pm button {
position: relative;
width: 100%;
height: auto;
font-size: 1rem;
border-radius: 5px;
font-weight: bold;
padding: 8px 12px 6px 12px;
color: var(--color-light);
background-color: var(--color-first);
border: 1px solid var(--color-first);
cursor: pointer;
}
.content--pm-modal-bkl .footer--pm .b--btn-upload--pm button i {
font-size: 1rem;
font-weight: bold;
padding-right: 2px;
color: var(--color-light);
}
.content--pm-modal-bkl .footer--pm .b--btn-upload--pm button:hover {
color: var(--color-first);
background-color: var(--color-light);
transition: all 0.3s ease;
}
.content--pm-modal-bkl .footer--pm .b--btn-upload--pm button:hover i {
color: var(--color-first);
transition: all 0.3s ease;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.modal--dt-box2 .b--open-md-bkl2 {
width: 90%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.modal--dt-box2 .b--open-md-bkl2 {
width: 90%;
}
.box--lines-due-slip {
display: none;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due {
width: 100%;
height: auto;
overflow-y: hidden;
padding-bottom: 10px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip {
width: 100%;
height: auto;
overflow-y: hidden;
padding-top: 10px;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.modal--dt-box2 .b--open-md-bkl2 {
width: 90%;
}
.box--lines-due-slip {
display: none;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due {
width: 100%;
height: auto;
overflow-y: hidden;
padding-bottom: 10px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip {
width: 100%;
height: auto;
overflow-y: hidden;
padding-top: 10px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.modal--dt-box2 .b--open-md-bkl2 {
width: 100%;
height: 100%;
border-radius: 0;
}
.box--lines-due-slip {
display: none;
}
.content--pm-modal-bkl .box--note-bkl-pm .b--note-pm {
width: 100%;
}
.content--pm-modal-bkl .box--total-bkl-pm {
padding-bottom: 16px;
}
.content--pm-modal-bkl .box--total-bkl-pm .total--pm .n-total {
font-size: 2rem;
}
.content--pm-modal-bkl .box--total-bkl-pm .total--pm .txt-sum {
margin-bottom: -10px;
}
.content--pm-modal-bkl .box--total-bkl-pm .total--pm .txt-currency {
margin-top: -10px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-ottbl--due {
width: 100%;
height: auto;
overflow-y: hidden;
padding-bottom: 10px;
}
.content--pm-modal-bkl .box--spr-ottbl-due-list .box-list--pm-slip {
width: 100%;
height: auto;
overflow-y: hidden;
padding-top: 10px;
}
}
.md--upload-file {
position: fixed;
top: 0;
left: 0;
display: flex;
align-items: flex-end;
justify-content: center;
height: 0vh;
background-color: transparent;
overflow: hidden;
transition: background-color 0.25s ease;
z-index: 9999;
}
.md--upload-file.open {
position: fixed;
width: 100%;
height: 100%;
background-color: rgba(var(--color-dark-rgb), 0.5);
transition: background-color 0.25s;
}
.md--upload-file.open>.st--upload-f {
transform: scale(1);
}
.md--upload-file .st--upload-f {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
width: 49%;
height: auto;
margin: 0;
background-color: var(--color-light);
transform: scale(0);
transition: transform 0.25s;
transition-delay: 0.15s;
border-radius: 10px 10px 0 0;
overflow: hidden;
bottom: 2.5%;
max-height: 95%;
}
.hd--md-uplf {
position: relative;
width: 100%;
height: auto;
padding-left: 20px;
padding-right: 16px;
padding-top: 6px;
padding-bottom: 4px;
background-color: var(--color-first);
}
.hd--md-uplf .spr--hd-md-uplf {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
align-items: center;
}
.hd--md-uplf .spr--hd-md-uplf .-title-hd-md-uplf {
position: relative;
width: calc(100% - 50px);
height: auto;
}
.hd--md-uplf .spr--hd-md-uplf .-title-hd-md-uplf p {
font-size: 0.94rem;
font-weight: bold;
color: var(--color-light);
text-align: center;
}
.hd--md-uplf .spr--hd-md-uplf .-btn-close-md-uplf {
position: relative;
width: 50px;
height: auto;
display: flex;
}
.hd--md-uplf .spr--hd-md-uplf .-btn-close-md-uplf p {
font-size: 1rem;
font-weight: bold;
color: var(--color-light);
text-align: right;
display: flex;
margin: 0 0 0 auto;
padding: 6px;
}
.hd--md-uplf .spr--hd-md-uplf .-btn-close-md-uplf p i {
color: var(--color-light);
cursor: pointer;
}
.b--warning {
position: relative;
width: 100%;
height: auto;
padding: 10px 12px 10px 12px;
}
.b--warning .bg-warning {
position: relative;
width: 85%;
height: auto;
padding: 10px 16px 16px 16px;
margin: 0 auto;
border-radius: 5px;
background-color: var(--color-red6);
z-index: 10;
}
.b--warning .bg-warning .title-wn {
position: relative;
width: 100%;
height: auto;
padding-bottom: 3px;
}
.b--warning .bg-warning .title-wn p {
font-size: 0.94rem;
font-weight: bold;
color: var(--color-light);
}
.b--warning .bg-warning .dt-wn {
position: relative;
width: 100%;
height: auto;
padding-left: 12px;
}
.b--warning .bg-warning .dt-wn p {
font-size: 0.88rem;
color: var(--color-light);
}
.b--warning .bg-free-wn {
position: absolute;
width: 100%;
height: 3.5rem;
background-color: var(--color-first);
top: 0;
left: 0;
z-index: 9;
}
.b--file-ul {
position: relative;
width: 100%;
height: auto;
padding: 10px 20px 20px 20px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.b--file-ul .b-img {
position: relative;
width: 116px;
height: auto;
padding: 0 16px 0 0;
display: flex;
}
.b--file-ul .b-img figure {
position: relative;
width: 100px;
height: 100px;
margin: auto 0;
}
.b--file-ul .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
margin-left: auto;
margin-right: auto;
border-radius: 5px;
object-fit: cover;
cursor: pointer;
}
.b--file-ul .b-input {
position: relative;
width: calc(100% - 116px);
height: auto;
padding: 0 0 0 16px;
}
.b--file-ul .b-input .-pp-no {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 0 0;
margin-bottom: 12px;
}
.b--file-ul .b-input .-pp-no .title--ppno {
position: absolute;
width: auto;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
top: 0;
left: 5px;
padding: 0 10px 2px 10px;
z-index: 10;
}
.b--file-ul .b-input .-pp-no .title--ppno p {
font-size: 0.75rem;
color: var(--color-txtg5);
}
.b--file-ul .b-input .-pp-no .input--ppno {
position: relative;
width: 100%;
height: auto;
padding: 7px 12px 5px 12px;
border: 1px solid var(--color-grey4);
border-radius: 5px;
}
.b--file-ul .b-input .-pp-no .input--ppno input {
position: relative;
width: 100%;
height: auto;
font-size: 0.94rem;
color: var(--color-txtg);
}
.b--file-ul .b-input .-pp-remark {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 0 0;
}
.b--file-ul .b-input .-pp-remark .title--psnrm {
position: absolute;
width: auto;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
top: 0;
left: 5px;
padding: 0 10px 2px 10px;
z-index: 10;
}
.b--file-ul .b-input .-pp-remark .title--psnrm p {
font-size: 0.75rem;
color: var(--color-txtg5);
}
.b--file-ul .b-input .-pp-remark .input--psnrm {
position: relative;
width: 100%;
height: auto;
padding: 7px 12px 5px 12px;
border: 1px solid var(--color-grey4);
border-radius: 5px;
}
.b--file-ul .b-input .-pp-remark .input--psnrm textarea {
position: relative;
width: 100%;
height: auto;
font-size: 0.88rem;
color: var(--color-txtg);
resize: none;
}
.b--file-ul .b-input ::placeholder {
font-size: 0.81rem;
font-weight: 300;
color: var(--color-txtg1);
}
.ft--md-uplf {
position: relative;
width: 100%;
height: auto;
padding: 16px 16px 10px 16px;
}
.ft--md-uplf .b--btn-uplf {
position: relative;
width: 70%;
height: auto;
margin: auto;
}
.ft--md-uplf .b--btn-uplf button {
position: relative;
width: 100%;
height: auto;
font-size: 1rem;
border-radius: 5px;
font-weight: bold;
padding: 8px 12px 6px 12px;
color: var(--color-light);
background-color: var(--color-first);
border: 1px solid var(--color-first);
cursor: pointer;
}
.ft--md-uplf .b--btn-uplf button i {
font-size: 1rem;
font-weight: bold;
padding-right: 2px;
color: var(--color-light);
}
.ft--md-uplf .b--btn-uplf button:hover {
color: var(--color-first);
background-color: var(--color-light);
transition: all 0.3s ease;
}
.ft--md-uplf .b--btn-uplf button:hover i {
color: var(--color-first);
transition: all 0.3s ease;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.md--upload-file .st--upload-f {
width: 85%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.md--upload-file .st--upload-f {
width: 85%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.md--upload-file .st--upload-f {
width: 85%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.md--upload-file .st--upload-f {
width: 100%;
bottom: 0;
}
.b--warning .bg-warning {
width: 100%;
}
.b--file-ul {
padding: 12px;
}
.b--file-ul .b-img {
width: 110px;
padding-right: 10px;
}
.b--file-ul .b-input {
width: calc(100% - 110px);
padding-left: 10px;
}
}
.md--upload-file2 {
position: fixed;
top: 0;
left: 0;
display: flex;
align-items: flex-end;
justify-content: center;
height: 0vh;
background-color: transparent;
overflow: hidden;
transition: background-color 0.25s ease;
z-index: 9999;
}
.md--upload-file2.open {
position: fixed;
width: 100%;
height: 100%;
background-color: rgba(var(--color-dark-rgb), 0.5);
transition: background-color 0.25s;
}
.md--upload-file2.open>.st--upload-f2 {
transform: scale(1);
}
.md--upload-file2 .st--upload-f2 {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
width: 59%;
height: auto;
margin: 0;
background-color: var(--color-light);
transform: scale(0);
transition: transform 0.25s;
transition-delay: 0.15s;
border-radius: 10px 10px 0 0;
overflow: hidden;
bottom: 2.5%;
max-height: 95%;
}
.b--warning .bg-free-wn2 {
position: absolute;
width: 100%;
height: 4.5rem;
background-color: var(--color-first);
top: 0;
left: 0;
z-index: 9;
}
.b--file-ul-slip {
position: relative;
width: 100%;
height: auto;
padding: 10px 20px 20px 20px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.b--file-ul-slip .b-img {
position: relative;
width: 156px;
height: auto;
padding: 0 16px 0 0;
display: flex;
}
.b--file-ul-slip .b-img figure {
position: relative;
width: 140px;
height: 200px;
margin: auto 0;
}
.b--file-ul-slip .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
margin-left: auto;
margin-right: auto;
border-radius: 5px;
object-fit: cover;
cursor: pointer;
}
.b--file-ul-slip .b-input {
position: relative;
width: calc(100% - 156px);
height: auto;
padding: 0 0 0 16px;
}
.b--file-ul-slip .b-input .radio--type {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 0 0;
margin-bottom: 12px;
display: flex;
align-items: center;
}
.b--file-ul-slip .b-input .radio--type input {
font-size: 0.94rem;
color: var(--color-first);
accent-color: var(--color-first);
cursor: pointer;
}
.b--file-ul-slip .b-input .radio--type label {
position: relative;
font-size: 0.94rem;
padding: 0 0 0 5px;
margin-right: 22px;
cursor: pointer;
color: var(--color-txtg4);
}
.b--file-ul-slip .b-input .-list-input {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 0 0;
margin-bottom: 12px;
}
.b--file-ul-slip .b-input .-list-input:last-child {
margin-bottom: 0;
}
.b--file-ul-slip .b-input .-list-input .title--inp {
position: absolute;
width: auto;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
top: 0;
left: 5px;
padding: 0 10px 2px 10px;
z-index: 10;
}
.b--file-ul-slip .b-input .-list-input .title--inp p {
font-size: 0.75rem;
color: var(--color-txtg5);
}
.b--file-ul-slip .b-input .-list-input .lines--inp {
position: relative;
width: 100%;
height: auto;
padding: 7px 12px 5px 12px;
border: 1px solid var(--color-grey4);
border-radius: 5px;
}
.b--file-ul-slip .b-input .-list-input .lines--inp select {
position: relative;
width: 100%;
font-size: 0.94rem;
color: var(--color-txtg);
cursor: pointer;
}
.b--file-ul-slip .b-input .-list-input .lines--inp select option {
font-size: 0.88rem;
color: var(--color-txtg5);
}
.b--file-ul-slip .b-input .-list-input .lines--inp input {
position: relative;
width: 100%;
height: auto;
font-size: 0.94rem;
color: var(--color-txtg);
}
.b--file-ul-slip .b-input .-list-input ::placeholder {
font-size: 0.81rem;
font-weight: 300;
color: var(--color-txtg1);
}
.b--file-ul-slip .b-input .-list-input .lines--inp input::-webkit-outer-spin-button,
.b--file-ul-slip .b-input .-list-input .lines--inp input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.note--date-pm {
position: relative;
width: 100%;
height: auto;
margin-top: -10px;
padding-left: 5px;
margin-bottom: 10px;
}
.note--date-pm p {
font-size: 0.75rem;
color: var(--color-red);
letter-spacing: 1.5px;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.md--upload-file2 .st--upload-f2 {
width: 85%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.md--upload-file2 .st--upload-f2 {
width: 85%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.md--upload-file2 .st--upload-f2 {
width: 85%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.md--upload-file2 .st--upload-f2 {
width: 100%;
bottom: 0;
}
.b--file-ul-slip {
padding: 10px 12px 20px 12px;
}
.b--file-ul-slip .b-img {
width: 130px;
padding-right: 10px;
}
.b--file-ul-slip .b-img figure {
width: 120px;
height: 180px;
}
.b--file-ul-slip .b-input {
width: calc(100% - 130px);
padding-left: 10px;
}
}
/* ================= ================= */
.md--warn-center-auto {
position: fixed;
top: 0;
left: 0;
display: flex;
align-items: flex-end;
justify-content: center;
height: 0vh;
background-color: transparent;
overflow: hidden;
transition: background-color 0.25s ease;
z-index: 9999;
}
.md--warn-center-auto.open {
position: fixed;
width: 100%;
height: 100%;
background-color: rgba(var(--color-dark-rgb), 0.5);
transition: background-color 0.25s;
}
.md--warn-center-auto.open>.open--md--sizeauto {
transform: scale(1);
}
.md--warn-center-auto .open--md--sizeauto {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
width: auto;
height: auto;
margin: auto;
background-color: var(--color-light);
transform: scale(0);
transition: transform 0.25s;
transition-delay: 0.15s;
border-radius: 10px;
overflow: hidden;
min-width: 20%;
max-height: 95%;
max-width: 95%;
}
.md--warn-center-auto .open--md--sizeauto .head--md {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-first);
}
.md--warn-center-auto .open--md--sizeauto .head--md .b-title-hdct {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px;
}
.md--warn-center-auto .open--md--sizeauto .head--md .b-title-hdct p {
font-size: 0.94rem;
text-align: center;
color: var(--color-light);
}
.md--warn-center-auto .open--md--sizeauto .dt--md {
position: relative;
width: 100%;
height: auto;
padding: 16px;
}
.md--warn-center-auto .open--md--sizeauto .dt--md .icon-cp {
font-size: 2.5rem;
text-align: center;
color: var(--color-green);
padding-bottom: 6px;
}
.md--warn-center-auto .open--md--sizeauto .dt--md .icon-cp i {
color: var(--color-green);
}
.md--warn-center-auto .open--md--sizeauto .dt--md .icon-cp2 {
font-size: 2.5rem;
text-align: center;
color: var(--color-red);
padding-bottom: 6px;
}
.md--warn-center-auto .open--md--sizeauto .dt--md .icon-cp2 i {
color: var(--color-red);
}
.md--warn-center-auto .open--md--sizeauto .dt--md .txt-warn {
font-size: 1rem;
text-align: center;
color: var(--color-txtg);
}
.md--warn-center-auto .open--md--sizeauto .ft--md {
position: relative;
width: 100%;
height: auto;
display: flex;
padding: 12px 16px;
}
.md--warn-center-auto .open--md--sizeauto .ft--md button {
position: relative;
width: auto;
height: auto;
margin: 0 auto;
font-size: 1rem;
padding: 5px 20px;
border-radius: 5px;
color: var(--color-light);
background-color: var(--color-red);
border: 1px solid var(--color-red);
cursor: pointer;
}
.md--warn-center-auto .open--md--sizeauto .ft--md button i {
color: var(--color-light);
}
.md--warn-center-auto .open--md--sizeauto .ft--md button:hover {
background-color: var(--color-light);
color: var(--color-red);
transition: all 0.3s ease;
}
.md--warn-center-auto .open--md--sizeauto .ft--md button:hover i {
color: var(--color-red);
transition: all 0.3s ease;
}
.md--warn-center-auto .open--md--sizeauto .ft--md .btn--close-md-approve {
position: relative;
width: auto;
height: auto;
margin: 0 auto;
border-radius: 5px;
background-color: var(--color-green);
border: 1px solid var(--color-green);
cursor: pointer;
}
.md--warn-center-auto .open--md--sizeauto .ft--md .btn--close-md-approve a {
position: relative;
width: auto;
height: auto;
padding: 5px 20px;
display: block;
}
.md--warn-center-auto .open--md--sizeauto .ft--md .btn--close-md-approve p {
font-size: 1rem;
color: var(--color-light);
}
.md--warn-center-auto .open--md--sizeauto .ft--md .btn--close-md-approve p i {
color: var(--color-light);
}
.md--warn-center-auto .open--md--sizeauto .ft--md .btn--close-md-approve:hover {
background-color: var(--color-light);
transition: all 0.3s ease;
}
.md--warn-center-auto .open--md--sizeauto .ft--md .btn--close-md-approve:hover p {
color: var(--color-green);
transition: all 0.3s ease;
}
.md--warn-center-auto .open--md--sizeauto .ft--md .btn--close-md-approve:hover p i {
color: var(--color-green);
transition: all 0.3s ease;
}
.test--open--md {
position: relative;
width: auto;
height: auto;
background-color: var(--color-first);
color: var(--color-light);
font-size: 2rem;
padding: 10px 20px;
}
/* ================= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.md--warn-center-auto .open--md--sizeauto {
min-width: 40%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.md--warn-center-auto .open--md--sizeauto {
min-width: 50%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.md--warn-center-auto .open--md--sizeauto {
min-width: 50%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.md--warn-center-auto .open--md--sizeauto {
min-width: 80%;
}
}
/* ================= animation ================= */
/*
animation: name time infinite;
pulse 0.5s infinite
flicker 1s infinite
flashing 1s linear infinite
flash linear 1.5s infinite
*/
.animation-set1 {
animation: set1 0.5s infinite;
}
@keyframes set1 {
0%,
50% {
color: var(--color-red);
}
51%,
100% {
color: var(--color-green4);
}
}
.animation-set2 {
animation: set2 linear 1.5s infinite;
}
@keyframes set2 {
0% {
opacity: 1;
}
50% {
opacity: 0.1;
}
100% {
opacity: 1;
}
}
.animation-set3 {
animation: set3 1.5s linear infinite;
}
@keyframes set3 {
0% {
opacity: 1;
}
25% {
opacity: 0.5;
}
50% {
opacity: 0.1;
}
75% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
.animation-set4 {
animation: set4 0.5s infinite;
}
@keyframes set4 {
0% {
color: var(--color-red);
}
25% {
color: var(--color-orange);
}
50% {
color: var(--color-yellow);
}
75% {
color: var(--color-green4);
}
100% {
color: var(--color-green);
}
}
/* ============= */
.b-anmt-newpg {
position: absolute;
top: 2px;
left: 10px;
}
.pdt-nanmt {
top: 1px;
/* top: -2px; */
}
.b-anmt-newpg p {
font-size: 0.75rem !important;
font-weight: bold !important;
overflow: visible !important;
text-shadow: 1px 1px 3px rgba(var(--color-dark-rgb), 0.3);
}
.b-anmt-newpg2 {
position: absolute;
top: 2px;
left: 1px;
}
.b-anmt-newpg2 p {
font-size: 0.75rem !important;
font-weight: bold !important;
overflow: visible !important;
text-shadow: 1px 1px 3px rgba(var(--color-dark-rgb), 0.3);
}
.b-anmt-newpg3 {
position: absolute;
top: 2px;
left: 10px;
}
.b-anmt-newpg3 p {
font-size: 0.75rem !important;
font-weight: bold !important;
overflow: visible !important;
text-shadow: 1px 1px 3px rgba(var(--color-dark-rgb), 0.3);
}
.b-anmt-newpg4 {
position: absolute;
/* top: 2px; */
left: 2px;
bottom: -8px;
}
.b-anmt-newpg4 p {
font-size: 0.75rem !important;
font-weight: bold !important;
overflow: visible !important;
text-shadow: 1px 1px 3px rgba(var(--color-dark-rgb), 0.3);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {
.b-anmt-newpg4 {
top: 2px;
left: 10px;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.b-anmt-newpg {
top: 0px;
}
.b-anmt-newpg p {
/* text-shadow: 1px 1px 3px rgba(var(--color-dark-rgb), 1); */
}
.b-anmt-newpg2 {
/* top: -20px; */
}
.b-anmt-newpg2 p {
/* text-shadow: 1px 1px 3px rgba(var(--color-dark-rgb), 1); */
}
.b-anmt-newpg3 {
/* top: -20px; */
}
.b-anmt-newpg3 p {
/* text-shadow: 1px 1px 3px rgba(var(--color-dark-rgb), 1); */
}
.b-anmt-newpg4 {
top: 2px;
left: 10px;
}
.b-anmt-newpg4 p {
/* text-shadow: 1px 1px 3px rgba(var(--color-dark-rgb), 1); */
}
}
/* ================= details ================= */
.sc--details-pg {
position: relative;
width: 100%;
height: auto;
}
.sc--details-pg .box-pg-dt {
position: relative;
width: 100%;
height: auto;
padding: 30px 20px 20px 20px;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--details-pg .box-pg-dt .b-name-pg {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 8px 0;
}
.sc--details-pg .box-pg-dt .b-name-pg p {
font-size: 1.38rem;
font-weight: bold;
/* text-align: center; */
}
.sc--details-pg .box-pg-dt-atc {
position: relative;
width: 100%;
height: auto;
padding: 30px 20px 0 20px;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.sc--details-pg .box-pg-dt-atc .b-name-pg {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 8px 0;
}
.sc--details-pg .box-pg-dt-atc .b-name-pg p {
font-size: 1.38rem;
font-weight: bold;
/* text-align: center; */
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.sc--details-pg .container {
padding: 0;
}
.sc--details-pg .box-pg-dt {
border-radius: 0;
padding: 0;
}
.sc--details-pg .box-pg-dt-atc {
width: 100%;
padding: 0;
border-radius: 0;
}
}
/* ====== details program ====== */
.box-dt-program-img-txt {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 0 16px 0;
margin: 0 0 16px 0;
border-bottom: 1px solid var(--color-grey3);
}
/* image program */
.box-dt-program-img-txt .b-img {
position: relative;
width: 35%;
height: auto;
overflow: hidden;
}
.box-dt-program-img-txt .b-img figure {
position: relative;
width: 100%;
height: auto;
}
.box-dt-program-img-txt .b-img figure .size-img {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
}
/* text program */
.box-dt-program-img-txt .b-dt {
position: relative;
width: 65%;
height: auto;
padding: 0 0 0 20px;
}
.box-dt-program-img-txt .b-dt .bt-dt {
position: relative;
width: 100%;
height: auto;
}
.box-dt-program-img-txt .b-dt .pd-bt {
padding: 2px 0 5px 0;
}
.box-dt-program-img-txt .b-dt .bt-dt p {
font-size: 0.94rem;
color: var(--color-txtg4);
}
.box-dt-program-img-txt .b-dt .bt-dt .t-name2 {
font-size: 1.32rem;
font-weight: bold;
color: var(--color-txtg);
}
.box-dt-program-img-txt .b-dt .bt-dt .t-shoetdt {
font-size: 0.88rem;
text-indent: 20px;
}
.box-dt-program-img-txt .b-dt .b-dt-price {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
border-top: 1px dashed var(--color-grey4);
margin-top: 10px;
padding: 10px 0 0 20px;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon {
position: relative;
width: calc(100%/2);
height: auto;
padding: 5px 20px 5px 0;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon p {
font-size: 0.88rem;
color: var(--color-txtg4);
padding-bottom: 1px;
font-weight: bold;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon p span {
color: var(--color-txtg4);
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon p .icon-pd {
padding-right: 5px;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon p i {
color: var(--color-icon-yl);
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon .txt-pd-l {
padding-left: 1.4rem;
font-weight: normal;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon .txt-pd-top {
padding-top: 3px;
font-size: 0.75rem;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon .color-txt-view-hs-d {
color: var(--color-txtg4);
font-weight: bold;
text-decoration: underline;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon .color-txt-view-hs-d a {
color: var(--color-txtg4);
cursor: pointer;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon .color-txt-view-hs-d:hover {
color: var(--color-first);
transition: all 0.3s ease;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon .color-txt-view-hs-d a:hover {
color: var(--color-first);
transition: all 0.3s ease;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-img-airline {
position: relative;
width: 100%;
height: auto;
padding: 0 0 0 1.4rem;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-img-airline figure {
position: relative;
width: auto;
height: 2.5rem;
overflow: hidden;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-img-airline figure .size-img {
position: relative;
width: auto;
height: 100%;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-price {
position: relative;
width: 100%;
height: auto;
padding: 0 0 0 1.4rem;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-price p {
font-size: 0.88rem;
color: var(--color-txtg4);
margin-bottom: -10px;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-price .t-decoration {
text-decoration: line-through;
font-weight: normal;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-price h1 {
font-size: 1.75rem;
font-weight: bold;
color: var(--color-red);
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-price h1 span {
font-size: 0.88rem;
font-weight: normal;
padding-left: 2px;
color: var(--color-txtg4);
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-price h1 .txt-currency {
color: var(--color-txtg4);
}
/* button contact */
.box-dt-program-img-txt .b-dt .b-btn-contact {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey4);
margin-top: 5px;
padding: 16px 0 0 0;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct {
position: relative;
width: calc((100%/4) - 6.75px);
padding: 5px 10px 4px 10px;
margin: 0 9px 9px 0;
border-radius: 5px;
overflow: hidden;
cursor: pointer;
background-color: var(--color-light);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-tel {
border: 1px solid var(--color-first);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line {
border: 1px solid var(--color-line);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line2 {
border: 1px solid var(--color-line);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-pdf {
border: 1px solid var(--color-pdf);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-word {
border: 1px solid var(--color-word);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct a {
position: relative;
width: 100%;
height: auto;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct p {
font-size: 1rem;
font-weight: normal;
text-align: center;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-tel p,
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-tel p i {
color: var(--color-first);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line p,
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line p i {
color: var(--color-line);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line2 p,
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line2 p i {
color: var(--color-line);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-pdf p,
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-pdf p i {
color: var(--color-pdf);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-word p,
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-word p i {
color: var(--color-word);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct p .icon-pd {
padding-right: 1px;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-tel p .txt-tel-web {
color: var(--color-first);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line p .txt-line-web {
color: var(--color-line);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line2 p .txt-line2-web {
color: var(--color-line);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-pdf p .txt-pdf-web {
color: var(--color-pdf);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-word p .txt-pdf-web {
color: var(--color-word);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-pdf p .txt-pdf-mbview {
display: none;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-word p .txt-word-mbview {
display: none;
}
/* ============= */
@media (min-width: 1200px) {
.box-dt-program-img-txt .b-dt .bt-dt .t-shoetdt {
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct:nth-child(4n+0) {
margin-right: 0;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct.cl-tel:hover {
background-color: var(--color-first);
transition: all 0.3s ease;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct.cl-line:hover {
background-color: var(--color-line);
transition: all 0.3s ease;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct.cl-line2:hover {
background-color: var(--color-line);
transition: all 0.3s ease;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct.cl-pdf:hover {
background-color: var(--color-pdf);
transition: all 0.3s ease;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct.cl-word:hover {
background-color: var(--color-word);
transition: all 0.3s ease;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct:hover p span {
color: var(--color-light);
transition: all 0.3s ease;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct:hover p i {
color: var(--color-light);
transition: all 0.3s ease;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.box-dt-program-img-txt .b-dt .bt-dt .t-shoetdt {
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.box-dt-program-img-txt .b-img {
width: 100%;
}
.box-dt-program-img-txt .b-img figure {
width: 80%;
margin: 0 auto;
}
.box-dt-program-img-txt .b-dt {
width: 100%;
padding: 20px 10px 0 10px;
}
.box-dt-program-img-txt .b-dt .bt-dt .t-shoetdt {
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon {
width: calc(100%/3);
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-codepg {
order: 1;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-countrypg {
order: 2;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-datepg {
order: 3;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-numberpg {
order: 4;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-pricepg {
order: 6;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-travelpg {
order: 5;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn {
justify-content: center;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--details-pg .container {
padding: 0;
}
.box-dt-program-img-txt .b-img {
width: 100%;
}
.box-dt-program-img-txt .b-img figure {
width: 80%;
margin: 0 auto;
}
.box-dt-program-img-txt .b-dt {
width: 100%;
padding: 20px 10px 0 10px;
}
.box-dt-program-img-txt .b-dt .bt-dt .t-shoetdt {
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon {
width: calc(100%/3);
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-codepg {
order: 1;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-countrypg {
order: 2;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-datepg {
order: 3;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-numberpg {
order: 4;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-pricepg {
order: 6;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-travelpg {
order: 5;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn {
justify-content: center;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.box-dt-program-img-txt .b-img {
width: 100%;
}
.box-dt-program-img-txt .b-img figure .size-img {
border-radius: 0;
}
.box-dt-program-img-txt .b-dt {
width: 100%;
padding: 10px 16px 0 16px;
}
.box-dt-program-img-txt .b-dt .bt-dt .t-name2 {
font-size: 1rem;
}
.box-dt-program-img-txt .b-dt .bt-dt .t-shoetdt {
font-size: 0.82rem;
}
.box-dt-program-img-txt .b-dt .b-dt-price {
padding: 0;
padding: 10px 5px;
background-color: var(--color-light);
border: 1px solid var(--color-grey3);
border-radius: 5px;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon {
width: calc(100%/4);
padding: 0 5px;
overflow: hidden;
}
.box-dt-program-img-txt .b-dt .car-dtandprice .txt-dt-icon {
width: calc(100%/3);
padding: 0 5px;
overflow: hidden;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon p {
text-align: center;
font-size: 0.75rem;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon p .icon-pd {
display: none;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon .txt-pd-l {
font-size: 0.69rem;
padding: 0;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-price {
padding: 0;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-price h1 {
font-size: 1rem;
display: grid;
/* display: flex; */
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-price h1 span {
font-size: 0.69rem;
margin-top: -5px;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-price h1 .txt-currency {
text-align: center;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-img-airline {
padding: 0;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-img-airline figure {
height: 2rem;
display: flex;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-img-airline figure .size-img {
margin: 0 auto;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-codepg {
order: 1;
border-right: 1px dashed var(--color-grey4);
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-codepg-car {
order: 1;
border-right: 1px dashed var(--color-grey4);
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-countrypg {
/* display: none; */
order: 5;
width: 100%;
padding-top: 10px;
margin-top: 5px;
border-top: 1px dashed var(--color-grey4);
display: flex;
justify-content: center;
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon .color-txt-view-hs-d {
margin-left: 10px;
color: var(--color-first);
}
.box-dt-program-img-txt .b-dt .b-dt-price .txt-dt-icon .color-txt-view-hs-d a {
color: var(--color-first);
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-countrypg-package {
order: 3;
border-right: 1px dashed var(--color-grey4);
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-countrypg-car {
order: 2;
border-right: 1px dashed var(--color-grey4);
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-datepg {
display: none;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-numberpg {
order: 2;
border-right: 1px dashed var(--color-grey4);
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-pricepg {
order: 4;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-pricepg-car {
order: 2;
}
.box-dt-program-img-txt .b-dt .b-dt-price .b-travelpg {
order: 3;
border-right: 1px dashed var(--color-grey4);
}
.box-dt-program-img-txt .b-dt .b-btn-contact {
position: fixed;
bottom: 0;
left: 0;
z-index: 4;
padding: 12px 10px 10px 10px;
background-color: var(--color-light);
border-top: 1px solid var(--color-grey2);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn {
justify-content: space-between;
align-items: center;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct {
width: auto;
padding: 0 10px 0 10px;
margin: 0;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-tel {
order: 4;
width: 49%;
height: 3rem;
padding: 5px 10px 3px 10px;
background: linear-gradient(90deg, rgba(var(--color-third-rgb), 1) 0%, rgba(var(--color-first-rgb), 1) 50%, rgba(var(--color-first-rgb), 1) 100%);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-tel a {
align-items: center;
display: flex;
height: 100%;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line {
order: 2;
width: 17%;
border: none;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line2 {
order: 3;
width: 17%;
border: none;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-pdf {
order: 1;
width: 17%;
border: none;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-word {
order: 1;
width: 17%;
border: none;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct p {
font-size: 0.75rem;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .btn-ct p .icon-pd {
font-size: 1.82rem;
}
/*
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line p,
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line p i {
color: var(--color-line);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-pdf p,
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-pdf p i {
color: var(--color-pdf);
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-word p,
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-word p i {
color: var(--color-word);
} */
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-tel p {
width: 100%;
display: flex;
justify-content: stretch;
align-items: center;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-tel p .icon-pd {
width: 30%;
border-right: 1px solid var(--color-light);
padding-right: 12px;
color: var(--color-light);
display: flex;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-tel p .icon-pd i {
color: var(--color-light);
margin: 0 auto;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-tel p .txt-tel-web {
width: 70%;
font-size: 1.13rem;
display: block;
color: var(--color-light);
padding-left: 10px;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line p .txt-line-web {
display: block;
color: var(--color-txtg);
margin-top: -4px;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-line2 p .txt-line2-web {
display: block;
color: var(--color-txtg);
margin-top: -4px;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-pdf p .txt-pdf-web {
display: none;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-word p .txt-pdf-web {
display: none;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-pdf p .txt-pdf-mbview {
display: block;
color: var(--color-txtg);
margin-top: -4px;
}
.box-dt-program-img-txt .b-dt .b-btn-contact .b-btn .cl-word p .txt-word-mbview {
display: block;
color: var(--color-txtg);
margin-top: -4px;
}
}
/* ====== city ====== */
.b-city-btn {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey4);
margin-top: 5px;
padding: 10px 0 0 0;
}
.city-separate {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 0 0 2px;
}
.city-separate .btn-city {
position: relative;
width: auto;
height: auto;
background-color: var(--color-light);
border: 1px solid var(--color-grey5);
border-radius: 5px;
margin: 6px 6px 0 0;
padding: 3px 10px 2px 10px;
cursor: pointer;
}
.city-separate .btn-city:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.city-separate .btn-city a {
position: relative;
width: 100%;
height: 100%;
}
.city-separate .btn-city p {
font-size: 0.82rem;
color: var(--color-txtg5);
}
.city-separate .btn-city:hover p {
color: var(--color-first);
transition: all 0.3s ease;
}
.city-separate .btn-city p .icon-city {
padding-right: 5px;
}
.city-separate .btn-city p i {
color: var(--color-icon-yl);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.b-city-btn {
border-top: none;
margin-top: 0;
}
.city-separate .btn-city p {
font-size: 0.75rem;
}
}
/* ====== period date price program ====== */
.box-period-dateprice-program {
position: relative;
width: 100%;
height: auto;
margin-bottom: 20px;
}
.box-period-dateprice-program .box-title {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 5px;
}
.box-period-dateprice-program .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-period-dateprice-program .table-dateprice {
position: relative;
width: 100%;
height: auto;
/* max-height: 23rem; */
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.box-period-dateprice-program .table-dateprice .tb-head {
position: relative;
width: 100%;
height: auto;
max-height: 2.125rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 5px;
/* padding: 0 5px 0 20px; */
background-color: var(--color-first);
}
.box-period-dateprice-program .table-dateprice .tb-head .b-size-tb {
position: relative;
width: auto;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
}
.box-period-dateprice-program .table-dateprice .tb-head .b-size-tb:last-child {
border-right: none;
}
.box-period-dateprice-program .table-dateprice .tb-head .s-tb0 {
width: 3%;
}
.box-period-dateprice-program .table-dateprice .tb-head .s-tb1 {
width: 25%;
/* width: 28%; */
}
.box-period-dateprice-program .table-dateprice .tb-head .s-tb2 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-head .s-tb3 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-head .s-tb4 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-head .s-tb5 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-head .s-tb6 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-head .s-tb7 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-head .s-tb8 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-head .s-tb9 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-head .b-size-tb p {
font-size: 1rem;
color: var(--color-light);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.box-period-dateprice-program .table-dateprice .tb-head .b-size-tb .txt-left {
text-align: left;
}
.box-period-dateprice-program .table-dateprice .tb-dt {
position: relative;
width: 100%;
height: auto;
/* max-height: 20.875rem;
overflow: scroll; */
}
.box-period-dateprice-program .table-dateprice .tb-dt::-webkit-scrollbar {
display: none;
}
.box-period-dateprice-program .table-dateprice .tb-dt {
-ms-overflow-style: none;
scrollbar-width: none;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 5px;
/* padding: 0 5px 0 20px; */
align-items: center;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp p {
margin: auto 0;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb {
position: relative;
width: auto;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
display: grid;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb:last-child {
border-right: none;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact {
position: relative;
width: fit-content;
height: fit-content;
border-radius: 5px;
background-color: var(--color-green5);
cursor: pointer;
align-items: center;
display: flex;
margin: auto;
padding: 5px 10px;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact a {
position: relative;
width: 100%;
height: auto;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact p {
font-size: 0.94rem;
text-align: center;
color: var(--color-light);
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact2 {
position: relative;
width: fit-content;
height: fit-content;
border-radius: 5px;
cursor: pointer;
align-items: center;
display: flex;
margin: auto;
padding: 5px 10px;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact2 a {
position: relative;
width: 100%;
height: auto;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact2 p {
font-size: 0.94rem;
text-align: center;
color: var(--color-light);
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .bg-color-btn1 {
background-color: var(--color-green5);
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .bg-color-btn2 {
background-color: var(--color-first);
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .bg-color-btn3 {
background-color: var(--color-line);
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s-tb1 {
width: 28%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s-tb2 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s-tb3 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s-tb4 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s-tb5 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s-tb6 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s-tb7 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s-tb8 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s-tb9 {
width: 9%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.94rem;
text-align: center;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-fullprice {
font-size: 0.69rem;
text-align: center;
color: var(--color-txtg4);
text-decoration: line-through;
margin-bottom: -5px;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-left {
text-align: left;
}
/* ====== mobile ====== */
.box-mb-period-dateprice-program {
position: relative;
width: 100%;
height: auto;
}
.box-mb-period-dateprice-program .mb-table-dateprice {
position: relative;
width: 100%;
height: auto;
padding: 0 16px 16px 16px;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 10px 0 0 0;
border-bottom: 1px solid var(--color-grey4);
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt:last-child {
border-bottom: none;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-size-month {
position: relative;
width: 2.7rem;
height: auto;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-size-month .b-bg-month {
position: relative;
width: fit-content;
height: auto;
padding: 2px 5px 2px 5px;
border-radius: 5px;
background-color: var(--color-first);
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-size-month .b-bg-month p {
font-size: 0.94rem;
color: var(--color-light);
text-align: center;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day {
position: relative;
width: calc(100% - 2.7rem);
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 0 0 5px;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day .b-day-and-price {
position: relative;
width: calc(100%/12);
height: auto;
padding: 0 5px;
border-right: 1px dashed var(--color-grey4);
margin: 0 0 10px 0;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day .b-day-and-price:last-child {
border-right: none;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day .b-day-and-price .b-txt {
position: relative;
width: 100%;
height: auto;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day .b-day-and-price .b-txt p {
font-size: 0.94rem;
text-align: center;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day .b-day-and-price .b-txt .txt-price {
font-size: 0.75rem;
margin-bottom: -5px;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day .b-day-and-price .b-txt p .currency {
font-size: 0.63rem;
padding-left: 2px;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day .b-day-and-price .b-txt p .cross-month {
font-size: 0.75rem;
padding-left: 2px;
}
.dp-none-period {
display: block;
}
.dp-none-period-mb {
display: none;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.dp-none-period {
display: none;
}
.dp-none-period-mb {
display: block;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-size-month .b-bg-month p {
font-size: 0.82rem;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day .b-day-and-price {
width: calc(100%/5);
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day .b-day-and-price .b-txt p {
font-size: 0.82rem;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day .b-day-and-price .b-txt .txt-price {
font-size: 0.63rem;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day .b-day-and-price .b-txt p .currency {
font-size: 0.6rem;
}
.box-mb-period-dateprice-program .mb-table-dateprice .mb-tb-dt .b-fullsize-day .b-day-and-price .b-txt p .cross-month {
font-size: 0.63rem;
padding-left: 2px;
}
}
/* ====== ipad ====== */
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .b-name-tb {
display: none;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb p .currency-size-ip {
display: none;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .stv-btn-tel {
display: none;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb0 {
width: 3%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb1 {
width: 25%;
padding-left: 10px;
/* width: 28%; */
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb2 {
width: 12.5%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb3 {
width: 12.5%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb4 {
width: 12.5%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb5 {
width: 12.5%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb6 {
width: 12.5%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb7 {
width: 12.5%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb8 {
width: 12.5%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb9 {
width: 12.5%;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-date-range-tb {
font-size: 0.94rem;
color: var(--color-txtg);
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-status-tb {
display: none;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .icon-tb-acd {
display: none;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {}
/* @media (min-width: 501px) and (max-width: 991px) { */
@media (min-width: 501px) and (max-width: 991px) {
.box-period-dateprice-program .table-dateprice {
/* max-height: 27rem; */
}
.box-period-dateprice-program .table-dateprice .tb-dt {
/* max-height: 27rem; */
}
.box-period-dateprice-program .table-dateprice .tb-head {
display: none;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp {
padding: 0;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
width: 100%;
padding: 0 16px 5px 16px;
align-items: center;
border-bottom: 1px dashed var(--color-grey5);
border-right: none;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb:first-child {
margin: 0 0 0 0;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb:last-child {
/* border-bottom: none; */
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .b-name-tb {
display: block;
padding: 0 8px 0 0;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .b-price-tb {
padding: 0 0 0 8px;
display: flex;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb0 {
width: 3.19rem;
padding: 10px 10px;
background-color: rgba(var(--color-first-rgb), 0.05);
border-bottom: 1px solid var(--color-first);
/* margin-top: 0; */
order: 1;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb0 .b-price-tb {
padding: 0;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb1 {
background-color: rgba(var(--color-first-rgb), 0.05);
border-bottom: 1px solid var(--color-first);
padding: 10px 16px 10px 0;
/* padding: 10px 16px; */
width: calc(100% - 3.19rem);
/* margin-top: 0; */
order: 2;
}
.accordion-list-dt2.showAnswerData2 .accordion-dt-view2 {
order: 3;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb2 {
order: 4;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb3 {
order: 5;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb4 {
order: 6;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb5 {
order: 7;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb6 {
order: 8;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb7 {
order: 9;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb8 {
order: 11;
border-bottom: none;
margin: 10px 0;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb9 {
order: 10;
/* border-bottom: 1px dashed var(--color-grey5); */
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-fullprice {
text-align: right;
margin-bottom: auto;
padding-right: 5px;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .stv-btn-tel {
display: block;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact2 {
width: 40%;
}
/* .box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb8 {
display: none;
} */
/* .box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .s2-tb9 {
margin: 10px 0;
} */
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb p .currency-size-ip {
display: initial;
color: var(--color-txtg5);
font-size: 0.75rem;
padding: 0 2px;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-date-range-tb {
width: calc(70% - 2rem);
padding-right: 10px;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-status-tb {
display: block;
font-size: 0.94rem;
color: var(--color-txtg);
width: 30%;
text-align: right;
padding-right: 8px;
}
.box-period-dateprice-program .table-dateprice .tb-dt .b-tb-dp .b-size-tb .icon-tb-acd {
display: block;
font-size: 1rem;
}
}
/* ====== accordion 2 ====== */
.accordion-dt-view2 {
width: 72%;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {}
@media (min-width: 501px) and (max-width: 991px) {
.box-sc-dt-accordion2 {
position: relative;
width: 100%;
height: auto;
}
.box-sc-dt-accordion2::-webkit-scrollbar {
display: none;
}
.accordion-list-dt2 {
list-style: none;
cursor: pointer;
}
.accordion-list-dt2.showAnswerData2 .accordion-title2 .arrowIcon2 {
transform: rotate(-180deg);
}
/* .accordion-list-dt2:hover .accordion-title2 span,
.accordion-list-dt2:hover .accordion-title2 .arrowIcon2 {
color: var(--color-first);
transition: all 0.3s ease;
} */
.accordion-list-dt2.showAnswerData2 .accordion-title2 {
/* border-bottom: 1px solid var(--color-first);
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px; */
transition: all 0.3s ease;
}
.accordion-list-dt2.showAnswerData2 .accordion-title2 span,
.accordion-list-dt2.showAnswerData2 .accordion-title2 .arrowIcon2 {
color: var(--color-first);
transition: all 0.3s ease;
}
.accordion-list-dt2.showAnswerData2 .accordion-dt-view2 {
width: 100%;
display: flex;
/* display: block; */
cursor: auto;
margin-top: 10px;
}
.accordion-title2 {
display: flex;
align-items: center;
justify-content: space-between;
}
.accordion-title2 .arrowIcon2 {
transition: all 0.3s ease;
}
.accordion-dt-view2 {
display: none;
}
}
/* ====== period date price package ====== */
.box-period-dateprice-package {
position: relative;
width: 100%;
height: auto;
margin-bottom: 20px;
}
.box-period-dateprice-package .box-title {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 5px;
}
.box-period-dateprice-package .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-period-dateprice-package .table-dateprice {
position: relative;
width: 100%;
height: auto;
max-height: 23rem;
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.box-period-dateprice-package .table-dateprice .tb-head {
position: relative;
width: 100%;
height: auto;
max-height: 3.625rem;
display: flex;
justify-content: space-between;
/* flex-wrap: wrap;
flex-direction: row; */
padding: 0 5px 0 20px;
background-color: var(--color-first);
}
.box-period-dateprice-package .table-dateprice .tb-head .b-size-tb {
position: relative;
/* width: auto; */
width: 100%;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
padding: 0 5px;
}
.box-period-dateprice-package .table-dateprice .tb-head .b-size-tb:last-child {
border-right: none;
}
/* .box-period-dateprice-package .table-dateprice .tb-head .s-tb1 {
width: 39%;
}
.box-period-dateprice-package .table-dateprice .tb-head .s-tb2 {
width: 13%;
}
.box-period-dateprice-package .table-dateprice .tb-head .s-tb3 {
width: 13%;
}
.box-period-dateprice-package .table-dateprice .tb-head .s-tb4 {
width: 13%;
}
.box-period-dateprice-package .table-dateprice .tb-head .s-tb5 {
width: 13%;
}
.box-period-dateprice-package .table-dateprice .tb-head .s-tb6 {
width: 9%;
} */
.box-period-dateprice-package .table-dateprice .tb-head .s-tb1 {
width: 160%;
}
.box-period-dateprice-package .table-dateprice .tb-head .s-tb6 {
width: 70%;
}
.box-period-dateprice-package .table-dateprice .tb-head .b-size-tb p {
font-size: 0.94rem;
color: var(--color-light);
text-align: center;
position: relative;
top: 50%;
transform: translateY(-50%);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.box-period-dateprice-package .table-dateprice .tb-head .b-size-tb .txt-left {
text-align: left;
}
.box-period-dateprice-package .table-dateprice .tb-dt {
position: relative;
width: 100%;
height: auto;
max-height: 19.375rem;
overflow: scroll;
margin: 0 0 5px 0;
}
.box-period-dateprice-package .table-dateprice .tb-dt::-webkit-scrollbar {
display: none;
}
.box-period-dateprice-package .table-dateprice .tb-dt {
-ms-overflow-style: none;
scrollbar-width: none;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: space-between;
/* flex-wrap: wrap;
flex-direction: row; */
padding: 0 5px 0 20px;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp p {
margin: auto 0;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb {
position: relative;
/* width: auto; */
width: 100%;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
display: grid;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb:last-child {
border-right: none;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-l-b {
display: none;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .price-r-b {
display: grid;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact {
position: relative;
width: fit-content;
height: fit-content;
border-radius: 5px;
background-color: var(--color-green5);
cursor: pointer;
align-items: center;
display: flex;
margin: auto;
padding: 5px 10px;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-tel {
display: none;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact a {
position: relative;
width: 100%;
height: auto;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact p {
font-size: 0.94rem;
text-align: center;
color: var(--color-light);
}
/* .box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb1 {
width: 39%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb2 {
width: 13%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb3 {
width: 13%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb4 {
width: 13%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb5 {
width: 13%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb6 {
width: 9%;
} */
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb1 {
width: 160%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb6 {
width: 70%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.94rem;
text-align: center;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-fullprice {
font-size: 0.69rem;
text-align: center;
color: var(--color-txtg4);
text-decoration: line-through;
margin-bottom: -5px;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-left {
text-align: left;
}
/* .dp-none-period-package {
display: block;
}
.dp-none-period-package-mb {
display: none;
} */
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
/* .dp-none-period-package {
display: none;
}
.dp-none-period-package-mb {
display: block;
} */
.box-period-dateprice-package {
padding: 0 16px;
}
.box-period-dateprice-package .table-dateprice {
/* height: 30rem; */
}
.box-period-dateprice-package .table-dateprice .tb-head {
display: none;
flex-wrap: wrap;
flex-direction: row;
}
.box-period-dateprice-package .table-dateprice .tb-dt {
max-height: inherit;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp {
padding: 0;
flex-wrap: wrap;
flex-direction: row;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb {
display: flex;
justify-content: stretch;
border-right: none;
padding: 0 10px;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-l-b {
position: relative;
width: 80%;
height: auto;
display: grid;
border-right: 1px dashed var(--color-grey5);
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .price-r-b {
position: relative;
width: 20%;
height: auto;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-l-b p {
text-align: left;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.88rem;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact {
width: 45%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-tel {
display: block;
background-color: var(--color-first);
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb1 {
width: 100%;
padding: 7px 10px 5px 10px;
margin-top: 0;
background-color: rgba(var(--color-first-rgb), 0.05);
border-bottom: 1px solid var(--color-first);
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb2 {
width: 100%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb3 {
width: 100%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb4 {
width: 100%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb5 {
width: 100%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb6 {
width: 100%;
margin: 14px 0;
}
}
/* ====== period date price car rental ====== */
.box-period-dateprice-car-rental {
position: relative;
width: 100%;
height: auto;
margin-bottom: 20px;
}
.box-period-dateprice-car-rental .box-title {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 5px;
}
.box-period-dateprice-car-rental .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-period-dateprice-car-rental .table-dateprice {
position: relative;
width: 100%;
height: auto;
max-height: 23rem;
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head {
position: relative;
width: 100%;
height: auto;
max-height: 3.625rem;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 20px;
background-color: var(--color-first);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .b-size-tb {
position: relative;
width: auto;
height: auto;
/* border-right: 1px solid var(--color-grey2); */
margin: 5px 0;
padding: 0 5px;
}
/* .box-period-dateprice-car-rental .table-dateprice .tb-head .b-size-tb:last-child {
border-right: none;
} */
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb1 {
/* width: 46%; */
width: calc(46% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb2 {
/* width: 15%; */
width: calc(15% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb3 {
/* width: 15%; */
width: calc(15% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb4 {
/* width: 15%; */
width: calc(15% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb5 {
width: 9%;
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .b-size-tb p {
font-size: 1rem;
color: var(--color-light);
text-align: center;
position: relative;
top: 50%;
transform: translateY(-50%);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .b-size-tb .txt-left {
text-align: left;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt {
position: relative;
width: 100%;
height: auto;
max-height: 19.375rem;
overflow: scroll;
margin: 0 0 5px 0;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt::-webkit-scrollbar {
display: none;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt {
-ms-overflow-style: none;
scrollbar-width: none;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 20px;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp p {
margin: auto 0;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb {
position: relative;
width: auto;
height: auto;
/* border-right: 1px solid var(--color-grey2); */
margin: 5px 0;
display: grid;
}
/* .box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb:last-child {
border-right: none;
} */
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-l-b {
display: none;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .price-r-b {
display: grid;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact {
position: relative;
width: fit-content;
height: fit-content;
border-radius: 5px;
background-color: var(--color-green5);
cursor: pointer;
align-items: center;
display: flex;
margin: auto;
padding: 5px 10px;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-tel {
display: none;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact a {
position: relative;
width: 100%;
height: auto;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact p {
font-size: 0.94rem;
text-align: center;
color: var(--color-light);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb1 {
/* width: 46%; */
width: calc(46% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb2 {
/* width: 15%; */
width: calc(15% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb3 {
/* width: 15%; */
width: calc(15% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb4 {
/* width: 15%; */
width: calc(15% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb5 {
width: 9%;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.94rem;
text-align: center;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-fullprice {
font-size: 0.69rem;
text-align: center;
color: var(--color-txtg4);
text-decoration: line-through;
margin-bottom: -5px;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-left {
text-align: left;
}
/* .dp-none-period-car-rental {
display: block;
}
.dp-none-period-car-rental-mb {
display: none;
} */
.lines-right-tb-car-rental {
position: relative;
width: 1px;
height: auto;
margin: 5px 0;
background-color: var(--color-grey2);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb1 {
width: calc(39% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb2 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb3 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb4 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb5 {
width: 11.5%;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb1 {
width: calc(39% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb2 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb3 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb4 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb5 {
width: 11.5%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb1 {
width: calc(39% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb2 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb3 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb4 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb5 {
width: 11.5%;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb1 {
width: calc(39% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb2 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb3 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb4 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb5 {
width: 11.5%;
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .b-size-tb p {
font-size: 0.94rem;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.88rem;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact p {
font-size: 0.88rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb1 {
width: calc(39% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb2 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb3 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb4 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .s-tb5 {
width: 11.5%;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb1 {
width: calc(39% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb2 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb3 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb4 {
width: calc(16.5% - 1px);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb5 {
width: 11.5%;
}
.box-period-dateprice-car-rental .table-dateprice .tb-head .b-size-tb p {
font-size: 0.94rem;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.88rem;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact p {
font-size: 0.88rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
/* .dp-none-period-car-rental {
display: none;
}
.dp-none-period-car-rental-mb {
display: block;
} */
.box-period-dateprice-car-rental {
padding: 0 16px;
}
.box-period-dateprice-car-rental .table-dateprice {
/* height: 30rem; */
}
.box-period-dateprice-car-rental .table-dateprice .tb-head {
display: none;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt {
max-height: inherit;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp {
padding: 0;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb {
display: flex;
justify-content: stretch;
border-right: none;
padding: 0 10px;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-l-b {
position: relative;
width: 80%;
height: auto;
display: grid;
border-right: 1px dashed var(--color-grey5);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .price-r-b {
position: relative;
width: 20%;
height: auto;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-l-b p {
text-align: left;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.88rem;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact {
width: 45%;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-tel {
display: block;
background-color: var(--color-first);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb1 {
width: 100%;
padding: 7px 10px 5px 10px;
margin-top: 0;
background-color: rgba(var(--color-first-rgb), 0.05);
border-bottom: 1px solid var(--color-first);
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb2 {
width: 100%;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb3 {
width: 100%;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb4 {
width: 100%;
}
.box-period-dateprice-car-rental .table-dateprice .tb-dt .b-tb-dp .s-tb5 {
width: 100%;
margin: 14px 0;
}
}
/* ====== period date price cruise ====== */
.box-period-dateprice-cruise {
position: relative;
width: 100%;
height: auto;
margin-bottom: 20px;
}
.box-period-dateprice-cruise .box-title {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 5px;
}
.box-period-dateprice-cruise .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-period-dateprice-cruise .table-dateprice {
position: relative;
width: 100%;
height: auto;
max-height: 23rem;
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.box-period-dateprice-cruise .table-dateprice .tb-head {
position: relative;
width: 100%;
height: auto;
max-height: 3.625rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 5px;
background-color: var(--color-first);
}
.box-period-dateprice-cruise .table-dateprice .tb-head .b-size-tb {
position: relative;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
padding: 0 5px;
}
.box-period-dateprice-cruise .table-dateprice .tb-head .b-size-tb:last-child {
border-right: none;
}
.box-period-dateprice-cruise .table-dateprice .tb-head .b-size-tb p {
font-size: 0.94rem;
color: var(--color-light);
text-align: center;
position: relative;
top: 50%;
transform: translateY(-50%);
}
/* .box-period-dateprice-cruise .table-dateprice .tb-head .b-size-tb .txt-left {
text-align: left;
} */
.box-period-dateprice-cruise .table-dateprice .tb-head .s-tb1 {
width: 25%;
}
.box-period-dateprice-cruise .table-dateprice .tb-head .s-tb2 {
width: 18%;
}
.box-period-dateprice-cruise .table-dateprice .tb-head .s-tb3 {
width: 13%;
}
.box-period-dateprice-cruise .table-dateprice .tb-head .s-tb4 {
width: 13%;
}
.box-period-dateprice-cruise .table-dateprice .tb-head .s-tb5 {
width: 13%;
}
.box-period-dateprice-cruise .table-dateprice .tb-head .s-tb6 {
width: 9%;
}
.box-period-dateprice-cruise .table-dateprice .tb-head .s-tb7 {
width: 9%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt {
position: relative;
width: 100%;
height: auto;
max-height: 19.375rem;
overflow: scroll;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt::-webkit-scrollbar {
display: none;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt {
-ms-overflow-style: none;
scrollbar-width: none;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 5px;
border-bottom: 1px solid var(--color-grey4);
margin: 5px 0;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp:last-child {
border-bottom: none;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp p {
margin: auto 0;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-date {
position: relative;
width: 25%;
height: auto;
border-right: 1px dashed var(--color-grey4);
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-date .b-size-tb {
position: relative;
width: 100%;
height: auto;
padding: 0 5px;
top: 50%;
transform: translateY(-50%);
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-date .b-size-tb p {
font-size: 0.88rem;
text-align: center;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price {
position: relative;
width: 75%;
height: auto;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
border-bottom: 1px dashed var(--color-grey4);
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list:last-child {
border-bottom: none;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .b-size-tb {
position: relative;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
padding: 0 5px;
display: grid;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .b-size-tb:last-child {
border-right: none;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .b-size-tb p {
font-size: 0.88rem;
text-align: center;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .b-size-tb .txt-fullprice {
font-size: 0.69rem;
text-align: center;
color: var(--color-txtg4);
text-decoration: line-through;
margin-bottom: -5px;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .b-size-tb .b-title-mb {
display: none;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .b-size-tb .b-txt-mb {
display: grid;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb2 {
width: 24%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb3 {
width: 17.3%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb4 {
width: 17.3%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb5 {
width: 17.3%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb6 {
width: 12.05%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb7 {
width: 12.05%;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-period-dateprice-cruise {
padding: 0 16px;
margin-bottom: 16px;
}
.box-period-dateprice-cruise .box-title p {
font-size: 1rem;
}
.box-period-dateprice-cruise .table-dateprice .tb-head {
display: none;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-date .b-size-tb p {
font-size: 0.82rem;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .b-size-tb p {
font-size: 0.82rem;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp {
padding: 0 0 5px 0;
margin: 0;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-date {
width: 100%;
border-right: none;
padding: 7px 10px 5px 10px;
background-color: rgba(var(--color-first-rgb), 0.05);
border-bottom: 1px solid var(--color-first);
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price {
width: 100%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb2 {
width: 100%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb3 {
width: 100%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb4 {
width: 100%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb5 {
width: 100%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb6 {
width: 100%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb7 {
width: 100%;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .s-tb2 .b-txt-mb p {
font-weight: bold;
color: var(--color-first);
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .b-size-tb {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .b-size-tb .b-title-mb {
position: relative;
width: 50%;
height: auto;
display: block;
border-right: 1px dashed var(--color-grey3);
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .b-size-tb .b-title-mb p {
text-align: left;
position: relative;
top: 50%;
transform: translateY(-50%);
}
.box-period-dateprice-cruise .table-dateprice .tb-dt .b-tb-dp .b-dt-price .b-tb-list .b-size-tb .b-txt-mb {
position: relative;
width: 50%;
height: auto;
}
}
/* ====== period date price ticket ====== */
.box-period-dateprice-ticket {
position: relative;
width: 100%;
height: auto;
margin-bottom: 20px;
}
.box-period-dateprice-ticket .box-title {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 5px;
}
.box-period-dateprice-ticket .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-period-dateprice-ticket .table-dateprice {
position: relative;
width: 100%;
height: auto;
max-height: 23rem;
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.box-period-dateprice-ticket .table-dateprice .tb-head {
position: relative;
width: 100%;
height: auto;
max-height: 2.125rem;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 20px;
background-color: var(--color-first);
}
.box-period-dateprice-ticket .table-dateprice .tb-head .b-size-tb {
position: relative;
width: auto;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
padding: 0 5px;
}
.box-period-dateprice-ticket .table-dateprice .tb-head .b-size-tb:last-child {
border-right: none;
}
.box-period-dateprice-ticket .table-dateprice .tb-head .s-tb1 {
width: 70%;
}
.box-period-dateprice-ticket .table-dateprice .tb-head .s-tb2 {
width: 18%;
}
.box-period-dateprice-ticket .table-dateprice .tb-head .s-tb3 {
width: 12%;
}
.box-period-dateprice-ticket .table-dateprice .tb-head .b-size-tb p {
font-size: 1rem;
color: var(--color-light);
text-align: center;
position: relative;
top: 50%;
transform: translateY(-50%);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.box-period-dateprice-ticket .table-dateprice .tb-head .b-size-tb .txt-left {
text-align: left;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt {
position: relative;
width: 100%;
height: auto;
max-height: 20.875rem;
overflow: scroll;
margin: 0 0 5px 0;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt::-webkit-scrollbar {
display: none;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt {
-ms-overflow-style: none;
scrollbar-width: none;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 20px;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp p {
margin: auto 0;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb {
position: relative;
width: auto;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
display: grid;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb:last-child {
border-right: none;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-l-b {
display: none;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .price-r-b {
display: grid;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact {
position: relative;
width: fit-content;
height: fit-content;
border-radius: 5px;
background-color: var(--color-green5);
cursor: pointer;
align-items: center;
display: flex;
margin: auto;
padding: 5px 10px;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-tel {
display: none;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact a {
position: relative;
width: 100%;
height: auto;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact p {
font-size: 0.94rem;
text-align: center;
color: var(--color-light);
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .s-tb1 {
width: 70%;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .s-tb2 {
width: 18%;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .s-tb3 {
width: 12%;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.94rem;
text-align: center;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-fullprice {
font-size: 0.69rem;
text-align: center;
color: var(--color-txtg4);
text-decoration: line-through;
margin-bottom: -5px;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-left {
text-align: left;
}
/* .dp-none-period-ticket {
display: block;
}
.dp-none-period-ticket-mb {
display: none;
} */
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
/* .dp-none-period-ticket {
display: none;
}
.dp-none-period-ticket-mb {
display: block;
} */
.box-period-dateprice-ticket {
padding: 0 16px;
}
.box-period-dateprice-ticket .table-dateprice {
max-height: 30rem;
}
.box-period-dateprice-ticket .table-dateprice .tb-head {
display: none;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt {
max-height: inherit;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp {
padding: 0;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb {
display: flex;
justify-content: stretch;
border-right: none;
padding: 0 10px;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-l-b {
position: relative;
width: 80%;
height: auto;
display: grid;
border-right: 1px dashed var(--color-grey5);
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .price-r-b {
position: relative;
width: 20%;
height: auto;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-l-b p {
text-align: left;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.88rem;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact {
width: 45%;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-tel {
display: block;
background-color: var(--color-first);
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .s-tb1 {
width: 100%;
padding: 7px 10px 5px 10px;
margin-top: 0;
background-color: rgba(var(--color-first-rgb), 0.05);
border-bottom: 1px solid var(--color-first);
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .s-tb2 {
width: 100%;
}
.box-period-dateprice-ticket .table-dateprice .tb-dt .b-tb-dp .s-tb3 {
width: 100%;
margin: 14px 0;
}
}
/* ====== Flight/Bus schedule ====== */
.box-flight-and-bus-schedule {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey4);
}
.box-flight-and-bus-schedule .box-title {
position: relative;
width: 100%;
height: auto;
padding: 10px;
background-color: rgba(var(--color-first-rgb), 0.02);
}
.box-flight-and-bus-schedule .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-flight-and-bus-schedule .box-title span {
font-size: 1.07rem;
font-weight: bold;
}
.box-flight-and-bus-schedule .box-title i {
font-size: 1.07rem;
font-weight: bold;
}
.box-flight-and-bus-schedule .pd-b-tb-all {
position: relative;
width: 100%;
height: auto;
margin: 10px 0 16px 0;
padding: 0 40px 0 20px;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-head-fgb {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 5px;
background-color: var(--color-first);
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-head-fgb .b-size-tb-fgb {
position: relative;
width: auto;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
padding: 0 5px;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-head-fgb .b-size-tb-fgb p {
font-size: 1rem;
color: var(--color-light);
text-align: center;
position: relative;
top: 50%;
transform: translateY(-50%);
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-head-fgb .s-tbfgb1 {
width: 50%;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-head-fgb .s-tbfgb2 {
width: 25%;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-head-fgb .s-tbfgb3 {
width: 25%;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb {
position: relative;
width: 100%;
height: auto;
overflow: scroll;
margin: 0 0 5px 0;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb::-webkit-scrollbar {
display: none;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb {
-ms-overflow-style: none;
scrollbar-width: none;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 5px;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb p {
margin: auto 0;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .b-size-tbfgb {
position: relative;
width: auto;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
display: grid;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .b-size-tbfgb p {
font-size: 0.94rem;
text-align: center;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .s-tbfgb1 {
width: 50%;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .s-tbfgb2 {
width: 25%;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .s-tbfgb3 {
width: 25%;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .b-size-tbfgb .txt-l-mbfgb {
display: none;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .b-size-tbfgb .price-r-mbfgb {
display: grid;
}
/* .dp-none-flight-bus {
display: block;
}
.dp-none-flight-bus-mb {
display: none;
} */
/* ============= */
@media (min-width: 1200px) {
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-head-fgb .b-size-tb-fgb:last-child {
border-right: none;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .b-size-tbfgb:last-child {
border-right: none;
}
}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
/* .dp-none-flight-bus {
display: none;
}
.dp-none-flight-bus-mb {
display: block;
} */
.box-flight-and-bus-schedule .box-title p {
font-size: 1rem;
}
.box-flight-and-bus-schedule .box-title span {
font-size: 1rem;
}
.box-flight-and-bus-schedule .box-title i {
font-size: 1rem;
}
.box-flight-and-bus-schedule .pd-b-tb-all {
margin: 10px 0 16px 0;
padding: 0 16px 0 16px;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-head-fgb {
display: none;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-head-fgb .b-size-tb-fgb p {
font-size: 0.94rem;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb {
margin-bottom: 0;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb {
padding: 5px 10px;
border-bottom: 1px solid var(--color-grey3);
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb:last-child {
border-bottom: none;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb:nth-child(odd) {
background-color: rgba(var(--color-first-rgb), 0.1);
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .b-size-tbfgb {
border-right: none;
margin: 5px 0 5px 0;
padding: 0 0 10px 0;
display: flex;
justify-content: stretch;
border-bottom: 1px dashed var(--color-grey4);
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .b-size-tbfgb:last-child {
border-bottom: none;
padding: 0;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .b-size-tbfgb p {
font-size: 0.88rem;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .s-tbfgb1 {
width: 100%;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .s-tbfgb2 {
width: 100%;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .s-tbfgb3 {
width: 100%;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .b-size-tbfgb .txt-l-mbfgb {
width: 50%;
display: grid;
padding: 0 0 0 5px;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .b-size-tbfgb .txt-l-mbfgb p {
text-align: left;
font-weight: bold;
}
.box-flight-and-bus-schedule .pd-b-tb-all .table-flight-bus .tb-dt-fgb .b-tb-dpfgb .b-size-tbfgb .price-r-mbfgb {
width: 50%;
}
/* .box-period-dateprice-package {
padding: 0 16px;
}
.box-period-dateprice-package .table-dateprice {
height: 30rem;
}
.box-period-dateprice-package .table-dateprice .tb-head {
display: none;
}
.box-period-dateprice-package .table-dateprice .tb-dt {
max-height: inherit;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp {
padding: 0;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb {
display: flex;
justify-content: stretch;
border-right: none;
padding: 0 10px;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-l-b {
position: relative;
width: 80%;
height: auto;
display: grid;
border-right: 1px dashed var(--color-grey5);
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .price-r-b {
position: relative;
width: 20%;
height: auto;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .txt-l-b p {
text-align: left;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.88rem;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-contact {
width: 45%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .b-size-tb .btn-bk-tel {
display: block;
background-color: var(--color-first);
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb1 {
width: 100%;
padding: 7px 10px 5px 10px;
margin-top: 0;
background-color: rgba(var(--color-first-rgb), 0.05);
border-bottom: 1px solid var(--color-first);
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb2 {
width: 100%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb3 {
width: 100%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb4 {
width: 100%;
}
.box-period-dateprice-package .table-dateprice .tb-dt .b-tb-dp .s-tb5 {
width: 100%;
margin: 14px 0;
} */
}
/* ====== timeline program ====== */
.box-timeline-program {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey4);
}
.box-timeline-program .box-title {
position: relative;
width: 100%;
height: auto;
padding: 10px;
background-color: rgba(var(--color-first-rgb), 0.02);
}
.box-timeline-program .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-timeline-program .box-title span {
font-size: 1.07rem;
font-weight: bold;
}
.box-timeline-program .box-title i {
font-size: 1.07rem;
font-weight: bold;
}
.box-timeline-program .box-dt {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 20px 40px;
}
.box-timeline-program .box-dt .b-timelines {
position: relative;
width: 100%;
height: auto;
}
.box-timeline-program .box-dt .b-timelines .b-list-timelines {
border-left: 1px dashed var(--color-first);
position: relative;
padding: 0 0 16px 25px;
margin-left: 10px;
}
.box-timeline-program .box-dt .b-timelines .b-list-timelines:last-child {
border: 0px;
padding-bottom: 0;
}
.box-timeline-program .box-dt .b-timelines .b-list-timelines::after {
content: "";
width: 20px;
height: 20px;
background: var(--color-second);
border: 1px solid var(--color-first);
box-shadow: 2px 2px 0px var(--color-second);
border-radius: 50%;
position: absolute;
left: -11px;
top: 0px;
}
.box-timeline-program .box-dt .b-timelines .b-list-timelines::before {
content: "";
display: inline-block;
width: 15px;
height: 10px;
position: absolute;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
left: 10px;
top: 5px;
border-right: 10px solid var(--color-grey6);
}
.box-timeline-program .box-dt .b-timelines .b-list-timelines .bg-box {
width: 95%;
height: auto;
border: 1px solid var(--color-grey3);
border-radius: 5px;
background-color: var(--color-light);
overflow: hidden;
}
.box-timeline-program .box-dt .b-timelines .b-list-timelines .bg-box .title-day {
position: relative;
width: 100%;
height: auto;
padding: 5px 12px;
border-bottom: 1px dashed var(--color-grey3);
background-color: var(--color-grey1);
}
.box-timeline-program .box-dt .b-timelines .b-list-timelines .bg-box .title-day p {
font-size: 1rem;
font-weight: bold;
}
.box-timeline-program .box-dt .b-timelines .b-list-timelines .bg-box .dt-day {
position: relative;
width: 100%;
height: auto;
padding: 5px 12px;
}
.box-timeline-program .box-dt .b-timelines .b-list-timelines .bg-box .dt-day p {
font-size: 0.94rem;
color: var(--color-txtg5);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-timeline-program .box-title span {
font-size: 1rem;
}
.box-timeline-program .box-dt {
padding: 10px 16px 20px 16px;
}
.box-timeline-program .box-dt .b-timelines .b-list-timelines .bg-box {
width: 100%;
}
.box-timeline-program .box-dt .b-timelines .b-list-timelines .bg-box .title-day p {
font-size: 0.94rem;
}
.box-timeline-program .box-dt .b-timelines .b-list-timelines .bg-box .dt-day p {
font-size: 0.88rem;
}
}
/* ====== How to book ====== */
.box-how-to-book {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey4);
}
.box-how-to-book .box-title {
position: relative;
width: 100%;
height: auto;
padding: 10px;
background-color: rgba(var(--color-first-rgb), 0.02);
}
.box-how-to-book .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-how-to-book .box-title span {
font-size: 1.07rem;
font-weight: bold;
}
.box-how-to-book .box-title i {
font-size: 1.07rem;
font-weight: bold;
}
.box-how-to-book .box-dt {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 10px 20px;
}
.box-how-to-book .box-dt p {
font-size: 0.94rem;
padding: 0 0 5px 0;
text-indent: 15px;
}
.box-how-to-book .box-img-booking {
position: relative;
width: 100%;
height: auto;
margin: 10px 0 10px 0;
}
.box-how-to-book .box-img-booking figure {
position: relative;
width: 100%;
height: auto;
}
.box-how-to-book .box-img-booking figure .size-img {
position: relative;
width: 100%;
height: auto;
}
/*----------------เพิ่มเอง 13092566-------------------*/
.box-img-booking2 {
position: relative;
width: 100%;
height: auto;
margin: 10px 0 10px 0;
}
.box-img-booking2 figure {
position: relative;
width: 100%;
height: auto;
}
.box-img-booking2 figure .size-img {
position: relative;
width: 100%;
height: auto;
}
/*----------------เพิ่มเอง 13092566-------------------*/
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-how-to-book .box-title span {
font-size: 1rem;
}
.box-how-to-book .box-dt {
padding: 12px 16px 5px 16px;
}
.box-how-to-book .box-dt p {
font-size: 0.88rem;
text-indent: 16px;
}
.box-how-to-book .box-img-booking {
padding: 0 16px;
}
/*----------------เพิ่มเอง 13092566-------------------*/
.box-img-booking2 {
padding: 0 16px;
}
/*----------------เพิ่มเอง 13092566-------------------*/
}
/* ====== payment and How to payment ====== */
.box-payment {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey4);
}
.box-payment .box-title {
position: relative;
width: 100%;
height: auto;
padding: 10px;
background-color: rgba(var(--color-first-rgb), 0.02);
}
.box-payment .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-payment .box-title span {
font-size: 1.07rem;
font-weight: bold;
}
.box-payment .box-title i {
font-size: 1.07rem;
font-weight: bold;
}
.box-payment .box-dt {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 10px 20px;
/* padding: 10px 0 0 20px; */
}
.box-payment .box-dt p {
font-size: 0.94rem;
padding: 0 0 5px 0;
text-indent: 15px;
}
.box-payment .box-tb-pm {
position: relative;
width: 100%;
height: auto;
padding: 0 10px 0 24px;
margin: 10px 0;
}
.box-payment .box-tb-pm .title {
position: relative;
width: 100%;
height: auto;
}
.box-payment .box-tb-pm .title p {
font-size: 1rem;
font-weight: bold;
}
.box-payment .box-tb-pm .tb-pm {
position: relative;
width: 100%;
height: auto;
margin: 5px 0 0 0;
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
}
.box-payment .box-tb-pm .tb-pm .l-tb-pm {
position: relative;
width: 100%;
height: auto;
}
.box-payment .box-tb-pm .tb-pm .r-tb-pm {
position: relative;
width: 100%;
height: auto;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
padding: 5px 10px;
background-color: var(--color-light);
border-top: 1px solid var(--color-grey3);
align-items: center;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one:first-child {
border-top: none;
}
.box-payment .box-tb-pm .tb-pm .bg-hd-tb {
background-color: var(--color-grey3);
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb1 {
position: relative;
width: 10%;
height: auto;
padding: 2px 5px;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb2 {
position: relative;
width: 18%;
height: auto;
padding: 2px 5px;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb3 {
position: relative;
width: 30%;
height: auto;
padding: 2px 5px;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb4 {
position: relative;
width: 30%;
height: auto;
padding: 2px 5px;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb5 {
position: relative;
width: 12%;
height: auto;
padding: 2px 5px;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb1 p,
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb2 p,
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb3 p,
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb4 p,
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb5 p {
font-size: 0.94rem;
text-align: center;
}
.box-payment .box-tb-pm .tb-pm .bg-hd-tb .tb1 p,
.box-payment .box-tb-pm .tb-pm .bg-hd-tb .tb2 p,
.box-payment .box-tb-pm .tb-pm .bg-hd-tb .tb3 p,
.box-payment .box-tb-pm .tb-pm .bg-hd-tb .tb4 p,
.box-payment .box-tb-pm .tb-pm .bg-hd-tb .tb5 p {
font-size: 1rem;
font-weight: bold;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb1 figure {
position: relative;
width: 100%;
height: 100%;
display: flex;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb1 figure .size-img {
position: relative;
width: auto;
height: 3rem;
margin: 0 auto;
}
.box-payment .box-tb-pm .b--dtpm .dt-pm {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 0 20px;
}
.box-payment .box-tb-pm .b--dtpm .dt-pm .title {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.box-payment .box-tb-pm .b--dtpm .dt-pm .title p {
font-size: 0.94rem;
font-weight: bold;
text-decoration: underline;
}
.box-payment .box-tb-pm .b--dtpm .dt-pm .dt {
position: relative;
width: 100%;
height: auto;
padding: 0 0 0 15px;
}
.box-payment .box-tb-pm .b--dtpm .dt-pm .dt p {
font-size: 0.94rem;
font-weight: normal;
padding-bottom: 3px;
}
.box-payment .box-tb-pm .bt {
position: relative;
width: 100%;
height: auto;
padding: 5px 0 0 10px;
}
.box-payment .box-tb-pm .bt p {
font-size: 0.94rem;
font-weight: normal;
padding-bottom: 3px;
text-indent: 15px;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-payment .box-title span {
font-size: 1rem;
}
.box-payment .box-dt {
padding: 10px 16px 10px 16px;
/* padding: 10px 16px 0 16px; */
}
.box-payment .box-dt p {
font-size: 0.88rem;
text-indent: 15px;
}
.box-payment .box-tb-pm {
padding: 0 16px;
margin: 5px 0;
}
.box-payment .box-tb-pm .title p {
font-size: 0.94rem;
}
.box-payment .box-tb-pm .tb-pm {
margin: 10px 0 0 0;
}
.box-payment .box-tb-pm .tb-pm .l-tb-pm {
display: none;
}
.box-payment .box-tb-pm .tb-pm .r-tb-pm {}
.box-payment .box-tb-pm .tb-pm .tb-pm-one {
flex-wrap: wrap;
flex-direction: row;
padding: 5px;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb1 {
order: 3;
width: 30%;
margin: 5px 0;
border-right: 1px dashed var(--color-grey4);
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb2 {
order: 4;
width: 36%;
margin: 5px 0;
border-right: 1px dashed var(--color-grey4);
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb3 {
order: 1;
width: 66%;
margin: 5px 0;
border-right: 1px dashed var(--color-grey4);
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb4 {
order: 5;
width: 34%;
margin: 5px 0;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb5 {
order: 2;
width: 34%;
margin: 5px 0;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb1 figure .size-img {
height: 2rem;
}
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb1 p,
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb2 p,
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb3 p,
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb4 p,
.box-payment .box-tb-pm .tb-pm .tb-pm-one .tb5 p {
font-size: 0.88rem;
}
.box-payment .box-tb-pm .tb-pm .bg-hd-tb .tb1 p,
.box-payment .box-tb-pm .tb-pm .bg-hd-tb .tb2 p,
.box-payment .box-tb-pm .tb-pm .bg-hd-tb .tb3 p,
.box-payment .box-tb-pm .tb-pm .bg-hd-tb .tb4 p,
.box-payment .box-tb-pm .tb-pm .bg-hd-tb .tb5 p {
font-size: 0.94rem;
}
.box-payment .box-tb-pm .b--dtpm .dt-pm .dt p {
font-size: 0.88rem;
}
.box-payment .box-tb-pm .bt p {
font-size: 0.88rem;
}
}
/* ====== details set ====== */
.box-dt-set {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey4);
}
.box-dt-set .box-title {
position: relative;
width: 100%;
height: auto;
padding: 10px;
background-color: rgba(var(--color-first-rgb), 0.02);
}
.box-dt-set .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-dt-set .box-title span {
font-size: 1.07rem;
font-weight: bold;
}
.box-dt-set .box-title i {
font-size: 1.07rem;
font-weight: bold;
}
.box-dt-set .box-dt {
position: relative;
width: 100%;
height: auto;
padding: 16px 0 0 20px;
margin-bottom: 10px;
}
.box-dt-set .box-dt p {
font-size: 0.94rem;
padding: 0 0 5px 0;
text-indent: 15px;
}
.box-dt-set .box-dt p span {
font-size: 0.94rem;
padding: 0 5px 0 0;
text-indent: 0;
}
.box-dt-set .box-dt p span i {
font-size: 0.94rem;
}
.box-dt-set .box-dt-clause {
position: relative;
width: 100%;
height: auto;
padding: 0 10px 0 25px;
margin: 10px 0;
}
.box-dt-set .box-dt-clause .title {
position: relative;
width: 100%;
height: auto;
}
.box-dt-set .box-dt-clause .title p {
font-size: 1rem;
font-weight: bold;
}
.box-dt-set .box-dt-clause .bt {
position: relative;
width: 100%;
height: auto;
padding: 2px 0 0 10px;
}
.box-dt-set .box-dt-clause .bt p {
font-size: 0.94rem;
font-weight: normal;
padding-bottom: 3px;
text-indent: 15px;
}
.box-dt-set .box-dt-clause .bt .txt-sub-topic {
font-size: 0.94rem;
font-weight: normal;
padding-bottom: 3px;
text-indent: 10px;
text-decoration: underline;
}
.box-dt-set .box-dt .b-dtset-lr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 0 16px 0;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr {
position: relative;
width: 50%;
height: auto;
display: flex;
justify-content: stretch;
padding: 3px 5px 3px 5px;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-title {
position: relative;
width: 30%;
height: auto;
padding: 0 5px;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-title p {
font-size: 0.94rem;
font-weight: bold;
text-indent: 0;
padding: 0;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .spr-txt {
position: relative;
width: 5%;
height: auto;
padding: 0 5px;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .spr-txt p {
font-size: 0.94rem;
text-indent: 0;
padding: 0;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-dt {
position: relative;
width: 65%;
height: auto;
padding: 0 5px;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-dt p {
font-size: 0.94rem;
text-indent: 0;
padding: 0;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-title {
width: 38%;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .spr-txt {
width: 5%;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-dt {
width: 57%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-title {
width: 45%;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .spr-txt {
width: 5%;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-dt {
width: 50%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-title {
width: 45%;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .spr-txt {
width: 5%;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-dt {
width: 50%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.box-dt-set .box-title p {
font-size: 1rem;
font-weight: bold;
}
.box-dt-set .box-title span {
font-size: 1rem;
font-weight: bold;
}
.box-dt-set .box-title i {
font-size: 1rem;
font-weight: bold;
}
.box-dt-set .box-dt {
padding: 10px 16px 0 16px;
margin-bottom: 10px;
}
.box-dt-set .box-dt p {
font-size: 0.88rem;
}
.box-dt-set .box-dt p span {
font-size: 0.88rem;
}
.box-dt-set .box-dt p span i {
font-size: 0.88rem;
}
.box-dt-set .box-dt-clause {
padding: 0 16px;
margin: 5px 0;
}
.box-dt-set .box-dt-clause .title p {
font-size: 0.94rem;
}
.box-dt-set .box-dt-clause .bt {
padding: 2px 0 0 0;
}
.box-dt-set .box-dt-clause .bt p {
font-size: 0.88rem;
}
.box-dt-set .box-dt .b-dtset-lr {
padding: 0 0 16px 16px;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr {
width: 100%;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-title {
width: 40%;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-title p {
font-size: 0.88rem;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .spr-txt {
width: 5%;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .spr-txt p {
font-size: 0.88rem;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-dt {
width: 55%;
}
.box-dt-set .box-dt .b-dtset-lr .b-txt-lr .txt-dt p {
font-size: 0.88rem;
}
}
/* ====== knowledge ====== */
.box-knowledge {
position: relative;
width: 100%;
height: auto;
padding: 0 20px 0 20px;
margin: 10px 0 10px 0;
}
.box-knowledge .bg-knowledge {
position: relative;
width: 80%;
height: auto;
background-color: rgba(var(--color-first-rgb), 0.035);
border: 1px dashed var(--color-first);
border-radius: 5px;
overflow: hidden;
padding: 10px 16px 16px 16px;
}
.box-knowledge .bg-knowledge .b-title {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 0;
}
.box-knowledge .bg-knowledge .b-title p {
font-size: 1rem !important;
font-weight: bold !important;
text-align: left !important;
text-indent: 0 !important;
}
.box-knowledge .bg-knowledge .b-title p span {
padding-right: 5px;
}
.box-knowledge .bg-knowledge .b-title p i {
color: var(--color-first);
}
.box-knowledge .bg-knowledge .b-dt {
position: relative;
width: 100%;
height: auto;
padding: 0 0 0 15px !important;
}
.box-knowledge .bg-knowledge .b-dt p {
font-size: 0.88rem !important;
font-weight: normal !important;
padding-bottom: 3px !important;
text-indent: 15px !important;
text-align: left !important;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-knowledge {
padding: 0 16px;
}
.pd0-box-knowledge {
padding: 0;
}
.box-knowledge .bg-knowledge {
width: 100%;
padding: 10px 12px 10px 12px;
}
.box-knowledge .bg-knowledge .b-title p {
font-size: 0.94rem !important;
}
.box-knowledge .bg-knowledge .b-dt p {
font-size: 0.82rem !important;
}
}
/* ====== map ====== */
.box-map {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey4);
}
.box-map .box-title {
position: relative;
width: 100%;
height: auto;
padding: 10px;
background-color: rgba(var(--color-first-rgb), 0.02);
}
.box-map .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-map .box-title span {
font-size: 1.07rem;
font-weight: bold;
}
.box-map .box-title i {
font-size: 1.07rem;
font-weight: bold;
}
.box-map .b-map {
position: relative;
width: 100%;
height: auto;
padding: 16px;
}
.box-map .b-map .b-if {
width: 80%;
height: 30rem;
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey4);
margin: 0 auto;
}
.box-map .b-map .b-if iframe {
width: 100%;
height: 100%;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.box-map .b-map .b-if {
width: 85%;
height: 22rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.box-map .b-map .b-if {
width: 90%;
height: 20rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box-map .b-map .b-if {
width: 90%;
height: 18rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.box-map .box-title p {
font-size: 1rem;
}
.box-map .box-title span {
font-size: 1rem;
}
.box-map .box-title i {
font-size: 1rem;
}
.box-map .b-map {
padding: 16px;
}
.box-map .b-map .b-if {
width: 100%;
height: 13rem;
}
}
/* ====== giveaway ====== */
.box-giveaway {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey4);
}
.box-giveaway .box-title {
position: relative;
width: 100%;
height: auto;
padding: 10px;
background-color: rgba(var(--color-first-rgb), 0.02);
}
.box-giveaway .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-giveaway .box-title span {
font-size: 1.07rem;
font-weight: bold;
}
.box-giveaway .box-title i {
font-size: 1.07rem;
font-weight: bold;
}
.box-giveaway .b-gvw {
position: relative;
width: 100%;
height: auto;
padding: 16px 10px 10px 16px;
}
.box-giveaway .b-gvw .b-lr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box-giveaway .b-gvw .b-lr .b-img {
position: relative;
width: 30%;
height: auto;
}
.box-giveaway .b-gvw .b-lr .b-img figure {
position: relative;
width: 100%;
height: auto;
}
.box-giveaway .b-gvw .b-lr .b-img figure .size-img {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
}
.box-giveaway .b-gvw .b-lr .b-dt {
position: relative;
width: 70%;
height: auto;
padding: 0 0 0 16px;
}
.box-giveaway .b-gvw .b-lr .b-dt .b-name {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 0;
}
.box-giveaway .b-gvw .b-lr .b-dt .b-name p {
font-size: 1.13rem;
font-weight: bold;
}
.box-giveaway .b-gvw .b-lr .b-dt .td-gvw {
position: relative;
width: 100%;
height: auto;
}
.box-giveaway .b-gvw .b-lr .b-dt .td-gvw p {
font-size: 0.94rem;
font-weight: normal;
color: var(--color-txtg5);
text-indent: 15px;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-giveaway .box-title p {
font-size: 1rem;
}
.box-giveaway .box-title span {
font-size: 1rem;
}
.box-giveaway .box-title i {
font-size: 1rem;
}
.box-giveaway .b-gvw {
padding: 16px;
}
.box-giveaway .b-gvw .b-lr .b-img {
width: 100%;
}
.box-giveaway .b-gvw .b-lr .b-dt {
width: 100%;
padding: 10px 0 0 10px;
}
.box-giveaway .b-gvw .b-lr .b-dt .b-name p {
font-size: 1rem;
}
.box-giveaway .b-gvw .b-lr .b-dt .td-gvw p {
font-size: 0.88rem;
}
}
/* ================= details gallery ================= */
.box-img-gallery-dt {
position: relative;
width: 100%;
height: auto;
margin: 20px 0 0 0;
/* margin: 10px 0 20px 0; */
padding: 0 10px;
/* padding: 0 0 0 20px; */
}
.box-img-gallery-dt .spr-img-gll {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
}
.box-img-gallery-dt .spr-img-gll .b-list-img {
position: relative;
width: calc((100%/4) - 6.8px);
/* width: calc((100%/3) - 6px); */
height: fit-content;
margin: 0 9px 9px 0;
border-radius: 5px;
border: 1px solid var(--color-grey4);
overflow: hidden;
}
.box-img-gallery-dt .spr-img-gll .b-list-img figure {
position: relative;
width: 100%;
height: auto;
cursor: pointer;
}
.box-img-gallery-dt .spr-img-gll .b-list-img figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.box-img-gallery-dt .spr-img-gll .b-list-img .b-name-img {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 3px 10px;
background-color: var(--color-light);
}
.box-img-gallery-dt .spr-img-gll .b-list-img .b-name-img p {
font-size: 0.82rem;
color: var(--color-txtg5);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
/* ============= */
@media (min-width: 1200px) {
.box-img-gallery-dt .spr-img-gll .b-list-img:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.box-img-gallery-dt .spr-img-gll .b-list-img:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.box-img-gallery-dt .spr-img-gll .b-list-img:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box-img-gallery-dt .spr-img-gll .b-list-img:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.box-img-gallery-dt {
margin: 10px 0 10px 0;
padding: 0 16px 0 16px;
}
.box-img-gallery-dt .spr-img-gll .b-list-img {
width: 100%;
margin: 0 0 9px 0;
}
.box-img-gallery-dt .spr-img-gll .b-list-img figure {
height: auto;
}
}
.bfull--imgv {
position: relative;
width: auto;
height: auto;
border-radius: 5px;
border: 1px solid var(--color-grey4);
overflow: hidden;
margin: 0 auto;
}
.bfull--imgv figure {
position: relative;
width: auto;
height: auto;
}
.bfull--imgv figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.bfull--imgv .bname-img {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 3px 10px;
background-color: var(--color-light);
}
.bfull--imgv .bname-img p {
font-size: 0.82rem;
color: var(--color-txtg5);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
/* ====== social and share ====== */
.box-social-and-share {
position: relative;
width: 100%;
height: auto;
padding: 20px 20px 0 0;
}
.lines-box-top-scash {
border-top: 1px dashed var(--color-grey4);
}
/* view program */
.box-social-and-share .box-view-pg {
position: relative;
width: 100%;
height: auto;
padding: 0 5px 10px 0;
}
.box-social-and-share .box-view-pg p {
font-size: 0.88rem;
font-weight: normal;
text-align: right;
color: var(--color-txtg5);
}
.box-social-and-share .box-view-pg p span {
color: var(--color-txt5);
}
.box-social-and-share .box-view-pg p .number-views {
padding: 0 2px;
font-weight: bold;
color: var(--color-red);
}
/* button social */
.box-social-and-share .box-btn-icon-social {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: end;
align-items: center;
padding: 0 0 5px 0;
}
.box-social-and-share .box-btn-icon-social .btn-icon {
position: relative;
width: 2.2rem;
height: 2.2rem;
border-radius: 100%;
margin: 0 0 0 10px;
cursor: pointer;
}
.box-social-and-share .box-btn-icon-social .btn-icon a {
position: relative;
width: 100%;
height: 100%;
}
.box-social-and-share .box-btn-icon-social .btn-icon a .size-img {
position: relative;
width: 100%;
height: auto;
}
/* hover image */
.box-social-and-share .box-btn-icon-social .btn-icon a .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.box-social-and-share .box-btn-icon-social .btn-icon:hover a .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* share program */
.box-social-and-share .box-share-link {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 0 0;
}
.box-social-and-share .box-share-link .b-link-v {
position: relative;
width: fit-content;
height: auto;
display: flex;
justify-content: stretch;
margin: 0 0 10px auto;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
}
.box-social-and-share .box-share-link .b-link-v:last-child {
margin-bottom: 0;
}
.box-social-and-share .box-share-link .b-link-v .view-url {
position: relative;
width: 20rem;
height: auto;
display: flex;
align-items: center;
padding: 5px 10px 3px 10px;
background-color: var(--color-light);
}
.box-social-and-share .box-share-link .b-link-v .view-url p {
font-size: 0.88rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
color: var(--color-txtg5);
}
.box-social-and-share .box-share-link .b-link-v .view-url input {
width: 100%;
height: auto;
font-size: 0.88rem;
color: var(--color-txtg5);
}
.box-social-and-share .box-share-link .b-link-v .btn {
position: relative;
width: 5.5rem;
height: auto;
padding: 5px 5px 3px 5px;
cursor: pointer;
}
.box-social-and-share .box-share-link .b-link-v .btn a {
position: relative;
width: 100%;
height: 100%;
}
.box-social-and-share .box-share-link .b-link-v .btn p {
font-size: 0.94rem;
color: var(--color-txtg5);
text-align: center;
}
.box-social-and-share .box-share-link .b-link-v .btn p span {
color: var(--color-txtg5);
}
.box-social-and-share .box-share-link .b-link-v .btn p span i {
color: var(--color-txtg5);
padding-left: 2px;
}
.box-social-and-share .box-share-link .b-link-v .cl-btn-link {
background-color: var(--color-first);
}
.box-social-and-share .box-share-link .b-link-v .cl-btn-pdf {
background-color: var(--color-pdf);
}
.box-social-and-share .box-share-link .b-link-v .cl-btn-word {
background-color: var(--color-word);
}
.box-social-and-share .box-share-link .b-link-v .btn button {
font-size: 0.94rem;
width: 100%;
height: auto;
color: var(--color-light);
background-color: transparent;
cursor: pointer;
}
.box-social-and-share .box-share-link .b-link-v .btn button i {
color: var(--color-light);
padding-left: 2px;
}
.box-social-and-share .box-share-link .b-link-v .btn.cl-btn-link:hover {
background-color: rgba(var(--color-first-rgb), 0.1);
transition: all 0.3s ease;
}
.box-social-and-share .box-share-link .b-link-v .btn.cl-btn-pdf:hover {
background-color: rgba(var(--color-pdf-rgb), 0.1);
transition: all 0.3s ease;
}
.box-social-and-share .box-share-link .b-link-v .btn.cl-btn-word:hover {
background-color: rgba(var(--color-word-rgb), 0.1);
transition: all 0.3s ease;
}
.box-social-and-share .box-share-link .b-link-v .btn.cl-btn-link:hover button,
.box-social-and-share .box-share-link .b-link-v .btn.cl-btn-pdf:hover button,
.box-social-and-share .box-share-link .b-link-v .btn.cl-btn-word:hover button {
color: var(--color-txtg);
transition: all 0.3s ease;
}
.box-social-and-share .box-share-link .b-link-v .btn.cl-btn-link:hover button i,
.box-social-and-share .box-share-link .b-link-v .btn.cl-btn-pdf:hover button i,
.box-social-and-share .box-share-link .b-link-v .btn.cl-btn-word:hover button i {
color: var(--color-txtg);
transition: all 0.3s ease;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-social-and-share {
padding: 12px 16px 20px 16px;
}
.box-social-and-share .box-share-link .b-link-v {
width: 100%;
}
.box-social-and-share .box-share-link .b-link-v .view-url {
width: calc(100% - 5.2rem);
}
.box-social-and-share .box-share-link .b-link-v .view-url input {
font-size: 0.82rem;
}
.box-social-and-share .box-share-link .b-link-v .btn {
width: 5.2rem;
}
.box-social-and-share .box-share-link .b-link-v .btn button {
font-size: 0.88rem;
}
}
/* ====== accordion ====== */
.box-sc-dt-accordion {
position: relative;
width: 100%;
height: auto;
}
.box-sc-dt-accordion::-webkit-scrollbar {
display: none;
}
.accordion-list-dt {
list-style: none;
cursor: pointer;
}
.accordion-list-dt.showAnswerData .accordion-title .arrowIcon {
transform: rotate(-180deg);
}
/* .accordion-list-dt:hover .accordion-title span,
.accordion-list-dt:hover .accordion-title .arrowIcon {
color: var(--color-first);
transition: all 0.3s ease;
} */
.accordion-list-dt.showAnswerData .accordion-title {
border-bottom: 1px solid var(--color-first);
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
transition: all 0.3s ease;
}
.accordion-list-dt.showAnswerData .accordion-title span,
.accordion-list-dt.showAnswerData .accordion-title .arrowIcon {
color: var(--color-first);
transition: all 0.3s ease;
}
.accordion-list-dt.showAnswerData .accordion-dt-view {
display: block;
cursor: auto;
}
.accordion-title {
display: flex;
align-items: center;
justify-content: space-between;
}
.accordion-title .arrowIcon {
transition: all 0.3s ease;
}
.accordion-dt-view {
display: none;
}
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ====== details article and past works ====== */
.box-dt-article-and-pastworks {
position: relative;
width: 100%;
height: auto;
}
.box-dt-article-and-pastworks .b-img-main {
position: relative;
width: 100%;
height: auto;
margin: 0 0 10px 0;
}
.box-dt-article-and-pastworks .b-img-main figure {
position: relative;
width: 100%;
height: 100%;
}
.box-dt-article-and-pastworks .b-img-main figure .size-img {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
}
.box-dt-article-and-pastworks .b-img-main .b-date {
position: absolute;
width: auto;
height: auto;
top: 0;
left: 0;
padding: 10px;
border-radius: 5px;
background-color: var(--color-bg-ft);
}
.box-dt-article-and-pastworks .b-img-main .b-date p {
font-size: 1.25rem;
color: var(--color-light);
text-align: center;
}
.box-dt-article-and-pastworks .b-img-main .b-date .month {
font-size: 0.75rem;
}
.box-dt-article-and-pastworks .b-img-main .b-country {
position: absolute;
width: auto;
height: auto;
bottom: 0;
right: 0;
padding: 10px;
border-radius: 5px;
background-color: var(--color-bg-ft);
}
.box-dt-article-and-pastworks .b-img-main .b-country p {
font-size: 0.75rem;
color: var(--color-light);
}
.box-dt-article-and-pastworks .b-img-main .b-country p .icon-b-ct {
color: var(--color-light);
padding-right: 5px;
}
.box-dt-article-and-pastworks .b-img-main .b-country p .icon-b-ct i {
color: var(--color-light);
}
.box-dt-article-and-pastworks .b-title-and-dt-main {
position: relative;
width: 100%;
height: auto;
padding: 16px 0 20px 0;
margin: 0 0 20px 0;
border-bottom: 1px dashed var(--color-grey4);
}
.box-dt-article-and-pastworks .b-title-and-dt-main .b-title {
position: relative;
width: 100%;
height: auto;
padding: 0 0 10px 0;
}
.box-dt-article-and-pastworks .b-title-and-dt-main .b-title p {
font-size: 1.32rem;
font-weight: bold;
color: var(--color-first);
text-align: center;
}
.box-dt-article-and-pastworks .b-title-and-dt-main .b-dt {
position: relative;
width: 100%;
height: auto;
padding: 0 10px;
}
.box-dt-article-and-pastworks .b-title-and-dt-main .b-dt p {
font-size: 0.94rem;
text-indent: 25px;
color: var(--color-txtg5);
}
.box-dt-article-and-pastworks .b-dt-sub-content {
position: relative;
width: 100%;
height: auto;
padding: 0 0 20px 0;
margin: 20px 0 20px 0;
border-bottom: 1px dashed var(--color-grey4);
}
.box-dt-article-and-pastworks .b-dt-sub-content:last-child {
border-bottom: none;
margin: 20px 0 0 0;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-title {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 0;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-title p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-txtg);
text-align: center;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-dt {
position: relative;
width: 100%;
height: auto;
padding: 0 10px 12px 10px;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-dt p {
font-size: 0.94rem;
text-indent: 25px;
color: var(--color-txtg5);
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery {
position: relative;
width: 100%;
height: auto;
display: flex;
/* justify-content: stretch; */
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
padding: 0 10px;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery .img-list {
position: relative;
width: calc((100%/2) - 4.5px);
height: fit-content;
margin: 0 9px 9px 0;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery .img-list figure {
position: relative;
width: 100%;
height: auto;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery .img-list figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery .img-list .title {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 3px 10px;
background-color: var(--color-light);
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery .img-list .title p {
font-size: 0.88rem;
text-align: center;
color: var(--color-txtg5);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
/* ============= */
@media (min-width: 1200px) {
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery .img-list:nth-child(2n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery .img-list:nth-child(2n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery .img-list:nth-child(2n+0) {
margin-right: 0;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery .img-list {
height: auto;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery .img-list:nth-child(2n+0) {
margin-right: 0;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery .img-list {
height: auto;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.box-dt-article-and-pastworks .b-img-main figure .size-img {
border-radius: 0;
}
.box-dt-article-and-pastworks .b-title-and-dt-main {
padding: 10px 16px 16px 16px;
}
.box-dt-article-and-pastworks .b-title-and-dt-main .b-title p {
font-size: 1rem;
}
.box-dt-article-and-pastworks .b-title-and-dt-main .b-dt {
padding: 0;
}
.box-dt-article-and-pastworks .b-title-and-dt-main .b-dt p {
font-size: 0.82rem;
}
.box-dt-article-and-pastworks .b-dt-sub-content {
padding: 0 16px 5px 16px;
margin: 16px 0 16px 0;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-title p {
font-size: 1rem;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-dt {
padding: 0 0 12px 0;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-dt p {
font-size: 0.82rem;
}
.box-dt-article-and-pastworks .b-img-main .b-date {
border-top-left-radius: 0;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery {
padding: 0;
}
.box-dt-article-and-pastworks .b-dt-sub-content .b-img-gallery .img-list {
width: 100%;
margin: 0 0 9px 0;
}
}
/* ================= Image lightbox styling ================= */
.box-img-lightbox {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 999;
visibility: hidden;
background-color: rgba(var(--color-dark-rgb), 0.5);
}
.box-img-lightbox.show {
visibility: hidden;
}
.box-img-lightbox .box-wrapper-img {
position: fixed;
width: 100%;
max-width: 60%;
top: 50%;
left: 50%;
border-radius: 5px;
opacity: 0;
pointer-events: none;
background-color: var(--color-light);
transform: translate(-50%, -50%) scale(0.9);
transition: transform 0.1s ease;
overflow: hidden;
border: 1px solid var(--color-grey5);
}
.box-img-lightbox.show .box-wrapper-img {
opacity: 1;
pointer-events: auto;
transform: translate(-50%, -50%) scale(1);
}
.box-img-lightbox .box-wrapper-img .b-head {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid var(--color-grey5);
}
.box-img-lightbox .box-wrapper-img .b-head .b-txt-name-img {
position: relative;
width: calc(100% - 5rem);
height: auto;
padding: 10px 10px 5px 10px;
}
.box-img-lightbox .box-wrapper-img .b-head .b-txt-name-img p {
font-size: 0.94rem;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.box-img-lightbox .box-wrapper-img .b-head .b-btn-close {
position: relative;
width: 5rem;
height: auto;
padding: 5px 10px;
}
.box-img-lightbox .box-wrapper-img .b-head .b-btn-close .btn-close-viewimg {
width: fit-content;
margin: 0 0 0 auto;
padding: 3px;
cursor: pointer;
}
.box-img-lightbox .box-wrapper-img .b-head .b-btn-close .btn-close-viewimg p {
font-size: 2.2rem;
cursor: pointer;
}
.box-img-lightbox .box-wrapper-img .b-head .b-btn-close .btn-close-viewimg i {
font-size: 2.2rem;
cursor: pointer;
}
.box-img-lightbox .box-wrapper-img .b-preview-img {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
padding: 10px;
}
.box-img-lightbox .box-wrapper-img .b-preview-img figure {
max-height: 35rem;
}
.box-img-lightbox .box-wrapper-img .b-preview-img figure .size-img {
width: 100%;
height: 100%;
object-fit: contain;
border-radius: 5px;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-img-lightbox .box-wrapper-img {
max-width: 90%;
}
.box-img-lightbox .box-wrapper-img .b-head .b-btn-close .btn-close-viewimg p {
font-size: 2rem;
}
.box-img-lightbox .box-wrapper-img .b-head .b-btn-close .btn-close-viewimg i {
font-size: 2rem;
}
}
/* ================= air tickets ================= */
.box-img-dt--lr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 0 16px 0;
margin: 0 0 16px 0;
border-bottom: 1px dashed var(--color-grey4);
}
.box-img-dt--lr .b-img-l {
position: relative;
width: 40%;
height: auto;
overflow: hidden;
}
.box-img-dt--lr .b-img-l figure {
position: relative;
width: 100%;
height: auto;
}
.box-img-dt--lr .b-img-l figure .size-img {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
}
.box-img-dt--lr .b-title-dt-r {
position: relative;
width: 60%;
height: auto;
padding: 0 0 0 20px;
}
.box-img-dt--lr .b-title-dt-r .title {
position: relative;
width: 100%;
height: auto;
padding: 2px 0 5px 0;
}
.box-img-dt--lr .b-title-dt-r .title p {
font-size: 1.32rem;
font-weight: bold;
color: var(--color-first);
}
.box-img-dt--lr .b-title-dt-r .dt {
position: relative;
width: 100%;
height: auto;
}
.box-img-dt--lr .b-title-dt-r .dt p {
font-size: 0.88rem;
font-weight: normal;
text-indent: 20px;
padding: 2px 0 5px 0;
color: var(--color-txtg5);
}
.b-dt-sub-content2 {
position: relative;
width: 100%;
height: auto;
padding: 0 0 20px 0;
margin: 20px 0 20px 0;
border-bottom: 1px dashed var(--color-grey4);
}
.b-dt-sub-content2:last-child {
border-bottom: none;
margin: 20px 0 0 0;
}
.b-dt-sub-content2 .b-title {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 0;
}
.b-dt-sub-content2 .b-title p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-txtg);
text-align: center;
}
.b-dt-sub-content2 .b-dt {
position: relative;
width: 100%;
height: auto;
padding: 0 10px 12px 10px;
}
.b-dt-sub-content2 .b-dt p {
font-size: 0.94rem;
text-indent: 25px;
color: var(--color-txtg5);
}
.b-dt-sub-content2 .b-img-gallery {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 10px;
}
.b-dt-sub-content2 .b-img-gallery .img-list {
position: relative;
/* height: fit-content; */
height: auto;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
}
.b-dt-sub-content2 .b-img-gallery .sb-img2 {
width: calc((100%/2) - 4.5px);
margin: 0 9px 9px 0;
}
.b-dt-sub-content2 .b-img-gallery .sb-img3 {
width: calc((100%/3) - 6px);
margin: 0 9px 9px 0;
}
.b-dt-sub-content2 .b-img-gallery .img-list figure {
position: relative;
width: 100%;
height: auto;
}
.b-dt-sub-content2 .b-img-gallery .img-list figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.b-dt-sub-content2 .b-img-gallery .img-list .title {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 3px 10px;
background-color: var(--color-light);
}
.b-dt-sub-content2 .b-img-gallery .img-list .title p {
font-size: 0.88rem;
text-align: center;
color: var(--color-txtg5);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.b-dt-sub-content2 .b-img-airline {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.b-dt-sub-content2 .b-img-airline .img-airline {
position: relative;
width: auto;
height: auto;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
}
.b-dt-sub-content2 .b-img-airline .size-bairline4 {
width: calc((100%/4) - 6.75px);
margin: 0 9px 9px 0;
}
.b-dt-sub-content2 .b-img-airline .size-bairline5 {
width: calc((100%/5) - 7.2px);
margin: 0 9px 9px 0;
}
.b-dt-sub-content2 .b-img-airline .img-airline figure {
position: relative;
width: 100%;
height: auto;
}
.b-dt-sub-content2 .b-img-airline .img-airline figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.b-dt-sub-content2 .b-img-airline .img-airline .name-airline {
position: relative;
width: 100%;
height: auto;
padding: 5px 6px 2px 6px;
background-color: var(--color-light);
}
.b-dt-sub-content2 .b-img-airline .img-airline .name-airline p {
font-size: 0.82rem;
color: var(--color-txtg5);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
text-align: center;
}
/* ============= */
@media (min-width: 1200px) {
.b-dt-sub-content2 .b-img-gallery .sb-img2:nth-child(2n+0) {
margin-right: 0;
}
.b-dt-sub-content2 .b-img-gallery .sb-img3:nth-child(3n+0) {
margin-right: 0;
}
.b-dt-sub-content2 .b-img-airline .size-bairline4:nth-child(4n+0) {
margin-right: 0;
}
.b-dt-sub-content2 .b-img-airline .size-bairline5:nth-child(5n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.b-dt-sub-content2 .b-img-gallery .sb-img3:nth-child(3n+0) {
margin-right: 0;
}
.b-dt-sub-content2 .b-img-airline .size-bairline4:nth-child(4n+0) {
margin-right: 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.b-dt-sub-content2 .b-img-gallery .sb-img3:nth-child(3n+0) {
margin-right: 0;
}
.b-dt-sub-content2 .b-img-airline .size-bairline4:nth-child(4n+0) {
margin-right: 0;
}
.box-img-dt--lr .b-img-l {
width: 100%;
}
.box-img-dt--lr .b-title-dt-r {
width: 100%;
padding: 16px 10px 0 10px;
}
.box-img-dt--lr .b-title-dt-r .title p {
text-align: center;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.b-dt-sub-content2 .b-img-gallery .sb-img3:nth-child(3n+0) {
margin-right: 0;
}
.b-dt-sub-content2 .b-img-airline .size-bairline4:nth-child(4n+0) {
margin-right: 0;
}
.box-img-dt--lr .b-img-l {
width: 100%;
}
.box-img-dt--lr .b-title-dt-r {
width: 100%;
padding: 16px 10px 0 10px;
}
.box-img-dt--lr .b-title-dt-r .title p {
text-align: center;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.box-img-dt--lr {
padding: 0 0 12px 0;
}
.box-img-dt--lr .b-img-l {
width: 100%;
margin: 0 0 10px 0;
}
.box-img-dt--lr .b-title-dt-r {
width: 100%;
padding: 0 16px 0 16px;
}
.box-img-dt--lr .b-img-l figure .size-img {
border-radius: 0;
}
.box-img-dt--lr .b-title-dt-r .title p {
font-size: 1rem;
}
.box-img-dt--lr .b-title-dt-r .dt p {
font-size: 0.82rem;
}
.b-dt-sub-content2 {
padding: 0 16px 5px 16px;
margin: 16px 0 16px 0;
}
.b-dt-sub-content2 .b-title p {
font-size: 1rem;
}
.b-dt-sub-content2 .b-dt {
padding: 0 0 12px 0;
}
.b-dt-sub-content2 .b-dt p {
font-size: 0.82rem;
}
.b-img-main .b-date {
border-top-left-radius: 0;
}
.b-dt-sub-content2 .b-img-gallery {
padding: 0;
}
.b-dt-sub-content2 .b-img-gallery .img-list {
width: 100%;
margin: 0 0 9px 0;
}
.b-dt-sub-content2 .b-img-airline .size-bairline4 {
width: calc((100%/2) - 4.5px);
}
.b-dt-sub-content2 .b-img-airline .size-bairline5 {
width: calc((100%/2) - 4.5px);
}
.b-dt-sub-content2 .b-img-airline .size-bairline4:nth-child(2n+0) {
margin-right: 0;
}
.b-dt-sub-content2 .b-img-airline .size-bairline5:nth-child(2n+0) {
margin-right: 0;
}
.b-dt-sub-content2 .b-img-airline .img-airline .name-airline p {
font-size: 0.75rem;
}
}
/* ================= visa ================= */
.box-img-dt-visa-lr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 0 16px 0;
margin: 0 0 16px 0;
border-bottom: 1px dashed var(--color-grey4);
}
.box-img-dt-visa-lr .b-img-l {
position: relative;
width: 40%;
height: auto;
overflow: hidden;
}
.box-img-dt-visa-lr .b-img-l figure {
position: relative;
width: 100%;
height: auto;
}
.box-img-dt-visa-lr .b-img-l figure .size-img {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
}
.box-img-dt-visa-lr .b-title-dt-r {
position: relative;
width: 60%;
height: auto;
padding: 0 0 0 20px;
}
.box-img-dt-visa-lr .b-title-dt-r .title {
position: relative;
width: 100%;
height: auto;
padding: 2px 0 5px 0;
}
.box-img-dt-visa-lr .b-title-dt-r .title p {
font-size: 1.32rem;
font-weight: bold;
color: var(--color-first);
}
.box-img-dt-visa-lr .b-title-dt-r .t-country {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 3px 16px;
margin: 5px 0 10px 0;
border-top: 1px dashed var(--color-grey4);
border-bottom: 1px dashed var(--color-grey4);
}
.box-img-dt-visa-lr .b-title-dt-r .t-country p {
font-size: 0.88rem;
}
.box-img-dt-visa-lr .b-title-dt-r .t-country p span {
padding-right: 5px;
}
.box-img-dt-visa-lr .b-title-dt-r .t-country p i {
color: var(--color-icon-yl);
}
.box-img-dt-visa-lr .b-title-dt-r .t-country p .txt-title-bold {
font-weight: bold;
}
.box-img-dt-visa-lr .b-title-dt-r .dt {
position: relative;
width: 100%;
height: auto;
}
.box-img-dt-visa-lr .b-title-dt-r .dt p {
font-size: 0.88rem;
font-weight: normal;
text-indent: 20px;
padding: 2px 0 5px 0;
color: var(--color-txtg5);
}
.b-dt-visa-content {
position: relative;
width: 100%;
height: auto;
padding: 0 0 20px 0;
margin: 20px 0 20px 0;
border-bottom: 1px dashed var(--color-grey4);
}
.b-dt-visa-content:last-child {
border-bottom: none;
margin: 20px 0 0 0;
}
.b-dt-visa-content .b-title {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 0;
}
.b-dt-visa-content .b-title p {
font-size: 1.07rem;
font-weight: bold;
color: var(--color-txtg);
/* text-align: center; */
}
.b-dt-visa-content .b-title p .icon-color-title {
padding-right: 5px;
}
.b-dt-visa-content .b-title p i {
color: var(--color-first);
}
.b-dt-visa-content .b-dt {
position: relative;
width: 100%;
height: auto;
padding: 0 10px 12px 10px;
}
.b-dt-visa-content .b-dt p {
font-size: 0.94rem;
text-indent: 25px;
color: var(--color-txtg5);
}
.b-dt-visa-content .b-img-waybooking {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 0 0;
}
.b-dt-visa-content .b-img-waybooking figure {
position: relative;
width: 100%;
height: auto;
/* max-height: 38rem; */
display: flex;
overflow: hidden;
}
.b-dt-visa-content .b-img-waybooking figure .size-img {
position: relative;
width: 100%;
height: auto;
object-fit: scale-down;
margin: 0 auto;
}
.b-dt-visa-content .b-img-applyvisa {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 0 0;
}
.b-dt-visa-content .b-img-applyvisa figure {
position: relative;
width: auto;
height: auto;
max-height: 30rem;
display: flex;
overflow: hidden;
}
.b-dt-visa-content .b-img-applyvisa figure .size-img {
position: relative;
width: 100%;
height: auto;
object-fit: scale-down;
margin: 0 auto;
}
.b-pd-table-visa {
position: relative;
width: 100%;
height: auto;
padding: 0 0 0 16px;
}
.table-visa-price {
position: relative;
width: 100%;
height: auto;
max-height: 23rem;
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.table-visa-price .tb-vs-head {
position: relative;
width: 100%;
height: auto;
max-height: 2.125rem;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
background-color: var(--color-first);
}
.table-visa-price .tb-vs-head .tb-hd-set {
position: relative;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
padding: 0 5px;
}
.table-visa-price .tb-vs-head .tb-hd-set:last-child {
border-right: none;
}
.table-visa-price .tb-vs-head .tb-hd-set p {
font-size: 1rem;
color: var(--color-light);
text-align: center;
position: relative;
top: 50%;
transform: translateY(-50%);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.table-visa-price .tb-vs-dt {
position: relative;
width: 100%;
height: auto;
max-height: 20.875rem;
overflow: scroll;
margin: 5px 0 5px 0;
}
.table-visa-price .tb-vs-dt::-webkit-scrollbar {
display: none;
}
.table-visa-price .tb-vs-dt {
-ms-overflow-style: none;
scrollbar-width: none;
}
.table-visa-price .tb-vs-dt .tb-dt-row {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set {
position: relative;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
display: grid;
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set p {
font-size: 0.94rem;
text-align: center;
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set p .currency {
font-size: 0.82rem;
padding: 0 0 0 3px;
font-weight: normal;
color: var(--color-txtg5);
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set .txt-left {
text-align: left;
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set .cl-price {
color: var(--color-red);
font-weight: bold;
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set .title-smb-l {
display: none;
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set .txt-dt-r {
display: grid;
}
.table-visa-price .stb1 {
width: 50%;
}
.table-visa-price .stb2 {
width: 30%;
}
.table-visa-price .stb3 {
width: 20%;
}
/* ============= */
@media (min-width: 1200px) {
.b-pd-bt-visa {
padding-bottom: 25px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.box-social-and-share {
padding: 0 0 20px 0;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.box-img-dt-visa-lr .b-img-l {
width: 100%;
}
.box-img-dt-visa-lr .b-img-l figure {
width: 80%;
margin: 0 auto;
}
.box-img-dt-visa-lr .b-title-dt-r {
width: 100%;
padding: 10px 0 0 0;
}
.box-social-and-share {
padding: 0 0 20px 0;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box-img-dt-visa-lr .b-img-l {
width: 100%;
}
.box-img-dt-visa-lr .b-img-l figure {
width: 80%;
margin: 0 auto;
}
.box-img-dt-visa-lr .b-title-dt-r {
width: 100%;
padding: 10px 0 0 0;
}
.box-social-and-share {
padding: 0 0 20px 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.box-img-dt-visa-lr {
padding: 0 0 12px 0;
}
.box-img-dt-visa-lr .b-img-l {
width: 100%;
margin: 0 0 10px 0;
}
.box-img-dt-visa-lr .b-title-dt-r {
width: 100%;
padding: 0 16px 0 16px;
}
.box-img-dt-visa-lr .b-img-l figure .size-img {
border-radius: 0;
}
.box-img-dt-visa-lr .b-title-dt-r .title p {
font-size: 1rem;
}
.box-img-dt-visa-lr .b-title-dt-r .dt p {
font-size: 0.82rem;
}
.box-img-dt-visa-lr .b-title-dt-r .t-country {
padding: 5px 5px 3px 5px;
}
.box-img-dt-visa-lr .b-title-dt-r .t-country p {
font-size: 0.82rem;
}
.b-dt-visa-content {
padding: 0 16px 5px 16px;
margin: 16px 0 16px 0;
}
.b-dt-visa-content .b-title p {
font-size: 1rem;
}
.b-dt-visa-content .b-dt {
padding: 0 0 12px 0;
}
.b-dt-visa-content .b-dt p {
font-size: 0.82rem;
}
.b-img-main .b-date {
border-top-left-radius: 0;
}
.b-dt-visa-content .b-img-applyvisa figure {
max-height: 20rem;
}
.b-pd-table-visa {
padding: 0 0 10px 0;
}
.table-visa-price {
max-height: 30rem;
}
.table-visa-price .tb-vs-head {
display: none;
}
.table-visa-price .tb-vs-head .tb-hd-set {}
.table-visa-price .tb-vs-head .tb-hd-set p {
font-size: 0.88rem;
}
.table-visa-price .tb-vs-dt {
max-height: inherit;
margin-top: 0;
}
.table-visa-price .tb-vs-dt .tb-dt-row {}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set {
display: flex;
justify-content: stretch;
border-right: none;
padding: 0 10px;
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set p {
font-size: 0.88rem;
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set p .currency {
font-size: 0.75rem;
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set .cl-price {
font-weight: normal;
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set .title-smb-l {
position: relative;
width: 70%;
height: auto;
display: grid;
border-right: 1px dashed var(--color-grey5);
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set .title-smb-l p {
text-align: left;
}
.table-visa-price .tb-vs-dt .tb-dt-row .tb-dt-set .txt-dt-r {
position: relative;
width: 30%;
height: auto;
}
.table-visa-price .stb1 {
width: 100%;
padding: 7px 10px 5px 10px !important;
margin-top: 0 !important;
background-color: rgba(var(--color-first-rgb), 0.05);
border-bottom: 1px solid var(--color-first);
}
.table-visa-price .stb1 p {
font-weight: bold;
}
.table-visa-price .stb2 {
width: 100%;
}
.table-visa-price .stb3 {
width: 100%;
}
}
/* ================= About Us ================= */
.sc-about-us {
position: relative;
width: 100%;
height: auto;
}
.box-bg-abus {
position: relative;
width: 100%;
height: auto;
margin: 20px 0;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
border: 1px solid var(--color-grey3);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.box-bg-abus .b--abus {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box-bg-abus .b--abus .b-img-abus {
position: relative;
width: 30%;
height: auto;
}
.box-bg-abus .b--abus .b-img-abus .b-space-img {
position: relative;
width: 100%;
height: auto;
padding: 16px;
}
.box-bg-abus .b--abus .b-img-abus .b-space-img figure {
position: relative;
width: 100%;
height: auto;
}
.box-bg-abus .b--abus .b-img-abus .b-space-img figure .size-img {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
}
.box-bg-abus .b--abus .b-dt-abus {
position: relative;
width: 70%;
height: auto;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt {
position: relative;
width: 100%;
height: auto;
padding: 16px 16px 16px 20px;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt .b-title-abus {
position: relative;
width: 100%;
height: auto;
padding-bottom: 12px;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt .b-title-abus p {
font-size: 1.38rem;
font-weight: bold;
color: var(--color-first);
text-indent: 0;
padding: 0;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt .b-title-abus p .icon-title {
padding-right: 8px;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt .b-title-abus p span i {
color: var(--color-first);
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt .b-title-abus .lines-title-b {
position: relative;
width: 5.3rem;
height: 2px;
border-radius: 100px;
background-color: var(--color-txtg4);
margin: -3px 0 0 0;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt p {
font-size: 0.94rem;
color: var(--color-txtg5);
text-indent: 25px;
padding-bottom: 3px;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt .txt-title {
font-weight: bold;
text-indent: 0;
padding: 10px 0 1px 0;
font-size: 1rem;
color: var(--color-blue6);
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt p .color-txt {
color: var(--color-first);
font-weight: bold;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt p .txt-undl {
text-decoration: underline;
color: var(--color-blue6);
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt p .txt-topic {
font-weight: bold;
color: var(--color-red5);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.box-bg-abus .b--abus .size-ip-img {
width: 40%;
}
.box-bg-abus .b--abus .size-ip-txt {
width: 60%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.box-bg-abus .b--abus .size-ip-img {
width: 100%;
}
.box-bg-abus .b--abus .size-ip-img .b-space-img {
width: auto;
height: 20rem;
}
.box-bg-abus .b--abus .size-ip-img .b-space-img figure {
width: auto;
height: 100%;
display: flex;
}
.box-bg-abus .b--abus .size-ip-img .b-space-img figure .size-img {
width: auto;
height: 100%;
margin: 0 auto;
}
.box-bg-abus .b--abus .size-ip-txt {
width: 100%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box-bg-abus .b--abus .size-ip-img {
width: 100%;
}
.box-bg-abus .b--abus .size-ip-img .b-space-img {
width: auto;
height: 20rem;
}
.box-bg-abus .b--abus .size-ip-img .b-space-img figure {
width: auto;
height: 100%;
display: flex;
}
.box-bg-abus .b--abus .size-ip-img .b-space-img figure .size-img {
width: auto;
height: 100%;
margin: 0 auto;
}
.box-bg-abus .b--abus .size-ip-txt {
width: 100%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc-about-us .container {
padding: 0;
}
.box-bg-abus {
margin: 0 0 20px 0;
border-radius: 0;
}
.box-bg-abus:last-child {
margin: 0;
}
.box-bg-abus .b--abus .b-img-abus {
width: 100%;
}
.box-bg-abus .b--abus .b-dt-abus {
width: 100%;
}
/* .box-bg-abus .b--abus .order-dt-abus2 {
order: 2;
}
.box-bg-abus .b--abus .order-img-abus2 {
order: 1;
} */
.box-bg-abus .b--abus .b-img-abus .b-space-img figure {
/* width: auto;
height: auto;
max-height: 20rem;
display: flex;
overflow: hidden; */
}
.box-bg-abus .b--abus .b-img-abus .b-space-img figure .size-img {
width: 100%;
height: auto;
/* object-fit: scale-down;
margin: 0 auto; */
}
/* .box-bg-abus .b--abus .b-dt-abus .b-space-dt {
padding-top: 5px;
} */
.box-bg-abus .b--abus .pd-t5-smb {
padding-top: 5px !important;
}
.box-bg-abus .b--abus .pd-b10-smb {
padding-bottom: 10px !important;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt .b-title-abus {
padding-bottom: 6px;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt .b-title-abus p {
font-size: 1.25rem;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt p {
font-size: 0.88rem;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt .txt-title {
font-size: 0.94rem;
}
.box-bg-abus .b--abus .b-dt-abus .b-space-dt .b-title-abus .lines-title-b {
width: 4.8rem;
}
}
/* ================= Contact Us ================= */
.sc--contact-us {
position: relative;
width: 100%;
height: auto;
}
.box-bg-ctus {
position: relative;
width: 100%;
height: auto;
margin: 20px 0;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
border: 1px solid var(--color-grey3);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.box-bg-ctus .b-dt-ctus {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus {
position: relative;
width: 30%;
height: auto;
padding: 16px 16px 10px 16px;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .b-title-ctus {
position: relative;
width: 100%;
height: auto;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .b-title-ctus p {
font-size: 1.38rem;
font-weight: bold;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .b-title-ctus .lines-title {
position: relative;
width: 3rem;
height: 2px;
border-radius: 100px;
background-color: var(--color-first);
margin: -3px 0 16px 0;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin: 0 0 16px 0;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .icon-l {
position: relative;
width: 4rem;
height: auto;
border-right: 1px dashed var(--color-grey5);
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .icon-l .bg-icon-ctus {
position: relative;
width: 2.5rem;
height: 2.5rem;
border-radius: 100%;
margin: 0 auto;
background-color: var(--color-light);
border: 1px solid var(--color-grey2);
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .icon-l .bg-icon-ctus i {
font-size: 1.25rem;
position: relative;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: var(--color-first);
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r {
position: relative;
width: calc(100% - 4rem);
height: auto;
padding: 0 0 0 10px;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r p {
font-size: 0.88rem;
color: var(--color-txtg4);
padding: 0 0 3px 8px;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r .titles {
font-size: 1rem;
padding-left: 0;
color: var(--color-txtg);
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r p a {
color: var(--color-txtg4);
cursor: pointer;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r p a:hover {
color: var(--color-first);
font-weight: bold;
transition: all 0.3s ease;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r p span {
color: var(--color-txtg4);
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r p .spr-txt {
padding: 0 5px;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r p .txt-name {}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-social-ctus {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
margin: 20px 0 0 0;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-social-ctus .btn-sc-ctus {
position: relative;
width: 2.2rem;
height: auto;
margin: 0 5px 5px 5px;
cursor: pointer;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-social-ctus .btn-sc-ctus a {
position: relative;
width: 100%;
height: 100%;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-social-ctus .btn-sc-ctus .size-img {
position: relative;
width: 100%;
height: auto;
}
.box-bg-ctus .b-dt-ctus .b-address-map {
position: relative;
width: 70%;
height: auto;
}
.box-bg-ctus .b-dt-ctus .b-address-map .b-map {
position: relative;
width: 100%;
height: 100%;
}
.box-bg-ctus .b-dt-ctus .b-address-map .b-map iframe {
width: 100%;
height: 100%;
}
/* hover image */
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-social-ctus .btn-sc-ctus .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-social-ctus .btn-sc-ctus:hover .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* Contact Team */
.b-contact-team {
position: relative;
width: 100%;
height: auto;
padding: 16px 16px 10px 16px;
}
.b-contact-team .b-title-cttm {
position: relative;
width: 100%;
height: auto;
}
.b-contact-team .b-title-cttm p {
font-size: 1.38rem;
font-weight: bold;
}
.b-contact-team .b-title-cttm .lines-title {
position: relative;
width: 3rem;
height: 2px;
border-radius: 100px;
background-color: var(--color-first);
margin: -3px 0 16px 0;
}
.b-contact-team .b-list-cttm {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.b-contact-team .b-list-cttm .list-box {
position: relative;
width: calc((100%/5) - 7.2px);
margin: 0 9px 9px 0;
background-color: var(--color-light);
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
}
.b-contact-team .b-list-cttm .list-box .b-img {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
}
.b-contact-team .b-list-cttm .list-box .b-img figure {
position: relative;
width: 100%;
height: 100%;
}
.b-contact-team .b-list-cttm .list-box .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.b-contact-team .b-list-cttm .list-box .b-name {
position: relative;
width: 100%;
height: auto;
padding: 10px;
}
.b-contact-team .b-list-cttm .list-box .b-name p {
font-size: 1rem;
font-weight: bold;
text-align: center;
}
.b-contact-team .b-list-cttm .list-box .b-description {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 5px 10px;
border-top: 1px dashed var(--color-grey3);
}
.b-contact-team .b-list-cttm .list-box .b-description p {
font-size: 0.94rem;
color: var(--color-txtg5);
text-align: center;
}
.b-contact-team .b-list-cttm .list-box .b-scmd {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
padding: 10px;
border-top: 1px dashed var(--color-grey3);
}
.b-contact-team .b-list-cttm .list-box .b-scmd .btn-scmd {
position: relative;
width: 2rem;
height: auto;
margin: 0 7px;
cursor: pointer;
}
.b-contact-team .b-list-cttm .list-box .b-scmd .btn-scmd a {
position: relative;
width: 100%;
height: 100%;
}
.b-contact-team .b-list-cttm .list-box .b-scmd .btn-scmd .size-img {
position: relative;
width: 100%;
height: auto;
}
.b-contact-team .b-list-cttm .list-box .b-tel {
position: relative;
width: 100%;
height: auto;
padding: 10px;
border-top: 1px dashed var(--color-grey3);
}
.b-contact-team .b-list-cttm .list-box .b-tel p {
font-size: 0.94rem;
color: var(--color-txtg5);
text-align: center;
padding-bottom: 5px;
}
.b-contact-team .b-list-cttm .list-box .b-tel p:last-child {
padding-bottom: 0;
}
.b-contact-team .b-list-cttm .list-box .b-tel p span {
color: var(--color-txtg5);
padding-right: 5px;
}
.b-contact-team .b-list-cttm .list-box .b-tel p i {
color: var(--color-first);
}
.b-contact-team .b-list-cttm .list-box .b-tel p a {
color: var(--color-txtg5);
cursor: pointer;
}
.b-contact-team .b-list-cttm .list-box .b-tel p a:hover {
color: var(--color-first);
font-weight: bold;
transition: all 0.3s ease;
}
/* hover image */
.b-contact-team .b-list-cttm .list-box .b-scmd .btn-scmd .size-img {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.b-contact-team .b-list-cttm .list-box .b-scmd .btn-scmd:hover .size-img {
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
/* ============= */
@media (min-width: 1200px) {
.b-contact-team .b-list-cttm .list-box:nth-child(5n+0) {
margin-right: 0;
}
.b-contact-team .b-list-cttm .list-box .b-img {
height: 13.625rem;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.b-contact-team .b-list-cttm .list-box {
width: calc((100%/4) - 6.75px);
}
.b-contact-team .b-list-cttm .list-box:nth-child(4n+0) {
margin-right: 0;
}
.b-contact-team .b-list-cttm .list-box .b-img {
height: 14.079rem;
}
.b-contact-team .b-list-cttm .list-box .b-name {
padding: 6px 10px 6px 10px;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.box-bg-ctus .b-dt-ctus .b-txt-ctus {
width: 100%;
order: 2;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus {
width: 50%;
padding-right: 10px;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .icon-l {
width: 3.5rem;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .icon-l .bg-icon-ctus {
width: 2.2rem;
height: 2.2rem;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .icon-l .bg-icon-ctus i {
font-size: 1rem;
transform: translate(-50%, -70%);
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r {
width: calc(100% - 3.5rem);
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .b-title-ctus p {
font-size: 1.25rem;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r p {
font-size: 0.82rem;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r .titles {
font-size: 0.94rem;
}
.box-bg-ctus .b-dt-ctus .b-address-map {
width: 100%;
height: 20rem;
order: 1;
}
/* Contact Team */
.b-contact-team .b-title-cttm p {
font-size: 1.25rem;
}
.b-contact-team .b-list-cttm .list-box {
width: calc((100%/4) - 6.75px);
}
.b-contact-team .b-list-cttm .list-box:nth-child(4n+0) {
margin-right: 0;
}
.b-contact-team .b-list-cttm .list-box .b-img {
height: 11.235rem;
}
.b-contact-team .b-list-cttm .list-box .b-name {
padding: 6px 10px 6px 10px;
}
.b-contact-team .b-list-cttm .list-box .b-description {
padding: 4px 10px 4px 10px;
}
.b-contact-team .b-list-cttm .list-box .b-description p {
font-size: 0.82rem;
}
.b-contact-team .b-list-cttm .list-box .b-scmd {
padding: 6px 10px 6px 10px;
}
.b-contact-team .b-list-cttm .list-box .b-scmd .btn-scmd {
width: 1.82rem;
}
.b-contact-team .b-list-cttm .list-box .b-tel {
padding: 6px 10px 6px 10px;
}
.b-contact-team .b-list-cttm .list-box .b-tel p {
font-size: 0.82rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box-bg-ctus .b-dt-ctus .b-txt-ctus {
width: 100%;
order: 2;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus {
width: 50%;
padding-right: 10px;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .icon-l {
width: 3.5rem;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .icon-l .bg-icon-ctus {
width: 2.2rem;
height: 2.2rem;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .icon-l .bg-icon-ctus i {
font-size: 1rem;
transform: translate(-50%, -70%);
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r {
width: calc(100% - 3.5rem);
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .b-title-ctus p {
font-size: 1.25rem;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r p {
font-size: 0.82rem;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r .titles {
font-size: 0.94rem;
}
.box-bg-ctus .b-dt-ctus .b-address-map {
width: 100%;
height: 20rem;
order: 1;
}
/* Contact Team */
.b-contact-team .b-title-cttm p {
font-size: 1.25rem;
}
.b-contact-team .b-list-cttm .list-box {
width: calc((100%/3) - 6px);
}
.b-contact-team .b-list-cttm .list-box:nth-child(3n+0) {
margin-right: 0;
}
.b-contact-team .b-list-cttm .list-box .b-img {
height: 14.124rem;
}
.b-contact-team .b-list-cttm .list-box .b-name {
padding: 6px 10px 6px 10px;
}
.b-contact-team .b-list-cttm .list-box .b-description {
padding: 4px 10px 4px 10px;
}
.b-contact-team .b-list-cttm .list-box .b-description p {
font-size: 0.82rem;
}
.b-contact-team .b-list-cttm .list-box .b-scmd {
padding: 6px 10px 6px 10px;
}
.b-contact-team .b-list-cttm .list-box .b-scmd .btn-scmd {
width: 1.82rem;
}
.b-contact-team .b-list-cttm .list-box .b-tel {
padding: 6px 10px 6px 10px;
}
.b-contact-team .b-list-cttm .list-box .b-tel p {
font-size: 0.82rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--contact-us .container {
padding: 0;
}
.box-bg-ctus {
margin: 0 0 20px 0;
border-radius: 0;
}
.box-bg-ctus:last-child {
margin: 0;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus {
width: 100%;
order: 2;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .icon-l {
width: 3.5rem;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .icon-l .bg-icon-ctus {
width: 2.2rem;
height: 2.2rem;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .icon-l .bg-icon-ctus i {
font-size: 1rem;
transform: translate(-50%, -70%);
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r {
width: calc(100% - 3.5rem);
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .b-title-ctus p {
font-size: 1.25rem;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r p {
font-size: 0.82rem;
}
.box-bg-ctus .b-dt-ctus .b-txt-ctus .set-box-ctus .txt-r .titles {
font-size: 0.94rem;
}
.box-bg-ctus .b-dt-ctus .b-address-map {
width: 100%;
height: 13rem;
order: 1;
}
/* Contact Team */
.b-contact-team .b-title-cttm p {
font-size: 1.25rem;
}
.b-contact-team .b-list-cttm .list-box {
width: calc((100%/2) - 4.5px);
}
.b-contact-team .b-list-cttm .list-box:nth-child(2n+0) {
margin-right: 0;
}
.b-contact-team .b-list-cttm .list-box .b-img {
height: 11.907rem;
}
.b-contact-team .b-list-cttm .list-box .b-name {
padding: 6px 10px 6px 10px;
}
.b-contact-team .b-list-cttm .list-box .b-name p {
font-size: 0.94rem;
}
.b-contact-team .b-list-cttm .list-box .b-description {
padding: 4px 10px 4px 10px;
}
.b-contact-team .b-list-cttm .list-box .b-description p {
font-size: 0.82rem;
}
.b-contact-team .b-list-cttm .list-box .b-scmd {
padding: 6px 10px 6px 10px;
}
.b-contact-team .b-list-cttm .list-box .b-scmd .btn-scmd {
width: 1.82rem;
}
.b-contact-team .b-list-cttm .list-box .b-tel {
padding: 6px 10px 6px 10px;
}
.b-contact-team .b-list-cttm .list-box .b-tel p {
font-size: 0.82rem;
}
}
/* ================= general information ================= */
.box-general-information {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey4);
}
.box-general-information .box-title {
position: relative;
width: 100%;
height: auto;
padding: 10px;
background-color: rgba(var(--color-first-rgb), 0.02);
}
.box-general-information .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-general-information .box-title span {
font-size: 1.07rem;
font-weight: bold;
}
.box-general-information .box-title i {
font-size: 1.07rem;
font-weight: bold;
}
.box-general-information .box-dt {
position: relative;
width: 100%;
height: auto;
padding: 10px 20px 10px 30px;
}
.box-general-information .box-dt .b-gr-info {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box-general-information .box-dt .b-gr-info .txt-half {
position: relative;
width: 50%;
height: auto;
padding: 5px 16px 5px 16px;
}
.box-general-information .box-dt .b-gr-info p {
font-size: 0.94rem;
padding: 0 0 5px 0;
text-indent: 22px;
color: var(--color-txtg5);
}
.box-general-information .box-dt .b-gr-info .title {
text-indent: 0;
font-weight: bold;
padding: 0 0 1px 0;
color: var(--color-txtg);
}
.box-general-information .box-dt .b-gr-info p .icon-title {
padding-right: 5px;
}
.box-general-information .box-dt .b-gr-info p .icon-title i {
color: var(--color-icon-yl);
}
.box-general-information .box-dt .b-gr-info .b-img-cruise {
position: relative;
width: auto;
height: 2.5rem;
padding: 0 0 0 22px;
}
.box-general-information .box-dt .b-gr-info .b-img-cruise figure {
position: relative;
width: auto;
height: 100%;
}
.box-general-information .box-dt .b-gr-info .b-img-cruise figure .size-img {
position: relative;
width: auto;
height: 100%;
}
/*
.box-general-information .box-dt p {
font-size: 0.94rem;
padding: 0 0 5px 0;
text-indent: 15px;
} */
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-general-information .box-title span {
font-size: 1rem;
}
.box-general-information .box-title i {
font-size: 1rem;
}
.box-general-information .box-dt {
padding: 10px 16px 10px 16px;
}
.box-general-information .box-dt .b-gr-info .txt-half {
padding: 5px;
}
.box-general-information .box-dt .b-gr-info p {
font-size: 0.82rem;
}
.box-general-information .box-dt .b-gr-info .title {
font-size: 0.88rem;
}
.box-general-information .box-dt .b-gr-info .b-img-cruise {
height: 2.2rem;
padding: 0 0 0 20px;
}
}
/* ================= VDO ================= */
.box-vdo-dt {
position: relative;
width: 100%;
height: auto;
margin: 10px 0 20px 0;
}
.box-vdo-dt .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 5px 20px;
}
.box-vdo-dt .b-title p {
font-size: 1rem;
font-weight: bold;
text-decoration: underline;
color: var(--color-first);
}
.box-vdo-dt .b-vdo-view {
position: relative;
width: 100%;
height: auto;
padding: 0 50px 0 30px;
}
.box-vdo-dt .b-vdo-view iframe {
position: relative;
border-radius: 5px;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-vdo-dt {
padding: 0 16px;
}
.box-vdo-dt .b-title {
padding: 5px 0 5px 0;
}
.box-vdo-dt .b-title p {
font-size: 0.94rem;
}
.box-vdo-dt .b-vdo-view {
padding: 0 0 0 0;
}
.box-vdo-dt .b-vdo-view iframe {
width: 100%;
height: 100%;
}
}
/* ================= ship routes ================= */
.box-ship-routes {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey4);
}
.box-ship-routes .box-title {
position: relative;
width: 100%;
height: auto;
padding: 10px;
background-color: rgba(var(--color-first-rgb), 0.02);
}
.box-ship-routes .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-ship-routes .box-title span {
font-size: 1.07rem;
font-weight: bold;
}
.box-ship-routes .box-title i {
font-size: 1.07rem;
font-weight: bold;
}
.box-ship-routes .box-dt {
position: relative;
width: 100%;
height: auto;
padding: 10px 20px 10px 20px;
}
.box-ship-routes .box-dt .b-lr-schedule-routes {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-schedule {
position: relative;
height: auto;
/* border-right: 1px dashed var(--color-grey4); */
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-schedule .b-dt-schedule {
position: relative;
width: 100%;
height: auto;
padding: 2px 20px 5px 10px;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-routes {
position: relative;
width: 30%;
height: auto;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-routes .b-dt-routes {
position: relative;
width: 100%;
height: auto;
padding: 2px 10px 5px 10px;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-routes .b-dt-routes figure {
position: relative;
width: 100%;
height: auto;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-routes .b-dt-routes figure .size-img {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .size-box-full-shrou {
width: 100%;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .size-box-half-shrou {
width: 70%;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-title {
position: relative;
width: 100%;
height: auto;
padding: 5px 20px 5px 10px;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-title p {
font-size: 1rem;
font-weight: bold;
text-align: center;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-title p .icon-txt {
padding-right: 5px;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-title p .icon-txt i {
color: var(--color-icon-yl);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-ship-routes .box-title span {
font-size: 1rem;
}
.box-ship-routes .box-title i {
font-size: 1rem;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-title {
padding: 5px 0 5px 0;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-title p {
font-size: 0.94rem;
}
/* .box-ship-routes .box-dt .b-lr-schedule-routes .b-schedule {
width: 100%;
} */
.box-ship-routes .box-dt .b-lr-schedule-routes .b-routes {
width: 100%;
padding-top: 10px;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-schedule .b-dt-schedule {
padding: 2px 0 5px 0;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .b-routes .b-dt-routes {
padding: 2px 0 5px 0;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .size-box-full-shrou {
width: 100%;
}
.box-ship-routes .box-dt .b-lr-schedule-routes .size-box-half-shrou {
width: 100%;
}
}
/* ================= table schedule routes ================= */
.table-schedule-routes {
position: relative;
width: 100%;
height: auto;
/* max-height: 23rem; */
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.table-schedule-routes .tb-head {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
background-color: var(--color-first);
}
.table-schedule-routes .tb-head .b-size-tb {
position: relative;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
padding: 0 5px;
}
.table-schedule-routes .tb-head .b-size-tb:last-child {
border-right: none;
}
.table-schedule-routes .tb-head .b-size-tb p {
font-size: 0.94rem;
text-align: center;
color: var(--color-light);
position: relative;
top: 50%;
transform: translateY(-50%);
}
.table-schedule-routes .tb-dt {
position: relative;
width: 100%;
height: auto;
/* max-height: 20.875rem;
overflow: scroll; */
}
/* .table-schedule-routes .tb-dt::-webkit-scrollbar {
display: none;
}
.table-schedule-routes .tb-dt {
-ms-overflow-style: none;
scrollbar-width: none;
} */
.table-schedule-routes .tb-dt .b-tb-dp {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
/* padding: 0 5px 0 20px; */
}
.table-schedule-routes .tb-dt .b-tb-dp .b-size-tb {
position: relative;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
padding: 0 5px;
display: grid;
}
.table-schedule-routes .tb-dt .b-tb-dp .b-size-tb:last-child {
border-right: none;
}
.table-schedule-routes .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.88rem;
text-align: center;
margin: auto 0;
}
.table-schedule-routes .tb-dt .b-tb-dp .b-size-tb p .txt-title-mb {
display: none;
}
.table-schedule-routes .s-tb1 {
width: 8%;
}
.table-schedule-routes .s-tb2 {
width: 12%;
}
.table-schedule-routes .s-tb3 {
width: 15%;
}
.table-schedule-routes .s-tb4 {
width: 35%;
}
.table-schedule-routes .s-tb5 {
width: 15%;
}
.table-schedule-routes .s-tb6 {
width: 15%;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.table-schedule-routes .tb-head {
display: none;
}
.table-schedule-routes .tb-head .b-size-tb p {
font-size: 0.88rem;
}
.table-schedule-routes .tb-dt .b-tb-dp {
padding-bottom: 10px;
}
.table-schedule-routes .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.82rem;
text-align: left;
}
.table-schedule-routes .tb-dt .b-tb-dp .b-size-tb p .txt-title-mb {
display: initial;
font-weight: bold;
}
.table-schedule-routes .tb-dt .b-tb-dp .b-size-tb {
padding: 0 10px;
}
.table-schedule-routes .s-tb1 {
width: 100%;
margin-top: 0 !important;
padding: 7px 10px 5px 10px !important;
background-color: rgba(var(--color-first-rgb), 0.05);
border-bottom: 1px solid var(--color-first);
}
.table-schedule-routes .s-tb2 {
width: 50%;
}
.table-schedule-routes .s-tb3 {
width: 50%;
}
.table-schedule-routes .s-tb4 {
width: 100%;
}
.table-schedule-routes .s-tb5 {
width: 50%;
}
.table-schedule-routes .s-tb6 {
width: 50%;
}
}
/* ================= Recommended flights ================= */
.box-recommended-flights {
position: relative;
width: 100%;
height: auto;
border-top: 1px dashed var(--color-grey4);
}
.box-recommended-flights .box-title {
position: relative;
width: 100%;
height: auto;
padding: 10px;
background-color: rgba(var(--color-first-rgb), 0.02);
}
.box-recommended-flights .box-title p {
font-size: 1.07rem;
font-weight: bold;
}
.box-recommended-flights .box-title span {
font-size: 1.07rem;
font-weight: bold;
}
.box-recommended-flights .box-title i {
font-size: 1.07rem;
font-weight: bold;
}
.box-recommended-flights .box-dt {
position: relative;
width: 100%;
height: auto;
padding: 10px 20px 16px 20px;
}
.box-recommended-flights .box-dt .b-note-details {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 0 0;
}
.box-recommended-flights .box-dt .b-note-details p {
font-size: 0.88rem;
color: var(--color-txtg5);
text-indent: 25px;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-recommended-flights .box-title span {
font-size: 1rem;
}
.box-recommended-flights .box-title i {
font-size: 1rem;
}
.box-recommended-flights .box-dt {
padding: 10px 16px 16px 16px;
}
.box-recommended-flights .box-dt .b-note-details p {
font-size: 0.82rem;
text-indent: 20px;
}
}
/* ================= table schedule routes ================= */
.table-recommended-flights {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.table-recommended-flights .tb-head {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
background-color: var(--color-first);
}
.table-recommended-flights .tb-head .b-size-tb {
position: relative;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
padding: 0 5px;
}
.table-recommended-flights .tb-head .b-size-tb:last-child {
border-right: none;
}
.table-recommended-flights .tb-head .b-size-tb p {
font-size: 0.94rem;
text-align: center;
color: var(--color-light);
position: relative;
top: 50%;
transform: translateY(-50%);
}
.table-recommended-flights .tb-dt {
position: relative;
width: 100%;
height: auto;
/* max-height: 20.875rem;
overflow: scroll; */
}
/* .table-recommended-flights .tb-dt::-webkit-scrollbar {
display: none;
}
.table-recommended-flights .tb-dt {
-ms-overflow-style: none;
scrollbar-width: none;
} */
.table-recommended-flights .tb-dt .b-tb-dp {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
/* padding: 0 5px 0 20px; */
}
.table-recommended-flights .tb-dt .b-tb-dp .b-size-tb {
position: relative;
height: auto;
border-right: 1px solid var(--color-grey2);
margin: 5px 0;
padding: 0 5px;
display: grid;
}
.table-recommended-flights .tb-dt .b-tb-dp .b-size-tb:last-child {
border-right: none;
}
.table-recommended-flights .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.88rem;
text-align: center;
margin: auto 0;
}
.table-recommended-flights .tb-dt .b-tb-dp .b-size-tb p .txt-title-mb {
display: none;
}
.table-recommended-flights .s-tb1 {
width: 50%;
}
.table-recommended-flights .s-tb2 {
width: 25%;
}
.table-recommended-flights .s-tb3 {
width: 25%;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.table-recommended-flights .tb-head .b-size-tb p {
font-size: 0.88rem;
}
.table-recommended-flights .tb-dt .b-tb-dp .b-size-tb p {
font-size: 0.82rem;
}
}
/* ================= Login ================= */
.sc--box-login {
position: relative;
width: 100%;
height: auto;
}
.bg-full-page-login {
position: relative;
width: 100%;
height: auto;
min-height: 100vh;
display: flex;
align-items: center;
padding: 60px 0;
background-image: radial-gradient(circle at 20% 14%, rgba(27, 27, 27, 0.05) 0%, rgba(27, 27, 27, 0.05) 50%, rgba(126, 126, 126, 0.05) 50%, rgba(126, 126, 126, 0.05) 100%), radial-gradient(circle at 18% 51%, rgba(248, 248, 248, 0.05) 0%, rgba(248, 248, 248, 0.05) 50%, rgba(26, 26, 26, 0.05) 50%, rgba(26, 26, 26, 0.05) 100%), radial-gradient(circle at 29% 38%, rgba(160, 160, 160, 0.05) 0%, rgba(160, 160, 160, 0.05) 50%, rgba(212, 212, 212, 0.05) 50%, rgba(212, 212, 212, 0.05) 100%), linear-gradient(90deg, rgb(35, 74, 255), rgb(59, 171, 253));
}
.bg-box-lin {
position: relative;
width: 80%;
height: 60vh;
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin: 0 auto;
}
.bg-box-lin .b-txt-welcome {
position: relative;
width: 60%;
height: auto;
padding: 16px;
display: flex;
align-items: center;
background-image: repeating-linear-gradient(90deg, hsla(253, 0%, 96%, 0.05) 0px, hsla(253, 0%, 96%, 0.05) 1px, transparent 1px, transparent 104px), repeating-linear-gradient(0deg, hsla(253, 0%, 96%, 0.05) 0px, hsla(253, 0%, 96%, 0.05) 1px, transparent 1px, transparent 104px), repeating-linear-gradient(0deg, hsla(253, 0%, 96%, 0.07) 0px, hsla(253, 0%, 96%, 0.07) 1px, transparent 1px, transparent 26px), repeating-linear-gradient(90deg, hsla(253, 0%, 96%, 0.07) 0px, hsla(253, 0%, 96%, 0.07) 1px, transparent 1px, transparent 26px), linear-gradient(45deg, rgb(18, 29, 67), rgb(18, 29, 67));
}
.bg-box-lin .b-txt-welcome .b-txt {
position: relative;
width: 100%;
height: auto;
/* margin: auto; */
}
.bg-box-lin .b-txt-welcome p {
font-size: 0.75rem;
/* text-indent: 25px; */
color: var(--color-grey2);
text-align: center;
}
.bg-box-lin .b-txt-welcome .tt-ct {
font-size: 0.88rem;
}
.bg-box-lin .b-txt-welcome p a {
font-size: 0.88rem;
color: var(--color-grey2);
text-decoration: underline;
cursor: pointer;
}
.bg-box-lin .b-txt-welcome .titles {
text-align: center;
font-weight: bold;
color: var(--color-light);
font-size: 1.75rem;
padding: 3px 0;
}
.bg-box-lin .b-txt-welcome .txt-top {
text-align: center;
color: var(--color-light);
font-size: 0.88rem;
padding: 2px 0;
}
.bg-box-lin .b-txt-welcome .list-spr-txt-wc {
position: relative;
width: 30px;
height: 4px;
border-radius: 10px;
background-color: var(--color-light);
margin: 0 auto 16px auto;
}
.bg-box-lin .b-input-list {
position: relative;
width: 40%;
height: auto;
padding: 16px 16px 16px 16px;
background-image: linear-gradient(88deg, rgba(202, 202, 202, 0.02) 0%, rgba(202, 202, 202, 0.02) 58%, transparent 58%, transparent 67%, rgba(220, 220, 220, 0.02) 67%, rgba(220, 220, 220, 0.02) 82%, rgba(8, 8, 8, 0.02) 82%, rgba(8, 8, 8, 0.02) 100%), linear-gradient(318deg, rgba(19, 19, 19, 0.02) 0%, rgba(19, 19, 19, 0.02) 5%, transparent 5%, transparent 50%, rgba(101, 101, 101, 0.02) 50%, rgba(101, 101, 101, 0.02) 65%, rgba(132, 132, 132, 0.02) 65%, rgba(132, 132, 132, 0.02) 100%), linear-gradient(150deg, rgba(166, 166, 166, 0.02) 0%, rgba(166, 166, 166, 0.02) 18%, transparent 18%, transparent 37%, rgba(105, 105, 105, 0.02) 37%, rgba(105, 105, 105, 0.02) 87%, rgba(244, 244, 244, 0.02) 87%, rgba(244, 244, 244, 0.02) 100%), linear-gradient(53deg, rgba(54, 54, 54, 0.02) 0%, rgba(54, 54, 54, 0.02) 26%, transparent 26%, transparent 81%, rgba(251, 251, 251, 0.02) 81%, rgba(251, 251, 251, 0.02) 85%, rgba(19, 19, 19, 0.02) 85%, rgba(19, 19, 19, 0.02) 100%), linear-gradient(90deg, rgb(255, 255, 255), rgb(255, 255, 255));
display: flex;
}
.bcenter-lin-n {
position: relative;
width: 100%;
margin: auto 0;
}
.bg-box-lin .b-input-list form {
position: relative;
width: 100%;
/* margin: auto 0; */
}
.bg-box-lin .b-input-list .box-title-login {
position: relative;
width: 90%;
height: auto;
padding: 0 0 5px 0;
margin: 0 auto;
}
.bg-box-lin .b-input-list .box-title-login p {
font-size: 0.63rem;
color: var(--color-txtg2);
text-align: center;
}
.bg-box-lin .b-input-list .box-title-login .titles {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-first);
text-align: center;
padding-bottom: 5px;
}
.bg-box-lin .b-input-list .box-inp-list {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 3px 0;
}
.bg-box-lin .b-input-list .box-inp-list p {
font-size: 0.88rem;
color: var(--color-txtg6);
padding-left: 5px;
}
.bg-box-lin .b-input-list .box-inp-list .name-inp {
padding-bottom: 2px;
}
.bg-box-lin .b-input-list .box-inp-list .lines-box-inp {
position: relative;
width: 100%;
height: auto;
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
display: flex;
justify-content: stretch;
align-items: center;
padding: 5px 3px;
}
.bg-box-lin .b-input-list .box-inp-list .lines-box-inp i {
font-size: 1.13rem;
color: var(--color-txtg4);
padding: 0 5px;
width: 2rem;
text-align: center;
}
.bg-box-lin .b-input-list .box-inp-list .lines-box-inp input {
background-color: var(--color-light);
width: calc(100% - 4rem);
height: auto;
font-size: 0.88rem;
}
.bg-box-lin .b-input-list .box-inp-list .lines-box-inp a {
position: relative;
width: auto;
height: auto;
margin: 0 auto -5px auto;
}
.bg-box-lin .b-input-list .box-forgot-password {
position: relative;
width: 100%;
height: auto;
display: flex;
}
.bg-box-lin .b-input-list .box-forgot-password p {
font-size: 0.63rem;
text-align: right;
cursor: pointer;
text-decoration: underline;
margin: 2px 5px 0 auto;
color: var(--color-txtg4);
}
.bg-box-lin .b-input-list .box-forgot-password a {
color: var(--color-txtg4);
}
.bg-box-lin .b-input-list .box-forgot-password p:hover a {
color: var(--color-txtg);
transition: all 0.3s ease;
}
.bg-box-lin .b-input-list .box-btn-login {
position: relative;
width: 100%;
height: auto;
padding: 25px 0 0 0;
display: flex;
}
.bg-box-lin .b-input-list .box-btn-login button {
background-color: var(--color-first);
border-radius: 5px;
width: 50%;
height: auto;
cursor: pointer;
margin: 0 auto;
font-size: 1rem;
font-weight: bold;
padding: 5px 16px 4px 16px;
border: 1px solid var(--color-light);
}
.bg-box-lin .b-input-list .box-btn-login button:hover {
border: 1px solid var(--color-first);
background-color: var(--color-light);
transition: all 0.3s ease;
}
.bg-box-lin .b-input-list .box-btn-login button span {
color: var(--color-light);
}
.bg-box-lin .b-input-list .box-btn-login button:hover span {
color: var(--color-first);
transition: all 0.3s ease;
}
.password-control {
font-size: 1rem;
transition: 0.5s;
color: var(--color-txtg4);
}
.password-control::after {
font-family: 'Font Awesome 6 Free';
content: "\f06e";
transition: 0.5s;
}
.view-password::after {
font-family: 'Font Awesome 6 Free';
content: "\f070";
transition: 0.5s;
}
/* ============= */
@media (min-width: 1400px) {
.bg-full-page-login {
align-items: flex-start;
padding: 100px 0 60px 0;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.bg-full-page-login {
min-height: 80vh;
padding: 40px 0;
}
.bg-box-lin {
height: 55vh;
}
.bg-box-lin .b-txt-welcome {
width: 55%;
}
.bg-box-lin .b-input-list {
width: 45%;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.bg-full-page-login {
min-height: 95vh;
padding: 40px 0;
}
.bg-box-lin {
width: 90%;
height: 50vh;
}
.bg-box-lin .b-txt-welcome {
width: 50%;
}
.bg-box-lin .b-input-list {
width: 50%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.bg-full-page-login {
min-height: 95vh;
padding: 40px 0;
}
.bg-box-lin {
width: 90%;
height: auto;
}
.bg-box-lin .b-txt-welcome {
width: 100%;
padding: 60px 20px 50px 20px;
}
.bg-box-lin .b-input-list {
width: 100%;
padding: 40px 20px 40px 20px;
}
.bg-box-lin .b-txt-welcome .b-txt {
width: 80%;
margin: 0 auto;
}
.bg-box-lin .b-input-list .box-title-login {
width: 80%;
}
.bg-box-lin .b-input-list .box-inp-list {
width: 80%;
margin: 0 auto;
}
.bg-box-lin .b-input-list .box-forgot-password {
width: 80%;
margin: 0 auto;
}
.bg-box-lin .b-input-list .box-btn-login {
width: 80%;
margin: 0 auto;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.bg-full-page-login {
min-height: 95vh;
padding: 40px 0;
}
.bg-box-lin {
width: 90%;
height: auto;
}
.bg-box-lin .b-txt-welcome {
width: 100%;
padding: 60px 20px 50px 20px;
}
.bg-box-lin .b-input-list {
width: 100%;
padding: 40px 20px 40px 20px;
}
.bg-box-lin .b-txt-welcome .b-txt {
width: 80%;
margin: 0 auto;
}
.bg-box-lin .b-input-list .box-title-login {
width: 80%;
}
.bg-box-lin .b-input-list .box-inp-list {
width: 80%;
margin: 0 auto;
}
.bg-box-lin .b-input-list .box-forgot-password {
width: 80%;
margin: 0 auto;
}
.bg-box-lin .b-input-list .box-btn-login {
width: 80%;
margin: 0 auto;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc--box-login .container {
padding: 0;
}
.bg-full-page-login {
min-height: 95vh;
padding: 40px 0;
}
.bg-box-lin {
width: 90%;
height: auto;
}
.bg-box-lin .b-txt-welcome {
width: 100%;
padding: 30px 16px 25px 16px;
}
.bg-box-lin .b-input-list {
width: 100%;
padding: 30px 16px 40px 16px;
}
.bg-box-lin .b-input-list .box-btn-login button {
width: 60%;
}
}
.brgt-lin-n {
position: relative;
width: 100%;
height: auto;
padding-top: 20px;
display: flex;
}
.btn-rgt-nlin- {
position: relative;
width: auto;
height: auto;
margin: 0 auto;
background-color: var(--color-green);
border: 1px solid var(--color-green);
border-radius: 5px;
cursor: pointer;
}
.btn-rgt-nlin- a {
position: relative;
width: auto;
height: auto;
padding: 6px 16px;
display: block;
}
.btn-rgt-nlin- a p {
font-size: 0.75rem;
color: var(--color-light);
}
.btn-rgt-nlin-:hover {
background-color: var(--color-light);
transition: all 0.3s ease;
}
.btn-rgt-nlin-:hover a p {
color: var(--color-green);
transition: all 0.3s ease;
}
/* ================= register ================= */
.sc--box-register {
position: relative;
width: 100%;
height: auto;
}
.bg-full-page-register {
position: relative;
width: 100%;
height: auto;
min-height: 100vh;
display: flex;
align-items: center;
padding: 60px 0;
background-image: linear-gradient(328deg, rgba(29, 29, 29, 0.05) 0%, rgba(29, 29, 29, 0.05) 25%, rgba(226, 226, 226, 0.05) 25%, rgba(226, 226, 226, 0.05) 50%, rgba(21, 21, 21, 0.05) 50%, rgba(21, 21, 21, 0.05) 75%, rgba(216, 216, 216, 0.05) 75%, rgba(216, 216, 216, 0.05) 100%), linear-gradient(172deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.05) 25%, rgba(108, 108, 108, 0.05) 25%, rgba(108, 108, 108, 0.05) 50%, rgba(21, 21, 21, 0.05) 50%, rgba(21, 21, 21, 0.05) 75%, rgba(236, 236, 236, 0.05) 75%, rgba(236, 236, 236, 0.05) 100%), linear-gradient(207deg, rgba(153, 153, 153, 0.05) 0%, rgba(153, 153, 153, 0.05) 25%, rgba(83, 83, 83, 0.05) 25%, rgba(83, 83, 83, 0.05) 50%, rgba(5, 5, 5, 0.05) 50%, rgba(5, 5, 5, 0.05) 75%, rgba(82, 82, 82, 0.05) 75%, rgba(82, 82, 82, 0.05) 100%), linear-gradient(297deg, rgba(26, 26, 26, 0.05) 0%, rgba(26, 26, 26, 0.05) 25%, rgba(223, 223, 223, 0.05) 25%, rgba(223, 223, 223, 0.05) 50%, rgba(232, 232, 232, 0.05) 50%, rgba(232, 232, 232, 0.05) 75%, rgba(153, 153, 153, 0.05) 75%, rgba(153, 153, 153, 0.05) 100%), linear-gradient(204deg, rgba(120, 120, 120, 0.05) 0%, rgba(120, 120, 120, 0.05) 25%, rgba(191, 191, 191, 0.05) 25%, rgba(191, 191, 191, 0.05) 50%, rgba(246, 246, 246, 0.05) 50%, rgba(246, 246, 246, 0.05) 75%, rgba(123, 123, 123, 0.05) 75%, rgba(123, 123, 123, 0.05) 100%), linear-gradient(90deg, rgb(59, 171, 253), rgb(37, 116, 255));
}
.bg-box-rgt {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
background-image: linear-gradient(88deg, rgba(202, 202, 202, 0.02) 0%, rgba(202, 202, 202, 0.02) 58%, transparent 58%, transparent 67%, rgba(220, 220, 220, 0.02) 67%, rgba(220, 220, 220, 0.02) 82%, rgba(8, 8, 8, 0.02) 82%, rgba(8, 8, 8, 0.02) 100%), linear-gradient(318deg, rgba(19, 19, 19, 0.02) 0%, rgba(19, 19, 19, 0.02) 5%, transparent 5%, transparent 50%, rgba(101, 101, 101, 0.02) 50%, rgba(101, 101, 101, 0.02) 65%, rgba(132, 132, 132, 0.02) 65%, rgba(132, 132, 132, 0.02) 100%), linear-gradient(150deg, rgba(166, 166, 166, 0.02) 0%, rgba(166, 166, 166, 0.02) 18%, transparent 18%, transparent 37%, rgba(105, 105, 105, 0.02) 37%, rgba(105, 105, 105, 0.02) 87%, rgba(244, 244, 244, 0.02) 87%, rgba(244, 244, 244, 0.02) 100%), linear-gradient(53deg, rgba(54, 54, 54, 0.02) 0%, rgba(54, 54, 54, 0.02) 26%, transparent 26%, transparent 81%, rgba(251, 251, 251, 0.02) 81%, rgba(251, 251, 251, 0.02) 85%, rgba(19, 19, 19, 0.02) 85%, rgba(19, 19, 19, 0.02) 100%), linear-gradient(90deg, rgb(255, 255, 255), rgb(255, 255, 255));
}
.b-note-rgt {
position: relative;
width: 100%;
height: auto;
padding: 10px 16px 5px 16px;
background-color: var(--color-grey3);
border-bottom: 1px dashed var(--color-grey5);
}
.b-note-rgt p {
font-size: 0.88rem;
font-weight: bold;
color: var(--color-red);
}
.bg-box-rgt .box-spr-rgt {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.bg-box-rgt .box-spr-rgt .box--left {
position: relative;
width: calc(50% - 0.5px);
height: fit-content;
padding: 16px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.bg-box-rgt .box-spr-rgt .box--right {
position: relative;
width: calc(50% - 0.5px);
height: fit-content;
padding: 16px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.lines-spr-lr-rgt {
width: 1px;
height: auto;
border-right: 1px dashed var(--color-grey5);
}
.bg-box-rgt .box-spr-rgt .box--upload-file-rgt {
position: relative;
width: 100%;
height: auto;
padding: 16px;
border-top: 1px dashed var(--color-grey5);
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.bg-box-rgt .box-spr-rgt .box--btn-rgt {
position: relative;
width: 100%;
height: auto;
padding: 30px 16px 20px 16px;
border-top: 1px dashed var(--color-grey5);
display: flex;
}
.bg-box-rgt .box-spr-rgt .box--btn-rgt button {
background-color: var(--color-first);
border-radius: 5px;
width: 40%;
height: auto;
cursor: pointer;
margin: 0 auto;
font-size: 1rem;
font-weight: bold;
padding: 5px 16px 4px 16px;
border: 1px solid var(--color-light);
margin: 0 auto;
}
.bg-box-rgt .box-spr-rgt .box--btn-rgt button span {
color: var(--color-light);
}
.bg-box-rgt .box-spr-rgt .box--btn-rgt button:hover {
border: 1px solid var(--color-first);
background-color: var(--color-light);
transition: all 0.3s ease;
}
.bg-box-rgt .box-spr-rgt .box--btn-rgt button:hover span {
color: var(--color-first);
transition: all 0.3s ease;
}
.rgt-title {
position: relative;
width: 100%;
height: auto;
padding-bottom: 20px;
}
.rgt-title .b-center-txt-title {
position: relative;
width: fit-content;
height: auto;
margin: 0 auto;
}
.rgt-title .b-center-txt-title p {
font-size: 1.13rem;
font-weight: bold;
color: var(--color-txtg);
}
.rgt-title .b-center-txt-title .lines-title-rgt {
position: relative;
width: 20px;
height: 2px;
background-color: var(--color-first);
margin-top: -5px;
border-radius: 10px;
}
.rgt-b-list {
position: relative;
height: auto;
padding: 0 0 12px 0;
}
.rgt-b-list p {
font-size: 0.88rem;
color: var(--color-txtg);
}
.rgt-b-list .name-inp {
padding: 0 0 1px 5px;
}
.rgt-b-list p .asterisk-red {
color: var(--color-red);
font-weight: bold;
padding-left: 3px;
}
.rgt-b-list .lines-box-inp {
position: relative;
width: 100%;
height: 1.875rem;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
align-items: center;
display: flex;
}
.rgt-b-list .pd-b-r10-rgt {
padding-right: 10px;
}
.rgt-b-list .lines-box-inp select {
width: 100%;
height: inherit;
font-size: 0.88rem;
padding: 2px 10px;
background-color: var(--color-light);
}
.rgt-b-list .lines-box-inp select option {
font-size: 0.88rem;
}
.rgt-b-list .lines-box-inp input {
width: 100%;
height: inherit;
font-size: 0.88rem;
padding: 2px 10px;
background-color: var(--color-light);
}
.rgt-b-list .lines-box-inp .size--inp-pass {
width: calc(100% - 2rem);
}
.rgt--size-b100 {
width: 100%;
}
.rgt--size-b50 {
width: 50%;
}
.pd-r--rgt {
padding-right: 10px;
}
.pd-l--rgt {
padding-left: 10px;
}
.eye-password-control-rgt {
font-size: 0.94rem;
transition: 0.5s;
color: var(--color-txtg4);
margin: 0 auto -2px auto;
}
.eye-password-control-rgt::after {
font-family: 'Font Awesome 6 Free';
content: "\f06e";
transition: 0.5s;
}
.view-password-rgt::after {
font-family: 'Font Awesome 6 Free';
content: "\f070";
transition: 0.5s;
}
.eye-confirm-password-control-rgt {
font-size: 0.94rem;
transition: 0.5s;
color: var(--color-txtg4);
margin: 0 auto -2px auto;
}
.eye-confirm-password-control-rgt::after {
font-family: 'Font Awesome 6 Free';
content: "\f06e";
transition: 0.5s;
}
.view-confirm-password-rgt::after {
font-family: 'Font Awesome 6 Free';
content: "\f070";
transition: 0.5s;
}
.b-spr-upl-img {
position: relative;
height: auto;
padding: 0 10px 0 10px;
}
.b-spr-upl-img .title-upl-file {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.b-spr-upl-img .title-upl-file p {
font-size: 0.88rem;
text-align: center;
color: var(--color-txtg);
}
.b-spr-upl-img .img-file {
position: relative;
width: 100%;
height: auto;
cursor: pointer;
}
.b-spr-upl-img .img-file figure {
position: relative;
width: auto;
height: auto;
max-height: 10rem;
display: flex;
overflow: hidden;
}
.b-spr-upl-img .img-file figure .size-imgupl {
position: relative;
width: 100%;
height: auto;
object-fit: scale-down;
margin: 0 auto;
}
.size-upl-rgt {
width: calc(100%/4);
}
/* ============= */
@media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {
.bg-full-page-register {
padding: 40px 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.bg-full-page-register {
padding: 40px 0;
}
.b-spr-upl-img .title-upl-file p {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.bg-full-page-register {
padding: 40px 0;
}
.lines-spr-lr-rgt {
border-right: none;
width: 100%;
border-bottom: 1px dashed var(--color-grey5);
}
.bg-box-rgt .box-spr-rgt .box--left {
width: 100%;
}
.bg-box-rgt .box-spr-rgt .box--right {
width: 100%;
}
.b-spr-upl-img {
padding: 10px 10px 10px 10px;
}
.size-upl-rgt {
width: calc(100%/2);
}
.b-spr-upl-img .title-upl-file p {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.bg-box-rgt .box-spr-rgt .box--btn-rgt button {
width: 50%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.bg-full-page-register {
padding: 40px 0;
}
.lines-spr-lr-rgt {
border-right: none;
width: 100%;
border-bottom: 1px dashed var(--color-grey5);
}
.bg-box-rgt .box-spr-rgt .box--left {
width: 100%;
}
.bg-box-rgt .box-spr-rgt .box--right {
width: 100%;
}
.b-spr-upl-img {
padding: 10px 10px 10px 10px;
}
.size-upl-rgt {
width: calc(100%/2);
}
.b-spr-upl-img .title-upl-file p {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.bg-box-rgt .box-spr-rgt .box--btn-rgt button {
width: 50%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.bg-full-page-register {
padding: 40px 0;
}
.lines-spr-lr-rgt {
border-right: none;
width: 100%;
border-bottom: 1px dashed var(--color-grey5);
}
.bg-box-rgt .box-spr-rgt .box--left {
width: 100%;
}
.bg-box-rgt .box-spr-rgt .box--right {
width: 100%;
}
.b-spr-upl-img {
padding: 10px 10px 10px 10px;
}
.size-upl-rgt {
width: calc(100%/2);
}
.b-spr-upl-img .title-upl-file {
min-height: 2.94rem;
}
.b-spr-upl-img .title-upl-file p {
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.bg-box-rgt .box-spr-rgt .box--btn-rgt button {
width: 70%;
}
}
/* ================= ================= */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
::placeholder {
font-size: 0.81rem;
font-weight: 300;
color: var(--color-txtg1);
}
.box-txt--inf {
position: relative;
width: 100%;
height: auto;
padding: 8px 20px 0 20px;
}
.box-txt--inf p {
font-size: 0.81rem;
text-align: center;
color: var(--color-red);
}
.t-asterisk- {
color: var(--color-red);
}
.box--captcha-rgt {
position: relative;
width: 100%;
height: auto;
display: flex;
padding: 0 20px 20px 20px;
}
.box--captcha-rgt .b-center--captcha {
position: relative;
width: fit-content;
height: auto;
margin: 0 auto;
/* display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row; */
}
.box--captcha-rgt .b-center--captcha .title-name--ctc {
position: relative;
width: auto;
height: auto;
padding: 0 0 4px 5px;
}
.box--captcha-rgt .b-center--captcha .title-name--ctc p {
font-size: 0.88rem;
color: var(--color-txtg);
}
.box--captcha-rgt .b-center--captcha .title-name--ctc p span {
color: var(--color-red);
}
.box--captcha-rgt .b-center--captcha .b--lines--ctc-dpf {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box--captcha-rgt .b-center--captcha .b--lines--ctc-dpf .lines-b--ctc {
position: relative;
width: auto;
height: auto;
display: flex;
justify-content: stretch;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
margin-right: 5px;
}
.box--captcha-rgt .b-center--captcha .b--lines--ctc-dpf .lines-b--ctc .b-img--ctc {
position: relative;
width: auto;
height: fit-content;
font-size: 0;
display: flex;
border-right: 1px solid var(--color-grey4);
}
.box--captcha-rgt .b-center--captcha .b--lines--ctc-dpf .lines-b--ctc input {
position: relative;
width: 15rem;
height: auto;
font-size: 0.88rem;
color: var(--color-txtg);
padding: 2px 16px;
background-color: var(--color-light);
}
.box--captcha-rgt .b-center--captcha .b--lines--ctc-dpf button {
position: relative;
width: auto;
height: auto;
padding: 2px 5px;
color: var(--color-light);
background-color: var(--color-first);
border: 1px solid var(--color-first);
cursor: pointer;
border-radius: 5px;
}
.box--captcha-rgt .b-center--captcha .b--lines--ctc-dpf button i {
font-size: 1.5rem;
color: var(--color-light);
}
.box--captcha-rgt .b-center--captcha .b--lines--ctc-dpf button:hover {
background-color: var(--color-light);
transition: all 0.3s ease;
}
.box--captcha-rgt .b-center--captcha .b--lines--ctc-dpf button:hover i {
color: var(--color-first);
transition: all 0.3s ease;
}
/* ============= */
@media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {
.box--captcha-rgt .b-center--captcha .b--lines--ctc-dpf .lines-b--ctc input {
width: 12rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.box--captcha-rgt .b-center--captcha {
width: 100%;
}
.box--captcha-rgt .b-center--captcha .b--lines--ctc-dpf .lines-b--ctc input {
width: 100%;
padding: 2px 12px;
}
.box--captcha-rgt .b-center--captcha .b--lines--ctc-dpf .lines-b--ctc {
width: calc((100% - 2.5rem) - 5px);
}
.box--captcha-rgt .b-center--captcha .b--lines--ctc-dpf button {
width: 2.5rem;
}
}
/* ================= Forgot Password ================= */
.sc--box-forgot-password {
position: relative;
width: 100%;
height: auto;
}
.bg-full-page-forgot-password {
position: relative;
width: 100%;
height: auto;
min-height: 100vh;
display: flex;
align-items: center;
padding: 40px 0;
background-image: radial-gradient(circle at 85% 1%, hsla(190, 0%, 93%, 0.05) 0%, hsla(190, 0%, 93%, 0.05) 96%, transparent 96%, transparent 100%), radial-gradient(circle at 14% 15%, hsla(190, 0%, 93%, 0.05) 0%, hsla(190, 0%, 93%, 0.05) 1%, transparent 1%, transparent 100%), radial-gradient(circle at 60% 90%, hsla(190, 0%, 93%, 0.05) 0%, hsla(190, 0%, 93%, 0.05) 20%, transparent 20%, transparent 100%), radial-gradient(circle at 79% 7%, hsla(190, 0%, 93%, 0.05) 0%, hsla(190, 0%, 93%, 0.05) 78%, transparent 78%, transparent 100%), radial-gradient(circle at 55% 65%, hsla(190, 0%, 93%, 0.05) 0%, hsla(190, 0%, 93%, 0.05) 52%, transparent 52%, transparent 100%), linear-gradient(135deg, rgb(37, 56, 222), rgb(96, 189, 244));
}
.bg-box-forgot-pass {
position: relative;
width: 40%;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin: 0 auto;
}
.bg-box-forgot-pass .b-txt-fgpass {
position: relative;
width: 100%;
height: auto;
min-height: 30vh;
padding: 16px;
display: flex;
background-image: linear-gradient(328deg, rgba(29, 29, 29, 0.05) 0%, rgba(29, 29, 29, 0.05) 25%, rgba(226, 226, 226, 0.05) 25%, rgba(226, 226, 226, 0.05) 50%, rgba(21, 21, 21, 0.05) 50%, rgba(21, 21, 21, 0.05) 75%, rgba(216, 216, 216, 0.05) 75%, rgba(216, 216, 216, 0.05) 100%), linear-gradient(172deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.05) 25%, rgba(108, 108, 108, 0.05) 25%, rgba(108, 108, 108, 0.05) 50%, rgba(21, 21, 21, 0.05) 50%, rgba(21, 21, 21, 0.05) 75%, rgba(236, 236, 236, 0.05) 75%, rgba(236, 236, 236, 0.05) 100%), linear-gradient(207deg, rgba(153, 153, 153, 0.05) 0%, rgba(153, 153, 153, 0.05) 25%, rgba(83, 83, 83, 0.05) 25%, rgba(83, 83, 83, 0.05) 50%, rgba(5, 5, 5, 0.05) 50%, rgba(5, 5, 5, 0.05) 75%, rgba(82, 82, 82, 0.05) 75%, rgba(82, 82, 82, 0.05) 100%), linear-gradient(297deg, rgba(26, 26, 26, 0.05) 0%, rgba(26, 26, 26, 0.05) 25%, rgba(223, 223, 223, 0.05) 25%, rgba(223, 223, 223, 0.05) 50%, rgba(232, 232, 232, 0.05) 50%, rgba(232, 232, 232, 0.05) 75%, rgba(153, 153, 153, 0.05) 75%, rgba(153, 153, 153, 0.05) 100%), linear-gradient(204deg, rgba(120, 120, 120, 0.05) 0%, rgba(120, 120, 120, 0.05) 25%, rgba(191, 191, 191, 0.05) 25%, rgba(191, 191, 191, 0.05) 50%, rgba(246, 246, 246, 0.05) 50%, rgba(246, 246, 246, 0.05) 75%, rgba(123, 123, 123, 0.05) 75%, rgba(123, 123, 123, 0.05) 100%), linear-gradient(90deg, rgb(43, 68, 161), rgb(18, 29, 67));
}
.bg-box-forgot-pass .b-txt-fgpass .b-center-txt {
position: relative;
width: 100%;
height: auto;
margin: auto;
}
.bg-box-forgot-pass .b-txt-fgpass .b-center-txt p {
font-size: 0.75rem;
color: var(--color-grey2);
text-align: center;
}
.bg-box-forgot-pass .b-txt-fgpass .b-center-txt .title-fgpass {
text-align: center;
font-weight: bold;
color: var(--color-light);
font-size: 1.63rem;
padding: 3px 0;
}
.bg-box-forgot-pass .b-txt-fgpass .b-center-txt .line-spr-fgpass {
position: relative;
width: 30px;
height: 4px;
border-radius: 10px;
background-color: var(--color-light);
margin: 0 auto 16px auto;
}
.bg-box-forgot-pass .b-input-fgpass {
position: relative;
width: 100%;
height: auto;
min-height: 20vh;
padding: 16px;
display: flex;
background-image: linear-gradient(339deg, rgba(47, 47, 47, 0.02) 0%, rgba(47, 47, 47, 0.02) 42%, transparent 42%, transparent 99%, rgba(17, 17, 17, 0.02) 99%, rgba(17, 17, 17, 0.02) 100%), linear-gradient(257deg, rgba(65, 65, 65, 0.02) 0%, rgba(65, 65, 65, 0.02) 11%, transparent 11%, transparent 92%, rgba(53, 53, 53, 0.02) 92%, rgba(53, 53, 53, 0.02) 100%), linear-gradient(191deg, rgba(5, 5, 5, 0.02) 0%, rgba(5, 5, 5, 0.02) 1%, transparent 1%, transparent 45%, rgba(19, 19, 19, 0.02) 45%, rgba(19, 19, 19, 0.02) 100%), linear-gradient(29deg, rgba(28, 28, 28, 0.02) 0%, rgba(28, 28, 28, 0.02) 33%, transparent 33%, transparent 40%, rgba(220, 220, 220, 0.02) 40%, rgba(220, 220, 220, 0.02) 100%), linear-gradient(90deg, rgb(255, 255, 255), rgb(255, 255, 255));
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass {
position: relative;
width: 80%;
height: auto;
margin: auto;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass .box-inp-list-fgpass {
position: relative;
width: 100%;
height: auto;
padding: 10px 0 3px 0;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass .box-inp-list-fgpass p {
font-size: 0.88rem;
color: var(--color-txtg6);
padding-left: 5px;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass .box-inp-list-fgpass .name-inp {
padding-bottom: 2px;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass .box-inp-list-fgpass .lines-box-inp {
position: relative;
width: 100%;
height: auto;
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
display: flex;
justify-content: stretch;
align-items: center;
padding: 5px 3px;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass .box-inp-list-fgpass .lines-box-inp i {
font-size: 1.13rem;
color: var(--color-txtg4);
padding: 0 5px;
width: 2rem;
text-align: center;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass .box-inp-list-fgpass .lines-box-inp input {
background-color: var(--color-light);
width: calc(100% - 4rem);
height: auto;
font-size: 0.88rem;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass .box-btn-forgot-password {
position: relative;
width: 100%;
height: auto;
padding: 25px 0 0 0;
display: flex;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass .box-btn-forgot-password button {
background-color: var(--color-first);
border-radius: 5px;
width: 80%;
height: auto;
cursor: pointer;
margin: 0 auto;
font-size: 1rem;
font-weight: bold;
padding: 5px 16px 4px 16px;
border: 1px solid var(--color-light);
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass .box-btn-forgot-password button span {
color: var(--color-light);
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass .box-btn-forgot-password button:hover {
border: 1px solid var(--color-first);
background-color: var(--color-light);
transition: all 0.3s ease;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass .box-btn-forgot-password button:hover span {
color: var(--color-first);
transition: all 0.3s ease;
}
/* ============= */
@media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {
.bg-full-page-forgot-password {
min-height: 90vh;
}
.bg-box-forgot-pass {
width: 45%;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass {
width: 80%;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.bg-full-page-forgot-password {
min-height: 95vh;
}
.bg-box-forgot-pass {
width: 60%;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass {
width: 80%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.bg-full-page-forgot-password {
min-height: 95vh;
}
.bg-box-forgot-pass {
width: 60%;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass {
width: 85%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.bg-full-page-forgot-password {
min-height: 95vh;
}
.bg-box-forgot-pass {
width: 60%;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass {
width: 90%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.bg-full-page-forgot-password {
min-height: 95vh;
}
.bg-box-forgot-pass {
width: 90%;
}
.bg-box-forgot-pass .b-txt-fgpass {
padding: 16px 25px;
}
.bg-box-forgot-pass .b-input-fgpass .b-center-inp-fgpass {
width: 100%;
}
}
/* ================= Change Password ================= */
.sc--box-change-password {
position: relative;
width: 100%;
height: auto;
}
.bg-full-page-change-password {
position: relative;
width: 100%;
height: auto;
min-height: 100vh;
display: flex;
align-items: center;
padding: 40px 0;
background-image: radial-gradient(circle at 85% 1%, hsla(190, 0%, 93%, 0.05) 0%, hsla(190, 0%, 93%, 0.05) 96%, transparent 96%, transparent 100%), radial-gradient(circle at 14% 15%, hsla(190, 0%, 93%, 0.05) 0%, hsla(190, 0%, 93%, 0.05) 1%, transparent 1%, transparent 100%), radial-gradient(circle at 60% 90%, hsla(190, 0%, 93%, 0.05) 0%, hsla(190, 0%, 93%, 0.05) 20%, transparent 20%, transparent 100%), radial-gradient(circle at 79% 7%, hsla(190, 0%, 93%, 0.05) 0%, hsla(190, 0%, 93%, 0.05) 78%, transparent 78%, transparent 100%), radial-gradient(circle at 55% 65%, hsla(190, 0%, 93%, 0.05) 0%, hsla(190, 0%, 93%, 0.05) 52%, transparent 52%, transparent 100%), linear-gradient(135deg, rgb(37, 56, 222), rgb(96, 189, 244));
}
.bg-box-change-pass {
position: relative;
width: 40%;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin: 0 auto;
}
.bg-box-change-pass .b-txt-chpass {
position: relative;
width: 100%;
height: auto;
min-height: 30vh;
padding: 16px;
display: flex;
background-image: linear-gradient(328deg, rgba(29, 29, 29, 0.05) 0%, rgba(29, 29, 29, 0.05) 25%, rgba(226, 226, 226, 0.05) 25%, rgba(226, 226, 226, 0.05) 50%, rgba(21, 21, 21, 0.05) 50%, rgba(21, 21, 21, 0.05) 75%, rgba(216, 216, 216, 0.05) 75%, rgba(216, 216, 216, 0.05) 100%), linear-gradient(172deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.05) 25%, rgba(108, 108, 108, 0.05) 25%, rgba(108, 108, 108, 0.05) 50%, rgba(21, 21, 21, 0.05) 50%, rgba(21, 21, 21, 0.05) 75%, rgba(236, 236, 236, 0.05) 75%, rgba(236, 236, 236, 0.05) 100%), linear-gradient(207deg, rgba(153, 153, 153, 0.05) 0%, rgba(153, 153, 153, 0.05) 25%, rgba(83, 83, 83, 0.05) 25%, rgba(83, 83, 83, 0.05) 50%, rgba(5, 5, 5, 0.05) 50%, rgba(5, 5, 5, 0.05) 75%, rgba(82, 82, 82, 0.05) 75%, rgba(82, 82, 82, 0.05) 100%), linear-gradient(297deg, rgba(26, 26, 26, 0.05) 0%, rgba(26, 26, 26, 0.05) 25%, rgba(223, 223, 223, 0.05) 25%, rgba(223, 223, 223, 0.05) 50%, rgba(232, 232, 232, 0.05) 50%, rgba(232, 232, 232, 0.05) 75%, rgba(153, 153, 153, 0.05) 75%, rgba(153, 153, 153, 0.05) 100%), linear-gradient(204deg, rgba(120, 120, 120, 0.05) 0%, rgba(120, 120, 120, 0.05) 25%, rgba(191, 191, 191, 0.05) 25%, rgba(191, 191, 191, 0.05) 50%, rgba(246, 246, 246, 0.05) 50%, rgba(246, 246, 246, 0.05) 75%, rgba(123, 123, 123, 0.05) 75%, rgba(123, 123, 123, 0.05) 100%), linear-gradient(90deg, rgb(43, 68, 161), rgb(18, 29, 67));
}
.bg-box-change-pass .b-txt-chpass .b-center-txt {
position: relative;
width: 100%;
height: auto;
margin: auto;
}
.bg-box-change-pass .b-txt-chpass .b-center-txt p {
font-size: 0.75rem;
color: var(--color-grey2);
text-align: center;
}
.bg-box-change-pass .b-txt-chpass .b-center-txt .title-chpass {
text-align: center;
font-weight: bold;
color: var(--color-light);
font-size: 1.63rem;
padding: 3px 0;
}
.bg-box-change-pass .b-txt-chpass .b-center-txt .line-spr-chpass {
position: relative;
width: 30px;
height: 4px;
border-radius: 10px;
background-color: var(--color-light);
margin: 0 auto 16px auto;
}
.bg-box-change-pass .b-input-chpass {
position: relative;
width: 100%;
height: auto;
min-height: 20vh;
padding: 16px;
display: flex;
background-image: linear-gradient(339deg, rgba(47, 47, 47, 0.02) 0%, rgba(47, 47, 47, 0.02) 42%, transparent 42%, transparent 99%, rgba(17, 17, 17, 0.02) 99%, rgba(17, 17, 17, 0.02) 100%), linear-gradient(257deg, rgba(65, 65, 65, 0.02) 0%, rgba(65, 65, 65, 0.02) 11%, transparent 11%, transparent 92%, rgba(53, 53, 53, 0.02) 92%, rgba(53, 53, 53, 0.02) 100%), linear-gradient(191deg, rgba(5, 5, 5, 0.02) 0%, rgba(5, 5, 5, 0.02) 1%, transparent 1%, transparent 45%, rgba(19, 19, 19, 0.02) 45%, rgba(19, 19, 19, 0.02) 100%), linear-gradient(29deg, rgba(28, 28, 28, 0.02) 0%, rgba(28, 28, 28, 0.02) 33%, transparent 33%, transparent 40%, rgba(220, 220, 220, 0.02) 40%, rgba(220, 220, 220, 0.02) 100%), linear-gradient(90deg, rgb(255, 255, 255), rgb(255, 255, 255));
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass {
position: relative;
width: 100%;
height: auto;
margin: auto;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-inp-list-chpass {
position: relative;
width: 80%;
height: auto;
padding: 10px 0 3px 0;
margin: 0 auto;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-inp-list-chpass p {
font-size: 0.88rem;
color: var(--color-txtg6);
padding-left: 5px;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-inp-list-chpass .name-inp {
padding-bottom: 2px;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-inp-list-chpass .lines-box-inp {
position: relative;
width: 100%;
height: auto;
border: 1px solid var(--color-grey3);
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
display: flex;
justify-content: stretch;
align-items: center;
padding: 5px 3px;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-inp-list-chpass .lines-box-inp i {
font-size: 1.13rem;
color: var(--color-txtg4);
padding: 0 5px;
width: 2rem;
text-align: center;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-inp-list-chpass .lines-box-inp input {
width: calc(100% - 4rem);
height: auto;
font-size: 0.88rem;
padding: 2px 10px;
background-color: var(--color-light);
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .lines-spr-inp-chpass {
position: relative;
width: 100%;
height: 1px;
margin: 16px 0 10px 0;
border-bottom: 1px dashed var(--color-grey4);
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-btn-change-password {
position: relative;
width: 100%;
height: auto;
padding: 25px 0 0 0;
display: flex;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-btn-change-password button {
background-color: var(--color-first);
border-radius: 5px;
width: 60%;
height: auto;
cursor: pointer;
margin: 0 auto;
font-size: 1rem;
font-weight: bold;
padding: 5px 16px 4px 16px;
border: 1px solid var(--color-light);
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-btn-change-password button span {
color: var(--color-light);
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-btn-change-password button:hover {
border: 1px solid var(--color-first);
background-color: var(--color-light);
transition: all 0.3s ease;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-btn-change-password button:hover span {
color: var(--color-first);
transition: all 0.3s ease;
}
.eye-chpass--control {
font-size: 0.94rem;
transition: 0.5s;
color: var(--color-txtg4);
margin: 0 auto -2px auto;
}
.eye-chpass--control::after {
font-family: 'Font Awesome 6 Free';
content: "\f06e";
transition: 0.5s;
}
.view-chpass-old::after {
font-family: 'Font Awesome 6 Free';
content: "\f070";
transition: 0.5s;
}
.view-chpass-new::after {
font-family: 'Font Awesome 6 Free';
content: "\f070";
transition: 0.5s;
}
.view-confirm-chpass-new::after {
font-family: 'Font Awesome 6 Free';
content: "\f070";
transition: 0.5s;
}
/* ============= */
@media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {
.bg-full-page-change-password {
min-height: 90vh;
}
.bg-box-change-pass {
width: 45%;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-inp-list-chpass {
width: 80%;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-btn-change-password button {
width: 60%;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.bg-full-page-change-password {
min-height: 95vh;
}
.bg-box-change-pass {
width: 60%;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-inp-list-chpass {
width: 80%;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-btn-change-password button {
width: 60%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.bg-full-page-change-password {
min-height: 95vh;
}
.bg-box-change-pass {
width: 60%;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-inp-list-chpass {
width: 85%;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-btn-change-password button {
width: 70%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.bg-full-page-change-password {
min-height: 95vh;
}
.bg-box-change-pass {
width: 60%;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-inp-list-chpass {
width: 90%;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-btn-change-password button {
width: 75%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.bg-full-page-change-password {
min-height: 95vh;
}
.bg-box-change-pass {
width: 90%;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-inp-list-chpass {
width: 100%;
}
.bg-box-change-pass .b-input-chpass .b-center-inp-chpass .box-btn-change-password button {
width: 75%;
}
.bg-box-change-pass .b-txt-chpass {
padding: 16px 25px;
}
}
/* ================= profile ================= */
.sc--profile-dt {
position: relative;
width: 100%;
height: auto;
}
.bg-full-profile-view {
position: relative;
width: 100%;
height: auto;
min-height: 80vh;
display: flex;
align-items: center;
padding: 50px 0;
background-image: linear-gradient(140deg, rgba(94, 94, 94, 0.04) 0%, rgba(94, 94, 94, 0.04) 40%, rgba(189, 189, 189, 0.04) 40%, rgba(189, 189, 189, 0.04) 100%), linear-gradient(300deg, rgba(186, 186, 186, 0.04) 0%, rgba(186, 186, 186, 0.04) 35%, rgba(254, 254, 254, 0.04) 35%, rgba(254, 254, 254, 0.04) 100%), linear-gradient(226deg, rgba(69, 69, 69, 0.04) 0%, rgba(69, 69, 69, 0.04) 89%, rgba(83, 83, 83, 0.04) 89%, rgba(83, 83, 83, 0.04) 100%), linear-gradient(266deg, rgba(200, 200, 200, 0.04) 0%, rgba(200, 200, 200, 0.04) 76%, rgba(91, 91, 91, 0.04) 76%, rgba(91, 91, 91, 0.04) 100%), linear-gradient(90deg, rgb(53, 25, 237), rgb(15, 161, 235));
}
.bg-profile-view {
position: relative;
width: 80%;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin: 0 auto;
}
.box-spr-profile {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box-spr-profile .b-left-pf {
position: relative;
width: 45%;
height: auto;
padding: 40px 30px 50px 40px;
/* padding: 40px 30px 50px 20px; */
background-image: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.15) 0px, rgba(255, 255, 255, 0.15) 1px, transparent 1px, transparent 41px), repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.15) 0px, rgba(255, 255, 255, 0.15) 1px, transparent 1px, transparent 41px), linear-gradient(90deg, hsl(227, 58%, 17%), hsl(227, 58%, 17%));
}
.box-spr-profile .b-left-pf .lines1-b-img-pf {
position: relative;
width: 13rem;
height: 13rem;
border: 2px dashed var(--color-grey4);
margin: 0 auto;
border-radius: 100%;
overflow: hidden;
}
.box-spr-profile .b-left-pf .lines1-b-img-pf .lines2-b-img-pf {
position: relative;
width: 12rem;
height: 12rem;
border: 2px dashed var(--color-grey2);
border-radius: 100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
overflow: hidden;
}
.box-spr-profile .b-left-pf .b-img {
position: relative;
width: 11rem;
height: 11rem;
border-radius: 100%;
overflow: hidden;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border: 4px solid var(--color-light);
}
.box-spr-profile .b-left-pf .b-img figure {
position: relative;
width: 100%;
height: 100%;
}
.box-spr-profile .b-left-pf .b-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.box-spr-profile .b-left-pf .b-txt-dt {
position: relative;
width: 100%;
height: auto;
border-bottom: 1px dashed var(--color-light);
padding: 10px 0 16px 0;
margin: 0 0 16px 0;
}
.box-spr-profile .b-left-pf .b-txt-dt .txt-name {
font-size: 1.13rem;
font-weight: bold;
color: var(--color-light);
text-align: center;
}
.box-spr-profile .b-left-pf .b-txt-dt .txt-applicanttype {
font-size: 0.82rem;
margin-top: -5px;
text-align: center;
color: var(--color-grey);
}
.box-spr-profile .b-left-pf .b-txt-dt .txt-expire {
font-size: 0.88rem;
text-align: center;
color: var(--color-light);
margin-top: 2px;
}
.box-spr-profile .b-left-pf .b-txt-dt .txt-expire span {
font-weight: bold;
color: var(--color-light);
}
.box-spr-profile .b-left-pf .b-txt-dt .txt-position {
font-size: 0.88rem;
text-align: center;
color: var(--color-light);
margin-top: 2px;
}
.box-spr-profile .b-left-pf .b-social-pf {
position: relative;
width: fit-content;
height: auto;
margin: 0 auto 0 auto;
}
.box-spr-profile .b-left-pf .b-social-pf .b-list-sc-pf {
position: relative;
width: fit-content;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding-bottom: 5px;
align-items: center;
}
.box-spr-profile .b-left-pf .b-social-pf .b-list-sc-pf .icon-l {
position: relative;
width: 1.5rem;
height: auto;
padding: 2px 5px 0 0;
}
.box-spr-profile .b-left-pf .b-social-pf .b-list-sc-pf .icon-l i {
font-size: 1rem;
color: var(--color-light);
}
.box-spr-profile .b-left-pf .b-social-pf .b-list-sc-pf .txt-r {
position: relative;
width: calc(100% - 1.5rem);
height: auto;
}
.box-spr-profile .b-left-pf .b-social-pf .b-list-sc-pf .txt-r p {
font-size: 0.88rem;
color: var(--color-light);
padding-left: 2px;
}
.box-spr-profile .b-left-pf .b-social-pf .b-list-sc-pf .txt-r .title-n {
font-size: 0.82rem;
color: var(--color-light);
font-weight: bold;
padding: 0 0 1px 0;
}
.box-spr-profile .b-right-pf {
position: relative;
width: 55%;
height: auto;
padding: 50px 40px 50px 30px;
/* padding: 50px 20px 50px 40px; */
background-image: linear-gradient(74deg, rgba(236, 236, 236, 0.02) 0%, rgba(236, 236, 236, 0.02) 13%, transparent 13%, transparent 64%, rgba(55, 55, 55, 0.02) 64%, rgba(55, 55, 55, 0.02) 71%, rgba(239, 239, 239, 0.02) 71%, rgba(239, 239, 239, 0.02) 100%), linear-gradient(170deg, rgba(8, 8, 8, 0.02) 0%, rgba(8, 8, 8, 0.02) 1%, transparent 1%, transparent 60%, rgba(9, 9, 9, 0.02) 60%, rgba(9, 9, 9, 0.02) 80%, rgba(198, 198, 198, 0.02) 80%, rgba(198, 198, 198, 0.02) 100%), linear-gradient(118deg, rgba(134, 134, 134, 0.02) 0%, rgba(134, 134, 134, 0.02) 30%, transparent 30%, transparent 43%, rgba(85, 85, 85, 0.02) 43%, rgba(85, 85, 85, 0.02) 47%, rgba(103, 103, 103, 0.02) 47%, rgba(103, 103, 103, 0.02) 100%), linear-gradient(249deg, rgba(178, 178, 178, 0.02) 0%, rgba(178, 178, 178, 0.02) 8%, transparent 8%, transparent 47%, rgba(161, 161, 161, 0.02) 47%, rgba(161, 161, 161, 0.02) 61%, rgba(19, 19, 19, 0.02) 61%, rgba(19, 19, 19, 0.02) 100%), linear-gradient(90deg, rgb(255, 255, 255), rgb(255, 255, 255));
}
.box-spr-profile .b-right-pf .b-address-company-pf {
position: relative;
width: 100%;
height: auto;
}
.box-spr-profile .b-right-pf .b-address-company-pf .title-pf {
position: relative;
width: fit-content;
height: auto;
padding-bottom: 20px;
}
.box-spr-profile .b-right-pf .b-address-company-pf .title-pf p {
font-size: 1.13rem;
font-weight: bold;
color: var(--color-txtg);
}
.box-spr-profile .b-right-pf .b-address-company-pf .title-pf .lines-title-pf {
position: relative;
width: 20px;
height: 2px;
background-color: var(--color-first);
margin-top: -5px;
border-radius: 10px;
}
.box-spr-profile .b-right-pf .b-address-company-pf .list-txt-cpn-pf {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding-bottom: 10px;
}
.box-spr-profile .b-right-pf .b-address-company-pf .list-txt-cpn-pf .icon-left {
position: relative;
width: 1.5rem;
height: auto;
padding: 2px 5px 0 0;
}
.box-spr-profile .b-right-pf .b-address-company-pf .list-txt-cpn-pf .icon-left i {
font-size: 1rem;
color: var(--color-txtg);
}
.box-spr-profile .b-right-pf .b-address-company-pf .list-txt-cpn-pf .txt-right {
position: relative;
width: calc(100% - 1.5rem);
height: auto;
}
.box-spr-profile .b-right-pf .b-address-company-pf .list-txt-cpn-pf .txt-right p {
font-size: 0.88rem;
color: var(--color-txtg5);
padding-left: 5px;
}
.box-spr-profile .b-right-pf .b-address-company-pf .list-txt-cpn-pf .txt-right .title-n {
font-size: 0.82rem;
color: var(--color-txtg);
font-weight: bold;
padding: 0 0 1px 0;
}
.box-spr-profile .b-txt-name-title-pf {
position: absolute;
width: fit-content;
height: auto;
top: 50%;
left: 45%;
transform: translate(-50%, -50%);
padding: 20px 0 0 0;
}
.box-spr-profile .b-txt-name-title-pf p {
font-size: 1.57rem;
font-weight: bold;
letter-spacing: 15px;
writing-mode: vertical-lr;
background: linear-gradient(to left, var(--color-txtg) 0%, var(--color-txtg) 50%, var(--color-light) 50%, var(--color-light) 70%, var(--color-light) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.box-spr-profile .b-txt-name-title-pf2 {
position: absolute;
width: fit-content;
height: auto;
top: 0;
left: -6px;
padding: 5px 0 0 0;
}
.box-spr-profile .b-txt-name-title-pf2 p {
font-size: 1.57rem;
font-weight: bold;
letter-spacing: 10px;
writing-mode: vertical-lr;
color: var(--color-light);
}
.box-spr-profile .b-txt-name-title-pf3 {
position: absolute;
width: fit-content;
height: auto;
right: -6px;
bottom: 0;
padding: 0 0 5px 0;
}
.box-spr-profile .b-txt-name-title-pf3 p {
font-size: 1.57rem;
font-weight: bold;
letter-spacing: 10px;
writing-mode: vertical-rl;
color: var(--color-txtg);
transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-o-transform: rotate(180deg);
-ms-transform: rotate(180deg);
}
/* ============= */
@media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.bg-profile-view {
width: 90%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.bg-profile-view {
width: 100%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.bg-profile-view {
width: 100%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.bg-profile-view {
width: 100%;
}
.box-spr-profile .b-left-pf {
width: 100%;
padding: 40px;
}
.box-spr-profile .b-right-pf {
width: 100%;
padding: 40px;
}
}
/* ================= edit profile ================= */
/* */
/* ============= */
/* @media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ================= new details 04-09-2023 ================= */
/* ==== name details ==== */
.box-name-dt {
position: relative;
width: 100%;
height: auto;
}
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ==== shoet details ==== */
.box-shoet-dt {
position: relative;
width: 100%;
height: auto;
}
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ==== title details ==== */
.box-title-dt {
position: relative;
width: 100%;
height: auto;
}
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ==== data details ==== */
.box-data-details {
position: relative;
width: 100%;
height: auto;
}
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ==== set sub topic ==== */
.box-set-sub-topic {
position: relative;
width: 100%;
height: auto;
padding: 0 0 0 10px;
}
.box-set-sub-topic .b-title {
position: relative;
width: 100%;
height: auto;
margin: 10px 0 0 0;
}
.box-set-sub-topic .b-title p {
font-size: 1rem;
font-weight: bold;
}
.box-set-sub-topic .b-stp {
position: relative;
width: 100%;
height: auto;
}
.box-set-sub-topic .b-stp p {
font-size: 0.94rem;
text-indent: 22px;
padding: 0 0 3px 15px;
}
.box-set-sub-topic .b-stp .sub--topic {
text-decoration: underline;
text-indent: 10px;
padding: 5px 0 3px 5px;
}
.box-set-sub-topic .b-stp p .txt-bold {
font-weight: bold;
}
.box-set-sub-topic .b-stp2 {
position: relative;
width: 100%;
height: auto;
margin-bottom: 8px;
}
.box-set-sub-topic .b-stp2:last-child {
margin-bottom: 0;
}
.box-set-sub-topic .b-stp2 p {
font-size: 0.94rem;
text-indent: 22px;
padding: 0 0 3px 15px;
}
.box-set-sub-topic .b-stp2 p .icon-clause {
text-indent: 0;
padding-right: 5px;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-set-sub-topic {
padding: 0;
}
.box-set-sub-topic .b-stp2 p {
font-size: 0.88rem;
padding-left: 10px;
}
.box-set-sub-topic .b-title p {
font-size: 0.94rem;
}
.box-set-sub-topic .b-stp .sub--topic {
padding-left: 0;
}
.box-set-sub-topic .b-stp p {
font-size: 0.88rem;
padding-left: 10px;
}
}
/* ==== set tab accordion ==== */
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ==== accordion ==== */
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
.b-modal-btn-test {
position: relative;
width: auto;
height: auto;
border: 1px solid var(--color-grey6);
margin: 20px;
border-radius: 5px;
background-color: var(--color-light);
display: inline-block;
padding: 5px 12px 5px 12px;
cursor: pointer;
}
.b-modal-btn-test p {
font-size: 1.2rem;
color: var(--color-txtg5);
}
/* ================= modal ================= */
.box-modal-bg {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--color-dark-rgb), 0.5);
transform: scale(1.1);
transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;
z-index: 999;
opacity: 0;
visibility: hidden;
display: none;
}
.modal-box-content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
max-width: 80%;
max-height: 80%;
border-radius: 5px;
}
.b-close-modal {
position: absolute;
width: auto;
height: auto;
top: -0.7rem;
right: -0.7rem;
z-index: 1;
}
.b-close-modal .btn-close-md {
position: relative;
width: 2.2rem;
height: 2.2rem;
cursor: pointer;
border: 2px solid var(--color-red);
border-radius: 100%;
background-color: var(--color-light);
display: flex;
}
.b-close-modal .btn-close-md i {
font-size: 1.5rem;
color: var(--color-red);
margin: auto;
}
.b-close-modal .btn-close-md:hover {
background-color: var(--color-red);
transition: all 0.3s ease;
}
.b-close-modal .btn-close-md:hover i {
color: var(--color-light);
transition: all 0.3s ease;
}
.b-img-modal {
position: relative;
width: auto;
height: auto;
/* height: 80vh; */
max-height: 80vh;
max-width: 80vw;
}
.b-img-modal figure {
position: relative;
width: max-content;
/* height: inherit; */
height: fit-content;
max-height: 80vh;
max-width: 80vw;
overflow: hidden;
border-radius: 5px;
-webkit-box-shadow: 0px 0px 10px 1px rgba(var(--color-dark-rgb), 0.2);
-moz-box-shadow: 0px 0px 10px 1px rgba(var(--color-dark-rgb), 0.2);
box-shadow: 0px 0px 10px 1px rgba(var(--color-dark-rgb), 0.2);
}
.b-img-modal figure .size-img {
position: relative;
width: 100%;
height: auto;
max-height: inherit;
/* max-height: -webkit-fill-available; */
object-fit: scale-down;
border-radius: 5px;
}
.b-show-modal {
display: block;
opacity: 1;
visibility: visible;
transform: scale(1.0);
transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;
}
.b-line-modal {
position: relative;
width: 40vw;
height: 80vh;
background-color: var(--color-light);
border-radius: 5px;
}
.b-dt-line-modal {
position: relative;
width: 100%;
height: calc(100% - 55px);
}
.b-dt-line-modal iframe {
position: relative;
width: 100%;
height: 100%;
}
.b-close-modal-ft {
position: relative;
width: 100%;
height: auto;
border-top: 1px solid var(--color-grey4);
display: flex;
padding: 10px;
}
.b-close-modal-ft .btn-close-md-ft {
position: relative;
width: auto;
height: auto;
border: 1px solid var(--color-grey5);
border-radius: 5px;
margin: 0 0 0 auto;
padding: 5px 10px 3px 10px;
cursor: pointer;
}
.b-close-modal-ft .btn-close-md-ft p {
font-size: 1rem;
color: var(--color-txtg5);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.b-line-modal {
width: 80vw;
height: 55vh;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.b-line-modal {
width: 80vw;
height: 60vh;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.b-line-modal {
width: 80vw;
height: 70vh;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.modal-box-content {
max-width: 90%;
}
.b-line-modal {
width: 90vw;
}
}
/* ================= Gallery ================= */
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ================= country menu ================= */
.sc--country-menu {
position: relative;
width: 100%;
height: auto;
padding: 0 0 10px 0;
background-color: var(--color-light);
}
.sc--country-menu .box-country {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 5px 0;
}
.sc--country-menu .box-country .b-title-zone {
position: relative;
width: 100%;
height: auto;
padding: 5px 0;
margin: 5px 0;
border-bottom: 1px solid var(--color-grey3);
}
.sc--country-menu .box-country .b-title-zone p {
font-size: 1rem;
text-align: center;
font-weight: bold;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sc--country-menu .box-country .btn-country {
position: relative;
width: 50%;
height: auto;
cursor: pointer;
}
.sc--country-menu .box-country .btn-country a {
position: relative;
width: 100%;
height: 100%;
cursor: pointer;
padding: 0;
}
.sc--country-menu .box-country .btn-country .b-spr-ctmn {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
align-items: center;
padding: 5px;
}
.sc--country-menu .box-country .btn-country .b-spr-ctmn .img-ct {
position: relative;
width: 2.2rem;
height: 100%;
}
.sc--country-menu .box-country .btn-country .b-spr-ctmn .img-ct figure {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.sc--country-menu .box-country .btn-country .b-spr-ctmn .img-ct figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: scale-down;
}
.sc--country-menu .box-country .btn-country .b-spr-ctmn .name-ct {
position: relative;
width: calc(100% - 2.2rem);
height: 100%;
padding: 0 5px;
}
.sc--country-menu .box-country .btn-country .b-spr-ctmn .name-ct p {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-size: 0.88rem;
text-align: left;
/* position: relative;
top: 50%;
transform: translateY(-50%); */
}
.sc--country-menu .box-country .btn-country:hover .b-spr-ctmn .name-ct p {
color: var(--color-first);
transition: all 0.3s ease;
}
/* ============= */
@media (min-width: 1200px) {
.sc--country-menu .box-country .btn-country {
position: relative;
width: calc(100%/4);
height: auto;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.sc--country-menu .box-country .btn-country {
position: relative;
width: calc(100%/4);
height: auto;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc--country-menu .box-country .btn-country {
position: relative;
width: calc(100%/3);
height: auto;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc--country-menu .box-country .btn-country {
position: relative;
width: calc(100%/3);
height: auto;
}
}
@media (min-width: 0px) and (max-width: 500px) {}
/* ================= not found ================= */
.sc-not-found {
position: relative;
width: 100%;
height: auto;
}
.box-not-found-full {
position: relative;
width: 100%;
height: 70vh;
background-color: var(--color-light);
display: flex;
}
.box-not-found-full .b-center {
margin: auto;
}
.box-not-found-full .b-center .b-img-not-found {
position: relative;
width: auto;
height: 17rem;
}
.box-not-found-full .b-center .b-img-not-found figure {
position: relative;
width: 100%;
height: 100%;
display: flex;
}
.box-not-found-full .b-center .b-img-not-found figure .size-img {
position: relative;
width: auto;
height: 100%;
margin: 0 auto;
}
.box-not-found-full .b-center .b-txt-not-found {
position: relative;
width: 100%;
height: auto;
padding: 20px 10px 10px 10px;
}
.box-not-found-full .b-center .b-txt-not-found p {
font-size: 1.25rem;
text-align: center;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.box-not-found-full .b-center .b-img-not-found {
height: 15rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.sc-not-found .container {
padding: 0;
}
.box-not-found-full .b-center .b-img-not-found {
height: 14rem;
}
.box-not-found-full .b-center .b-txt-not-found p {
font-size: 1.19rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.sc-not-found .container {
padding: 0;
}
.box-not-found-full .b-center .b-img-not-found {
height: 14rem;
}
.box-not-found-full .b-center .b-txt-not-found p {
font-size: 1.19rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.sc-not-found .container {
padding: 0;
}
.box-not-found-full .b-center .b-img-not-found {
height: 12rem;
}
.box-not-found-full .b-center .b-txt-not-found p {
font-size: 1.13rem;
}
}
/* ================= bg img full page ================= */
.bg-fhll-page-img {
position: absolute;
width: 100%;
height: 100%;
top: -20px;
left: 0;
background-image: url(/img/bgfullsize.png);
background-repeat: no-repeat;
background-size: 100% auto;
background-position: top;
opacity: 0.6;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {
.bg-fhll-page-img {
display: none;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.bg-fhll-page-img {
display: none;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.bg-fhll-page-img {
display: none;
}
}
/* ================= ================= */
.box--pgweb-set {
position: relative;
width: 100%;
height: auto;
padding: 0 10px 10px 10px;
margin: 0 0 10px 0;
border-bottom: 1px dashed var(--color-grey4);
}
/* .box--pgweb-set:first-child {
border-top: 1px dashed var(--color-grey4);
padding-top: 12px;
} */
.box--pgweb-set:last-child {
border-bottom: none;
}
.topic--pgweb-set {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
}
.topic--pgweb-set p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-first);
text-align: center;
}
.view--logo-ctmweb {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
padding-top: 5px;
}
.view--logo-ctmweb .list--vlgctmweb {
position: relative;
width: calc((100% / 8) - 4px);
height: auto;
margin: 0 2px 10px 2px;
border-radius: 5px;
border: 1px solid var(--color-grey4);
overflow: hidden;
}
.view--logo-ctmweb .list--vlgctmweb figure {
position: relative;
width: 100%;
height: auto;
}
.view--logo-ctmweb .list--vlgctmweb figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.view--logo-ctmweb .list--vlgctmweb .name-ctm {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 3px 10px;
background-color: var(--color-light);
}
.view--logo-ctmweb .list--vlgctmweb .name-ctm p {
font-size: 0.82rem;
color: var(--color-txtg5);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
/* ============= */
@media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {
.view--logo-ctmweb .list--vlgctmweb {
width: calc((100% / 6) - 4px);
}
}
@media (min-width: 0px) and (max-width: 500px) {
.box--pgweb-set {
padding: 0 16px 10px 16px;
}
.topic--pgweb-set {
padding-bottom: 5px;
}
.topic--pgweb-set p {
font-size: 1rem;
}
.view--logo-ctmweb .list--vlgctmweb {
width: calc((100% / 4) - 4px);
}
}
/* ================= ================= */
/* ============= */
/* @media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ================= ================= */
/* ============= */
/* @media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
.bg--period-notbalance-red {
background-color: var(--color-red2);
}
/* ================= ================= */
.pagenuber--break {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
margin: 16px auto 5px auto;
}
.pagenuber--break button {
font-size: 1rem;
padding: 4px 10px;
margin-bottom: 12px;
background-color: var(--color-light);
border: 1px solid var(--color-first);
cursor: pointer;
color: var(--color-first);
}
.pagenuber--break button:hover {
background-color: var(--color-second);
color: var(--color-first);
transition: all 0.3s ease;
}
.pagenuber--break button:first-child {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.pagenuber--break button:last-child {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
.pagenuber--break button:disabled {
background-color: var(--color-grey4);
color: var(--color-txtg2);
cursor: default;
}
.pagenuber--break button.active {
background-color: var(--color-first);
color: var(--color-light);
}
/* ============= */
/* @media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/* ================= ================= */
.VIpgJd-ZVi9od-ORHb-OEVmcd {
top: auto !important;
bottom: 0 !important;
}
body {
top: 0 !important;
}
/* ============= */
/* @media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
/*-------------------------เพิ่มเอง 13092566------------------------------------------*/
/* 2.2.7. Pagination */
.pagination {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
-ms-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.pagination>li {
float: left;
height: auto;
margin-right: 6px;
text-align: center;
font-size: 1em;
margin-bottom: 8px;
}
.pagination>li.disabled>span {
color: var(--color-light);
background: var(--color-grey4);
}
.pagination>li.disabled>span:hover {
background: var(--color-grey4);
}
.pagination>li>a,
.pagination>li>span {
line-height: 40px;
padding: 6px 20px;
color: var(--color-light);
/*border-radius: 0 !important;*/
background: var(--color-grey4);
/*border: none;*/
border-radius: 5px;
text-transform: uppercase;
font-weight: bold;
}
.pagination>li>a:hover,
.pagination>li>a:focus,
.pagination>li>span:hover,
.pagination>li>span:focus {
color: var(--color-light);
background: var(--color-first);
}
.pagination>li.active>a,
.pagination>li.active>span {
background: var(--color-first) !important;
}
.pagination>li.first,
.pagination>li.prev {
margin-right: 10px;
}
.pagination>li.next,
.pagination>li.last {
margin-left: 4px;
}
.pagination>li.first>a,
.pagination>li.prev>a,
.pagination>li.next>a,
.pagination>li.last>a {
background: var(--color-first);
padding: 6px 15px;
}
.pagination>li.first>a:hover,
.pagination>li.prev>a:hover,
.pagination>li.next>a:hover,
.pagination>li.last>a:hover {
background: var(--color-first);
}
.pagination>li.first.disabled>a,
.pagination>li.first.disabled>span,
.pagination>li.prev.disabled>a,
.pagination>li.prev.disabled>span,
.pagination>li.next.disabled>a,
.pagination>li.next.disabled>span,
.pagination>li.last.disabled>a,
.pagination>li.last.disabled>span {
color: var(--color-light);
background: var(--color-grey4);
}
.viewpagination {
position: relative;
width: 100%;
/* height: 3.5rem; */
height: auto;
}
.viewlist {
font-size: 0.94rem;
color: var(--color-txtg5);
padding-left: 1.5rem;
/* padding-left: 3rem; */
}
.viewlist li {
list-style-type: disc !important;
}
/*-------------------------------------------------*/
.bg-danger {
background-color: var(--color-red);
}
.bg-warning {
background-color: var(--color-icon-yl);
}
.bg-success {
background-color: var(--color-green);
}
/* ============= */
@media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {
.pg-order-smb1 {
order: 2;
}
.pg-order-smb2 {
order: 1;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.pg-order-smb1 {
order: 2;
}
.pg-order-smb2 {
order: 1;
}
}
.txt--ws-- {
color: var(--color-first) !important;
font-weight: 500;
text-decoration: underline;
}
/* ============ edit ============ */
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r {
width: calc(100% - 242px);
}
@media (min-width: 0px) and (max-width: 500px) {
.content--pg-modal-bkl .dt--list-pg .list--pg .img--pg-l {
width: 100px;
padding: 10px;
}
.content--pg-modal-bkl .dt--list-pg .list--pg .input--pg-r {
width: calc(100% - 210px);
padding: 10px;
}
}
.b--file-ul {
padding-bottom: 10px;
}
/* ======================== */
.box--editdelete-pssp {
position: relative;
width: 110px;
height: auto;
padding: 10px 10px 10px 0;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: column;
}
.box--editdelete-pssp button {
position: relative;
width: auto;
height: auto;
font-size: 0.75rem;
padding: 5px 12px;
border-radius: 5px;
margin-bottom: 12px;
cursor: pointer;
}
.box--editdelete-pssp button:last-child {
margin-bottom: 0;
}
.box--editdelete-pssp button i {
padding-right: 3px;
}
.color-ed-pssp {
background-color: var(--color-green);
border: 1px solid var(--color-green);
color: var(--color-light);
}
.color-ed-pssp i {
color: var(--color-light);
}
.color-dl-pssp {
background-color: var(--color-red);
border: 1px solid var(--color-red);
color: var(--color-light);
}
.color-dl-pssp i {
color: var(--color-light);
}
.color-ed-pssp:hover {
background-color: var(--color-light);
color: var(--color-green);
transition: all 0.3s ease;
}
.color-ed-pssp:hover i {
color: var(--color-green);
transition: all 0.3s ease;
}
.color-dl-pssp:hover {
background-color: var(--color-light);
color: var(--color-red);
transition: all 0.3s ease;
}
.color-dl-pssp:hover i {
color: var(--color-red);
transition: all 0.3s ease;
}
/* ======================== */
.box--type-passport {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
border-top: 1px solid var(--color-grey4);
padding: 6px 16px;
}
.box--type-passport .title-- {
position: relative;
width: auto;
height: auto;
padding-right: 10px;
}
.box--type-passport .title-- p {
font-size: 0.88rem;
color: var(--color-txtg);
font-weight: 600;
}
.box--type-passport .brdo--passp-- {
position: relative;
width: auto;
height: auto;
display: flex;
align-items: center;
padding: 0 16px 0 5px;
}
.box--type-passport .brdo--passp-- input {
font-size: 1rem;
color: var(--color-first);
accent-color: var(--color-first);
cursor: pointer;
}
.box--type-passport .brdo--passp-- label {
position: relative;
font-size: 0.94rem;
padding: 0 0 0 5px;
cursor: pointer;
color: var(--color-txtg);
}
.btpassp2 {
border-top: none;
border-bottom: 1px solid var(--color-grey4);
margin-top: 12px;
}
.box--copyright {
margin: 0;
padding: 16px 0 6px 0;
border-top: none;
}
/* count number */
.box-count-number-show {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
margin-top: 18px;
/* margin-bottom: 18px; */
}
.box-count-number-show .lines-hrzt {
position: relative;
width: 100%;
border-top: 1px solid var(--color-grey3);
}
.box-count-number-show .count-number {
position: relative;
height: auto;
width: inherit;
min-width: 9rem;
max-width: 12rem;
border: 1px solid var(--color-grey3);
border-radius: 5px;
margin-left: 8px;
margin-right: 8px;
padding-left: 20px;
padding-right: 20px;
padding-top: 5px;
padding-bottom: 3px;
}
.box-count-number-show .count-number p {
padding: 0;
margin: 0;
font-weight: normal;
font-size: 0.88rem;
color: var(--color-light);
text-align: center;
}
.box-count-number-show .count-number p .s-ic {
padding-right: 5px;
color: var(--color-light);
}
.box-count-number-show .count-number p .s-ic i {
color: var(--color-light);
}
.box-count-number-show .count-number p .txt-number-count {
font-size: 1rem;
font-weight: bold;
color: var(--color-light);
}
/* ------- Powered by ------- */
.box--powered-by {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
overflow: hidden;
align-items: center;
padding: 6px 12px 16px 12px;
}
.box--powered-by p {
font-size: 0.6rem;
color: var(--color-light);
padding-right: 3px;
}
.box--powered-by a {
position: relative;
width: auto;
height: 1rem;
cursor: pointer;
}
.box--powered-by a .simg-logopwb {
position: relative;
width: auto;
height: 1rem;
}
/* ================================================ */
/* ================== 2024-07-10 ================== */
/* ================= booking list ================= */
.bimg--nl {
position: relative;
width: 140px;
height: auto;
padding: 12px;
}
.nb--img-lpp {
position: relative;
width: 100%;
height: auto;
display: flex;
}
.nb--img-lpp figure {
position: relative;
width: 100%;
height: 120px;
margin: auto 0;
}
.nb--img-lpp figure .size-imglpp {
position: relative;
width: 100%;
height: 100%;
margin-left: auto;
margin-right: auto;
border-radius: 5px;
object-fit: cover;
cursor: pointer;
}
.btype--pp {
position: relative;
width: 100%;
height: auto;
padding-top: 10px;
}
.btype--pp .title {
position: relative;
width: auto;
height: auto;
}
.btype--pp .title p {
font-size: 0.88rem;
color: var(--color-txtg);
font-weight: 600;
}
.btype--pp .rdo--typp- {
position: relative;
width: auto;
height: auto;
display: flex;
padding-left: 10px;
}
.btype--pp .rdo--typp- input {
font-size: 0.88rem;
color: var(--color-first);
accent-color: var(--color-first);
cursor: pointer;
}
.btype--pp .rdo--typp- label {
position: relative;
font-size: 0.88rem;
padding: 0 0 0 5px;
cursor: pointer;
color: var(--color-txtg);
}
.binput--nl {
position: relative;
width: calc(100% - 255px);
height: fit-content;
padding: 6px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.bl--inp-pp {
position: relative;
height: fit-content;
padding: 10px 10px 2px 10px;
}
.bl--inp-pp .title {
padding-left: 6px;
}
.bl--inp-pp .title p {
font-size: 0.75rem;
color: var(--color-txtg5);
}
.bl--inp-pp .title p span {
color: var(--color-first);
}
.bl--inp-pp .blines-inp {
position: relative;
width: 100%;
height: auto;
padding: 3px 12px 5px 12px;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
}
.bl--inp-pp .blines-inp input,
.bl--inp-pp .blines-inp textarea {
position: relative;
width: 100%;
height: auto;
font-size: 0.94rem;
color: var(--color-txtg);
cursor: default;
}
.sbinp-pp10 { width: 10%; }
.sbinp-pp15 { width: 15%; }
.sbinp-pp20 { width: 20%; }
.sbinp-pp25 { width: 25%; }
.sbinp-pp30 { width: 30%; }
.sbinp-pp35 { width: 35%; }
.sbinp-pp40 { width: 40%; }
.sbinp-pp45 { width: 45%; }
.sbinp-pp50 { width: 50%; }
.sbinp-pp55 { width: 55%; }
.sbinp-pp60 { width: 60%; }
.sbinp-pp65 { width: 65%; }
.sbinp-pp70 { width: 70%; }
.sbinp-pp75 { width: 75%; }
.sbinp-pp80 { width: 80%; }
.sbinp-pp85 { width: 85%; }
.sbinp-pp90 { width: 90%; }
.sbinp-pp95 { width: 95%; }
.sbinp-pp100 { width: 100%; }
.sbinp-ppor1 { width: 20%; }
.sbinp-ppor2 { width: 40%; }
.sbinp-ppor3 { width: 40%; }
.sbinp-ppor4 { width: 25%; }
.sbinp-ppor5 { width: 25%; }
.sbinp-ppor6 { width: 25%; }
.sbinp-ppor7 { width: 25%; }
.sbinp-ppor8 { width: 100%; }
.bbtn--nl {
position: relative;
width: 115px;
height: auto;
padding: 12px 12px 12px 0;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: column;
}
.-btn-box- {
position: relative;
width: auto;
height: auto;
font-size: 0.75rem;
padding: 5px 12px;
border-radius: 5px;
margin-bottom: 12px;
cursor: pointer;
}
.-btn-box- p {
font-size: 0.75rem;
}
.-btn-box- i {
padding-right: 3px;
}
.color-btn-box--sc {
background-color: var(--color-green);
border: 1px solid var(--color-green);
color: var(--color-light);
}
.color-btn-box--dl {
background-color: var(--color-red);
border: 1px solid var(--color-red);
color: var(--color-light);
}
.color-btn-box--wn {
background-color: var(--color-bg-yl);
border: 1px solid var(--color-bg-yl);
color: var(--color-light);
}
.color-btn-box--if {
background-color: var(--color-msg);
border: 1px solid var(--color-msg);
color: var(--color-light);
}
.color-btn-box--sc p,
.color-btn-box--dl p,
.color-btn-box--wn p,
.color-btn-box--if p,
.color-btn-box--sc i,
.color-btn-box--dl i,
.color-btn-box--wn i,
.color-btn-box--if i {
color: var(--color-light);
}
.color-btn-box--sc:hover {
background-color: var(--color-light);
color: var(--color-green);
transition: all 0.3s ease;
}
.color-btn-box--dl:hover {
background-color: var(--color-light);
color: var(--color-red);
transition: all 0.3s ease;
}
.color-btn-box--wn:hover {
background-color: var(--color-light);
color: var(--color-bg-yl);
transition: all 0.3s ease;
}
.color-btn-box--if:hover {
background-color: var(--color-light);
color: var(--color-msg);
transition: all 0.3s ease;
}
.color-btn-box--sc:hover p,
.color-btn-box--sc:hover i {
color: var(--color-green);
transition: all 0.3s ease;
}
.color-btn-box--dl:hover p,
.color-btn-box--dl:hover i {
color: var(--color-red);
transition: all 0.3s ease;
}
.color-btn-box--wn:hover p,
.color-btn-box--wn:hover i {
color: var(--color-bg-yl);
transition: all 0.3s ease;
}
.color-btn-box--if:hover p,
.color-btn-box--if:hover i {
color: var(--color-msg);
transition: all 0.3s ease;
}
::placeholder {
font-size: 0.75rem;
font-weight: 300;
color: var(--color-txtg1);
}
::-ms-input-placeholder {
font-size: 0.75rem;
font-weight: 300;
color: var(--color-txtg1);
}
.pdt--12 {
padding-bottom: 12px;
}
.pdb--12 {
padding-bottom: 12px;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {
.sbinp-ppor1 {
order: 1;
}
.sbinp-ppor2 {
order: 2;
}
.sbinp-ppor3 {
order: 3;
}
.sbinp-ppor4 {
order: 4;
width: 70%;
}
.sbinp-ppor5 {
order: 6;
width: 50%;
}
.sbinp-ppor6 {
order: 7;
width: 50%;
}
.sbinp-ppor7 {
order: 5;
width: 30%;
}
.sbinp-ppor8 {
order: 8;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.bimg--nl {
width: 100%;
padding-bottom: 0;
}
.binput--nl {
width: 100%;
padding-top: 0;
}
.bbtn--nl {
width: 100%;
padding: 12px;
flex-direction: row;
}
.btype--pp {
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding-top: 12px;
padding-left: 10px;
}
.-btn-box- {
margin: 0 12px 0 12px;
}
.sbinp-ppor1 {
order: 1;
width: 50%;
}
.sbinp-ppor2 {
order: 3;
width: 50%;
}
.sbinp-ppor3 {
order: 4;
width: 50%;
}
.sbinp-ppor4 {
order: 5;
width: 100%;
}
.sbinp-ppor5 {
order: 6;
width: 50%;
}
.sbinp-ppor6 {
order: 7;
width: 50%;
}
.sbinp-ppor7 {
order: 2;
width: 50%;
}
.sbinp-ppor8 {
order: 8;
}
}
/* ======================================== */
/* ======================================== */
.bul--pp {
position: relative;
width: 130px;
height: auto;
padding-right: 6px;
padding-top: 20px;
}
.bul-img-pp {
position: relative;
width: 100%;
height: auto;
display: flex;
}
.bul-img-pp figure {
position: relative;
width: 100%;
height: 140px;
margin: auto 0;
}
.bul-img-pp figure .size-imgulpp {
position: relative;
width: 100%;
height: 100%;
margin-left: auto;
margin-right: auto;
border-radius: 5px;
object-fit: cover;
}
.btype-ul-pp {
position: relative;
width: 100%;
height: auto;
padding-top: 16px;
}
.btype-ul-pp .title {
position: relative;
width: auto;
height: auto;
}
.btype-ul-pp .title p {
font-size: 0.88rem;
color: var(--color-txtg);
font-weight: 600;
}
.btype-ul-pp .rdo--typp- {
position: relative;
width: auto;
height: auto;
display: flex;
padding-left: 10px;
}
.btype-ul-pp .rdo--typp- input {
font-size: 0.88rem;
color: var(--color-first);
accent-color: var(--color-first);
cursor: pointer;
}
.btype-ul-pp .rdo--typp- label {
position: relative;
font-size: 0.88rem;
padding: 0 0 0 5px;
cursor: pointer;
color: var(--color-txtg);
}
.bul--input-pp {
position: relative;
width: calc(100% - 136px);
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.bul--inp-pp {
position: relative;
height: fit-content;
padding: 10px 10px 2px 10px;
}
.bul--inp-pp .title {
padding-left: 6px;
}
.bul--inp-pp .title p {
font-size: 0.75rem;
color: var(--color-txtg5);
}
.bul--inp-pp .title p span {
color: var(--color-first);
}
.bul--inp-pp .blines-inp {
position: relative;
width: 100%;
height: auto;
padding: 3px 12px 5px 12px;
border: 1px solid var(--color-grey4);
border-radius: 5px;
overflow: hidden;
}
.bul--inp-pp .blines-inp input ,
.bul--inp-pp .blines-inp textarea {
position: relative;
width: 100%;
height: auto;
font-size: 0.94rem;
color: var(--color-txtg);
cursor: default;
}
.b--file-ul {
overflow-y: scroll;
}
.sbulinp-ppor1 { width: 20%; }
.sbulinp-ppor2 { width: 40%; }
.sbulinp-ppor3 { width: 40%; }
.sbulinp-ppor4 { width: 20%; }
.sbulinp-ppor5 { width: 40%; }
.sbulinp-ppor6 { width: 40%; }
.sbulinp-ppor7 { width: 40%; }
.sbulinp-ppor8 { width: 30%; }
.sbulinp-ppor9 { width: 30%; }
.sbulinp-ppor10 { width: 40%; }
.sbulinp-ppor11 { width: 30%; }
.sbulinp-ppor12 { width: 30%; }
.sbulinp-ppor13 { width: 100%; }
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.bul--pp {
width: 100%;
padding: 0;
}
.btype-ul-pp {
display: flex;
flex-wrap: wrap;
flex-direction: row;
padding-left: 12px;
}
.bul--input-pp {
width: 100%;
}
.sbulinp-ppor1 {
order: 2;
width: 30%;
}
.sbulinp-ppor2 {
order: 4;
width: 50%;
}
.sbulinp-ppor3 {
order: 5;
width: 50%;
}
.sbulinp-ppor4 {
order: 1;
width: 30%;
}
.sbulinp-ppor5 {
order: 6;
width: 50%;
}
.sbulinp-ppor6 {
order: 7;
width: 50%;
}
.sbulinp-ppor7 {
order: 8;
width: 100%;
}
.sbulinp-ppor8 {
order: 9;
width: 50%;
}
.sbulinp-ppor9 {
order: 10;
width: 50%;
}
.sbulinp-ppor10 {
order: 11;
width: 50%;
}
.sbulinp-ppor11 {
order: 12;
width: 50%;
}
.sbulinp-ppor12 {
order: 3;
width: 40%;
}
.sbulinp-ppor13 {
order: 13;
}
}
.hd-title{
font-size: 1.32rem;
font-weight: bold;
color: var(--color-first);
text-align: center;
padding-bottom : 0.97rem;
}
/* =================== list program tour =================== */
/* =================== 2024-07-17 =================== */
.b-tvp-acd-list {
position: relative;
width: 100%;
height: auto;
padding: 4px 0 10px 0;
}
.baccordiontvp {
position: relative;
width: 100%;
height: auto;
background-color: rgba(var(--color-second-rgb), 0.5);
border: 1px solid var(--color-first);
cursor: pointer;
border-radius: 5px;
padding: 3px 12px;
transition: 0.4s;
font-size: 0.88rem;
color: var(--color-txtg);
font-weight: 600;
text-align: left;
}
.baccordiontvp::before {
content: '\002B';
color: var(--color-txtg4);
font-weight: 600;
float: right;
margin-left: 6px;
width: 12px;
text-align: right;
}
.baccordiontvp span {
font-weight: normal;
}
.baccordiontvp.active {
border-radius: 5px 5px 0 0;
}
.baccordiontvp.active, .baccordiontvp:hover {
background-color: var(--color-first);
color: var(--color-light);
transition: all 0.3s ease;
}
.baccordiontvp.active span,
.baccordiontvp:hover span, .baccordiontvp:hover::before {
color: var(--color-light);
transition: all 0.3s ease;
}
.baccordiontvp.active::before {
content: "\2212";
color: var(--color-light);
}
.bpanelt {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-light);
overflow: hidden;
transition: max-height 0.2s ease-out;
/* max-height: 0; */
/* max-height: max-content; */
cursor: default;
border-radius: 0 0 5px 5px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.blinesprtv {
border: 1px solid var(--color-first);
}
.bmaxh-accpra {
max-height: max-content;
}
.bmaxh-accpr0 {
max-height: 0;
}
.blist-tvp- {
position: relative;
height: auto;
padding: 2px 10px;
}
.blist-tvp- p {
font-size: 0.88rem;
color: var(--color-txtg5);
}
.blist-tvp- p i {
color: var(--color-icon-yl);
padding-right: 3px;
}
.stvp-w {
width: calc(100%/3);
}
/* ============= */
@media (min-width: 1200px) {
/* .baccordiontvp span {
float: right;
} */
.blist-tvp-:nth-child(6n+4),
.blist-tvp-:nth-child(6n+5),
.blist-tvp-:nth-child(6n+6) {
background-color: rgba(var(--color-second-rgb), 0.5);
}
}
@media (min-width: 992px) and (max-width: 1199px) {
/* .baccordiontvp span {
float: right;
} */
.blist-tvp-:nth-child(6n+4),
.blist-tvp-:nth-child(6n+5),
.blist-tvp-:nth-child(6n+6) {
background-color: rgba(var(--color-second-rgb), 0.5);
}
}
@media (min-width: 791px) and (max-width: 991px) {
/* .baccordiontvp span {
float: right;
} */
.stvp-w {
width: calc(100%/2);
}
.blist-tvp-:nth-child(4n+3),
.blist-tvp-:nth-child(4n+4) {
background-color: rgba(var(--color-second-rgb), 0.5);
}
}
@media (min-width: 501px) and (max-width: 790px) {
.stvp-w {
width: calc(100%/2);
}
.blist-tvp- p {
font-size: 0.81rem;
}
.blist-tvp-:nth-child(4n+3),
.blist-tvp-:nth-child(4n+4) {
background-color: rgba(var(--color-second-rgb), 0.5);
}
.b-tvp-acd-list {
padding-bottom: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.stvp-w {
width: calc(100%/2);
}
.blist-tvp- p {
font-size: 0.75rem;
}
.blist-tvp-:nth-child(4n+3),
.blist-tvp-:nth-child(4n+4) {
background-color: rgba(var(--color-second-rgb), 0.5);
}
.b-tvp-acd-list {
padding-bottom: 0;
}
}
/* =================== 2024-07-17 =================== */
.dpn-b- {
display: none;
}
.bpdb-10 {
padding-bottom: 10px !important;
}
.bpdb-16 {
padding-bottom: 16px !important;
}
.alit-end {
align-items: end;
}
.cltxtg4 { color: var(--color-txtg4); }
.cltxtg5 { color: var(--color-txtg5); }
.bdt-vlistf {
position: relative;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 2px 0;
}
.bdt-vlistf figure {
width: 100%;
height: 3.5rem;
display: flex;
}
.bdt-vlistf figure .size-img {
position: relative;
width: auto;
height: 100%;
}
.sn1b {
width: 100%;
}
.ssh1b {
width: 100%;
}
.s1b {
width: 30%;
padding-bottom: 6px;
}
.s2b {
width: 40%;
padding-bottom: 16px;
}
.s3b {
width: 30%;
padding-bottom: 6px;
}
.blsit-vdt {
position: relative;
height: auto;
padding: 5px 10px;
}
.blsit-vdt p {
font-size: 0.88rem;
font-weight: normal;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
/*-webkit-line-clamp: 2;*/
-webkit-line-clamp: 3;
}
.blsit-vdt p i {
color: var(--color-icon-yl);
padding-right: 3px;
}
.blsit-vdt p span {
color: var(--color-first);
font-weight: bold;
text-decoration: underline;
}
.sdv1 {
width: 33%;
/* width: calc(100%/3); */
}
.sdv2 {
width: 25%;
/* width: calc(100%/3); */
}
.sdv3 {
width: 42%;
/* width: calc(100%/3); */
}
.sdv100 {
width: 100%;
}
.btn-viewdtpg {
position: relative;
width: auto;
height: fit-content;
cursor: pointer;
background-color: var(--color-first);
border: 1px solid var(--color-first);
border-radius: 5px;
margin-left: auto;
margin-top: auto;
margin-bottom: auto;
}
.btn-viewdtpg a {
position: relative;
width: auto;
height: auto;
padding: 3px 16px;
}
.btn-viewdtpg p {
font-size: 0.88rem;
color: var(--color-light);
}
.btn-viewdtpg:hover {
background-color: var(--color-light);
transition: all 0.3s ease;
}
.btn-viewdtpg:hover p {
color: var(--color-fifth);
transition: all 0.3s ease;
}
.bfullp-pgl {
position: relative;
width: 33%;
height: fit-content;
padding-right: 5px;
}
.bfullp-pgl p {
font-size: 0.75rem;
color: var(--color-txtg4);
text-align: right;
text-decoration: line-through;
}
.bnetp-pgl {
position: relative;
width: 67%;
height: auto;
padding-left: 5px;
}
.bnetp-pgl p {
font-size: 0.75rem;
color: var(--color-txtg4);
margin-bottom: -5px;
}
.bnetp-pgl .price-n {
font-size: 1.44rem;
font-weight: bold;
color: var(--color-red);
}
.bnetp-pgl .txtcrn {
font-size: 0.75rem;
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg {
height: fit-content;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg {
height: fit-content;
}
.b-tvp-acd-list {
padding: 10px 0;
}
.s1b {
width: 40%;
padding: 0 12px 0 12px;
}
.s2b {
width: 60%;
padding: 0 12px 0 12px;
}
.s3b {
width: 100%;
padding: 10px 12px 6px 12px;
}
.btn-viewdtpg {
margin-left: auto;
margin-right: auto;
}
.btn-viewdtpg p {
width: 100%;
text-align: center;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.b-tvp-acd-list {
padding: 10px 0;
}
.s1b {
width: 50%;
padding: 0 12px 0 12px;
}
.s2b {
width: 50%;
padding: 0 12px 0 12px;
}
.s3b {
width: 100%;
padding: 10px 12px 6px 12px;
}
.btn-viewdtpg {
margin-left: auto;
margin-right: auto;
}
.btn-viewdtpg p {
width: 100%;
text-align: center;
}
}
/* =================== =================== */
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
.title-bksmb-pl {
font-size: 0.94rem;
font-weight: 600;
color: var(--color-fifth);
text-decoration: underline;
}
.title-bksmb-pl i {
color: var(--color-fifth);
}
/* ========================================================== */
/* ================= Our Partner 30-08-2024 ================= */
.tt-ourpn-sch {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
padding: 20px 0 16px 0;
}
.ttl-ourpn {
position: relative;
width: 50%;
height: auto;
}
.ttl-ourpn p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-txtg);
}
.ttl-ourpn p span {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
}
.ttr-sch {
position: relative;
width: 50%;
height: auto;
}
.ttr-sch .box-search-ourpn {
position: relative;
width: calc(50% + 60px);
height: auto;
display: flex;
justify-content: stretch;
margin-right: 0;
margin-left: auto;
}
.ttr-sch .box-search-ourpn input {
position: relative;
width: calc(100% - 60px);
height: auto;
font-size: 0.75rem;
padding: 5px 16px;
border: 1px solid var(--color-grey5);
border-radius: 5px 0 0 5px;
}
.ttr-sch .box-search-ourpn button {
position: relative;
width: 60px;
height: auto;
padding: 5px 16px;
font-size: 0.75rem;
background-color: var(--color-first);
color: var(--color-light);
border-radius: 0 5px 5px 0;
}
.box-our-partner-ls {
position: relative;
width: 100%;
height: auto;
}
.b-menu-pv {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 5px;
}
.btn-mnpv {
position: relative;
width: auto;
height: auto;
background-color: var(--color-first);
border: 1px solid var(--color-first);
border-radius: 50px;
overflow: hidden;
margin: 6px;
display: flex;
}
.btn-mnpv a {
position: relative;
width: auto;
height: auto;
padding: 6px 16px;
cursor: pointer;
}
.btn-mnpv p {
font-size: 0.88rem;
color: var(--color-light);
}
.btn-mnpv:hover {
background-color: var(--color-light);
transition: all 0.3s ease;
}
.btn-mnpv:hover p {
color: var(--color-first);
transition: all 0.3s ease;
}
.b-list-ourpn {
position: relative;
width: 100%;
height: auto;
padding: 12px 0;
border-bottom: 1px dashed var(--color-grey4);
}
.title-province-ourpn {
position: relative;
width: 100%;
height: auto;
padding: 0 0 12px 0;
}
.title-province-ourpn p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-first);
}
.list-our-partner {
position: relative;
width: 90%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
margin: 0 auto;
}
.dt-ourpn-ls {
position: relative;
width: calc((100%/5) - 12px);
height: auto;
border: 1px solid var(--color-grey4);
border-radius: 5px;
background-color: var(--color-light);
margin: 6px;
padding: 6px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.08);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.08);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.08);
}
.dt-ourpn-ls .bimg-pn {
position: relative;
width: 100%;
height: 7rem;
display: flex;
margin-bottom: 3px;
}
.dt-ourpn-ls .bimg-pn figure {
position: relative;
width: auto;
height: auto;
max-height: 7rem;
display: flex;
overflow: hidden;
margin: auto;
}
.dt-ourpn-ls .bimg-pn figure .size-imglg {
position: relative;
width: 100%;
height: auto;
object-fit: scale-down;
margin: 0 auto;
}
.dt-ourpn-ls .bname-ourpn {
position: relative;
width: 100%;
height: auto;
padding: 2px 6px;
}
.dt-ourpn-ls .bname-ourpn p {
font-size: 0.88rem;
text-align: center;
color: var(--color-black5);
font-weight: 500;
}
.dt-ourpn-ls .btatno-ourpn,
.dt-ourpn-ls .btaxid-ourpn {
position: relative;
width: 100%;
height: auto;
padding: 2px 4px;
}
.dt-ourpn-ls .btatno-ourpn p,
.dt-ourpn-ls .btaxid-ourpn p {
font-size: 0.81rem;
text-align: center;
}
/* ============= */
/* @media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {} */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.ttr-sch .box-search-ourpn {
width: calc(60% + 60px);
}
.b-menu-pv {
margin-bottom: 0;
}
.list-our-partner {
width: 95%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.ttr-sch .box-search-ourpn {
width: calc(70% + 60px);
}
.b-menu-pv {
margin-bottom: 0;
}
.list-our-partner {
width: 95%;
}
.dt-ourpn-ls {
width: calc((100% / 4) - 12px);
}
}
@media (min-width: 501px) and (max-width: 790px) {
.ttr-sch .box-search-ourpn {
width: calc(70% + 60px);
}
.b-menu-pv {
margin-bottom: 0;
}
.list-our-partner {
width: 100%;
}
.dt-ourpn-ls {
width: calc((100% / 4) - 12px);
}
}
@media (min-width: 0px) and (max-width: 500px) {
.tt-ourpn-sch {
padding-top: 12px;
}
.ttl-ourpn, .ttr-sch {
width: 100%;
}
.ttl-ourpn p {
text-align: center;
}
.ttr-sch .box-search-ourpn {
width: 100%;
}
.ttl-ourpn {
padding-bottom: 6px;
}
.b-menu-pv {
margin-bottom: 0;
}
.btn-mnpv p {
font-size: 0.81rem;
}
.list-our-partner {
width: 100%;
}
.dt-ourpn-ls {
width: calc((100% / 2) - 12px);
}
}
/* =================== =================== */
.tpr-color {
color: transparent !important;
background-color: transparent !important;
}
.tpr-color i {
color: transparent !important;
background-color: transparent !important;
}
/* ============= */
@media (min-width: 791px) {
.fsize-txttd {
font-size: 0.81rem !important;
}
}
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {}
/* =========================================================== */
/* ==================== review 03-09-2024 ==================== */
.box-review-w {
position: relative;
width: 100%;
height: auto;
}
.tltle-pglist {
position: relative;
width: 100%;
height: auto;
padding: 16px 0 10px 10px;
}
.tltle-pglist p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-txtg);
}
.tltle-pglist p span {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
}
.lines-tt {
position: absolute;
width: 2rem;
height: 2px;
background-color: var(--color-red);
bottom: 10px;
left: 10px;
}
.dt-rvw-list {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 20px;
}
.dt-rvw-list .blist-spr {
position: relative;
width: calc((100%/5) - 7.2px);
height: auto;
border: 1px solid var(--color-grey6);
overflow: hidden;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
cursor: pointer;
margin: 0 9px 9px 0;
}
.dt-rvw-list .blist-spr:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.dt-rvw-list .blist-spr a {
position: relative;
width: 100%;
height: auto;
}
.dt-rvw-list .blist-spr .bimg {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
overflow: hidden;
}
.dt-rvw-list .blist-spr .bimg figure {
position: relative;
width: 100%;
height: 14.1rem;
overflow: hidden;
}
.dt-rvw-list .blist-spr .bimg figure .size-imgrvw {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.dt-rvw-list .blist-spr .bnamepg {
position: relative;
width: 100%;
height: 3.1rem;
padding: 0 10px 5px 10px;
}
.dt-rvw-list .blist-spr .bnamepg h2,
.dt-rvw-list .blist-spr .bnamepg p {
font-size: 0.94rem;
font-weight: bold;
color: var(--color-txtg);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.dt-rvw-list .blist-spr:hover .bnamepg h2,
.dt-rvw-list .blist-spr:hover .bnamepg p {
color: var(--color-first);
transition: all 0.3s ease;
}
.dt-rvw-list .blist-spr .bdtpg {
position: relative;
width: 100%;
height: auto;
padding: 0 10px 10px 10px;
}
.dt-rvw-list .blist-spr .bdtpg p {
font-size: 0.81rem;
color: var(--color-txtg4);
text-indent: 15px;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
/* hover image */
.dt-rvw-list .blist-spr .bimg figure .size-imgrvw {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.dt-rvw-list .blist-spr:hover .bimg figure .size-imgrvw {
-ms-transform: scale(1.1);
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
/* ============= */
/* @media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {} */
@media (min-width: 1200px) {
.dt-rvw-list .blist-spr:nth-child(5n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.dt-rvw-list .blist-spr:nth-child(5n+0) {
margin-right: 0;
}
.dt-rvw-list .blist-spr .bimg figure {
height: 11.5rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.dt-rvw-list .blist-spr {
width: calc((100%/4) - 6.75px);
}
.dt-rvw-list .blist-spr:nth-child(4n+0) {
margin-right: 0;
}
.dt-rvw-list .blist-spr .bimg figure {
height: 11.7rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.dt-rvw-list .blist-spr {
width: calc((100%/4) - 6.75px);
}
.dt-rvw-list .blist-spr:nth-child(4n+0) {
margin-right: 0;
}
.dt-rvw-list .blist-spr .bimg figure {
height: 10.9rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.dt-rvw-list .blist-spr {
width: calc((100%/2) - 4.5px);
}
.dt-rvw-list .blist-spr:nth-child(2n+0) {
margin-right: 0;
}
.dt-rvw-list .blist-spr .bimg figure {
height: 12.1rem;
}
}
/* ========================================================== */
/* ================== review dt 03-09-2024 ================== */
.bg-page-view {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
margin: 20px 0;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.04);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.04);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.04);
padding: 16px;
}
.box-name-pgrvw {
position: relative;
width: 100%;
height: auto;
padding: 5px 0 10px 0;
}
.box-name-pgrvw p,
.box-name-pgrvw h1 {
font-size: 1.31rem;
font-weight: bold;
text-align: center;
color: var(--color-txtg);
}
.box-img-main-pgrvw {
position: relative;
width: 100%;
height: auto;
}
.box-img-main-pgrvw figure {
position: relative;
width: 100%;
height: auto;
}
.box-img-main-pgrvw figure .size-imgrvw {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
}
.box-content-pgrvw {
position: relative;
width: 100%;
height: auto;
padding: 10px 0;
}
.box-content-pgrvw p {
font-size: 0.94rem;
color: var(--color-txtg5);
text-indent: 25px;
}
.box-gallery-rvw {
position: relative;
width: 100%;
height: auto;
margin: 10px 0 5px 0;
padding-top: 20px;
border-top: 1px dashed var(--color-grey4);
}
.box-gallery-rvw .spr-img-gll {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box-gallery-rvw .spr-img-gll .b-list-img {
position: relative;
width: calc((100%/4) - 6.75px);
height: fit-content;
margin: 0 9px 9px 0;
border-radius: 5px;
border: 1px solid var(--color-grey4);
overflow: hidden;
cursor: pointer;
}
.box-gallery-rvw .spr-img-gll .b-list-img figure {
position: relative;
width: 100%;
height: 9.7rem;
overflow: hidden;
}
.box-gallery-rvw .spr-img-gll .b-list-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.box-gallery-rvw .spr-img-gll .b-list-img .b-name-img {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 3px 10px;
background-color: var(--color-light);
}
.box-gallery-rvw .spr-img-gll .b-list-img .b-name-img p {
font-size: 0.82rem;
color: var(--color-txtg5);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.box-video-rvw {
position: relative;
width: 100%;
height: auto;
margin: 10px 0 5px 0;
padding-top: 14px;
border-top: 1px dashed var(--color-grey4);
/* display: flex; */
/* justify-content: center;
flex-wrap: wrap;
flex-direction: row; */
overflow: hidden;
}
.box-video-rvw .bvideo-tt-yt {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
padding: 0 16px 20px 16px;
margin-bottom: 20px;
border-bottom: 1px dashed var(--color-grey4);
}
.box-video-rvw .bvideo-tt-yt:last-child {
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}
.box-video-rvw .bvideo-tt-yt .title-vdottyt {
position: relative;
width: 100%;
height: auto;
padding-bottom: 6px;
}
.box-video-rvw .bvideo-tt-yt .title-vdottyt p {
font-size: 1rem;
font-weight: bold;
color: var(--color-txtg);
text-align: center;
}
.box-video-rvw .bvideo-tt-yt .b-ifvdottyt {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
display: flex;
/* padding-bottom: 56.25%; */
}
.box-video-rvw .bvideo-tt-yt .b-ifvdottyt iframe {
width: 70%;
margin: 0 auto;
}
.tiktok-embed {
margin-top: 0 !important;
margin-bottom: 0 !important;
}
#hgallery button {
z-index: 600 !important;
}
/* ============= */
@media (min-width: 1200px) {
.box-gallery-rvw .spr-img-gll .b-list-img:nth-child(4n+0) {
margin-right: 0;
}
.box-video-rvw .bvideo-tt-yt .b-ifvdottyt iframe {
height: 436px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.box-gallery-rvw .spr-img-gll .b-list-img {
width: calc((100% / 3) - 6px);
}
.box-gallery-rvw .spr-img-gll .b-list-img:nth-child(3n+0) {
margin-right: 0;
}
.box-gallery-rvw .spr-img-gll .b-list-img figure {
height: 10.7rem;
}
.box-video-rvw .bvideo-tt-yt .b-ifvdottyt iframe {
height: 436px;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.box-gallery-rvw .spr-img-gll .b-list-img {
width: calc((100% / 3) - 6px);
}
.box-gallery-rvw .spr-img-gll .b-list-img:nth-child(3n+0) {
margin-right: 0;
}
.box-gallery-rvw .spr-img-gll .b-list-img figure {
height: 8.6rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box-gallery-rvw .spr-img-gll .b-list-img {
width: calc((100% / 3) - 6px);
}
.box-gallery-rvw .spr-img-gll .b-list-img:nth-child(3n+0) {
margin-right: 0;
}
.box-gallery-rvw .spr-img-gll .b-list-img figure {
height: 7.9rem;
}
.box-video-rvw .bvideo-tt-yt .b-ifvdottyt iframe {
width: 80%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.pgrvwdt .container {
padding: 0;
}
.bg-page-view {
margin: 0;
border-radius: 0;
}
.box-gallery-rvw {
padding-left: 16px;
padding-right: 16px;
}
.box-gallery-rvw .spr-img-gll .b-list-img {
width: 100%;
margin-right: 0;
}
.box-gallery-rvw .spr-img-gll .b-list-img figure {
height: auto;
}
.box-video-rvw .bvideo-tt-yt .b-ifvdottyt iframe {
width: 100%;
}
}
/* ================================================================= */
/* ================== about us Gallery 04-09-2024 ================== */
.b-gll-abus-view {
position: relative;
width: 100%;
height: auto;
margin: 20px 0;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
border: 1px solid var(--color-grey3);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.b-gll-abus-view .box-gallery-rvw {
border-top: none;
margin: 0;
padding: 16px 16px 7px 16px;
}
.b-title-all {
position: relative;
width: 100%;
height: auto;
padding-bottom: 12px;
}
.b-title-all p {
font-size: 1.38rem;
font-weight: bold;
color: var(--color-first);
text-indent: 0;
padding: 0;
}
.b-title-all p i {
color: var(--color-first);
}
.b-title-all p span {
color: var(--color-first);
}
.pd-title-all {
padding: 16px 16px 0 16px;
}
.lines-bt-ttl {
position: relative;
width: 5.3rem;
height: 2px;
border-radius: 100px;
background-color: var(--color-txtg4);
margin: -3px 0 0 0;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.b-title-all p {
font-size: 1.25rem;
}
}
/* =============================================================== */
/* ================= period and price 15-09-2024 ================= */
.box-period--pg {
position: relative;
width: 100%;
height: auto;
margin-bottom: 20px;
}
.box-title-prpg {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 5px;
}
.box-title-prpg p {
font-size: 1.07rem;
font-weight: bold;
}
.box-tb-period {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.tb-head-pr {
position: relative;
width: 100%;
height: auto;
max-height: 2.125rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 5px;
background-color: var(--color-first);
}
.td-hd {
position: relative;
height: auto;
margin: 5px 0;
}
.td-hd p {
font-size: 1rem;
color: var(--color-light);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.tb-dt-pr {
position: relative;
width: 100%;
height: auto;
}
.list-tb-prdt {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 5px;
}
.td-dt {
position: relative;
height: auto;
margin: 5px 0;
display: grid;
padding: 0 10px;
}
.title-name-smb {
display: none;
}
.title-name-smb p {
font-size: 0.94rem;
color: var(--color-txtg);
}
.dt-price-pg {
display: grid;
align-items: center;
}
.dt-price-pg p {
font-size: 0.94rem;
margin: auto 0;
text-align: center;
}
.dt-price-pg i {
font-size: 0.94rem;
margin: auto 0;
text-align: center;
color: var(--color-txtg);
}
.dt-price-pg .fullprice-pg {
font-size: 0.69rem;
text-align: center;
color: var(--color-txtg4);
text-decoration: line-through;
margin-bottom: -5px;
}
.dt-price-pg .totalprice-pg {
font-size: 0.94rem;
text-align: center;
color: var(--color-txtg);
}
.dt-price-pg .currency-pg {
display: none;
color: var(--color-txtg5);
font-size: 0.75rem;
padding: 0 2px;
}
.btxt-range-pr {
display: grid;
align-items: center;
}
.btxt-range-pr p {
font-size: 0.94rem;
color: var(--color-txtg);
}
.btxt-range-pr span {
padding-left: 2px;
}
.txt-prpg-tb {
font-size: 0.94rem;
color: var(--color-txtg);
}
.bicon-acd {
display: none;
}
.bicon-acd i {
font-size: 0.94rem;
color: var(--color-txtg);
text-align: right;
margin: 0 0 0 auto;
}
.icon-aracd-smb {
display: none;
font-size: 0.94rem;
color: var(--color-txtg);
text-align: right;
}
.lines-right-tbhd {
border-right: 1px solid var(--color-grey2);
}
.lines-right-tbhd:last-child {
border-right: none;
}
.lines-right-tbpr {
border-right: 1px solid var(--color-grey4);
}
.lines-right-tbdt {
border-right: 1px solid var(--color-grey4);
}
.lines-bottom-tdbt {
border-bottom: 1px dashed var(--color-grey3);
}
.lines-bottom-tdbt:last-child {
border-bottom: none;
}
.btn-bkavbl {
position: relative;
width: auto;
height: fit-content;
border-radius: 5px;
display: grid;
align-items: center;
margin: auto 0;
}
.btn-bkavbl p {
font-size: 0.94rem;
color: var(--color-light);
padding: 4px 5px;
text-align: center;
}
.btn-bkavbl a {
position: relative;
width: auto;
height: 100%;
color: var(--color-light);
cursor: pointer;
display: grid;
align-items: center;
}
.bg-btn-success {
background-color: var(--color-green);
}
.bg-btn-danger {
background-color: var(--color-red);
}
.bg-btn-warning {
background-color: var(--color-yellow);
}
.bg-btn-danger a {
cursor: default;
}
.balit-center {
align-items: center;
}
.td-dt.size-bdt-tb9 .dt-price-pg .totalprice-pg {
font-size: 0.88rem;
}
.size-btb0 { width: 3%; }
.size-btb1 { width: 25%; }
.size-btb2 { width: 8.6%; }
.size-btb3 { width: 8.6%; }
.size-btb4 { width: 8.6%; }
.size-btb5 { width: 8.6%; }
.size-btb6 { width: 8.6%; }
.size-btb7 { width: 8.6%; }
.size-btb8 { width: 8.6%; }
.size-btb9 { width: 8.6%; }
.size-btb10 { width: 0; }
.size-btb11 { width: 3.2%; }
.acd-hd {
position: relative;
width: 28%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.size-bdt-tb0 { width: 11%; padding: 0; }
.size-bdt-tb1 { width: 89%; }
.acd-dt-view {
position: relative;
width: 72%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.size-bdt-tb2 { width: 11.9375%; }
.size-bdt-tb3 { width: 11.9375%; }
.size-bdt-tb4 { width: 11.9375%; }
.size-bdt-tb5 { width: 11.9375%; }
.size-bdt-tb6 { width: 11.9375%; }
.size-bdt-tb7 { width: 11.9375%; }
.size-bdt-tb8 { width: 11.9375%; }
.size-bdt-tb9 { width: 11.9375%; }
.size-bdt-tb10 { width: 0; display: none; }
.size-bdt-tb11 { width: 4.5%; }
/* ============= */
@media (min-width: 992px) {
.lines-right-tbdt:last-child {
border-right: none;
}
.lines-right-tbdt.size-bdt-tb9 {
border-right: none;
}
.td-dt.size-bdt-tb9 {
padding: 0 0 0 4px;
}
}
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-tb-period {
border-radius: 0;
border: none;
}
}
@media (min-width: 0px) and (max-width: 991px) {
.lines-bottom-tdbt {
/* border-bottom: none; */
border-bottom: 2px solid var(--color-grey6);
}
.lines-bottom-tdbt:last-child {
border-bottom: 2px solid var(--color-grey6);
}
.bg-st-tttbpr {
background-color: var(--color-first);
border-bottom: 1px solid var(--color-first);
}
.bg-scc-tttbpr {
background-color: var(--color-green);
border-bottom: 1px solid var(--color-green);
}
.bg-dg-tttbpr {
background-color: var(--color-red);
border-bottom: 1px solid var(--color-red);
}
.bg-wn-tttbpr {
background-color: var(--color-yellow);
border-bottom: 1px solid var(--color-yellow);
}
.bg-st-tttbpr .dt-price-pg i, .bg-st-tttbpr .btxt-range-pr p, .bg-st-tttbpr .bicon-acd i,
.bg-scc-tttbpr .dt-price-pg i, .bg-scc-tttbpr .btxt-range-pr p, .bg-scc-tttbpr .bicon-acd i,
.bg-dg-tttbpr .dt-price-pg i, .bg-dg-tttbpr .btxt-range-pr p, .bg-dg-tttbpr .bicon-acd i,
.bg-wn-tttbpr .dt-price-pg i, .bg-wn-tttbpr .btxt-range-pr p, .bg-wn-tttbpr .bicon-acd i {
color: var(--color-light);
}
.lines-right-tbdt,
.lines-right-tbpr {
border-right: none;
}
.tb-head-pr {
display: none;
}
.title-name-smb {
display: block;
}
.acd-hd,
.acd-dt-view {
width: 100%;
}
.acd-hd {
padding: 2px 16px;
}
.list-tb-prdt {
padding: 0;
margin-bottom: 5px;
}
.btxt-range-pr {
width: calc(100% - 1.6rem);
padding-right: 10px;
}
.btxt-range-pr p .cl-red {
color: var(--color-light) !important;
}
.bicon-acd {
width: 1.6rem;
display: flex;
}
.td-dt {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
padding: 0 16px 10px 16px;
}
.txt-prpg-tb {
width: calc(100% - 2rem);
padding-right: 10px;
}
.icon-aracd-smb {
display: block;
}
.dt-price-pg {
display: flex;
}
.dt-price-pg .fullprice-pg {
margin-bottom: auto;
padding-right: 6px;
}
.dt-price-pg .currency-pg {
display: inline;
padding: 0 0 0 5px;
}
.box-sizemb-bk {
position: relative;
width: 100%;
height: auto;
}
.bnt-sizemb-bk {
position: relative;
width: 70%;
height: auto;
margin: 0 auto;
border-radius: 5px;
overflow: hidden;
}
.bnt-sizemb-bk a {
font-size: 1rem;
color: var(--color-light);
cursor: pointer;
}
.bnt-sizemb-bk p {
font-size: 1rem;
text-align: center;
color: var(--color-light);
padding: 6px 12px;
}
.btn-bkavbl p {
padding: 2px 16px;
}
.bg-btn-bkscc {
background-color: var(--color-green);
}
.bg-btn-bkdg {
background-color: var(--color-red);
}
.bg-btn-bkwn {
background-color: var(--color-yellow);
}
.bg-btn-bkgy {
background-color: var(--color-grey4);
}
.bg-btn-bkgy p {
color: var(--color-txtg);
}
.td-dt.size-bdt-tb0, .td-dt.size-bdt-tb1 {
padding-bottom: 0;
}
.size-bdt-tb0 {
padding: 0;
}
.td-dt.size-bdt-tb1 {
padding-left: 10px;
padding-right: 0;
}
.size-bdt-tb0 { width: 2rem; }
.size-bdt-tb1 { width: calc(100% - 2rem); }
.size-bdt-tb2, .size-bdt-tb3, .size-bdt-tb4, .size-bdt-tb5,
.size-bdt-tb6, .size-bdt-tb7, .size-bdt-tb8, .size-bdt-tb9, .size-bdt-tb11 {
width: 100%;
border-bottom: 1px dashed var(--color-grey3);
}
.size-bdt-tb2 {
order: 1;
}
.size-bdt-tb3 {
order: 2;
}
.size-bdt-tb4 {
order: 3;
}
.size-bdt-tb5 {
order: 4;
}
.size-bdt-tb6 {
order: 6;
}
.size-bdt-tb7 {
order: 7;
}
.size-bdt-tb8 {
order: 8;
}
.size-bdt-tb9 {
order: 9;
}
.size-bdt-tb10 {
order: 10;
width: 100%;
display: block;
}
.size-bdt-tb11 {
order: 5;
}
.accordion-dt-prsmb {
position: relative;
width: 100%;
height: auto;
}
.accordion-dt-prsmb::-webkit-scrollbar {
display: none;
}
.acd-list {
cursor: pointer;
}
.acd-list.showawdt {
/* margin-bottom: 0; */
}
.acd-list .acd-smb {
display: flex;
align-items: center;
justify-content: space-between;
}
.acd-list .acd-smb .aricacd {
transition: all 0.3s ease;
}
.acd-list.showawdt .acd-smb .aricacd {
transform: rotate(-180deg);
}
.acd-list .acd-dt-view {
display: none;
}
.acd-list.showawdt .acd-dt-view {
display: flex;
}
}
/* ========================================================== */
/* ================= social home 16-09-2024 ================= */
.sc--scmd-h {
position: relative;
width: 100%;
height: auto;
}
.box-social-h {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
margin-top: 20px;
padding: 16px;
}
.btitle-sch {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
}
.btitle-sch p {
font-size: 1rem;
font-weight: bold;
color: var(--color-txtg);
text-align: center;
text-decoration: underline;
}
.bsch-view {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
}
.btn-sch {
position: relative;
width: 9rem;
height: auto;
margin: 0 16px;
overflow: hidden;
}
.btn-sch2 {
position: relative;
width: 4rem;
height: auto;
margin: 0 16px;
overflow: hidden;
}
.btn-sch a,
.btn-sch2 a {
position: relative;
width: auto;
height: auto;
cursor: pointer;
}
.biconsch {
position: relative;
width: 3.2rem;
height: 3.2rem;
border-radius: 100%;
display: flex;
overflow: hidden;
margin: 0 auto;
}
.biconsch p {
font-size: 2rem;
color: var(--color-light);
display: flex;
margin: auto;
text-align: center;
}
.biconsch i {
color: var(--color-light);
}
.name-scmd-h {
font-size: 0.88rem;
color: var(--color-txtg5);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
padding-top: 3px;
}
.bgiconsc-fb {
background-color: var(--color-fb);
}
.bgiconsc-line {
background-color: var(--color-line);
}
.bgiconsc-ig {
background-color: var(--color-ig);
}
.bgiconsc-tt {
background-color: var(--color-tt);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-social-h {
padding-bottom: 0;
}
.btn-sch {
margin-bottom: 16px;
}
.btn-sch2 {
width: calc(50% - 32px);
margin-bottom: 16px;
}
}
@media (min-width: 0px) and (max-width: 1199px) {
.box--main2 {
display: flex;
flex-wrap: wrap;
}
.sc--img-slider {
order: 1;
}
.box--sh2-ct-ro-smb {
order: 2;
}
.sc--banner-l-pm {
order: 3;
}
.sc--scmd-h {
order: 4;
}
.sc--bpushsell {
order: 5;
}
.order-box-pgfiamai {
order: 6;
margin-top: 20px !important;
}
.sc--program-cl-f {
order: 7;
}
.sc--review-f {
order: 8;
}
.sc--program-rw-half-f {
order: 9;
}
.sc--article-card-f {
order: 10;
}
.sc--review-f {
order: 11;
}
.sc--footage-data-f {
order: 12;
}
}
.blist-tvp- .n-vpr-box, .blist-tvp- .n-vpr-box a {
display: flex;
justify-content: stretch;
align-items: center;
flex-wrap: wrap;
flex-direction: row;
}
.blist-tvp- .n-vpr-box i {
padding-right: 6px;
}
.blist-tvp- .n-vpr-box .txt-prpg-n {
width: 64%;
}
.blist-tvp- .n-vpr-box .txt-blset-n {}
.baccordiontvp {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: stretch;
}
.btxt-namepr {
order: 1;
font-weight: bold !important;
}
.txt-datepr {
order: 2;
}
.txt-tvpr {
order: 3;
}
.baccordiontvp::before {
order: 4;
}
/* ============= */
@media (min-width: 791px) {
.txt-datepr {
margin-left: auto;
}
.txt-tvpr {
padding-left: 5px;
}
}
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.blist-tvp- .n-vpr-box .txt-prpg-n {
width: 58%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.blist-tvp- .n-vpr-box .txt-prpg-n {
width: 46%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.blist-tvp- {
padding: 2px 6px;
}
}
@media (min-width: 0px) and (max-width: 500px) {}
@media (min-width: 0px) and (max-width: 790px) {
.blist-tvp- .n-vpr-box i {
width: 13%;
}
.blist-tvp- .n-vpr-box .txt-prpg-n {
width: 87%;
}
.blist-tvp- .n-vpr-box .txt-blset-n {
margin: 0 auto;
}
.txt-datepr {
padding-left: 5px;
width: 65%;
}
.txt-tvpr {
order: 4;
width: 100%;
}
.baccordiontvp::before {
order: 3;
margin-left: auto;
}
}
/* ============================================================= */
/* ================= Push Sell Home 19-09-2024 ================= */
.sc--bpushsell {
position: relative;
width: 100%;
height: auto;
}
.box-bg-pstb {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
margin: 20px 0;
padding: 16px;
}
/* ====== title ====== */
.box-title-short {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 16px 16px;
}
.bname-title {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.bname-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-txtg);
}
.bname-title i {
color: var(--color-txtg);
}
.color-txt-namett {
color: var(--color-txtg);
}
.color-txt-namett2 {
color: var(--color-first);
}
.blines-spr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
}
.lineslr-spr {
position: relative;
width: 100px;
height: auto;
border-top: 1px solid var(--color-grey5);
}
.circlect-spr {
position: relative;
width: 12px;
height: 12px;
border: 1px solid var(--color-icon-yl);
border-radius: 100%;
margin: 0 8px;
}
.bshort-title {
position: relative;
width: 100%;
height: auto;
padding-top: 5px;
}
.bshort-title p {
font-size: 0.94rem;
font-weight: normal;
text-align: center;
color: var(--color-txtg4);
}
/* ====== dt ====== */
.box-table-full {
position: relative;
width: 100%;
height: auto;
margin-bottom: 20px;
}
.title-tb {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 5px;
}
.title-tb p {
font-size: 1.07rem;
font-weight: bold;
}
.table--b {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.b--head-tb {
position: relative;
width: 100%;
height: auto;
max-height: 2.125rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
background-color: var(--color-first);
}
.td--tbhd {
position: relative;
height: auto;
margin: 5px 0;
padding: 0 6px;
}
.td--tbhd p {
font-size: 0.94rem;
color: var(--color-light);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.b-dt-tb {
position: relative;
width: 100%;
height: auto;
}
.tr-list-box {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.td--tbdt {
position: relative;
height: auto;
margin: 5px 0;
display: grid;
padding: 0 6px;
}
.td--tbdt.size--btb1 {
padding-left: 12px;
}
.td--tbdt p {
font-size: 0.88rem;
}
.btxt-smb-range {
position: relative;
width: 100%;
height: auto;
margin: auto 0;
}
.btxt-smb-range p {
font-size: 0.88rem;
color: var(--color-txtg);
}
.btxt-smb-range span {
font-size: 0.81rem;
}
.btxt-smb-range i {
font-size: 0.81rem;
}
.btxt-smb-range .show-holiday {
font-size: 0.75rem;
color: var(--color-red);
}
.bicon-smb-acd {
display: none;
}
.bicon-smb-acd i {
font-size: 0.88rem;
color: var(--color-txtg);
text-align: right;
margin: 0 0 0 auto;
}
.smb-tt-name {
position: relative;
/* width: 100%;
height: auto; */
display: none;
}
.smb-tt-name p {
font-size: 0.88rem;
color: var(--color-txtg);
}
.view-dt-pgn {
position: relative;
/* width: 100%;
height: auto; */
margin: auto 0;
}
.view-dt-pgn p {
font-size: 0.88rem;
text-align: center;
}
.size--btb3 .view-dt-pgn p {
text-align: left;
}
.smb-dtpgn-full {
padding-left: 6px;
}
.full-price-prpg {
font-size: 0.75rem !important;
color: var(--color-txtg4);
text-decoration: line-through;
margin-bottom: -5px;
}
.total-price-prpg {
font-size: 0.94rem !important;
font-weight: bold;
color: var(--color-red);
}
.crc-price-prpg {
font-size: 0.63rem;
font-weight: normal;
color: var(--color-txtg4);
display: none;
}
.btn-avblc {
position: relative;
width: auto;
height: fit-content;
border-radius: 5px;
display: grid;
align-items: center;
margin: auto 0;
}
.btn-avblc a {
position: relative;
width: auto;
height: 100%;
color: var(--color-light);
cursor: pointer;
display: grid;
align-items: center;
}
.btn-avblc p {
font-size: 0.88rem;
color: var(--color-light);
padding: 4px 5px;
text-align: center;
}
.bg-avblc-st {
background-color: var(--color-first);
}
.bg-avblc-scc {
background-color: var(--color-green);
}
.bg-avblc-dg {
background-color: var(--color-red);
}
.bg-avblc-wn {
background-color: var(--color-yellow);
}
.smb-acd-title {
position: relative;
width: 30%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.smb-acd-dt {
position: relative;
width: 70%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.lines-rtbhdhs, .lines-rtbhd {
border-right: 1px solid var(--color-grey2);
}
.lines-rtbhd:last-child {
border-right: none;
}
.lines-bttbdt {
border-bottom: 1px dashed var(--color-grey3);
}
.lines-bttbdt:last-child {
border-bottom: none;
}
.lines-rtbdths, .lines-rtbdt {
border-right: 1px solid var(--color-grey4);
}
.lines-rtbdt:last-child {
border-right: none;
}
.lines-bdnone-t { border-top: none; }
.lines-bdnone-b { border-bottom: none; }
.lines-bdnone-l { border-left: none; }
.lines-bdnone-r { border-right: none; }
.txtal-l { text-align: left !important; }
.txtal-r { text-align: right !important; }
.txtal-c { text-align: center !important; }
.size--btb1 { width: 60%; }
.size--btb2 { width: 40%; }
.size--btb3 { width: 50%; }
.size--btb4 { width: 15%; }
.size--btb5 { width: 10.5%; }
.size--btb6 { width: 7.5%; }
.size--btb7 { width: 7.5%; }
.size--btb8 { width: 9.5%; }
.size--btb9 { display: none; }
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.sc--bpushsell .container {
padding: 0;
}
.bname-title p {
font-size: 1.13rem;
}
.bshort-title p {
font-size: 0.88rem;
}
}
@media (min-width: 0px) and (max-width: 991px) {
.b--head-tb {
display: none;
}
.btxt-smb-range p, .btxt-smb-range .show-holiday,
.size--btb2 .view-dt-pgn p, .bicon-smb-acd i {
color: var(--color-light);
}
.size--btb2 .view-dt-pgn p {
text-align: right;
}
.td--tbdt {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
padding: 0 12px 10px 12px;
align-items: center;
}
.td--tbdt.size--btb1, .td--tbdt.size--btb2 {
padding-bottom: 0;
}
.size--btb2 .view-dt-pgn {
width: calc(100% - 1.4rem);
}
.bicon-smb-acd {
width: 1.4rem;
display: flex;
}
.size--btb3 .view-dt-pgn p {
text-align: center;
font-weight: bold;
}
.smb-tt-name {
display: block;
}
.lines-rtbdths, .lines-rtbdt {
border-right: none;
}
.lines-bttbdt {
border-bottom: none;
}
.smb-acd-title, .smb-acd-dt {
width: 100%;
}
.smb-dtpgn-full {
width: 100%;
padding-left: 0;
}
.dpn-smbttn {
display: none;
}
.crc-price-prpg {
display: inline;
}
.size--btb5 .view-dt-pgn {
display: flex;
justify-content: stretch;
align-items: baseline;
}
.size--btb5 .view-dt-pgn .full-price-prpg {
padding-right: 3px;
font-size: 0.63rem !important;
}
.btn-avblc p {
padding: 2px 16px;
}
.b-btnbk-smb {
position: relative;
width: 100%;
height: auto;
}
.btn-booking-smb {
position: relative;
width: 70%;
height: auto;
margin: 0 auto;
border-radius: 5px;
overflow: hidden;
}
.btn-booking-smb a {
font-size: 1rem;
color: var(--color-light);
cursor: pointer;
}
.btn-booking-smb p {
font-size: 1rem;
text-align: center;
color: var(--color-light);
padding: 6px 12px;
}
.box-bg-pstb {
margin-bottom: 0;
}
.bg-ttsmb-st {
background-color: var(--color-first);
}
.bg-ttsmb-scc, .bg-btnbk-scc {
background-color: var(--color-green);
}
.bg-ttsmb-dg, .bg-btnbk-dg {
background-color: var(--color-red);
}
.bg-ttsmb-wn, .bg-btnbk-wn {
background-color: var(--color-yellow);
}
.bg-btnbk-gy {
background-color: var(--color-grey4);
}
.bg-btnbk-gy p {
color: var(--color-txtg);
}
.size--btb1 {
width: 55%;
}
.size--btb2 {
width: 45%;
}
.size--btb3, .size--btb4, .size--btb5,
.size--btb6, .size--btb7, .size--btb8 {
width: 100%;
border-bottom: 1px dashed var(--color-grey3);
}
.size--btb9 {
width: 100%;
display: flex;
padding-bottom: 5px;
}
.tr-list-box {
margin-bottom: 5px;
}
.tr-list-box:last-child {
margin-bottom: 0;
}
.acd-dt-vsmb {
position: relative;
width: 100%;
height: auto;
}
.acd-dt-vsmb::-webkit-scrollbar {
display: none;
}
.acd-dtlist {
cursor: pointer;
}
.acd-dtlist.acdshowdt {}
.acd-dtlist .acd-qsiar {
display: flex;
align-items: center;
justify-content: space-between;
}
.acd-dtlist .acd-qsiar .iconarhd {
transition: all 0.3s ease;
}
.acd-dtlist.acdshowdt .acd-qsiar .iconarhd {
transform: rotate(-180deg);
}
.acd-dtlist .smb-acd-dt {
display: none;
}
.acd-dtlist.acdshowdt .smb-acd-dt {
display: flex;
}
}
/* ============================================== */
/* ================= 30-09-2024 ================= */
.cln-txt-fp-s {
margin-bottom: -10px;
margin-top: 5px;
}
.cln-txt-fp-s .txt-price-full-box1 {
padding-right: 0;
}
.b-pg-discount-n {
position: relative;
width: 100%;
height: auto;
border-bottom: 1px dashed var(--color-grey3);
background-color: rgba(var(--color-second-rgb), 0.1);
padding: 2px 12px;
}
.txt-dc-n-show {
font-size: 0.94rem;
font-weight: normal;
text-align: center;
color: var(--color-txtg4);
}
.txt-dc-n-show span {
color: var(--color-red);
font-weight: bold;
}
.txt-dc-n-show i {
color: var(--color-icon-yl);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.b-pg-discount-n {
/* display: none; */
position: absolute;
width: auto;
padding: 0;
top: 0;
right: 6px;
background-color: transparent;
border-bottom: none;
}
.txt-dc-n-show {
font-size: 0.75rem;
}
.cln-txt-fp-s {
margin-bottom: -8px;
margin-top: 0;
}
.txt-price-full-box1 {
font-size: 0.69rem;
}
}
/* ================= ================= */
.box-btn--social-media {
position: fixed;
bottom: 20px;
right: 20px;
display: flex;
z-index: 999;
}
.box-btn--social-media .open-close-btn-scmd {
position: relative;
width: 2rem;
height: 2rem;
background-color: var(--color-green);
border-radius: 50%;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
cursor: pointer;
transform: rotate(0deg);
transition: all 0.3s ease;
/* transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55); */
}
.box-btn--social-media .open-close-btn-scmd.open {
transform: rotate(45deg);
background-color: var(--color-red);
transition: all 0.3s ease;
}
.box-btn--social-media .open-close-btn-scmd.open i::before {
font-family: 'Font Awesome 6 Free';
content: "\2b";
font-weight: bold;
font-size: 1.3rem;
}
.box-btn--social-media .open-close-btn-scmd i {
font-size: 1.2rem;
text-align: center;
position: relative;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: var(--color-light);
}
.box-btn--social-media .scmedia-icons {
position: absolute;
width: 10.5rem;
height: auto;
bottom: 2.4rem;
right: 0;
transform: translateX(200%);
transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.box-btn--social-media .open-close-btn-scmd.open ~ .scmedia-icons {
transform: translateX(0);
}
.box-btn--social-media .scmedia-icons .logo--top-b {
position: relative;
width: 100%;
height: auto;
}
.box-btn--social-media .scmedia-icons .logo--top-b figure {
position: relative;
width: 100%;
height: 100%;
}
.box-btn--social-media .scmedia-icons .logo--top-b figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.box-btn--social-media .scmedia-icons .logo--top-b figure .size-img20 {
position: relative;
width: 100%;
height: auto;
margin-bottom: -4.5px;
z-index: 9;
}
.box-btn--social-media .scmedia-icons .logo--top-b figure .size-img80 {
position: relative;
width: 100%;
height: auto;
margin-bottom: -16.5px;
z-index: 9;
}
.box-btn--social-media .scmedia-icons .logo--top-b figure .size-img150 {
position: relative;
width: 100%;
height: auto;
margin-bottom: -31.5px;
z-index: 9;
}
.box-btn--social-media .scmedia-icons .logo--top-b figure .size-img200 {
position: relative;
width: 100%;
height: auto;
margin-bottom: -42.5px;
z-index: 9;
}
.box-btn--social-media .scmedia-icons .contact--box {
position: relative;
width: 100%;
height: auto;
/* padding: 12px; */
background-color: var(--color-line);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
border-radius: 20px;
overflow: hidden;
}
.box-btn--social-media .scmedia-icons .contact--box .bhead {
position: relative;
width: auto;
height: auto;
padding: 8px 0;
margin: 12px 12px 0 12px;
z-index: 12;
}
.box-btn--social-media .scmedia-icons .contact--box .bhead p {
font-size: 0.94rem;
text-align: center;
color: var(--color-light);
display: flex;
align-items: center;
justify-content: center;
}
.box-btn--social-media .scmedia-icons .contact--box .bhead p i {
color: var(--color-light);
font-size: 1.63rem;
padding-right: 6px;
margin-bottom: -2px;
background-color: var(--color-line);
}
.box-btn--social-media .scmedia-icons .contact--box .bqrcode {
position: relative;
width: auto;
height: auto;
padding: 8px 0;
margin: 0 12px;
border-bottom: 1px solid rgba(var(--color-light-rgb), 0.4);
}
.box-btn--social-media .scmedia-icons .contact--box .bqrcode p {
font-size: 0.69rem;
text-align: center;
color: var(--color-light);
font-weight: 300;
}
.box-btn--social-media .scmedia-icons .contact--box .bqrcode p a {
cursor: pointer;
color: var(--color-light);
font-size: 0.75rem;
font-weight: normal;
}
.box-btn--social-media .scmedia-icons .contact--box .bqrcode p a:hover {
color: var(--color-fifth);
text-decoration: underline;
transition: all 0.3s ease;
}
.box-btn--social-media .scmedia-icons .contact--box .bqrcode figure {
position: relative;
width: 7rem;
height: 7rem;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
margin: 10px auto;
}
.box-btn--social-media .scmedia-icons .contact--box .bqrcode figure a {
position: relative;
width: 100%;
height: 100%;
cursor: pointer;
}
.box-btn--social-media .scmedia-icons .contact--box .bqrcode figure .size-img {
position: relative;
width: 100%;
height: auto;
}
.box-btn--social-media .scmedia-icons .contact--box .btel {
position: relative;
width: auto;
height: auto;
padding: 8px 0;
margin: 0 12px;
border-bottom: 1px solid rgba(var(--color-light-rgb), 0.4);
display: flex;
justify-content: stretch;
align-items: center;
}
.box-btn--social-media .scmedia-icons .contact--box .btel .icon {
position: relative;
width: 1.8rem;
height: auto;
display: flex;
}
.box-btn--social-media .scmedia-icons .contact--box .btel .icon i {
font-size: 1.13rem;
color: var(--color-light);
margin: auto;
}
.box-btn--social-media .scmedia-icons .contact--box .btel .numbert {
position: relative;
width: calc(100% - 1.8rem);
height: auto;
padding-left: 6px;
}
.box-btn--social-media .scmedia-icons .contact--box .btel .numbert p {
font-size: 0.81rem;
color: var(--color-light);
margin-bottom: 6px;
}
.box-btn--social-media .scmedia-icons .contact--box .btel .numbert p:last-child {
margin-bottom: 0;
}
.box-btn--social-media .scmedia-icons .contact--box .btel .numbert p a {
color: var(--color-light);
cursor: pointer;
}
.box-btn--social-media .scmedia-icons .contact--box .btel .numbert p a:hover {
color: var(--color-fifth);
text-decoration: underline;
transition: all 0.3s ease;
}
.box-btn--social-media .scmedia-icons .contact--box .btime {
position: relative;
width: auto;
height: auto;
padding: 8px 0;
margin: 0 12px;
}
.box-btn--social-media .scmedia-icons .contact--box .btime p {
font-size: 0.69rem;
text-align: center;
color: var(--color-light);
font-weight: 300;
}
.box-btn--social-media .scmedia-icons .contact--box .btime .topic {
font-size: 0.75rem;
color: var(--color-light);
font-weight: normal;
margin-top: 6px;
}
.box-btn--social-media .scmedia-icons .contact--box .btime .topic:first-child {
margin-top: 0;
}
.box-btn--social-media .scmedia-icons .contact--box .bsoocial {
position: relative;
width: 100%;
height: auto;
padding: 5px 0 0 0;
}
.box-btn--social-media .scmedia-icons .contact--box .bsoocial .bgscmd {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-green6);
border-bottom-left-radius: 12px;
border-bottom-right-radius: 12px;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
padding: 8px 6px 6px 6px;
}
.box-btn--social-media .scmedia-icons .contact--box .bsoocial .bgscmd .btnscmd {
position: relative;
width: 1.5rem;
height: 1.5rem;
border-radius: 5px;
overflow: hidden;
display: flex;
margin: 0 6px 6px 0;
box-shadow: 0px 0px 5px 2px rgba(var(--color-light-rgb), 0.1);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-light-rgb), 0.1);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-light-rgb), 0.1);
}
.box-btn--social-media .scmedia-icons .contact--box .bsoocial .bgscmd .btnscmd:last-child {
margin-right: 0;
}
.box-btn--social-media .scmedia-icons .contact--box .bsoocial .bgscmd .btnscmd a {
position: relative;
width: 100%;
height: 100%;
cursor: pointer;
display: flex;
}
.box-btn--social-media .scmedia-icons .contact--box .bsoocial .bgscmd .btnscmd a i {
color: var(--color-light);
font-size: 0.94rem;
text-align: center;
margin: auto;
}
.box-btn--social-media .scmedia-icons .contact--box .bsoocial .bgscmd .bgbtn-fb {
background-color: var(--color-fb);
}
.box-btn--social-media .scmedia-icons .contact--box .bsoocial .bgscmd .bgbtn-line {
background-color: var(--color-line);
}
.box-btn--social-media .scmedia-icons .contact--box .bsoocial .bgscmd .bgbtn-ig {
background-color: var(--color-ig);
}
.box-btn--social-media .scmedia-icons .contact--box .bsoocial .bgscmd .bgbtn-tt {
background-color: var(--color-tt);
}
.box-btn--social-media .scmedia-icons .contact--box .bsoocial .bgscmd .bgbtn-email {
background-color: var(--color-email);
}
/* ============= */
/* @media (min-width: 1400px) {} */
/* @media (min-width: 1200px) and (max-width: 1399px) {} */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-btn--social-media {
display: none;
}
}
.box-dateep-n {
padding-top: 5px;
}
.bg-b-dateep-n {
background-color: var(--color-orange);
}
.size-fdateep-n {
font-size: 0.85rem !important;
}
@media (min-width: 501px) and (max-width: 790px) {
.size-fdateep-n {
font-size: 0.81rem !important;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.size-fdateep-n {
font-size: 0.75rem !important;
}
}
/* =================== list program tour =================== */
/* =================== 2024-07-17 =================== */
.b-tvp-acd-list {
position: relative;
width: 100%;
height: auto;
padding: 4px 0 10px 0;
}
.baccordiontvp {
position: relative;
width: 100%;
height: auto;
background-color: rgba(var(--color-second-rgb), 0.5);
border: 1px solid var(--color-first);
cursor: pointer;
border-radius: 5px;
padding: 3px 12px;
transition: 0.4s;
font-size: 0.88rem;
color: var(--color-txtg);
font-weight: 600;
text-align: left;
}
.baccordiontvp::before {
content: '\002B';
color: var(--color-txtg4);
font-weight: 600;
float: right;
margin-left: 6px;
width: 12px;
text-align: right;
}
.baccordiontvp span {
font-weight: normal;
}
.baccordiontvp.active {
border-radius: 5px 5px 0 0;
}
.baccordiontvp.active, .baccordiontvp:hover {
background-color: var(--color-first);
color: var(--color-light);
transition: all 0.3s ease;
}
.baccordiontvp.active span,
.baccordiontvp:hover span, .baccordiontvp:hover::before {
color: var(--color-light);
transition: all 0.3s ease;
}
.baccordiontvp.active::before {
content: "\2212";
color: var(--color-light);
}
.bpanelt {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-light);
overflow: hidden;
transition: max-height 0.2s ease-out;
/* max-height: 0; */
/* max-height: max-content; */
cursor: default;
border-radius: 0 0 5px 5px;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.blinesprtv {
border: 1px solid var(--color-first);
}
.bmaxh-accpra {
max-height: max-content;
}
.bmaxh-accpr0 {
max-height: 0;
}
.blist-tvp- {
position: relative;
height: auto;
padding: 2px 10px;
}
.blist-tvp- p {
font-size: 0.88rem;
color: var(--color-txtg5);
}
.blist-tvp- p i {
color: var(--color-icon-yl);
padding-right: 3px;
}
.stvp-w {
width: calc(100%/3);
}
/* ============= */
@media (min-width: 1200px) {
/* .baccordiontvp span {
float: right;
} */
.blist-tvp-:nth-child(6n+4),
.blist-tvp-:nth-child(6n+5),
.blist-tvp-:nth-child(6n+6) {
background-color: rgba(var(--color-second-rgb), 0.5);
}
}
@media (min-width: 992px) and (max-width: 1199px) {
/* .baccordiontvp span {
float: right;
} */
.blist-tvp-:nth-child(6n+4),
.blist-tvp-:nth-child(6n+5),
.blist-tvp-:nth-child(6n+6) {
background-color: rgba(var(--color-second-rgb), 0.5);
}
}
@media (min-width: 791px) and (max-width: 991px) {
/* .baccordiontvp span {
float: right;
} */
.stvp-w {
width: calc(100%/2);
}
.blist-tvp-:nth-child(4n+3),
.blist-tvp-:nth-child(4n+4) {
background-color: rgba(var(--color-second-rgb), 0.5);
}
}
@media (min-width: 501px) and (max-width: 790px) {
.stvp-w {
width: calc(100%/2);
}
.blist-tvp- p {
font-size: 0.81rem;
}
.blist-tvp-:nth-child(4n+3),
.blist-tvp-:nth-child(4n+4) {
background-color: rgba(var(--color-second-rgb), 0.5);
}
.b-tvp-acd-list {
padding-bottom: 0;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.stvp-w {
width: calc(100%/2);
}
.blist-tvp- p {
font-size: 0.75rem;
}
.blist-tvp-:nth-child(4n+3),
.blist-tvp-:nth-child(4n+4) {
background-color: rgba(var(--color-second-rgb), 0.5);
}
.b-tvp-acd-list {
padding-bottom: 0;
}
}
/* =================== 2024-07-17 =================== */
.dpn-b- {
display: none;
}
.bpdb-10 {
padding-bottom: 10px !important;
}
.bpdb-16 {
padding-bottom: 16px !important;
}
.alit-end {
align-items: end;
}
.cltxtg4 { color: var(--color-txtg4); }
.cltxtg5 { color: var(--color-txtg5); }
.bdt-vlistf {
position: relative;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 2px 0;
}
.bdt-vlistf figure {
width: 100%;
height: 3.5rem;
display: flex;
}
.bdt-vlistf figure .size-img {
position: relative;
width: auto;
height: 100%;
}
.sn1b {
width: 100%;
}
.ssh1b {
width: 100%;
}
.s1b {
width: 30%;
padding-bottom: 6px;
}
.s2b {
width: 40%;
padding-bottom: 16px;
}
.s3b {
width: 30%;
padding-bottom: 6px;
}
.blsit-vdt {
position: relative;
height: auto;
padding: 5px 10px;
}
.blsit-vdt p {
font-size: 0.88rem;
font-weight: normal;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
/*-webkit-line-clamp: 2;*/
-webkit-line-clamp: 3;
}
.blsit-vdt p i {
color: var(--color-icon-yl);
padding-right: 3px;
}
.blsit-vdt p span {
color: var(--color-first);
font-weight: bold;
text-decoration: underline;
}
.sdv1 {
width: 33%;
/* width: calc(100%/3); */
}
.sdv2 {
width: 25%;
/* width: calc(100%/3); */
}
.sdv3 {
width: 42%;
/* width: calc(100%/3); */
}
.sdv100 {
width: 100%;
}
.btn-viewdtpg {
position: relative;
width: auto;
height: fit-content;
cursor: pointer;
background-color: var(--color-first);
border: 1px solid var(--color-first);
border-radius: 5px;
margin-left: auto;
margin-top: auto;
margin-bottom: auto;
}
.btn-viewdtpg a {
position: relative;
width: auto;
height: auto;
padding: 3px 16px;
}
.btn-viewdtpg p {
font-size: 0.88rem;
color: var(--color-light);
}
.btn-viewdtpg:hover {
background-color: var(--color-light);
transition: all 0.3s ease;
}
.btn-viewdtpg:hover p {
color: var(--color-fifth);
transition: all 0.3s ease;
}
.bfullp-pgl {
position: relative;
width: 33%;
height: fit-content;
padding-right: 5px;
}
.bfullp-pgl p {
font-size: 0.75rem;
color: var(--color-txtg4);
text-align: right;
text-decoration: line-through;
}
.bnetp-pgl {
position: relative;
width: 67%;
height: auto;
padding-left: 5px;
}
.bnetp-pgl p {
font-size: 0.75rem;
color: var(--color-txtg4);
margin-bottom: -5px;
}
.bnetp-pgl .price-n {
font-size: 1.44rem;
font-weight: bold;
color: var(--color-red);
}
.bnetp-pgl .txtcrn {
font-size: 0.75rem;
font-weight: normal;
padding-left: 3px;
color: var(--color-txtg4);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {
.sc--program-row-sprlr-bg-lr .box-bg-pg .box--list-pg .box--one-lpg {
height: fit-content;
}
.sc--program-row-sprlr-lr .box--not-bg-pg .box--list-pg .box--one-lpg {
height: fit-content;
}
.b-tvp-acd-list {
padding: 10px 0;
}
.s1b {
width: 40%;
padding: 0 12px 0 12px;
}
.s2b {
width: 60%;
padding: 0 12px 0 12px;
}
.s3b {
width: 100%;
padding: 10px 12px 6px 12px;
}
.btn-viewdtpg {
margin-left: auto;
margin-right: auto;
}
.btn-viewdtpg p {
width: 100%;
text-align: center;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.b-tvp-acd-list {
padding: 10px 0;
}
.s1b {
width: 50%;
padding: 0 12px 0 12px;
}
.s2b {
width: 50%;
padding: 0 12px 0 12px;
}
.s3b {
width: 100%;
padding: 10px 12px 6px 12px;
}
.btn-viewdtpg {
margin-left: auto;
margin-right: auto;
}
.btn-viewdtpg p {
width: 100%;
text-align: center;
}
}
/* =================== =================== */
/* ============= */
/* @media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {} */
.title-bksmb-pl {
font-size: 0.94rem;
font-weight: 600;
color: var(--color-fifth);
text-decoration: underline;
}
.title-bksmb-pl i {
color: var(--color-fifth);
}
/* ========================================================== */
/* ================= Our Partner 30-08-2024 ================= */
.tt-ourpn-sch {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
padding: 20px 0 16px 0;
}
.ttl-ourpn {
position: relative;
width: 50%;
height: auto;
}
.ttl-ourpn p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-txtg);
}
.ttl-ourpn p span {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
}
.ttr-sch {
position: relative;
width: 50%;
height: auto;
}
.ttr-sch .box-search-ourpn {
position: relative;
width: calc(50% + 60px);
height: auto;
display: flex;
justify-content: stretch;
margin-right: 0;
margin-left: auto;
}
.ttr-sch .box-search-ourpn input {
position: relative;
width: calc(100% - 60px);
height: auto;
font-size: 0.75rem;
padding: 5px 16px;
border: 1px solid var(--color-grey5);
border-radius: 5px 0 0 5px;
}
.ttr-sch .box-search-ourpn button {
position: relative;
width: 60px;
height: auto;
padding: 5px 16px;
font-size: 0.75rem;
background-color: var(--color-first);
color: var(--color-light);
border-radius: 0 5px 5px 0;
}
.box-our-partner-ls {
position: relative;
width: 100%;
height: auto;
}
.b-menu-pv {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 5px;
}
.btn-mnpv {
position: relative;
width: auto;
height: auto;
background-color: var(--color-first);
border: 1px solid var(--color-first);
border-radius: 50px;
overflow: hidden;
margin: 6px;
display: flex;
}
.btn-mnpv a {
position: relative;
width: auto;
height: auto;
padding: 6px 16px;
cursor: pointer;
}
.btn-mnpv p {
font-size: 0.88rem;
color: var(--color-light);
}
.btn-mnpv:hover {
background-color: var(--color-light);
transition: all 0.3s ease;
}
.btn-mnpv:hover p {
color: var(--color-first);
transition: all 0.3s ease;
}
.b-list-ourpn {
position: relative;
width: 100%;
height: auto;
padding: 12px 0;
border-bottom: 1px dashed var(--color-grey4);
}
.title-province-ourpn {
position: relative;
width: 100%;
height: auto;
padding: 0 0 12px 0;
}
.title-province-ourpn p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-first);
}
.list-our-partner {
position: relative;
width: 90%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
margin: 0 auto;
}
.dt-ourpn-ls {
position: relative;
width: calc((100%/5) - 12px);
height: auto;
border: 1px solid var(--color-grey4);
border-radius: 5px;
background-color: var(--color-light);
margin: 6px;
padding: 6px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.08);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.08);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.08);
}
.dt-ourpn-ls .bimg-pn {
position: relative;
width: 100%;
height: 7rem;
display: flex;
margin-bottom: 3px;
}
.dt-ourpn-ls .bimg-pn figure {
position: relative;
width: auto;
height: auto;
max-height: 7rem;
display: flex;
overflow: hidden;
margin: auto;
}
.dt-ourpn-ls .bimg-pn figure .size-imglg {
position: relative;
width: 100%;
height: auto;
object-fit: scale-down;
margin: 0 auto;
}
.dt-ourpn-ls .bname-ourpn {
position: relative;
width: 100%;
height: auto;
padding: 2px 6px;
}
.dt-ourpn-ls .bname-ourpn p {
font-size: 0.88rem;
text-align: center;
color: var(--color-black5);
font-weight: 500;
}
.dt-ourpn-ls .btatno-ourpn,
.dt-ourpn-ls .btaxid-ourpn {
position: relative;
width: 100%;
height: auto;
padding: 2px 4px;
}
.dt-ourpn-ls .btatno-ourpn p,
.dt-ourpn-ls .btaxid-ourpn p {
font-size: 0.81rem;
text-align: center;
}
/* ============= */
/* @media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {} */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.ttr-sch .box-search-ourpn {
width: calc(60% + 60px);
}
.b-menu-pv {
margin-bottom: 0;
}
.list-our-partner {
width: 95%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.ttr-sch .box-search-ourpn {
width: calc(70% + 60px);
}
.b-menu-pv {
margin-bottom: 0;
}
.list-our-partner {
width: 95%;
}
.dt-ourpn-ls {
width: calc((100% / 4) - 12px);
}
}
@media (min-width: 501px) and (max-width: 790px) {
.ttr-sch .box-search-ourpn {
width: calc(70% + 60px);
}
.b-menu-pv {
margin-bottom: 0;
}
.list-our-partner {
width: 100%;
}
.dt-ourpn-ls {
width: calc((100% / 4) - 12px);
}
}
@media (min-width: 0px) and (max-width: 500px) {
.tt-ourpn-sch {
padding-top: 12px;
}
.ttl-ourpn, .ttr-sch {
width: 100%;
}
.ttl-ourpn p {
text-align: center;
}
.ttr-sch .box-search-ourpn {
width: 100%;
}
.ttl-ourpn {
padding-bottom: 6px;
}
.b-menu-pv {
margin-bottom: 0;
}
.btn-mnpv p {
font-size: 0.81rem;
}
.list-our-partner {
width: 100%;
}
.dt-ourpn-ls {
width: calc((100% / 2) - 12px);
}
}
/* =================== =================== */
.tpr-color {
color: transparent !important;
background-color: transparent !important;
}
.tpr-color i {
color: transparent !important;
background-color: transparent !important;
}
/* ============= */
@media (min-width: 791px) {
.fsize-txttd {
font-size: 0.81rem !important;
}
}
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {}
/* =========================================================== */
/* ==================== review 03-09-2024 ==================== */
.box-review-w {
position: relative;
width: 100%;
height: auto;
}
.tltle-pglist {
position: relative;
width: 100%;
height: auto;
padding: 16px 0 10px 10px;
}
.tltle-pglist p {
font-size: 1.25rem;
font-weight: bold;
color: var(--color-txtg);
}
.tltle-pglist p span {
font-size: 0.88rem;
font-weight: normal;
color: var(--color-txtg4);
}
.lines-tt {
position: absolute;
width: 2rem;
height: 2px;
background-color: var(--color-red);
bottom: 10px;
left: 10px;
}
.dt-rvw-list {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
margin-bottom: 20px;
}
.dt-rvw-list .blist-spr {
position: relative;
width: calc((100%/5) - 7.2px);
height: auto;
border: 1px solid var(--color-grey6);
overflow: hidden;
border-radius: 5px;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
cursor: pointer;
margin: 0 9px 9px 0;
}
.dt-rvw-list .blist-spr:hover {
border: 1px solid var(--color-first);
transition: all 0.3s ease;
}
.dt-rvw-list .blist-spr a {
position: relative;
width: 100%;
height: auto;
}
.dt-rvw-list .blist-spr .bimg {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
overflow: hidden;
}
.dt-rvw-list .blist-spr .bimg figure {
position: relative;
width: 100%;
height: 14.1rem;
overflow: hidden;
}
.dt-rvw-list .blist-spr .bimg figure .size-imgrvw {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.dt-rvw-list .blist-spr .bnamepg {
position: relative;
width: 100%;
height: 3.1rem;
padding: 0 10px 5px 10px;
}
.dt-rvw-list .blist-spr .bnamepg h2,
.dt-rvw-list .blist-spr .bnamepg p {
font-size: 0.94rem;
font-weight: bold;
color: var(--color-txtg);
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.dt-rvw-list .blist-spr:hover .bnamepg h2,
.dt-rvw-list .blist-spr:hover .bnamepg p {
color: var(--color-first);
transition: all 0.3s ease;
}
.dt-rvw-list .blist-spr .bdtpg {
position: relative;
width: 100%;
height: auto;
padding: 0 10px 10px 10px;
}
.dt-rvw-list .blist-spr .bdtpg p {
font-size: 0.81rem;
color: var(--color-txtg4);
text-indent: 15px;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
/* hover image */
.dt-rvw-list .blist-spr .bimg figure .size-imgrvw {
display: block;
position: relative;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
.dt-rvw-list .blist-spr:hover .bimg figure .size-imgrvw {
-ms-transform: scale(1.1);
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
/* ============= */
/* @media (min-width: 1400px) {}
@media (min-width: 1200px) and (max-width: 1399px) {} */
@media (min-width: 1200px) {
.dt-rvw-list .blist-spr:nth-child(5n+0) {
margin-right: 0;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.dt-rvw-list .blist-spr:nth-child(5n+0) {
margin-right: 0;
}
.dt-rvw-list .blist-spr .bimg figure {
height: 11.5rem;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.dt-rvw-list .blist-spr {
width: calc((100%/4) - 6.75px);
}
.dt-rvw-list .blist-spr:nth-child(4n+0) {
margin-right: 0;
}
.dt-rvw-list .blist-spr .bimg figure {
height: 11.7rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.dt-rvw-list .blist-spr {
width: calc((100%/4) - 6.75px);
}
.dt-rvw-list .blist-spr:nth-child(4n+0) {
margin-right: 0;
}
.dt-rvw-list .blist-spr .bimg figure {
height: 10.9rem;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.dt-rvw-list .blist-spr {
width: calc((100%/2) - 4.5px);
}
.dt-rvw-list .blist-spr:nth-child(2n+0) {
margin-right: 0;
}
.dt-rvw-list .blist-spr .bimg figure {
height: 12.1rem;
}
}
/* ========================================================== */
/* ================== review dt 03-09-2024 ================== */
.bg-page-view {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
margin: 20px 0;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.04);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.04);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.04);
padding: 16px;
}
.box-name-pgrvw {
position: relative;
width: 100%;
height: auto;
padding: 5px 0 10px 0;
}
.box-name-pgrvw p,
.box-name-pgrvw h1 {
font-size: 1.31rem;
font-weight: bold;
text-align: center;
color: var(--color-txtg);
}
.box-img-main-pgrvw {
position: relative;
width: 100%;
height: auto;
}
.box-img-main-pgrvw figure {
position: relative;
width: 100%;
height: auto;
}
.box-img-main-pgrvw figure .size-imgrvw {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
}
.box-content-pgrvw {
position: relative;
width: 100%;
height: auto;
padding: 10px 0;
}
.box-content-pgrvw p {
font-size: 0.94rem;
color: var(--color-txtg5);
text-indent: 25px;
}
.box-gallery-rvw {
position: relative;
width: 100%;
height: auto;
margin: 10px 0 5px 0;
padding-top: 20px;
border-top: 1px dashed var(--color-grey4);
}
.box-gallery-rvw .spr-img-gll {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.box-gallery-rvw .spr-img-gll .b-list-img {
position: relative;
width: calc((100%/4) - 6.75px);
height: fit-content;
margin: 0 9px 9px 0;
border-radius: 5px;
border: 1px solid var(--color-grey4);
overflow: hidden;
cursor: pointer;
}
.box-gallery-rvw .spr-img-gll .b-list-img figure {
position: relative;
width: 100%;
height: 9.7rem;
overflow: hidden;
}
.box-gallery-rvw .spr-img-gll .b-list-img figure .size-img {
position: relative;
width: 100%;
height: 100%;
object-fit: cover;
}
.box-gallery-rvw .spr-img-gll .b-list-img .b-name-img {
position: relative;
width: 100%;
height: auto;
padding: 5px 10px 3px 10px;
background-color: var(--color-light);
}
.box-gallery-rvw .spr-img-gll .b-list-img .b-name-img p {
font-size: 0.82rem;
color: var(--color-txtg5);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.box-video-rvw {
position: relative;
width: 100%;
height: auto;
margin: 10px 0 5px 0;
padding-top: 14px;
border-top: 1px dashed var(--color-grey4);
/* display: flex; */
/* justify-content: center;
flex-wrap: wrap;
flex-direction: row; */
overflow: hidden;
}
.box-video-rvw .bvideo-tt-yt {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
padding: 0 16px 20px 16px;
margin-bottom: 20px;
border-bottom: 1px dashed var(--color-grey4);
}
.box-video-rvw .bvideo-tt-yt:last-child {
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}
.box-video-rvw .bvideo-tt-yt .title-vdottyt {
position: relative;
width: 100%;
height: auto;
padding-bottom: 6px;
}
.box-video-rvw .bvideo-tt-yt .title-vdottyt p {
font-size: 1rem;
font-weight: bold;
color: var(--color-txtg);
text-align: center;
}
.box-video-rvw .bvideo-tt-yt .b-ifvdottyt {
position: relative;
width: 100%;
height: auto;
overflow: hidden;
display: flex;
/* padding-bottom: 56.25%; */
}
.box-video-rvw .bvideo-tt-yt .b-ifvdottyt iframe {
width: 70%;
margin: 0 auto;
}
.tiktok-embed {
margin-top: 0 !important;
margin-bottom: 0 !important;
}
#hgallery button {
z-index: 600 !important;
}
/* ============= */
@media (min-width: 1200px) {
.box-gallery-rvw .spr-img-gll .b-list-img:nth-child(4n+0) {
margin-right: 0;
}
.box-video-rvw .bvideo-tt-yt .b-ifvdottyt iframe {
height: 436px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
.box-gallery-rvw .spr-img-gll .b-list-img {
width: calc((100% / 3) - 6px);
}
.box-gallery-rvw .spr-img-gll .b-list-img:nth-child(3n+0) {
margin-right: 0;
}
.box-gallery-rvw .spr-img-gll .b-list-img figure {
height: 10.7rem;
}
.box-video-rvw .bvideo-tt-yt .b-ifvdottyt iframe {
height: 436px;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.box-gallery-rvw .spr-img-gll .b-list-img {
width: calc((100% / 3) - 6px);
}
.box-gallery-rvw .spr-img-gll .b-list-img:nth-child(3n+0) {
margin-right: 0;
}
.box-gallery-rvw .spr-img-gll .b-list-img figure {
height: 8.6rem;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.box-gallery-rvw .spr-img-gll .b-list-img {
width: calc((100% / 3) - 6px);
}
.box-gallery-rvw .spr-img-gll .b-list-img:nth-child(3n+0) {
margin-right: 0;
}
.box-gallery-rvw .spr-img-gll .b-list-img figure {
height: 7.9rem;
}
.box-video-rvw .bvideo-tt-yt .b-ifvdottyt iframe {
width: 80%;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.pgrvwdt .container {
padding: 0;
}
.bg-page-view {
margin: 0;
border-radius: 0;
}
.box-gallery-rvw {
padding-left: 16px;
padding-right: 16px;
}
.box-gallery-rvw .spr-img-gll .b-list-img {
width: 100%;
margin-right: 0;
}
.box-gallery-rvw .spr-img-gll .b-list-img figure {
height: auto;
}
.box-video-rvw .bvideo-tt-yt .b-ifvdottyt iframe {
width: 100%;
}
}
/* ================================================================= */
/* ================== about us Gallery 04-09-2024 ================== */
.b-gll-abus-view {
position: relative;
width: 100%;
height: auto;
margin: 20px 0;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
border: 1px solid var(--color-grey3);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
}
.b-gll-abus-view .box-gallery-rvw {
border-top: none;
margin: 0;
padding: 16px 16px 7px 16px;
}
.b-title-all {
position: relative;
width: 100%;
height: auto;
padding-bottom: 12px;
}
.b-title-all p {
font-size: 1.38rem;
font-weight: bold;
color: var(--color-first);
text-indent: 0;
padding: 0;
}
.b-title-all p i {
color: var(--color-first);
}
.b-title-all p span {
color: var(--color-first);
}
.pd-title-all {
padding: 16px 16px 0 16px;
}
.lines-bt-ttl {
position: relative;
width: 5.3rem;
height: 2px;
border-radius: 100px;
background-color: var(--color-txtg4);
margin: -3px 0 0 0;
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.b-title-all p {
font-size: 1.25rem;
}
}
/* =============================================================== */
/* ================= period and price 15-09-2024 ================= */
.box-period--pg {
position: relative;
width: 100%;
height: auto;
margin-bottom: 20px;
}
.box-title-prpg {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 5px;
}
.box-title-prpg p {
font-size: 1.07rem;
font-weight: bold;
}
.box-tb-period {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.tb-head-pr {
position: relative;
width: 100%;
height: auto;
/* max-height: 2.125rem; */
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 5px;
background-color: var(--color-first);
}
.td-hd {
position: relative;
height: auto;
margin: 5px 0;
display: flex;
flex-direction: column;
}
.td-hd p {
font-size: 0.94rem;
/* font-size: 1rem; */
color: var(--color-light);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
margin: auto;
}
.tb-dt-pr {
position: relative;
width: 100%;
height: auto;
}
.list-tb-prdt {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
padding: 0 5px 0 5px;
}
.td-dt {
position: relative;
height: auto;
margin: 5px 0;
display: grid;
padding: 0 10px;
}
.title-name-smb {
display: none;
}
.title-name-smb p {
font-size: 0.94rem;
color: var(--color-txtg);
}
.dt-price-pg {
display: grid;
align-items: center;
}
.dt-price-pg p {
font-size: 0.94rem;
margin: auto 0;
text-align: center;
}
.dt-price-pg i {
font-size: 0.94rem;
margin: auto 0;
text-align: center;
color: var(--color-txtg);
}
.dt-price-pg .fullprice-pg {
font-size: 0.69rem;
text-align: center;
color: var(--color-txtg4);
text-decoration: line-through;
margin-bottom: -5px;
}
.dt-price-pg .totalprice-pg {
font-size: 0.94rem;
text-align: center;
color: var(--color-txtg);
}
.dt-price-pg .currency-pg {
display: none;
color: var(--color-txtg5);
font-size: 0.75rem;
padding: 0 2px;
}
.btxt-range-pr {
display: grid;
align-items: center;
}
.btxt-range-pr p {
font-size: 0.94rem;
color: var(--color-txtg);
}
.btxt-range-pr .txtnote-n {
font-size: 0.81rem;
color: var(--color-blue);
font-weight: normal;
}
.btxt-range-pr .txtnote-n i {
color: var(--color-blue);
}
.btxt-range-pr span {
padding-left: 2px;
}
.txt-prpg-tb {
font-size: 0.94rem;
color: var(--color-txtg);
}
.bicon-acd {
display: none;
}
.bicon-acd i {
font-size: 0.94rem;
color: var(--color-txtg);
text-align: right;
margin: 0 0 0 auto;
}
.icon-aracd-smb {
display: none;
font-size: 0.94rem;
color: var(--color-txtg);
text-align: right;
}
.lines-right-tbhd {
border-right: 1px solid var(--color-grey2);
}
.lines-right-tbhd:last-child {
border-right: none;
}
.lines-right-tbpr {
border-right: 1px solid var(--color-grey4);
}
.lines-right-tbdt {
border-right: 1px solid var(--color-grey4);
}
.lines-bottom-tdbt {
border-bottom: 1px dashed var(--color-grey3);
}
.lines-bottom-tdbt:last-child {
border-bottom: none;
}
.btn-bkavbl {
position: relative;
width: auto;
height: fit-content;
border-radius: 5px;
display: grid;
align-items: center;
margin: auto 0;
}
.btn-bkavbl p {
font-size: 0.94rem;
color: var(--color-light);
padding: 4px 5px;
text-align: center;
}
.btn-bkavbl a {
position: relative;
width: auto;
height: 100%;
color: var(--color-light);
cursor: pointer;
display: grid;
align-items: center;
}
.bg-btn-success {
background-color: var(--color-green);
}
.bg-btn-danger {
background-color: var(--color-red);
}
.bg-btn-warning {
background-color: var(--color-yellow);
}
.bg-btn-danger a {
cursor: default;
}
.balit-center {
align-items: center;
}
.td-dt.size-bdt-tb9 .dt-price-pg .totalprice-pg {
font-size: 0.88rem;
}
.td-dt.size-bdt-tb13 .dt-price-pg .totalprice-pg,
.td-dt.size-bdt-tb14 .dt-price-pg .totalprice-pg {
font-size: 0.88rem;
}
.size-btb0 { width: 3%; }
.size-btb1 { width: 25%; }
.size-btb2 { width: 8.6%; }
.size-btb3 { width: 8.6%; }
.size-btb4 { width: 8.6%; }
.size-btb5 { width: 8.6%; }
.size-btb6 { width: 8.6%; }
.size-btb7 { width: 8.6%; }
.size-btb8 { width: 8.6%; }
.size-btb9 { width: 8.6%; }
.size-btb10 { width: 0; }
.size-btb11 { width: 3.2%; }
.size-btb12 { width: 17.2%; }
.size-btb13 { width: 9.2%; }
.size-btb14 { width: 8%; }
.acd-hd {
position: relative;
width: 28%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.size-bdt-tb0 { width: 11%; padding: 0; }
.size-bdt-tb1 { width: 89%; }
.acd-dt-view {
position: relative;
width: 72%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.size-bdt-tb2 { width: 11.9375%; }
.size-bdt-tb3 { width: 11.9375%; }
.size-bdt-tb4 { width: 11.9375%; }
.size-bdt-tb5 { width: 11.9375%; }
.size-bdt-tb6 { width: 11.9375%; }
.size-bdt-tb7 { width: 11.9375%; }
.size-bdt-tb8 { width: 11.9375%; }
.size-bdt-tb9 { width: 11.9375%; }
.size-bdt-tb10 { width: 0; display: none; }
.size-bdt-tb11 { width: 4.5%; }
.size-bdt-tb12 { width: 23.875%; }
.size-bdt-tb13 { width: 12.7%; }
.size-bdt-tb14 { width: 11.175%; }
/* ============= */
@media (min-width: 992px) {
.lines-right-tbdt:last-child {
border-right: none;
}
.lines-right-tbdt.size-bdt-tb9 {
border-right: none;
}
.td-dt.size-bdt-tb9 {
padding: 0 0 0 4px;
}
.lines-right-tbdt.size-bdt-tb12 {
border-right: none;
}
.td-dt.size-bdt-tb12 {
padding: 0 0 0 4px;
}
.lines-right-tbdt.size-bdt-tb14 {
border-right: none;
}
.td-dt.size-bdt-tb14 {
padding: 0 0 0 4px;
}
}
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-tb-period {
border-radius: 0;
border: none;
}
}
@media (min-width: 0px) and (max-width: 991px) {
.lines-bottom-tdbt {
/* border-bottom: none; */
border-bottom: 2px solid var(--color-grey6);
}
.lines-bottom-tdbt:last-child {
border-bottom: 2px solid var(--color-grey6);
}
.bg-st-tttbpr {
background-color: var(--color-first);
border-bottom: 1px solid var(--color-first);
}
.bg-scc-tttbpr {
background-color: var(--color-green);
border-bottom: 1px solid var(--color-green);
}
.bg-dg-tttbpr {
background-color: var(--color-red);
border-bottom: 1px solid var(--color-red);
}
.bg-wn-tttbpr {
background-color: var(--color-yellow);
border-bottom: 1px solid var(--color-yellow);
}
.bg-st-tttbpr .dt-price-pg i, .bg-st-tttbpr .btxt-range-pr p, .bg-st-tttbpr .bicon-acd i,
.bg-scc-tttbpr .dt-price-pg i, .bg-scc-tttbpr .btxt-range-pr p, .bg-scc-tttbpr .bicon-acd i,
.bg-dg-tttbpr .dt-price-pg i, .bg-dg-tttbpr .btxt-range-pr p, .bg-dg-tttbpr .bicon-acd i,
.bg-wn-tttbpr .dt-price-pg i, .bg-wn-tttbpr .btxt-range-pr p, .bg-wn-tttbpr .bicon-acd i,
.btxt-range-pr .txtnote-n, .btxt-range-pr .txtnote-n i {
color: var(--color-light);
}
.btxt-range-pr .txtnote-n {
padding-top: 5px;
margin-top: 5px;
border-top: 1px dashed var(--color-light);
}
.lines-right-tbdt,
.lines-right-tbpr {
border-right: none;
}
.tb-head-pr {
display: none;
}
.title-name-smb {
display: block;
}
.acd-hd,
.acd-dt-view {
width: 100%;
}
.acd-hd {
padding: 2px 16px;
}
.list-tb-prdt {
padding: 0;
margin-bottom: 5px;
}
.btxt-range-pr {
width: calc(100% - 1.6rem);
padding-right: 10px;
}
.btxt-range-pr p .cl-red {
color: var(--color-light) !important;
}
.bicon-acd {
width: 1.6rem;
display: flex;
}
.td-dt {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
padding: 0 16px 10px 16px;
}
.txt-prpg-tb {
width: calc(100% - 2rem);
padding-right: 10px;
}
.icon-aracd-smb {
display: block;
}
.dt-price-pg {
display: flex;
}
.dt-price-pg .fullprice-pg {
margin-bottom: auto;
padding-right: 6px;
}
.dt-price-pg .currency-pg {
display: inline;
padding: 0 0 0 5px;
}
.box-sizemb-bk {
position: relative;
width: 100%;
height: auto;
}
.bnt-sizemb-bk {
position: relative;
width: 70%;
height: auto;
margin: 0 auto;
border-radius: 5px;
overflow: hidden;
}
.bnt-sizemb-bk a {
font-size: 1rem;
color: var(--color-light);
cursor: pointer;
}
.bnt-sizemb-bk p {
font-size: 1rem;
text-align: center;
color: var(--color-light);
padding: 6px 12px;
}
.btn-bkavbl p {
padding: 2px 16px;
}
.bg-btn-bkscc {
background-color: var(--color-green);
}
.bg-btn-bkdg {
background-color: var(--color-red);
}
.bg-btn-bkwn {
background-color: var(--color-yellow);
}
.bg-btn-bkgy {
background-color: var(--color-grey4);
}
.bg-btn-bkgy p {
color: var(--color-txtg);
}
.td-dt.size-bdt-tb0, .td-dt.size-bdt-tb1 {
padding-bottom: 0;
}
.size-bdt-tb0 {
padding: 0;
}
.td-dt.size-bdt-tb1 {
padding-left: 10px;
padding-right: 0;
}
.size-bdt-tb0 { width: 2rem; }
.size-bdt-tb1 { width: calc(100% - 2rem); }
.size-bdt-tb2, .size-bdt-tb3, .size-bdt-tb4, .size-bdt-tb5,
.size-bdt-tb6, .size-bdt-tb7, .size-bdt-tb8, .size-bdt-tb9,
.size-bdt-tb11, .size-bdt-tb12, .size-bdt-tb13, .size-bdt-tb14 {
width: 100%;
border-bottom: 1px dashed var(--color-grey3);
}
.size-bdt-tb2 {
order: 1;
}
.size-bdt-tb3 {
order: 2;
}
.size-bdt-tb4 {
order: 3;
}
.size-bdt-tb5 {
order: 3;
/* order: 4; */
}
.size-bdt-tb6 {
order: 5;
/* order: 6; */
}
.size-bdt-tb7 {
order: 6;
/* order: 7; */
}
.size-bdt-tb8 {
order: 7;
/* order: 8; */
}
.size-bdt-tb9 {
order: 9;
}
.size-bdt-tb10 {
order: 10;
width: 100%;
display: block;
}
.size-bdt-tb11 {
order: 4;
/* order: 5; */
}
.size-bdt-tb12 {
order: 9;
}
.size-bdt-tb13 {
order: 8;
}
.size-bdt-tb14 {
order: 9;
}
.accordion-dt-prsmb {
position: relative;
width: 100%;
height: auto;
}
.accordion-dt-prsmb::-webkit-scrollbar {
display: none;
}
.acd-list {
cursor: pointer;
}
.acd-list.showawdt {
/* margin-bottom: 0; */
}
.acd-list .acd-smb {
display: flex;
align-items: center;
justify-content: space-between;
}
.acd-list .acd-smb .aricacd {
transition: all 0.3s ease;
}
.acd-list.showawdt .acd-smb .aricacd {
transform: rotate(-180deg);
}
.acd-list .acd-dt-view {
display: none;
}
.acd-list.showawdt .acd-dt-view {
display: flex;
}
}
/* ========================================================== */
/* ================= social home 16-09-2024 ================= */
.sc--scmd-h {
position: relative;
width: 100%;
height: auto;
}
.box-social-h {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
background-color: var(--color-light);
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
margin-top: 20px;
padding: 16px;
}
.btitle-sch {
position: relative;
width: 100%;
height: auto;
padding-bottom: 10px;
}
.btitle-sch p {
font-size: 1rem;
font-weight: bold;
color: var(--color-txtg);
text-align: center;
text-decoration: underline;
}
.bsch-view {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
flex-wrap: wrap;
flex-direction: row;
}
.btn-sch {
position: relative;
width: 9rem;
height: auto;
margin: 0 16px;
overflow: hidden;
}
.btn-sch2 {
position: relative;
width: 4rem;
height: auto;
margin: 0 16px;
overflow: hidden;
}
.btn-sch a,
.btn-sch2 a {
position: relative;
width: auto;
height: auto;
cursor: pointer;
}
.biconsch {
position: relative;
width: 3.2rem;
height: 3.2rem;
border-radius: 100%;
display: flex;
overflow: hidden;
margin: 0 auto;
}
.biconsch p {
font-size: 2rem;
color: var(--color-light);
display: flex;
margin: auto;
text-align: center;
}
.biconsch i {
color: var(--color-light);
}
.name-scmd-h {
font-size: 0.88rem;
color: var(--color-txtg5);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
padding-top: 3px;
}
.bgiconsc-fb {
background-color: var(--color-fb);
}
.bgiconsc-line {
background-color: var(--color-line);
}
.bgiconsc-ig {
background-color: var(--color-ig);
}
.bgiconsc-tt {
background-color: var(--color-tt);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.box-social-h {
padding-bottom: 0;
}
.btn-sch {
margin-bottom: 16px;
}
.btn-sch2 {
width: calc(50% - 32px);
margin-bottom: 16px;
}
}
@media (min-width: 0px) and (max-width: 1199px) {
.box--main2 {
display: flex;
flex-wrap: wrap;
}
.sc--img-slider {
order: 1;
}
.box--sh2-ct-ro-smb {
order: 2;
}
.sc--banner-l-pm {
order: 3;
}
.sc--scmd-h {
order: 4;
}
.sc--bpushsell {
order: 5;
}
.order-box-pgfiamai {
order: 6;
margin-top: 20px !important;
}
.sc--program-cl-f {
order: 7;
}
.sc--review-f {
order: 8;
}
.sc--program-rw-half-f {
order: 9;
}
.sc--article-card-f {
order: 10;
}
.sc--review-f {
order: 11;
}
.sc--footage-data-f {
order: 12;
}
}
.blist-tvp- .n-vpr-box, .blist-tvp- .n-vpr-box a {
display: flex;
justify-content: stretch;
align-items: center;
flex-wrap: wrap;
flex-direction: row;
}
.blist-tvp- .n-vpr-box i {
padding-right: 6px;
}
.blist-tvp- .n-vpr-box .txt-prpg-n {
width: 64%;
}
.blist-tvp- .n-vpr-box .txt-blset-n {}
.baccordiontvp {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: stretch;
}
.btxt-namepr {
order: 1;
font-weight: bold !important;
}
.txt-datepr {
order: 2;
}
.txt-tvpr {
order: 3;
}
.baccordiontvp::before {
order: 4;
}
/* ============= */
@media (min-width: 791px) {
.txt-datepr {
margin-left: auto;
}
.txt-tvpr {
padding-left: 5px;
}
}
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {
.blist-tvp- .n-vpr-box .txt-prpg-n {
width: 58%;
}
}
@media (min-width: 791px) and (max-width: 991px) {
.blist-tvp- .n-vpr-box .txt-prpg-n {
width: 46%;
}
}
@media (min-width: 501px) and (max-width: 790px) {
.blist-tvp- {
padding: 2px 6px;
}
}
@media (min-width: 0px) and (max-width: 500px) {}
@media (min-width: 0px) and (max-width: 790px) {
.blist-tvp- .n-vpr-box i {
width: 13%;
}
.blist-tvp- .n-vpr-box .txt-prpg-n {
width: 87%;
}
.blist-tvp- .n-vpr-box .txt-blset-n {
margin: 0 auto;
}
.txt-datepr {
padding-left: 5px;
width: 65%;
}
.txt-tvpr {
order: 4;
width: 100%;
}
.baccordiontvp::before {
order: 3;
margin-left: auto;
}
}
/* ============================================================= */
/* ================= Push Sell Home 19-09-2024 ================= */
.sc--bpushsell {
position: relative;
width: 100%;
height: auto;
}
.box-bg-pstb {
position: relative;
width: 100%;
height: auto;
background-color: var(--color-light);
border-radius: 5px;
overflow: hidden;
box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-webkit-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
-moz-box-shadow: 0px 0px 5px 2px rgba(var(--color-dark-rgb), 0.05);
margin: 20px 0;
padding: 16px;
}
/* ====== title ====== */
.box-title-short {
position: relative;
width: 100%;
height: auto;
padding: 5px 16px 16px 16px;
}
.bname-title {
position: relative;
width: 100%;
height: auto;
padding-bottom: 5px;
}
.bname-title p {
font-size: 1.25rem;
font-weight: bold;
text-align: center;
color: var(--color-txtg);
}
.bname-title i {
color: var(--color-txtg);
}
.color-txt-namett {
color: var(--color-txtg);
}
.color-txt-namett2 {
color: var(--color-first);
}
.blines-spr {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
}
.lineslr-spr {
position: relative;
width: 100px;
height: auto;
border-top: 1px solid var(--color-grey5);
}
.circlect-spr {
position: relative;
width: 12px;
height: 12px;
border: 1px solid var(--color-icon-yl);
border-radius: 100%;
margin: 0 8px;
}
.bshort-title {
position: relative;
width: 100%;
height: auto;
padding-top: 5px;
}
.bshort-title p {
font-size: 0.94rem;
font-weight: normal;
text-align: center;
color: var(--color-txtg4);
}
/* ====== dt ====== */
.box-table-full {
position: relative;
width: 100%;
height: auto;
margin-bottom: 20px;
}
.title-tb {
position: relative;
width: 100%;
height: auto;
padding: 0 0 5px 5px;
}
.title-tb p {
font-size: 1.07rem;
font-weight: bold;
}
.table--b {
position: relative;
width: 100%;
height: auto;
border-radius: 5px;
overflow: hidden;
border: 1px solid var(--color-grey3);
}
.b--head-tb {
position: relative;
width: 100%;
height: auto;
max-height: 2.125rem;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
background-color: var(--color-first);
}
.td--tbhd {
position: relative;
height: auto;
margin: 5px 0;
padding: 0 6px;
}
.td--tbhd p {
font-size: 0.94rem;
color: var(--color-light);
text-align: center;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.b-dt-tb {
position: relative;
width: 100%;
height: auto;
}
.tr-list-box {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.td--tbdt {
position: relative;
height: auto;
margin: 5px 0;
display: grid;
padding: 0 6px;
}
.td--tbdt.size--btb1 {
padding-left: 12px;
}
.td--tbdt p {
font-size: 0.88rem;
}
.btxt-smb-range {
position: relative;
width: 100%;
height: auto;
margin: auto 0;
}
.btxt-smb-range p {
font-size: 0.88rem;
color: var(--color-txtg);
}
.btxt-smb-range span {
font-size: 0.81rem;
}
.btxt-smb-range i {
font-size: 0.81rem;
}
.btxt-smb-range .show-holiday {
font-size: 0.75rem;
color: var(--color-red);
}
.bicon-smb-acd {
display: none;
}
.bicon-smb-acd i {
font-size: 0.88rem;
color: var(--color-txtg);
text-align: right;
margin: 0 0 0 auto;
}
.smb-tt-name {
position: relative;
/* width: 100%;
height: auto; */
display: none;
}
.smb-tt-name p {
font-size: 0.88rem;
color: var(--color-txtg);
}
.view-dt-pgn {
position: relative;
/* width: 100%;
height: auto; */
margin: auto 0;
}
.view-dt-pgn p {
font-size: 0.88rem;
text-align: center;
}
.size--btb3 .view-dt-pgn p {
text-align: left;
}
.smb-dtpgn-full {
padding-left: 6px;
}
.full-price-prpg {
font-size: 0.75rem !important;
color: var(--color-txtg4);
text-decoration: line-through;
margin-bottom: -5px;
}
.total-price-prpg {
font-size: 0.94rem !important;
font-weight: bold;
color: var(--color-red);
}
.crc-price-prpg {
font-size: 0.63rem;
font-weight: normal;
color: var(--color-txtg4);
display: none;
}
.btn-avblc {
position: relative;
width: auto;
height: fit-content;
border-radius: 5px;
display: grid;
align-items: center;
margin: auto 0;
}
.btn-avblc a {
position: relative;
width: auto;
height: 100%;
color: var(--color-light);
cursor: pointer;
display: grid;
align-items: center;
}
.btn-avblc p {
font-size: 0.88rem;
color: var(--color-light);
padding: 4px 5px;
text-align: center;
}
.bg-avblc-st {
background-color: var(--color-first);
}
.bg-avblc-scc {
background-color: var(--color-green);
}
.bg-avblc-dg {
background-color: var(--color-red);
}
.bg-avblc-wn {
background-color: var(--color-yellow);
}
.smb-acd-title {
position: relative;
width: 30%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.smb-acd-dt {
position: relative;
width: 70%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.lines-rtbhdhs, .lines-rtbhd {
border-right: 1px solid var(--color-grey2);
}
.lines-rtbhd:last-child {
border-right: none;
}
.lines-bttbdt {
border-bottom: 1px dashed var(--color-grey3);
}
.lines-bttbdt:last-child {
border-bottom: none;
}
.lines-rtbdths, .lines-rtbdt {
border-right: 1px solid var(--color-grey4);
}
.lines-rtbdt:last-child {
border-right: none;
}
.lines-bdnone-t { border-top: none; }
.lines-bdnone-b { border-bottom: none; }
.lines-bdnone-l { border-left: none; }
.lines-bdnone-r { border-right: none; }
.txtal-l { text-align: left !important; }
.txtal-r { text-align: right !important; }
.txtal-c { text-align: center !important; }
.size--btb1 { width: 60%; }
.size--btb2 { width: 40%; }
.size--btb3 { width: 50%; }
.size--btb4 { width: 15%; }
.size--btb5 { width: 10.5%; }
.size--btb6 { width: 7.5%; }
.size--btb7 { width: 7.5%; }
.size--btb8 { width: 9.5%; }
.size--btb9 { display: none; }
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.sc--bpushsell .container {
padding: 0;
}
.bname-title p {
font-size: 1.13rem;
}
.bshort-title p {
font-size: 0.88rem;
}
}
@media (min-width: 0px) and (max-width: 991px) {
.b--head-tb {
display: none;
}
.btxt-smb-range p, .btxt-smb-range .show-holiday,
.size--btb2 .view-dt-pgn p, .bicon-smb-acd i {
color: var(--color-light);
}
.size--btb2 .view-dt-pgn p {
text-align: right;
}
.td--tbdt {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-direction: row;
padding: 0 12px 10px 12px;
align-items: center;
}
.td--tbdt.size--btb1, .td--tbdt.size--btb2 {
padding-bottom: 0;
}
.size--btb2 .view-dt-pgn {
width: calc(100% - 1.4rem);
}
.bicon-smb-acd {
width: 1.4rem;
display: flex;
}
.size--btb3 .view-dt-pgn p {
text-align: center;
font-weight: bold;
}
.smb-tt-name {
display: block;
}
.lines-rtbdths, .lines-rtbdt {
border-right: none;
}
.lines-bttbdt {
border-bottom: none;
}
.smb-acd-title, .smb-acd-dt {
width: 100%;
}
.smb-dtpgn-full {
width: 100%;
padding-left: 0;
}
.dpn-smbttn {
display: none;
}
.crc-price-prpg {
display: inline;
}
.size--btb5 .view-dt-pgn {
display: flex;
justify-content: stretch;
align-items: baseline;
}
.size--btb5 .view-dt-pgn .full-price-prpg {
padding-right: 3px;
font-size: 0.63rem !important;
}
.btn-avblc p {
padding: 2px 16px;
}
.b-btnbk-smb {
position: relative;
width: 100%;
height: auto;
}
.btn-booking-smb {
position: relative;
width: 70%;
height: auto;
margin: 0 auto;
border-radius: 5px;
overflow: hidden;
}
.btn-booking-smb a {
font-size: 1rem;
color: var(--color-light);
cursor: pointer;
}
.btn-booking-smb p {
font-size: 1rem;
text-align: center;
color: var(--color-light);
padding: 6px 12px;
}
.box-bg-pstb {
margin-bottom: 0;
}
.bg-ttsmb-st {
background-color: var(--color-first);
}
.bg-ttsmb-scc, .bg-btnbk-scc {
background-color: var(--color-green);
}
.bg-ttsmb-dg, .bg-btnbk-dg {
background-color: var(--color-red);
}
.bg-ttsmb-wn, .bg-btnbk-wn {
background-color: var(--color-yellow);
}
.bg-btnbk-gy {
background-color: var(--color-grey4);
}
.bg-btnbk-gy p {
color: var(--color-txtg);
}
.size--btb1 {
width: 55%;
}
.size--btb2 {
width: 45%;
}
.size--btb3, .size--btb4, .size--btb5,
.size--btb6, .size--btb7, .size--btb8 {
width: 100%;
border-bottom: 1px dashed var(--color-grey3);
}
.size--btb9 {
width: 100%;
display: flex;
padding-bottom: 5px;
}
.tr-list-box {
margin-bottom: 5px;
}
.tr-list-box:last-child {
margin-bottom: 0;
}
.acd-dt-vsmb {
position: relative;
width: 100%;
height: auto;
}
.acd-dt-vsmb::-webkit-scrollbar {
display: none;
}
.acd-dtlist {
cursor: pointer;
}
.acd-dtlist.acdshowdt {}
.acd-dtlist .acd-qsiar {
display: flex;
align-items: center;
justify-content: space-between;
}
.acd-dtlist .acd-qsiar .iconarhd {
transition: all 0.3s ease;
}
.acd-dtlist.acdshowdt .acd-qsiar .iconarhd {
transform: rotate(-180deg);
}
.acd-dtlist .smb-acd-dt {
display: none;
}
.acd-dtlist.acdshowdt .smb-acd-dt {
display: flex;
}
}
/* ============================================== */
/* ================= 30-09-2024 ================= */
.cln-txt-fp-s {
margin-bottom: -10px;
margin-top: 5px;
}
.cln-txt-fp-s .txt-price-full-box1 {
padding-right: 0;
}
.b-pg-discount-n {
position: relative;
width: 100%;
height: auto;
border-bottom: 1px dashed var(--color-grey3);
background-color: rgba(var(--color-second-rgb), 0.1);
padding: 2px 12px;
}
.txt-dc-n-show {
font-size: 0.94rem;
font-weight: normal;
text-align: center;
color: var(--color-txtg4);
}
.txt-dc-n-show span {
color: var(--color-red);
font-weight: bold;
}
.txt-dc-n-show i {
color: var(--color-icon-yl);
}
/* ============= */
@media (min-width: 1200px) {}
@media (min-width: 992px) and (max-width: 1199px) {}
@media (min-width: 791px) and (max-width: 991px) {}
@media (min-width: 501px) and (max-width: 790px) {}
@media (min-width: 0px) and (max-width: 500px) {
.b-pg-discount-n {
/* display: none; */
position: absolute;
width: auto;
padding: 0;
top: 0;
right: 6px;
background-color: transparent;
border-bottom: none;
}
.txt-dc-n-show {
font-size: 0.75rem;
}
.cln-txt-fp-s {
margin-bottom: -8px;
margin-top: 0;
}
.txt-price-full-box1 {
font-size: 0.69rem;
}
}
.box-dateep-n {
padding-top: 5px;
}
.bg-b-dateep-n {
background-color: var(--color-orange);
}
.size-fdateep-n {
font-size: 0.85rem !important;
}
@media (min-width: 501px) and (max-width: 790px) {
.size-fdateep-n {
font-size: 0.81rem !important;
}
}
@media (min-width: 0px) and (max-width: 500px) {
.size-fdateep-n {
font-size: 0.75rem !important;
}
}
/* ============================================== */
/* ================= 2024-11-27 ================= */
.box-hdtb-h {
position: relative;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
border-right: 1px solid var(--color-first);
padding: 2px 10px;
background-color: rgba(var(--color-second-rgb), 0.8);
border-bottom: 1px solid var(--color-first);
}
.td-dt-bn {
position: relative;
height: auto;
padding: 0 5px;
border-right: 1px solid var(--color-grey4);
}
.td-dt-bn p {
font-size: 0.88rem;
font-weight: 500;
color: var(--color-txtg);
/* text-align: center; */
}
.td-dt-bn.std1-wn {
padding-left: 26px;
}
.box-vdttb-n {
position: relative;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
border-right: 1px solid var(--color-first);
padding: 2px 10px;
}
.box-vdttb-n a {
position: relative;
width: 100%;
height: auto;
display: flex;
justify-content: stretch;
flex-wrap: wrap;
flex-direction: row;
}
.td-dt-n {
position: relative;
height: auto;
padding: 0 5px;
border-right: 1px solid var(--color-grey4);
}
.td-dt-n p {
font-size: 0.88rem;
color: var(--color-txtg);
}
.td-dt-n p i {
color: var(--color-icon-yl);
padding-right: 3px;
}
.td-dt-n p span {
font-size: 0.75rem;
color: var(--color-txtg);
padding-left: 3px;
}
.std2-wn p, .std3-wn p {
text-align: center;
position: relative;
top: 50%;
transform: translateY(-50%);
}
.td-dt-n .txt-price-ln {}
.td-dt-n .clbl-n {
color: var(--color-blue);
font-weight: bold;
}
.td-dt-n .clbl-redn {
color: var(--color-red);
font-weight: bold;
}
.td-dt-n .clbl-wln {
color: var(--color-icon-yl);
font-weight: bold;
}
.stb-wn {
width: 50%;
}
.std1-wn {
width: calc(70% - 3.5rem);
}
.std2-wn {
width: 30%;
}
.std3-wn {
width: 3.5rem;
}
.box-hdtb-h:nth-child(2) {
border-right: none;
}
.td-dt-bn:last-child, .td-dt-n:last-child {
border-right: none;
}
/* ============= */
@media (min-width: 791px) {
.box-vdttb-n:nth-child(2n+0) {
border-right: none;
}
.box-vdttb-n:nth-child(4n+1),
.box-vdttb-n:nth-child(4n+2) {
background-color: rgba(var(--color-second-rgb), 0.5);
}
}
@media (min-width: 0px) and (max-width: 790px) {
.stb-wn {
width: 100%;
}
.box-hdtb-h:nth-child(2) {
display: none;
}
.box-hdtb-h, .box-vdttb-n {
border-right: none;
}
.box-vdttb-n:nth-child(2n+0) {
background-color: rgba(var(--color-second-rgb), 0.5);
}
}
/* ===================================================== */
/* ================= flight 2024-12-20 ================= */
.box-flight-pr-n {
position: relative;
width: 100%;
height: auto;
padding-top: 2px;
}
.set-txt-flight {
font-weight: 500 !important;
color: var(--color-txtg5) !important;
}
.size-txt1-flight {
font-size: 0.75rem !important;
}
.size-txt2-flight {}
.set-txt-flight span {}
.set-txt-flight .txt-spr-flight {}
.txt-holiday-pr-n {
font-size: 0.81rem !important;
color: var(--color-red) !important;
font-weight: normal !important;
}
.btxt-range-pr p {
font-weight: bold;
color: var(--color-first);
}
.btxt-range-pr p span {
font-weight: normal;
}
/* ============= */
@media (min-width: 992px) and (max-width: 1199px) {
.size-txt1-flight {
font-size: 0.69rem !important;
}
}
@media (min-width: 0px) and (max-width: 991px) {
.box-flight-pr-n {
display: none;
}
.txt-holiday-pr-n {
color: var(--color-light) !important;
}
}