a {
  outline: none !important;
}
a.no-text-decoration {
  text-decoration: none;
  color: inherit;
}

/*flex*/
.flex {
  display: flex;
  flex-wrap: nowrap;
}

.flex-row {
  flex-direction: row;
}

.flex-row-reverse {
  flex-direction: row-reverse;
}

.flex-column {
  flex-direction: column;
}

.flex-column-reverse {
  flex-direction: column-reverse;
}

.flex-wrap {
  flex-wrap: wrap;
}

.flex-no-wrap {
  flex-wrap: nowrap;
}

.flex-wrap-reverse {
  flex-wrap: wrap-reverse;
}

.flex-justify-start {
  justify-content: flex-start;
}

.flex-justify-center {
  justify-content: center;
}

.flex-justify-end {
  justify-content: flex-end;
}

.flex-item {
  flex-grow: 0;
  overflow: hidden;
  flex-shrink: 0;
}
.flex-item.shrink-unset {
  flex-shrink: unset;
}

.flex-align-center {
  align-items: center;
}

.flex-1 {
  flex-grow: 1;
  flex-basis: 0;
}

.flex-fit-item {
  height: 100%;
  width: 100%;
  flex-shrink: 1;
  overflow: hidden;
}

/*display*/
.inline-block {
  display: inline-block;
}

.display-none {
  display: none;
}

/*position*/
.vertical-middle::before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.vertical-middle-content {
  display: inline-block;
  vertical-align: middle;
}

/*cursor*/
.cursor-pointer {
  cursor: pointer;
}

/*image*/
.image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-origin: content-box;
}
.image.image-cover {
  background-size: cover;
}

/*text*/
.text-nowrap {
  white-space: nowrap;
}

.text-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.text-ellipsis-2 {
  word-break: break-all;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.circle {
  border-radius: 50%;
}

[visibility=hidden] {
  visibility: hidden;
}

.component-styled-text strong,
.html strong {
  font-weight: bold;
}
.component-styled-text em,
.html em {
  font-style: italic;
}

.rich-text-cke5 figure.image {
  margin: 0;
  font-size: 0;
}

.rich-text-cke5 figure.image img {
  width: 100%;
}

.headroom {
  will-change: transform;
  transition: transform 200ms linear;
}

.headroom.headroom--pinned {
  transform: translateY(0%);
}

.headroom.sticky.headroom--unpinned {
  transform: translateY(-100%);
}

.plyr {
  height: 100% !important;
}

.plyr .plyr__video-wrapper--fixed-ratio {
  padding-bottom: 0 !important;
  height: 100% !important;
}

.swiper-container-vertical > .swiper-pagination-fraction {
  display: inline-block;
  left: unset;
  right: 0;
  width: unset;
  bottom: unset;
  top: 50%;
  transform: translateY(-50%);
}

.swiper-container-vertical > .swiper-pagination-progressbar {
  left: unset !important;
  right: 0 !important;
}

.designer div[app-id=ID_COMMON_NAVIGATOR] {
  visibility: visible;
}
.designer nav.menu-c li.designer-active {
  z-index: 100 !important;
}
.designer nav.menu-c li.designer-active > ul {
  display: block;
}
.designer nav.menu-c ul[app-id=off-comp-nav-ul] > li > ul[full-width] {
  position: relative !important;
  left: calc(0px - var(--item-left-designer)) !important;
  width: var(--nav-width-designer) !important;
}
.designer nav.menu-c ul[app-id=off-comp-nav-ul] > li > ul[full-height] {
  position: relative !important;
  top: var(--nav-height-designer) !important;
  height: calc(100vh - var(--nav-height-designer)) !important;
}

div[app-id=ID_COMMON_NAVIGATOR] {
  z-index: 2147483640;
}
div[app-id=ID_COMMON_NAVIGATOR][phone-logo-enabled] nav.menu-c .menu-button::before {
  content: "";
  background-image: var(--nav-phone-logo);
  width: var(--nav-phone-logo-width);
  height: var(--nav-phone-logo-height);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  display: inline-block;
  vertical-align: middle;
}

nav.menu-c {
  margin: 0 auto !important;
  overflow: visible !important;
  display: flex !important;
  font-size: 0;
}
nav.menu-c ul[app-id=off-comp-nav-ul] {
  width: 100%;
}
nav.menu-c ul[app-id=off-comp-nav-ul] > li > ul[full-width] {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  width: unset !important;
}
nav.menu-c ul[app-id=off-comp-nav-ul] > li > ul[full-height] {
  top: var(--nav-height) !important;
  height: calc(100vh - var(--nav-height)) !important;
}
nav.menu-c,
nav.menu-c ul,
nav.menu-c ul li,
nav.menu-c ul li div.item,
nav.menu-c .menu-button {
  margin: 0;
  padding: 0;
  list-style: none;
  background-color: inherit;
  position: relative;
  box-sizing: border-box;
  overflow: visible !important;
}
nav.menu-c .menu-button {
  font-size: 16px;
  cursor: pointer;
  display: none;
  padding: 10px;
}
nav.menu-c ul li {
  display: inline-block;
  cursor: pointer;
  vertical-align: middle;
}
nav.menu-c ul li.high-light-page-item {
  background-color: var(--high-light-page-background-color) !important;
  color: var(--high-light-page-color) !important;
}
nav.menu-c ul ul > li {
  display: block;
}
nav.menu-c li > ul {
  display: none;
  position: absolute;
  left: 0;
  top: 100%;
  min-width: -webkit-max-content;
  min-width: -moz-max-content;
  min-width: max-content;
}
nav.menu-c.menuc-2 li > ul {
  overflow: hidden !important;
}
nav.menu-c li > .item {
  font-size: 0;
}
nav.menu-c li > .item > .comp {
  display: block;
  font-size: 16px;
}
nav.menu-c li:hover {
  z-index: 10 !important;
}
nav.menu-c a {
  text-decoration: none;
}
nav.menu-c .folder.point {
  display: none;
  position: absolute;
  right: 10px;
  top: 0;
  width: 50px;
  bottom: 0;
}
nav.menu-c .folder.hamburger {
  position: absolute;
  right: 10px;
  width: 50px;
  top: 50%;
  padding: 0;
  transform: translateY(-50%) scale(0.6);
  opacity: 1;
}
nav.menu-c .folder.hamburger .hamburger-inner {
  background-color: var(--nav-phone-folder-color);
}
nav.menu-c .folder.hamburger .hamburger-inner::before {
  background-color: var(--nav-phone-folder-color);
}
nav.menu-c .folder.hamburger .hamburger-inner::after {
  background-color: var(--nav-phone-folder-color);
}

html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c.menu-c2:not(.disable-phone) > .menu-button, html.responsive-phone nav.menu-c.menu-c2:not(.disable-phone) > .menu-button {
  padding-left: var(--nav-phone-head-padding-left-right);
  padding-right: var(--nav-phone-head-padding-left-right);
  text-align: var(--nav-phone-head-horizontal-align);
}
html.responsive-pc nav.menu-c li.keep-active-pc > ul {
  display: block !important;
}
html.responsive-pad nav.menu-c li.keep-active-pad > ul {
  display: block !important;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c li.keep-active-phone > ul, html.responsive-phone nav.menu-c li.keep-active-phone > ul {
  display: block !important;
}

nav.menu-c.disalble-phone li:hover > ul,
html.responsive-pc nav.menu-c li:hover > ul,
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR]:not(.pad-to-phone) li:hover > ul {
  display: block !important;
}
nav.menu-c.disalble-phone li.keep-active > ul,
html.responsive-pc nav.menu-c li.keep-active > ul,
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR]:not(.pad-to-phone) li.keep-active > ul {
  display: block !important;
}
nav.menu-c.disalble-phone li:hover > ul.flex,
html.responsive-pc nav.menu-c li:hover > ul.flex,
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR]:not(.pad-to-phone) li:hover > ul.flex {
  display: flex !important;
}

.designer [app-id=device-entity].responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone), .designer [app-id=device-entity].responsive-phone nav.menu-c:not(.disable-phone), html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone), html.responsive-phone nav.menu-c:not(.disable-phone) {
  display: flex !important;
  flex-direction: column;
}
.designer [app-id=device-entity].responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) > ul, .designer [app-id=device-entity].responsive-phone nav.menu-c:not(.disable-phone) > ul, html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) > ul, html.responsive-phone nav.menu-c:not(.disable-phone) > ul {
  text-align: left !important;
  width: 100% !important;
}
.designer [app-id=device-entity].responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) ul > li, .designer [app-id=device-entity].responsive-phone nav.menu-c:not(.disable-phone) ul > li, html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) ul > li, html.responsive-phone nav.menu-c:not(.disable-phone) ul > li {
  display: block;
  width: 100% !important;
  float: none !important;
}
.designer [app-id=device-entity].responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li > ul, .designer [app-id=device-entity].responsive-phone nav.menu-c:not(.disable-phone) li > ul, html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li > ul, html.responsive-phone nav.menu-c:not(.disable-phone) li > ul {
  position: relative !important;
  top: 0;
}
.designer [app-id=device-entity].responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li > ul[full-height], .designer [app-id=device-entity].responsive-phone nav.menu-c:not(.disable-phone) li > ul[full-height], html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li > ul[full-height], html.responsive-phone nav.menu-c:not(.disable-phone) li > ul[full-height] {
  height: 100vh !important;
  top: 0 !important;
}
.designer [app-id=device-entity].responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li.sub-menu > .item, .designer [app-id=device-entity].responsive-phone nav.menu-c:not(.disable-phone) li.sub-menu > .item, html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li.sub-menu > .item, html.responsive-phone nav.menu-c:not(.disable-phone) li.sub-menu > .item {
  display: flex;
  flex-direction: row;
  font-size: 0;
}
.designer [app-id=device-entity].responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li.sub-menu > .item > .comp, .designer [app-id=device-entity].responsive-phone nav.menu-c:not(.disable-phone) li.sub-menu > .item > .comp, html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li.sub-menu > .item > .comp, html.responsive-phone nav.menu-c:not(.disable-phone) li.sub-menu > .item > .comp {
  display: inline-block;
  flex-grow: 1;
  flex-shrink: 0;
}
.designer [app-id=device-entity].responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) .comp, .designer [app-id=device-entity].responsive-phone nav.menu-c:not(.disable-phone) .comp, html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) .comp, html.responsive-phone nav.menu-c:not(.disable-phone) .comp {
  margin: 10px !important;
}
.designer [app-id=device-entity].responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) .comp.hide-in-phone, .designer [app-id=device-entity].responsive-phone nav.menu-c:not(.disable-phone) .comp.hide-in-phone, html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) .comp.hide-in-phone, html.responsive-phone nav.menu-c:not(.disable-phone) .comp.hide-in-phone {
  display: none !important;
}
.designer [app-id=device-entity].responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c.menu-opened:not(.disable-phone) > ul, .designer [app-id=device-entity].responsive-phone nav.menu-c.menu-opened:not(.disable-phone) > ul, html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c.menu-opened:not(.disable-phone) > ul, html.responsive-phone nav.menu-c.menu-opened:not(.disable-phone) > ul {
  display: flex !important;
  flex-direction: column;
}
.designer [app-id=device-entity].responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c.menu-opened:not(.disable-phone) > ul > li, .designer [app-id=device-entity].responsive-phone nav.menu-c.menu-opened:not(.disable-phone) > ul > li, html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c.menu-opened:not(.disable-phone) > ul > li, html.responsive-phone nav.menu-c.menu-opened:not(.disable-phone) > ul > li {
  flex: none;
}

html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone .menu-c2.menu-opened, html.responsive-phone .menu-c2.menu-opened {
  height: 100vh;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone .menu-c2.menu-opened [app-id=off-comp-nav-ul], html.responsive-phone .menu-c2.menu-opened [app-id=off-comp-nav-ul] {
  flex: 1;
  overflow: auto !important;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone), html.responsive-phone nav.menu-c:not(.disable-phone) {
  width: 100% !important;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) .menu-button, html.responsive-phone nav.menu-c:not(.disable-phone) .menu-button {
  display: block;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) > ul, html.responsive-phone nav.menu-c:not(.disable-phone) > ul {
  display: none;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li.sub-menu > .sub-menu-button, html.responsive-phone nav.menu-c:not(.disable-phone) li.sub-menu > .sub-menu-button {
  color: white;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
  width: 30px;
  height: 30px;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.6);
  line-height: 15px;
  left: 5px;
  display: block;
  font-size: 16px;
  z-index: 100000000;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li.sub-menu > .sub-menu-button::before, html.responsive-phone nav.menu-c:not(.disable-phone) li.sub-menu > .sub-menu-button::before {
  content: "+";
  display: inline-block;
  vertical-align: middle;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li.sub-menu > .sub-menu-button::after, html.responsive-phone nav.menu-c:not(.disable-phone) li.sub-menu > .sub-menu-button::after {
  content: "";
  height: 100%;
  display: inline-block;
  vertical-align: middle;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li.sub-menu.sub-menu-opened, html.responsive-phone nav.menu-c:not(.disable-phone) li.sub-menu.sub-menu-opened {
  z-index: 100 !important;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li.sub-menu.sub-menu-opened > .sub-menu-button::before, html.responsive-phone nav.menu-c:not(.disable-phone) li.sub-menu.sub-menu-opened > .sub-menu-button::before {
  content: "-";
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li.sub-menu.sub-menu-opened > ul, html.responsive-phone nav.menu-c:not(.disable-phone) li.sub-menu.sub-menu-opened > ul {
  display: block;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) li.sub-menu > ul, html.responsive-phone nav.menu-c:not(.disable-phone) li.sub-menu > ul {
  display: none;
  width: 100% !important;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) .folder.point, html.responsive-phone nav.menu-c:not(.disable-phone) .folder.point {
  display: block;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) .folder.point .p, html.responsive-phone nav.menu-c:not(.disable-phone) .folder.point .p {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 8px;
  height: 8px;
  background: #eee;
  border-radius: 50%;
  transition: all 0.5s;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) .folder.point .p1, html.responsive-phone nav.menu-c:not(.disable-phone) .folder.point .p1 {
  left: 25%;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) .folder.point .p2, html.responsive-phone nav.menu-c:not(.disable-phone) .folder.point .p2 {
  left: 50%;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone) .folder.point .p3, html.responsive-phone nav.menu-c:not(.disable-phone) .folder.point .p3 {
  left: 75%;
}
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone).menu-opened:not(.disable-phone) .folder.point .p1,
html.responsive-pad [app-id=ID_COMMON_NAVIGATOR].pad-to-phone nav.menu-c:not(.disable-phone).menu-opened:not(.disable-phone) .folder.point .p3, html.responsive-phone nav.menu-c:not(.disable-phone).menu-opened:not(.disable-phone) .folder.point .p1,
html.responsive-phone nav.menu-c:not(.disable-phone).menu-opened:not(.disable-phone) .folder.point .p3 {
  left: 50%;
}

.off-comp-collapse > .collapse-page:not(:last-child) {
  margin-bottom: var(--item-dist);
}

.off-comp-collapse > .collapse-page > .collapse-header.open {
  border-color: var(--active-border-color) !important;
  background-color: var(--active-background-color) !important;
}

.off-comp-collapse > .collapse-page > .collapse-header > a {
  display: block;
  line-height: inherit !important;
}

.off-comp-collapse.font-icon > .collapse-page > .collapse-header > a::before {
  transition: all 0.3s;
  display: inline-block;
}

.off-comp-collapse.font-icon > .collapse-page > .collapse-header.open > a::before {
  transform: rotate(90deg);
}

.off-comp-collapse > .collapse-page > .collapse-header a {
  text-decoration: none;
  color: unset;
}

.off-comp-collapse > .collapse-page > .collapse-header.open a {
  color: var(--active-text-color);
}

.off-comp-collapse.icon-right > .collapse-page > .collapse-header > a::before {
  float: right;
}

.off-comp-collapse > .collapse-page > .collapse-header > a::before {
  font-size: var(--icon-font-size);
  margin-right: var(--icon-margin-right);
}

.off-comp-collapse.icon-text > .collapse-page > .collapse-header > a::before {
  content: "+";
  color: var(--icon-color);
}

.off-comp-collapse.icon-text > .collapse-page > .collapse-header.open > a::before {
  content: "-";
  color: var(--active-icon-color);
}

.off-comp-collapse.icon-triangle > .collapse-page > .collapse-header > a::before {
  content: "";
  transition: all 0.3s;
  transform: rotate(-90deg);
  display: inline-block;
  vertical-align: middle;
  width: 0;
  height: 0;
  border-left: 0.5em solid transparent;
  border-right: 0.5em solid transparent;
  border-top: 1em solid var(--icon-color);
}

.off-comp-collapse.icon-triangle > .collapse-page > .collapse-header.open > a::before {
  transform: rotate(0);
  border-top-color: var(--active-icon-color);
}

.off-comp-faq {
  overflow-y: auto !important;
  line-height: var(--line-height);
}

.off-comp-faq > .faqs > .faq {
  cursor: pointer;
}

.off-comp-faq > .faqs > .faq > .content {
  white-space: pre-line;
}

.off-comp-faq > .category,
.off-comp-faq > .faqs > .faq > .title {
  background-color: var(--title-background-color);
}

.off-comp-faq > .category,
.off-comp-faq > .faqs > .faq > .title {
  color: var(--title-color);
  font-size: var(--title-font-size);
  font-weight: var(--title-font-weight);
  padding: var(--title-padding-tb) var(--title-padding-lr);
}

.off-comp-faq > .faqs > .faq:hover > .title {
  color: var(--title-hover-color);
}

.off-comp-faq > .faqs > .faq > .title > .image {
  float: right;
  height: var(--line-height);
  width: var(--line-height);
  background-image: var(--title-image);
}

.off-comp-faq > .faqs > .faq > .content {
  color: var(--content-color);
  font-size: var(--content-font-size);
  font-weight: var(--content-font-weight);
}

.off-comp-faq > .faqs > .faq {
  border: solid var(--faq-border-weight) var(--faq-border-color);
}

.off-comp-faq > .faqs > .faq:not(:first-child) {
  border-top: none;
}

.off-comp-friendly-links .off-comp-friendly-links-item {
  display: block;
  color: unset;
  text-decoration: none;
}

.off-comp-friendly-links .off-comp-friendly-links-item:hover {
  color: var(--hover-color);
}

.off-comp-gallery [app-id=ID_COMP_GALLERY_SWIPER] .swiper-wrapper .swiper-slide {
  padding: var(--main-slide-padding-top) var(--main-slide-padding-right) var(--main-slide-padding-bottom) var(--main-slide-padding-left);
  background-clip: content-box;
  background-origin: content-box;
}
.off-comp-gallery [app-id=ID_COMP_GALLERY_THUMB] {
  left: var(--thumb-padding-lr) !important;
  right: var(--thumb-padding-lr) !important;
}
.off-comp-gallery [app-id=ID_COMP_GALLERY_THUMB] .swiper-wrapper .swiper-slide {
  padding: var(--thumb-slide-padding-top) var(--thumb-slide-padding-right) var(--thumb-slide-padding-bottom) var(--thumb-slide-padding-left);
  background-clip: content-box;
  background-origin: content-box;
}

.designer .comp_image_hover > figure > figcaption {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 1 !important;
  padding: 0 !important;
  transform: none !important;
}

[class^=imghvr-] > figcaption * {
  transition: none;
}

.off-form-input {
  color: var(--font-color);
}

.off-form-input::-moz-placeholder {
  color: var(--font-color);
}

.off-form-input:-ms-input-placeholder {
  color: var(--font-color);
}

.off-form-input::-ms-input-placeholder {
  color: var(--font-color);
}

.off-form-input::placeholder {
  color: var(--font-color);
}

.off-form-input::-webkit-input-placeholder {
  color: var(--font-color);
}

.off-form-input:-moz-placeholder {
  color: var(--font-color);
}

.off-form-input::-moz-placeholder {
  color: var(--font-color);
}

.off-form-input:-ms-input-placeholder {
  color: var(--font-color);
}

.component-menu {
  overflow: visible !important;
}

.component-menu * {
  background-color: inherit;
}

.component-menu li {
  cursor: pointer;
}

[content-layout=flow] > .component-menu {
  overflow: visible !important;
}

.component-menu nav.menu-c2 {
  height: 100% !important;
}
.component-menu ul[app-id=off-comp-nav-ul-menu] {
  position: relative !important;
}
.component-menu ul[app-id=off-comp-nav-ul] {
  width: 100% !important;
  height: 100% !important;
}
.component-menu ul[app-id=off-comp-nav-ul] > li:hover > ul {
  display: block !important;
}
.component-menu.component-vertical-menu ul[app-id=off-comp-nav-ul] > li {
  width: 100% !important;
}
.component-menu.component-vertical-menu.component-vertical-menu-horizontal ul[app-id=off-comp-nav-ul-menu] {
  position: absolute !important;
  left: 100% !important;
  top: 0 !important;
}
.component-menu.component-horizontal-menu ul[app-id=off-comp-nav-ul] {
  word-break: keep-all;
  white-space: nowrap;
}
.component-menu.component-horizontal-menu ul[app-id=off-comp-nav-ul] > li {
  height: 100% !important;
}

.off-comp-profession-list {
  --pagi-item-border-radius-unit: 1%;
}

.off-comp-profession-list [app-id=id_comp_profession_list_con] > [app-id=id_comp_profession_list_template] {
  width: var(--column-width) !important;
}

.responsive-pad .off-comp-profession-list [app-id=id_comp_profession_list_con] > [app-id=id_comp_profession_list_template] {
  width: var(--column-width-pad) !important;
}

.responsive-phone .off-comp-profession-list [app-id=id_comp_profession_list_con] > [app-id=id_comp_profession_list_template] {
  width: var(--column-width-phone) !important;
}

.responsive-phone .off-comp-profession-list [app-id=id_comp_profession_list_pagination].hide-number-btn-in-phone > .page-btn-number {
  display: none;
}

.off-comp-profession-list.auto-height {
  height: auto !important;
}
.off-comp-profession-list.auto-height [app-id=id_comp_profession_list_main_con_list_con] {
  height: auto !important;
  flex-basis: auto !important;
}
.off-comp-profession-list [app-id=id_comp_profession_list_pagination] {
  text-align: center;
  display: none;
}
.off-comp-profession-list [app-id=id_comp_profession_list_loadmore] {
  display: none;
  text-align: center;
  cursor: pointer;
}
.off-comp-profession-list [app-id=id_comp_profession_list_loadmore]::before {
  content: attr(loadmore-text);
  display: inline-block;
  vertical-align: middle;
}
.off-comp-profession-list [app-id=id_comp_profession_list_loadmore]::after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}

.off-comp-profession-list.show-pagi [app-id=id_comp_profession_list_pagination] {
  display: block;
}

.off-comp-profession-list [app-id=id_comp_profession_list_pagination]::before {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  content: "";
}

.off-comp-profession-list [app-id=id_comp_profession_list_pagination] > .page-item {
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
  padding: 5px 10px;
  background-color: var(--pagi-item-bg-color);
  color: var(--pagi-item-color);
  font-size: var(--pagi-item-font-size);
  margin: 0 var(--pagi-item-margin);
  border: solid var(--pagi-item-border-width) var(--pagi-item-border-color);
  border-radius: calc(var(--pagi-item-border-radius) * var(--pagi-item-border-radius-unit));
}
.off-comp-profession-list [app-id=id_comp_profession_list_pagination] > .page-item:hover {
  background-color: var(--pagi-item-bg-color-hover);
  color: var(--pagi-item-color-hover);
}

.off-comp-profession-list [app-id=id_comp_profession_list_pagination] > .page-item:not(:first-child) {
  border-left-width: calc(var(--pagi-item-close) * var(--pagi-item-border-width));
}

.off-comp-profession-list [app-id=id_comp_profession_list_pagination] > .page-item:not(:first-child):not(:last-child) {
  border-radius: calc(var(--pagi-item-close) * var(--pagi-item-border-radius) * var(--pagi-item-border-radius-unit));
}

.off-comp-profession-list [app-id=id_comp_profession_list_pagination] > .page-item:first-child {
  border-top-right-radius: calc(var(--pagi-item-close) * var(--pagi-item-border-radius) * var(--pagi-item-border-radius-unit));
  border-bottom-right-radius: calc(var(--pagi-item-close) * var(--pagi-item-border-radius) * var(--pagi-item-border-radius-unit));
}

.off-comp-profession-list [app-id=id_comp_profession_list_pagination] > .page-item:last-child {
  border-top-left-radius: calc(var(--pagi-item-close) * var(--pagi-item-border-radius) * var(--pagi-item-border-radius-unit));
  border-bottom-left-radius: calc(var(--pagi-item-close) * var(--pagi-item-border-radius) * var(--pagi-item-border-radius-unit));
}

.off-comp-profession-list > [app-id=id_comp_profession_list_pagination] > .page-item.active {
  background-color: var(--pagi-item-bg-color-active);
  color: var(--pagi-item-color-active);
}

.off-comp-profession-list [app-id=id_comp_profession_list_con] > [app-id=id_comp_profession_list_template] .comp-list-template-field.text:not(.responsive-font-size) {
  font-size: var(--font-size);
}

.off-comp-profession-list.profession-list-auto-height {
  display: block;
  height: auto !important;
}
.off-comp-profession-list.profession-list-auto-height [app-id=id_comp_profession_list_con] {
  height: auto !important;
}

.responsive-pad .off-comp-profession-list [app-id=id_comp_profession_list_con] > [app-id=id_comp_profession_list_template] .comp-list-template-field.text:not(.responsive-font-size) {
  font-size: var(--font-size-pad);
}

.responsive-phone .off-comp-profession-list [app-id=id_comp_profession_list_con] > [app-id=id_comp_profession_list_template] .comp-list-template-field.text:not(.responsive-font-size) {
  font-size: var(--font-size-phone);
}

.publish .off-comp-profession-list {
  visibility: hidden;
}

.off-comp-profession-list > [app-id=id_comp_profession_list_cate_con] div[parent-cate-id] {
  overflow: hidden;
  height: 0;
  transition: height 1s;
}

[app-id=id_comp_profession_list_cate_template].sub-cate-item.active, [app-id=id_comp_profession_list_cate_template].active {
  background-color: var(--active-cate-background-color) !important;
  color: var(--active-cate-color);
}
[app-id=id_comp_profession_list_cate_template].sub-cate-item {
  background-color: var(--sub-cate-background-color) !important;
  color: var(--sub-cate-color);
}

.responsive-pc .off-comp-profession-list.load-type-pc-pagination [app-id=id_comp_profession_list_pagination] {
  display: block;
}
.responsive-pc .off-comp-profession-list.load-type-pc-loadmore [app-id=id_comp_profession_list_loadmore] {
  display: block;
}

.responsive-phone .off-comp-profession-list.load-type-phone-pagination [app-id=id_comp_profession_list_pagination] {
  display: block;
}
.responsive-phone .off-comp-profession-list.load-type-phone-loadmore [app-id=id_comp_profession_list_loadmore] {
  display: block;
}

.off-comp-profession-search input::-moz-placeholder {
  color: var(--font-color);
}

.off-comp-profession-search input:-ms-input-placeholder {
  color: var(--font-color);
}

.off-comp-profession-search input::-ms-input-placeholder {
  color: var(--font-color);
}

.off-comp-profession-search input,
.off-comp-profession-search input::placeholder {
  color: var(--font-color);
}

.off-comp-profession-toggle.set-mode .off-comp-profession-toggle-set-con {
  display: block;
}
.off-comp-profession-toggle.set-mode .off-comp-profession-toggle-unset-con {
  display: none;
}
.off-comp-profession-toggle.unset-mode .off-comp-profession-toggle-set-con {
  display: none;
}
.off-comp-profession-toggle.unset-mode .off-comp-profession-toggle-unset-con {
  display: block;
}

.off-comp-profession-item .comp-list-template-field.skus [sku-selector-spec] {
  color: var(--spec-color);
  padding: var(--spec-value-padding-top) var(--spec-value-padding-right) var(--spec-value-padding-bottom) var(--spec-value-padding-left);
  margin: var(--spec-value-margin-top) var(--spec-value-margin-right) var(--spec-value-margin-bottom) var(--spec-value-margin-left);
}
.off-comp-profession-item .comp-list-template-field.skus [sku-selector-value] {
  display: inline-block;
  color: var(--spec-value-color);
  border-left: var(--sepc-value-border-left-width) var(--sepc-value-border-left-color) var(--sepc-value-border-left-style);
  border-right: var(--sepc-value-border-right-width) var(--sepc-value-border-right-color) var(--sepc-value-border-right-style);
  border-top: var(--sepc-value-border-top-width) var(--sepc-value-border-top-color) var(--sepc-value-border-top-style);
  border-bottom: var(--sepc-value-border-bottom-width) var(--sepc-value-border-bottom-color) var(--sepc-value-border-bottom-style);
  padding: var(--spec-value-padding-top) var(--spec-value-padding-right) var(--spec-value-padding-bottom) var(--spec-value-padding-left);
  margin: var(--spec-value-margin-top) var(--spec-value-margin-right) var(--spec-value-margin-bottom) var(--spec-value-margin-left);
}
.off-comp-profession-item .comp-list-template-field.skus [sku-selector-value].active {
  color: var(--spec-value-active-color);
  border-left: var(--sepc-value-active-border-left-width) var(--sepc-value-active-border-left-color) var(--sepc-value-active-border-left-style);
  border-right: var(--sepc-value-active-border-right-width) var(--sepc-value-active-border-right-color) var(--sepc-value-active-border-right-style);
  border-top: var(--sepc-value-active-border-top-width) var(--sepc-value-active-border-top-color) var(--sepc-value-active-border-top-style);
  border-bottom: var(--sepc-value-active-border-bottom-width) var(--sepc-value-active-border-bottom-color) var(--sepc-value-active-border-bottom-style);
}

.off-comp-profession-item .comp-list-template-field[html] table, .off-comp-profession-item .comp-list-template-field[html] caption, .off-comp-profession-item .comp-list-template-field[html] tbody, .off-comp-profession-item .comp-list-template-field[html] tfoot, .off-comp-profession-item .comp-list-template-field[html] thead, .off-comp-profession-item .comp-list-template-field[html] tr, .off-comp-profession-item .comp-list-template-field[html] th, .off-comp-profession-item .comp-list-template-field[html] td {
  border: solid 1px black;
}

.off-comp-profession-item .comp-list-template-field[field-name=number-input] span[field=number-input] {
  display: inline-block;
  width: 40px;
  text-align: center;
  height: 40px;
  line-height: 38px;
  border: solid 1px #eeeeee;
  box-sizing: border-box;
}
.off-comp-profession-item .comp-list-template-field[field-name=number-input] span[field=number-input][role=minus] {
  border-right: none;
}
.off-comp-profession-item .comp-list-template-field[field-name=number-input] span[field=number-input][role=add] {
  border-left: none;
}
.off-comp-profession-item .comp-list-template-field[field-name=number-input] input[field=number-input] {
  height: 40px;
  border-radius: 0;
  box-sizing: border-box;
  padding: 0 10px;
  border: solid 1px #eeeeee;
}

.publish .off-comp-profession-item {
  visibility: hidden;
}

.off-comp-common-item-parameters-row .off-comp-common-item-html-col-group {
  width: var(--col-group-name-width);
}
.off-comp-common-item-parameters-row .off-comp-common-item-html-col-param-name {
  width: var(--col-param-name-width);
}
.off-comp-common-item-parameters-row .off-comp-common-item-html-col-param-value {
  width: var(--col-param-value-width);
}

.off-comp-product-item-item .comp-list-template-field.template.props.text-align-style-normal .key, .off-comp-product-item-item .comp-list-template-field.template.props.text-align-style-normal .value {
  text-align: left;
}
.off-comp-product-item-item .comp-list-template-field.template.props.text-align-style-center .key {
  text-align: right;
}
.off-comp-product-item-item .comp-list-template-field.template.props.text-align-style-center .value {
  text-align: left;
}
.off-comp-product-item-item .comp-list-template-field.template.props .item {
  box-sizing: border-box;
  padding: var(--item-padding);
  flex-basis: var(--props-column-count);
}
.off-comp-product-item-item .comp-list-template-field.template.props .item .key {
  color: var(--key-color);
  padding-right: 10px;
}
.off-comp-product-item-item .comp-list-template-field.template.props .item .value {
  color: var(--value-color);
  padding-left: 10px;
}
.off-comp-product-item-item .comp-list-template-field.template.props .item .key, .off-comp-product-item-item .comp-list-template-field.template.props .item .value {
  box-sizing: border-box;
  width: 50%;
  display: inline-block;
  vertical-align: top;
}

.off-comp-query > [app-id=off-comp-query-container] {
  overflow-y: auto;
}

.off-comp-query > [app-id=off-comp-query-container] > .row {
  line-height: 30px;
  padding: 5px 0;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .title {
  text-align: var(--title-text-align);
  width: var(--title-width);
  padding: 0 var(--title-horizontal-padding);
  font-weight: var(--title-font-weight);
  font-size: var(--title-font-size);
  box-sizing: border-box;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .title .required {
  color: red;
}

/* .off-comp-query>[app-id=off-comp-query-container]{
    overflow:visible;
  }
  .off-comp-query>[app-id=off-comp-query-container]>.row{
    overflow:visible;
  }
  .off-comp-query>[app-id=off-comp-query-container]>.row>.value{
    overflow:visible;
  } */
.off-comp-query > [app-id=off-comp-query-container] > .row > .value {
  position: relative;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value input[type=radio] {
  margin: 0 5px 0 10px;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value input[type=text][query-item-name],
.off-comp-query > [app-id=off-comp-query-container] > .row > .value select[query-item-name] {
  width: 100%;
  box-sizing: border-box;
}

:focus {
  outline: none;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value input[type=text] {
  color: #333;
  width: 100%;
  box-sizing: border-box;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value input[type=text]:focus {
  outline: none;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value input[type=text] {
  border: 0;
  padding: 7px 0;
  border-bottom: 1px solid var(--theme-color);
  border-radius: 0;
}

.off-comp-query.input-text-border > [app-id=off-comp-query-container] > .row > .value input[type=text] {
  border: 1px solid var(--theme-color);
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value input[type=text] ~ .focus-border {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background-color: var(--theme-sub-color);
  transition: 0.4s;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value input[type=text]:focus ~ .focus-border {
  width: 100%;
  transition: 0.4s;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value .select2-selection {
  height: 40px;
  border-color: var(--theme-color);
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value .select2-selection .select2-selection__rendered {
  line-height: 40px;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value .select2-selection .select2-selection__arrow {
  height: 40px;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value .select2-container .select2-selection .select2-selection__arrow b {
  border-color: var(--theme-color) transparent transparent transparent;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value .select2-container.select2-container--open .select2-selection .select2-selection__arrow b {
  border-color: transparent transparent var(--theme-color) transparent;
}

.off-comp-query-select2-dropdown.select2-dropdown {
  border-color: var(--theme-color);
}

.off-comp-query-select2-dropdown.select2-dropdown .select2-search__field {
  border-color: var(--theme-color) !important;
}

.off-comp-query-select2-dropdown .select2-results__option.select2-results__option--highlighted {
  background-color: var(--theme-sub-color) !important;
}

.off-comp-query-select2-dropdown .select2-results__option[aria-selected=true] {
  background-color: var(--theme-sub-color) !important;
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value .magic-radio + label:before {
  border-color: var(--theme-color);
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value .magic-radio:checked + label:before {
  border-color: var(--theme-sub-color);
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value .magic-radio:checked + label:after {
  background-color: var(--theme-sub-color);
}

.off-comp-query > [app-id=off-comp-query-container] > .row > .value .magic-radio + label:hover:before,
.off-comp-query > [app-id=off-comp-query-container] > .row > .value .magic-checkbox + label:hover:before {
  -webkit-animation: none !important;
          animation: none !important;
  border-color: var(--theme-sub-color) !important;
}

.off-comp-share .social-share-icon.icon-baidu {
  border-color: #2e40dc !important;
  background-image: url(../image/baidu.svg) !important;
  box-sizing: border-box;
  padding: 5px;
}

.off-comp-share .social-share-icon.icon-baidu:hover {
  background: #2e40dc url(../image/baidu-white.svg) center no-repeat !important;
  border-color: white !important;
  background-size: contain !important;
  background-origin: content-box !important;
}

.component-styled-text em,
.comp-list-template-field.html[field-name=content] em,
.cke_editable em {
  font-style: italic;
}

.component-styled-text strong,
.comp-list-template-field.html[field-name=content] strong,
.cke_editable strong {
  font-weight: bold;
}

.component-styled-text s,
.comp-list-template-field.html[field-name=content] s,
.cke_editable s {
  text-decoration: line-through;
}

.component-styled-text u,
.comp-list-template-field.html[field-name=content] u,
.cke_editable u {
  text-decoration: underline;
}

.component-styled-text a,
.comp-list-template-field.html[field-name=content] a,
.cke_editable a {
  text-decoration: none;
  color: inherit;
}

.component-styled-text ol,
.comp-list-template-field.html[field-name=content] ol,
.cke_editable ol {
  list-style: decimal;
  -webkit-margin-before: 1em;
          margin-block-start: 1em;
  -webkit-margin-after: 1em;
          margin-block-end: 1em;
  -webkit-margin-start: 0px;
          margin-inline-start: 0px;
  -webkit-margin-end: 0px;
          margin-inline-end: 0px;
  -webkit-padding-start: 40px;
          padding-inline-start: 40px;
}

.component-styled-text blockquote,
.comp-list-template-field.html[field-name=content] blockquote,
.cke_editable blockquote {
  display: block;
  -webkit-margin-before: 1em;
          margin-block-start: 1em;
  -webkit-margin-after: 1em;
          margin-block-end: 1em;
  -webkit-margin-start: 40px;
          margin-inline-start: 40px;
  -webkit-margin-end: 40px;
          margin-inline-end: 40px;
  font-style: italic;
  font-family: Georgia, Times, "Times New Roman", serif;
  padding: 2px 0;
  border-style: solid;
  border-color: #ccc;
  border-width: 0;
  padding-left: 20px;
  padding-right: 8px;
  border-left-width: 5px;
}

.component-table {
  overflow: auto !important;
}

.component-table table {
  /* width: 800px; */
  border-collapse: collapse;
  overflow: hidden;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
  height: 100%;
  width: 100%;
  table-layout: fixed;
  word-break: break-all;
}

.component-table th,
.component-table td {
  padding: 15px;
  /* background-color: rgba(255, 255, 255, 0.2); */
}

.component-table.border table {
  border-left: solid 1px #eee;
  border-top: solid 1px #eee;
}

.component-table.border th,
.component-table.border td {
  border-right: solid 1px #eee;
  border-bottom: solid 1px #eee;
}

.component-table th {
  font-size: var(--head-font-size);
  color: var(--head-color);
}

.component-table th {
  background-color: #55608f;
}

.component-table tr:hover {
  background-color: rgba(255, 255, 255, 0.3);
}

.component-table td {
  position: relative;
  font-size: var(--body-font-size);
  color: var(--body-color);
}

.component-table td:hover:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -9999px;
  bottom: -9999px;
  background-color: rgba(0, 0, 0, 0.1);
  z-index: -1;
}

.component-table td:hover:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -9999px;
  right: -9999px;
  background-color: rgba(0, 0, 0, 0.1);
  z-index: -1;
}

.off-comp-tabs.horizontal > ul > .off-comp-tab-tabheaditem:not(:last-child) {
  margin-right: var(--tab-space);
}

.off-comp-tabs.vertical > ul > .off-comp-tab-tabheaditem:not(:last-child) {
  margin-bottom: var(--tab-space);
}

.off-comp-tab-tabheaditem {
  text-align: var(--tab-text-align);
  border-left: var(--tab-border-left-style) var(--tab-border-left-width) var(--tab-border-left-color);
  border-top: var(--tab-border-top-style) var(--tab-border-top-width) var(--tab-border-top-color);
  border-right: var(--tab-border-right-style) var(--tab-border-right-width) var(--tab-border-right-color);
  border-bottom: var(--tab-border-bottom-style) var(--tab-border-bottom-width) var(--tab-border-bottom-color);
  border-top-left-radius: var(--tab-border-top-left-radius);
  border-top-right-radius: var(--tab-border-top-right-radius);
  border-bottom-left-radius: var(--tab-border-bottom-left-radius);
  border-bottom-right-radius: var(--tab-border-bottom-right-radius);
  background-color: var(--tab-bg-color);
  color: var(--tab-color);
  font-weight: var(--tab-font-weight);
  font-size: var(--tab-font-size);
}

.off-comp-tab-tabheaditem > a {
  padding: var(--tab-padding-top) var(--tab-padding-right) var(--tab-padding-bottom) var(--tab-padding-left);
}

.off-comp-tab-tabheaditem > a > .off-comp-tab-tabheaditem-icon {
  color: var(--tab-icon-color);
}

.off-comp-tab-tabheaditem:hover,
.off-comp-tab-tabheaditem.active,
.designer .off-comp-tab-tabheaditem.designer-active {
  background-color: var(--tab-bg-color-active);
  color: var(--tab-color-active);
  font-weight: var(--tab-font-weight-active);
  font-size: var(--tab-font-size-active);
}

.off-comp-tab-tabheaditem:hover > a > .off-comp-tab-tabheaditem-icon,
.off-comp-tab-tabheaditem.active > a > .off-comp-tab-tabheaditem-icon,
.designer .off-comp-tab-tabheaditem.designer-active > a > .off-comp-tab-tabheaditem-icon {
  color: var(--tab-icon-color-active);
}

.responsive-pad .off-comp-tabs:not(.no-responsive-mode).vertical,
.responsive-phone .off-comp-tabs:not(.no-responsive-mode).vertical,
.designer .responsive-pad .off-comp-tabs:not(.no-responsive-mode).vertical,
.designer .responsive-phone .off-comp-tabs:not(.no-responsive-mode).vertical {
  flex-direction: column;
}

.responsive-pad .off-comp-tabs:not(.no-responsive-mode) > [app-id=ID_COMP_TABS_HEAD],
.responsive-phone .off-comp-tabs:not(.no-responsive-mode) > [app-id=ID_COMP_TABS_HEAD],
.designer .responsive-pad .off-comp-tabs:not(.no-responsive-mode) > [app-id=ID_COMP_TABS_HEAD],
.designer .responsive-phone .off-comp-tabs:not(.no-responsive-mode) > [app-id=ID_COMP_TABS_HEAD] {
  /* flex-direction: column; */
  display: block;
}

.responsive-pad .off-comp-tabs:not(.no-responsive-mode) > [app-id=ID_COMP_TABS_HEAD] > .off-comp-tab-tabheaditem,
.responsive-phone .off-comp-tabs:not(.no-responsive-mode) > [app-id=ID_COMP_TABS_HEAD] > .off-comp-tab-tabheaditem,
.designer .responsive-pad .off-comp-tabs:not(.no-responsive-mode) > [app-id=ID_COMP_TABS_HEAD] > .off-comp-tab-tabheaditem,
.designer .responsive-phone .off-comp-tabs:not(.no-responsive-mode) > [app-id=ID_COMP_TABS_HEAD] > .off-comp-tab-tabheaditem {
  display: block !important;
  height: auto !important;
}

/* {
      background-color:var(--tab-bg-color-active);
      color:var(--tab-color-active);
      font-weight: var(--tab-font-weight-active);
      font-size:var(--tab-font-size-active);
    }
    {
      color:var(--tab-icon-color-active);
    } */
.off-comp-tab-tabheaditem > a > span {
  line-height: var(--tab-line-height) !important;
}

.off-comp-tab-tabheaditem.off-comp-tab-tabheaditem-v2 > a > span {
  line-height: unset !important;
}

.off-comp-tab-tabheaditem.off-comp-tab-tabheaditem-v2 > a::before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.off-comp-tab-tabheaditem > * {
  vertical-align: middle;
}

.off-comp-tab-tabheaditem.inline-icon > a > span:first-child {
  margin-right: var(--tab-icon-space);
}

[app-id=ID_COMP_TABS_CONTENT] > [role=tabpanel] > * {
  visibility: unset !important;
}

.off-comp-tabs.tab-layout-center > ul[app-id=ID_COMP_TABS_HEAD] {
  justify-content: center;
}
.off-comp-tabs.tab-layout-center > ul[app-id=ID_COMP_TABS_HEAD] > li {
  flex: none;
}
.off-comp-tabs.tab-layout-start > ul[app-id=ID_COMP_TABS_HEAD] {
  justify-content: flex-start;
}
.off-comp-tabs.tab-layout-start > ul[app-id=ID_COMP_TABS_HEAD] > li {
  flex: none;
}
.off-comp-tabs.tab-layout-end > ul[app-id=ID_COMP_TABS_HEAD] {
  justify-content: flex-end;
}
.off-comp-tabs.tab-layout-end > ul[app-id=ID_COMP_TABS_HEAD] > li {
  flex: none;
}

.component-text > [app-id=TEXT] {
  width: 100%;
  /* margin-bottom: -1em; */
}

.component-text > [app-id=TEXT].auto-width {
  width: auto;
}

.component-text.line-height-v2 > p {
  line-height: calc(var(--responsive-font-size-pc) * var(--line-height));
}

.responsive-pad .component-text.line-height-v2 > p {
  line-height: calc(var(--responsive-font-size-pad) * var(--line-height));
}

.responsive-phone .component-text.line-height-v2 > p {
  line-height: calc(var(--responsive-font-size-phone) * var(--line-height));
}

.component-text.auto-width {
  width: auto !important;
}
.component-text.auto-width > [app-id=TEXT] {
  width: "auto" !important;
}
.component-text.auto-height {
  height: auto !important;
}

.off-form-textarea {
  color: var(--font-color);
}

.off-form-textarea::-moz-placeholder {
  color: var(--font-color);
}

.off-form-textarea:-ms-input-placeholder {
  color: var(--font-color);
}

.off-form-textarea::-ms-input-placeholder {
  color: var(--font-color);
}

.off-form-textarea::placeholder {
  color: var(--font-color);
}

.off-form-textarea::-webkit-input-placeholder {
  color: var(--font-color);
}

.off-form-textarea:-moz-placeholder {
  color: var(--font-color);
}

.off-form-textarea::-moz-placeholder {
  color: var(--font-color);
}

.off-form-textarea:-ms-input-placeholder {
  color: var(--font-color);
}

.off-comp-progressbar {
  position: absolute !important;
}

.off-comp-form .select2-selection {
  height: 40px;
  border-color: var(--theme-color) !important;
}

.off-comp-form .select2-selection .select2-selection__rendered {
  line-height: 40px;
  color: var(--font-color) !important;
}

.off-comp-form .select2-selection .select2-selection__arrow {
  height: 40px;
}

.off-comp-form .select2-container .select2-selection .select2-selection__arrow b {
  border-color: var(--theme-color) transparent transparent transparent;
}

.off-comp-form .select2-container.select2-container--open .select2-selection .select2-selection__arrow b {
  border-color: transparent transparent var(--theme-color) transparent;
}

.off-comp-form-select2-dropdown.select2-dropdown {
  border-color: var(--theme-color);
}

.off-comp-form-select2-dropdown.select2-dropdown .select2-search__field {
  border-color: var(--theme-color) !important;
}

.off-comp-form-select2-dropdown .select2-results__option.select2-results__option--highlighted {
  background-color: var(--theme-sub-color) !important;
}

.off-comp-form-select2-dropdown .select2-results__option {
  color: var(--font-color) !important;
  background-color: var(--background-color);
}

.off-comp-form-select2-dropdown .select2-results__option[aria-selected=true] {
  background-color: var(--theme-color) !important;
  color: var(--font-heigh-light-color) !important;
}

.off-comp-form-area-select .select2-container,
.off-form-select .select2-container {
  height: 100%;
}
.off-comp-form-area-select .select2-container > .selection,
.off-form-select .select2-container > .selection {
  height: 100%;
  display: block;
}
.off-comp-form-area-select .select2-container > .selection > .select2-selection--single,
.off-form-select .select2-container > .selection > .select2-selection--single {
  height: 100%;
  background-color: var(--background-color);
}
.off-comp-form-area-select .select2-container > .selection > .select2-selection--single > .select2-selection__rendered,
.off-form-select .select2-container > .selection > .select2-selection--single > .select2-selection__rendered {
  top: 50%;
  left: 50%;
  position: absolute;
  transform: translate(-50%, -50%);
}
.off-comp-form-area-select .select2-container > .selection > .select2-selection--single > .select2-selection__arrow,
.off-form-select .select2-container > .selection > .select2-selection--single > .select2-selection__arrow {
  transform: translateY(-50%);
  top: 50%;
}

.off-comp-form-area-select {
  display: flex;
}
.off-comp-form-area-select div.select-con {
  flex: 1;
  padding: 0 5px;
}
.off-comp-form-area-select[mode=PC] .select-con:nth-child(3) {
  display: none;
}

html.responsive-phone .off-comp-form-area-select, div[app-id=device-entity].responsive-phone .off-comp-form-area-select {
  flex-direction: column;
}
html.responsive-phone .off-comp-form-area-select .select-con, div[app-id=device-entity].responsive-phone .off-comp-form-area-select .select-con {
  padding: 5px 0;
}

.off-comp-form-scroll-list > .input-scroll-list-wrapper > .input-scroll-list-con > div > div {
  transition: all var(--transition-time);
  opacity: var(--default-opacity);
}
.off-comp-form-scroll-list > .input-scroll-list-wrapper > .input-scroll-list-con > div > div.active {
  color: var(--active-color);
  font-size: var(--active-font-size);
  background-color: var(--active-background-color);
  font-weight: var(--active-font-weight);
  opacity: var(--active-opacity);
}

.off-comp-icono {
  text-align: center;
}
.off-comp-icono::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  position: relative;
  height: 100%;
}
.off-comp-icono > div {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  transform: var(--content-scale);
}
.off-comp-icono > div {
  color: var(--color) !important;
}

.off-comp-video > .plyr .plyr__controls__item.plyr__control[data-plyr=play] {
  visibility: hidden;
}

.off-comp-video-modal-modal > video {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-width: 80vw;
  max-height: 80vh;
}

.off-comp-video-modal[poster-image] > videl {
  visibility: hidden;
}
.off-comp-video-modal .off-comp-video-modal-cover {
  background-color: rgba(0, 0, 0, 0) !important;
  background-image: var(--poster-image);
  cursor: pointer;
}
.off-comp-video-modal .off-comp-video-modal-cover::before {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: var(--icon-color);
  text-shadow: 1px 0px 0px var(--icon-color), 0px 1px 0px var(--icon-color), -1px 0px 0px var(--icon-color), 0px -1px 0px var(--icon-color), 1px 4px 5px #aeaeae;
  z-index: 2;
}
.off-comp-video-modal .off-comp-video-modal-cover:hover::after {
  opacity: 1;
}
.off-comp-video-modal .off-comp-video-modal-cover::after {
  transition: opacity 0.2s;
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  opacity: 0;
  background-color: rgba(0, 0, 0, 0.8) !important;
  z-index: 1;
}

.off-comp-gallery-lg {
  font-size: 0;
}

.responsive-pc .off-comp-gallery-lg > div.gallery-lg-item {
  width: var(--list-item-width);
  height: var(--list-item-height);
  padding: var(--list-item-padding);
}

.responsive-pad .off-comp-gallery-lg > div.gallery-lg-item {
  width: var(--list-item-width-pad);
  height: var(--list-item-height-pad);
  padding: var(--list-item-padding-pad);
}

.responsive-phone .off-comp-gallery-lg > div.gallery-lg-item {
  width: var(--list-item-width-phone);
  height: var(--list-item-height-phone);
  padding: var(--list-item-padding-phone);
}

.off-comp-gallery-lg > div.gallery-lg-item {
  padding: 2.5px;
  cursor: pointer;
}

.off-comp-gallery-lg > div.gallery-lg-item > img {
  transition: transform 0.15s ease 0s;
  transform: scale3d(1, 1, 1);
  height: 100%;
  width: 100%;
}

.off-comp-gallery-lg > div.gallery-lg-item:hover > img {
  transform: scale3d(1.1, 1.1, 1.1);
}

.off-comp-gallery-lg > div.gallery-lg-item:hover .gallery-lg-poster > img {
  opacity: 1;
}

.off-comp-gallery-lg > div.gallery-lg-item .gallery-lg-poster {
  background-color: rgba(0, 0, 0, 0.1);
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: background-color 0.15s ease 0s;
}

.off-comp-gallery-lg > div.gallery-lg-item .gallery-lg-poster.item-image::before {
  color: var(--image-icon-color);
  font-size: var(--image-icon-size);
  display: none;
}

.off-comp-gallery-lg > div.gallery-lg-item:hover .gallery-lg-poster.item-image::before {
  display: block;
}

.off-comp-gallery-lg > div.gallery-lg-item .gallery-lg-poster::before {
  color: #eee;
  position: absolute;
  font-size: 40px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.off-comp-gallery-lg > div.gallery-lg-item .gallery-lg-poster > img {
  left: 50%;
  margin-left: -10px;
  margin-top: -10px;
  opacity: 0;
  position: absolute;
  top: 50%;
  transition: opacity 0.3s ease 0s;
}

.off-comp-gallery-lg > div.gallery-lg-item:hover .gallery-lg-poster {
  background-color: rgba(0, 0, 0, 0.5);
}

.off-comp-gallery-lg > .gallery-lg-item[data-poster=none] > .gallery-lg-img {
  opacity: 0;
}
.off-comp-gallery-lg > .gallery-lg-item > .gallery-lg-img {
  z-index: 99 !important;
}
.off-comp-gallery-lg > .gallery-lg-item > .gallery-lg-poster {
  background-color: rgba(0, 0, 0, 0) !important;
  z-index: 100 !important;
}
.off-comp-gallery-lg > .gallery-lg-item > .gallery-lg-poster:hover {
  background-color: var(--list-item-hover-bgcolor) !important;
}

.off-comp-accordion {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.off-comp-accordion > .card {
  flex: 1;
  transition: all var(--animation-span-time) ease-in-out;
  height: 100%;
  position: relative;
}
.off-comp-accordion > .card.active {
  flex-grow: var(--active-size);
}
.off-comp-accordion.vertical {
  flex-direction: column;
}
.off-comp-accordion.vertical > .card {
  height: unset;
  width: 100%;
}

.off-comp-accordion-v2 {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.off-comp-accordion-v2 > .card {
  flex: 1;
  transition: all var(--animation-span-time) linear;
  position: relative;
}
.off-comp-accordion-v2.horizontal.first > .card:last-child {
  min-width: none !important;
  max-width: none !important;
}
.off-comp-accordion-v2.horizontal.last > .card:first-child, .off-comp-accordion-v2.horizontal.middle > .card:first-child {
  min-width: none !important;
  max-width: none !important;
}
.off-comp-accordion-v2.horizontal > .card {
  height: 100%;
  max-height: none !important;
  min-height: none !important;
}
.off-comp-accordion-v2.vertical {
  flex-direction: column;
}
.off-comp-accordion-v2.vertical.first > .card:last-child {
  min-width: none !important;
  max-width: none !important;
}
.off-comp-accordion-v2.vertical.last > .card:first-child, .off-comp-accordion-v2.vertical.middle > .card:first-child {
  min-height: none !important;
  max-height: none !important;
}
.off-comp-accordion-v2.vertical > .card {
  max-width: none !important;
  min-width: none !important;
  height: unset;
  width: 100%;
}

.off-comp-swiper > [app-id=ID_COMP_SWIPER_SWIPER] {
  overflow: hidden !important;
  width: unset !important;
  left: var(--padding-lr) !important;
  right: var(--padding-lr) !important;
}

.off-comp-table-data.auto-height {
  height: auto !important;
  display: block !important;
}
.off-comp-table-data > [app-id=id_comp_table_data_table] {
  overflow: auto !important;
}
.off-comp-table-data > [app-id=id_comp_table_data_table] > table {
  table-layout: fixed;
  word-break: break-all;
  line-height: 1.5em;
  width: 100%;
  text-align: left;
  border-left: solid var(--table-border-width) var(--table-border-color);
  border-top: solid var(--table-border-width) var(--table-border-color);
}
.off-comp-table-data > [app-id=id_comp_table_data_table] > table th, .off-comp-table-data > [app-id=id_comp_table_data_table] > table td {
  border-right: solid var(--table-border-width) var(--table-border-color);
  border-bottom: solid var(--table-border-width) var(--table-border-color);
}
.off-comp-table-data > [app-id=id_comp_table_data_table] > table th {
  text-align: var(--table-header-text-align);
  font-size: var(--table-header-font-size);
  color: var(--table-header-color);
  background-color: var(--table-header-background-color);
  padding: var(--table-header-padding-tb) var(--table-header-padding-lr);
}
.off-comp-table-data > [app-id=id_comp_table_data_table] > table td {
  text-align: var(--table-row-text-align);
  padding: var(--table-row-padding-tb) var(--table-row-padding-lr);
}
.off-comp-table-data > [app-id=id_comp_table_data_table] > table tr:nth-child(odd) {
  font-size: var(--table-row-even-font-size);
  color: var(--table-row-even-color);
  background-color: var(--table-row-even-background-color);
}
.off-comp-table-data > [app-id=id_comp_table_data_table] > table tr:nth-child(even) {
  font-size: var(--table-row-odd-font-size);
  color: var(--table-row-odd-color);
  background-color: var(--table-row-odd-background-color);
}
.off-comp-table-data > [app-id=id_comp_table_data_table] > table tr:not(:first-child):hover {
  font-size: var(--table-row-hover-font-size);
  color: var(--table-row-hover-color);
  background-color: var(--table-row-hover-background-color);
}
.off-comp-table-data [app-id=id_comp_table_data_pagination] {
  text-align: center;
}
.off-comp-table-data [app-id=id_comp_table_data_pagination]::before {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  content: "";
}
.off-comp-table-data [app-id=id_comp_table_data_pagination] > .page-item {
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
  padding: 5px 10px;
  background-color: var(--pagi-item-bg-color);
  color: var(--pagi-item-color);
  font-size: var(--pagi-item-font-size);
  margin: 0 var(--pagi-item-margin);
  border: solid var(--pagi-item-border-width) var(--pagi-item-border-color);
  border-radius: calc(var(--pagi-item-border-radius) * var(--pagi-item-border-radius-unit));
}
.off-comp-table-data [app-id=id_comp_table_data_pagination] > .page-item:hover {
  background-color: var(--pagi-item-bg-color-hover);
  color: var(--pagi-item-color-hover);
}
.off-comp-table-data [app-id=id_comp_table_data_pagination] > .page-item:not(:first-child) {
  border-left-width: calc(var(--pagi-item-close) * var(--pagi-item-border-width));
}
.off-comp-table-data [app-id=id_comp_table_data_pagination] > .page-item:not(:first-child):not(:last-child) {
  border-radius: calc(var(--pagi-item-close) * var(--pagi-item-border-radius) * var(--pagi-item-border-radius-unit));
}
.off-comp-table-data [app-id=id_comp_table_data_pagination] > .page-item:first-child {
  border-top-right-radius: calc(var(--pagi-item-close) * var(--pagi-item-border-radius) * var(--pagi-item-border-radius-unit));
  border-bottom-right-radius: calc(var(--pagi-item-close) * var(--pagi-item-border-radius) * var(--pagi-item-border-radius-unit));
}
.off-comp-table-data [app-id=id_comp_table_data_pagination] > .page-item:last-child {
  border-top-left-radius: calc(var(--pagi-item-close) * var(--pagi-item-border-radius) * var(--pagi-item-border-radius-unit));
  border-bottom-left-radius: calc(var(--pagi-item-close) * var(--pagi-item-border-radius) * var(--pagi-item-border-radius-unit));
}
.off-comp-table-data [app-id=id_comp_table_data_pagination] > .page-item.active {
  background-color: var(--pagi-item-bg-color-active);
  color: var(--pagi-item-color-active);
}

.off-comp-calendar {
  text-align: center;
}
.off-comp-calendar .title {
  background-color: var(--title-background-color);
  color: var(--title-color);
  font-size: var(--title-font-size);
  line-height: var(--title-height);
}
.off-comp-calendar .header {
  background-color: var(--week-background-color);
  color: var(--week-color);
  font-size: var(--week-font-size);
  line-height: var(--week-height);
}
.off-comp-calendar .main {
  color: var(--date-color);
  font-size: var(--date-font-size);
}
.off-comp-calendar .main > .row > .item {
  background-color: var(--date-background-color);
  border-left: solid var(--date-border-width) var(--date-border-color);
  border-top: solid var(--date-border-width) var(--date-border-color);
}
.off-comp-calendar .main > .row > .item.active {
  color: var(--date-active-color);
  font-size: var(--date-active-font-size);
  background-color: var(--date-active-background-color);
}
.off-comp-calendar .main > .row > .item:hover {
  color: var(--date-hover-color);
  font-size: var(--date-hover-font-size);
  background-color: var(--date-hover-background-color);
}
.off-comp-calendar .main > .row > .item::before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}
.off-comp-calendar .main > .row > .item > span {
  vertical-align: middle;
}
.off-comp-calendar .main > .row > .item:last-child {
  border-right: solid var(--date-border-width) var(--date-border-color);
}
.off-comp-calendar .main > .row:last-child > .item {
  border-bottom: solid var(--date-border-width) var(--date-border-color);
}

.off-comp-bmap .BMap_bubble_pop .BMap_bubble_top {
  border: none !important;
}
.off-comp-bmap .BMap_bubble_pop .BMap_bubble_top .BMap_bubble_title, .off-comp-bmap .BMap_bubble_pop .BMap_bubble_top .BMap_bubble_buttons {
  background-color: white !important;
}
.off-comp-bmap .BMap_bubble_pop .BMap_bubble_center {
  box-sizing: border-box;
}
.off-comp-bmap .BMap_bubble_pop .BMap_bubble_center .content-con {
  padding: 10px 10px 0 10px;
}

.off-comp-layout-hc > [app-id=ID_COMP_HC_WRAPPER].page-width {
  width: var(--root-page-width) !important;
}

.off-comp-qrcode > .inner {
  height: 100%;
  background: inherit;
}

.off-comp-container-flow::after {
  content: "";
  display: block;
  height: 100%;
}

.off-comp-search {
  display: flex;
  overflow: visible !important;
}
.off-comp-search.input-border-r .off-search-comp-con-input {
  border-right-style: solid !important;
}
.off-comp-search.input-border-l .off-search-comp-con-input {
  border-left-style: solid !important;
}
.off-comp-search .off-comp-search-con {
  overflow: visible !important;
  width: unset !important;
  height: unset !important;
  position: unset !important;
  flex: 1;
}
.off-comp-search .off-comp-search-con .off-search-comp-con-select {
  background-color: var(--select-bg-color);
  color: var(--select-font-color);
  overflow: visible !important;
  width: var(--select-width);
  cursor: pointer;
}
.off-comp-search .off-comp-search-con .off-search-comp-con-select .select-item-con {
  transition: opacity 200ms linear;
  background: inherit;
  visibility: hidden;
  opacity: 0;
}
.off-comp-search .off-comp-search-con .off-search-comp-con-select:hover .select-item-con {
  visibility: visible;
  opacity: 1;
}
.off-comp-search .off-comp-search-con .off-search-comp-con-select:hover .select-item-con.closed {
  visibility: hidden;
}
.off-comp-search .off-comp-search-con .off-search-comp-con-select:hover .select-item-con .select-item {
  line-height: 20px;
  padding: 10px 0;
}
.off-comp-search .off-comp-search-con .off-search-comp-con-select:hover .select-item-con .select-item:hover {
  background-color: var(--select-high-light-bg-color);
  color: var(--select-high-light-font-color);
}
.off-comp-search .off-comp-search-con .off-search-comp-con-input {
  border-color: var(--input-border-color) !important;
  border: solid 1px black;
  border-radius: 0;
  width: 0px;
  color: var(--input-font-color);
  border-left-style: none;
  border-right-style: none;
  border-width: var(--input-border-size);
}

.sim-button.button-cus-1 {
  color: var(--text-color);
  transition: all 0.5s;
  position: relative;
  border: 1px solid var(--border-color);
  background-color: var(--button-cus-1-bg-color);
}

.sim-button.button-cus-1:hover {
  background-color: var(--cover-color);
}

.off-comp-container-scroll > .off-comp-container-scroll-con {
  top: 0 !important;
  position: relative !important;
}

.publish .fa[app-type=comp],
.publish [class^=simplelineicons-][app-type=comp],
.publish [class^=ti-][app-type=comp] {
  visibility: hidden;
}

.off-comp-fullpage-pagination[horizontal] {
  word-break: keep-all;
  white-space: nowrap;
}
.off-comp-fullpage-pagination[horizontal] .fullpage-pagination-area {
  height: 100% !important;
  width: 50% !important;
  display: inline-block;
}

body *::-webkit-scrollbar {
  display: none;
}

.animeHide {
  visibility: hidden;
}

.hi-icon:after {
  pointer-events: none;
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  content: "";
  box-sizing: content-box;
}

.lg-backdrop {
  z-index: 10000000000 !important;
}

.lg-outer {
  z-index: 10000000050 !important;
}

.responsive-phone > [app-type=root] > [app-type=section] {
  width: 100% !important;
}

[content-layout=flow] {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-content: flex-start !important;
}
[content-layout=flow].flow-align-center {
  justify-content: center;
}
[content-layout=flow].flow-align-start {
  justify-content: flex-start;
}
[content-layout=flow].flow-align-end {
  justify-content: flex-end;
}
[content-layout=flow]::after {
  flex-grow: 0;
  flex-shrink: 0;
  content: "";
}

[content-layout=flow].content-layout-flow-auto-height {
  height: auto !important;
}

[content-layout=flow].content-layout-flow-auto-width {
  width: auto !important;
}

[content-layout=flow] > * {
  flex-grow: 0 !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  position: relative !important;
  left: 0 !important;
  top: 0 !important;
  right: unset !important;
  bottom: unset !important;
}

.responsive-font-size {
  font-size: var(--responsive-font-size-pc);
}

.responsive-pad .responsive-font-size {
  font-size: var(--responsive-font-size-pad);
}

.responsive-phone .responsive-font-size {
  font-size: var(--responsive-font-size-phone);
}

.responsive-font-size.calc-line-height {
  line-height: calc(var(--responsive-font-size-pc) * var(--line-height));
}

.responsive-pad .responsive-font-size.calc-line-height {
  line-height: calc(var(--responsive-font-size-pad) * var(--line-height));
}

.responsive-phone .responsive-font-size.calc-line-height {
  line-height: calc(var(--responsive-font-size-phone) * var(--line-height));
}

.width-auto-important {
  width: auto !important;
}

.height-auto-important {
  height: auto !important;
}

.position-fixed {
  z-index: 2000000000 !important;
}

html[page-type=htmlFH],
html[page-type=h5] {
  height: 100%;
}
html[page-type=htmlFH] > body,
html[page-type=h5] > body {
  height: 100%;
}
html[page-type=htmlFH] > body > div[app-type=root],
html[page-type=h5] > body > div[app-type=root] {
  height: 100%;
}
html[page-type=htmlFH] > body > div[app-type=root] > div[app-type=page], html[page-type=htmlFH] > body > div[app-type=root] > div[app-type=section],
html[page-type=h5] > body > div[app-type=root] > div[app-type=page],
html[page-type=h5] > body > div[app-type=root] > div[app-type=section] {
  height: 100vh !important;
  width: 100% !important;
}

.designer.all-comp-overflow-visible [app-type=comp] {
  overflow: visible !important;
}

.designer .designer-transition-none {
  transition: none !important;
}

[app-type=root] > [app-type=section].z-index-under-nav {
  z-index: 1000000 !important;
}
[app-type=root] > [app-type=section].z-index-top {
  z-index: 2147483649 !important;
}

.select2-container {
  z-index: 2000000001;
}