/* CSS Document */
/************************** generic class *****************************/
.header1-l {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 40px;
font-weight: bold;
line-height: 56px;
}
.header1 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 30px;
font-weight: bold;
line-height: 42px;
}
.header2 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 25px;
font-weight: bold;
line-height: 35px;
}
.header3 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 20px;
font-weight: bold;
line-height: 28px;
}
.subheader1 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 20px;
font-weight: bold;
line-height: 28px;
}
.subheader2 {
font-size: 16px;
font-weight: bold;
line-height: 23px;
}
.body_copyL {
font-size: 14px;
line-height: 20px;
}
.body_copy1 {
font-size: 12px;
line-height: 17px;
}
.body_copy2 {
font-size: 11px;
line-height: 16px;
}
.bodycopyL {
font-size: 14px;
line-height: 20px;
}
.bodycopy1 {
font-size: 12px;
line-height: 17px;
}
.bodycopy2 {
font-size: 11px;
line-height: 16px;
}
.red {
color: #fc1921;
}
.green {
color: #4fad26;
}
.grey {
color: #a3a3a3;
}
.link4 {
color: #0041c0;
font-weight: bold;
}
.style-dark .link4 {
color: #00a0c6;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.bodycopyL2 {
font-size: 16px;
line-height: 23px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
/************************** generic class *****************************/
.header1-l {
font-size: 1.5rem;
line-height: 1.4;
}
.header1 {
font-size: 1.125rem;
line-height: 1.575rem;
}
.header2 {
font-size: 1rem;
line-height: 1.4rem;
}
.header3 {
font-size: 1rem;
line-height: 1.4rem;
}
.subheader1 {
font-size: 0.938rem;
line-height: 1.3132rem;
}
.subheader2 {
font-size: 0.75rem;
line-height: 1.05rem;
}
.subheader3 {
font-size: 0.75rem;
line-height: 1.05rem;
}
.subheader4 {
font-size: 0.625rem;
line-height: 0.875rem;
}
.bodycopyL,
.body_copyL {
font-size: 0.688rem;
line-height: 0.9632rem;
}
.bodycopyL2 {
font-size: 14px;
line-height: 20px;
}
.bodycopy1,
.body_copy1 {
font-size: 0.625rem;
line-height: 0.875rem;
}
.bodycopy2,
.body_copy2 {
font-size: 0.563rem;
line-height: 0.7882rem;
}
.bodycopy5 {
font-size: 0.75rem;
line-height: 1.05rem;
}
.mobile_fontsizeup.header1 {
font-size: 24px;
line-height: 34px;
}
.mobile_fontsizeup.bodycopy1, .mobile_fontsizeup.body_copy1, .mobile_fontsizeup.link4 {
font-size: 14px;
line-height: 20px;
}
}
/*slider*/
.slider-wrapper {
position: relative;
page-break-inside: avoid;
}
.slider-wrapper .slider > .slide-block {
float: left;
position: relative;
overflow: hidden;
}
.slider-wrapper .slider-slide-controller {
position: relative;
}
.slider-wrapper .slide-controller {
position: absolute;
width: 100%;
height: 0;
}
.slider-wrapper .slide-controller .first-child {
float: left;
}
.slider-wrapper .slide-controller .last-child {
float: right;
}
.slider-wrapper .slide-controller .first-child a,
.slider-wrapper .slide-controller .last-child a {
display: block;
width: 37px;
height: 47px;
background-repeat: no-repeat;
}
.slider-wrapper .paginator-thumb-control {
position: relative;
width: 976px;
/*height:75px;*/
margin: 30px auto 0;
overflow: hidden;
}
.slider-wrapper .paginator-thumb-control a.paginator-thumb-prev,
.slider-wrapper .paginator-thumb-control a.paginator-thumb-next {
display: block;
position: absolute;
width: 11px;
height: 17px;
top: 50%;
margin-top: -9px;
}
.slider-wrapper .paginator-thumb-control a.paginator-thumb-prev {
left: 80px;
}
.slider-wrapper .paginator-thumb-control a.paginator-thumb-next {
right: 80px;
}
.slider-wrapper .paginator-thumb-control a.hid {
opacity: 0.3;
filter: alpah(opacity=30);
cursor: default;
}
.slider-wrapper .paginator-wrapper {
position: relative;
width: 715px;
/*height:75px;*/
margin: 0 auto;
overflow: hidden;
}
.slider-wrapper .paginator-wrapper .paginator {
text-align: center;
/* scsk modified start */
/*position:absolute;*/
position:relative;
/* scsk modified end */
left: 0px;
}
.slider-wrapper .paginator-wrapper .paginator:before {
content: "";
display: inline-block;
/*height:75px;*/
vertical-align: middle;
}
.slider-wrapper .paginator-wrapper .paginator a {
display: inline-block;
position: relative;
width: 75px;
height: auto;
margin-right: 5px;
background: none;
vertical-align: middle;
text-align: center;
}
.slider-wrapper .paginator-wrapper .paginator a > img {
width: 75px;
filter: url("data:image/svg+xml;utf8,#grayscale");
/* Firefox 10+ */
filter: gray;
-webkit-filter: grayscale(100%);
}
.slider-wrapper .paginator-wrapper .paginator a.selected > img,
.slider-wrapper .paginator-wrapper .paginator a:hover > img {
filter: url("data:image/svg+xml;utf8,#grayscale");
-webkit-filter: grayscale(0%);
}
.slider-wrapper .paginator-wrapper .paginator a:last-child {
margin-right: 0;
}
/*.slider-wrapper .paginator-wrapper .paginator a svg {
position:absolute;
top:0;
left:0;
}
.slider-wrapper .paginator-wrapper .paginator a.selected svg image,
.slider-wrapper .paginator-wrapper .paginator a:hover svg image {
opacity:0;
}
.slider-wrapper .paginator-wrapper .paginator a > img.ie10 {
opacity:0;
}
.slider-wrapper .paginator-wrapper .paginator a.selected img.ie10,
.slider-wrapper .paginator-wrapper .paginator a:hover img.ie10 {
opacity:1;
}
*/
/************************** browsebar *****************************/
#browsebar-name .name {
text-transform: none;
}
/************************** learncontent-header *****************************/
#learncontent-header {
background-color: #fff;
color: #1f1f1f;
}
.style-dark #learncontent-header {
background-color: #222;
color: #fff;
}
#learncontent-header .breadcrumbs {
padding-top: 10px;
padding-bottom: 5px;
overflow: hidden;
font-size: 11px;
}
#learncontent-header .breadcrumbs li {
float: left;
margin-right: 10px;
}
#learncontent-header .breadcrumbs li a {
display: inline-block;
padding-left: 14px;
background-position: 0 50%;
background-repeat: no-repeat;
background-image: url(common-clientlibs/images/icn-arrow-darkgrey-right.png);
color: #404040;
}
#learncontent-header .breadcrumbs li a:hover {
color: #1f1f1f;
}
.style-dark #learncontent-header .breadcrumbs li a {
background-image: url(common-clientlibs/images/icn-arrow-lightgrey-right.gif);
color: #9b9b9b;
}
.style-dark #learncontent-header .breadcrumbs li a:hover {
color: #fff;
}
#learncontent-header .pagetitle {
margin-top: 50px;
}
#learncontent-header .pagetitle p {
margin-top: 5px;
}
#learncontent-header .pagetitle strong,
#learncontent-header .pagetitle b {
font-weight: bold;
}
#learncontent-header .pagetitle img {
vertical-align: bottom;
}
#learncontent-header .pagetitle a {
color: #0041c0;
font-weight: bold;
}
.style-dark #learncontent-header .pagetitle a {
color: #00a0c6;
}
/************************** learncontent-contents *****************************/
#learncontent-contents {
background-color: #fff;
color: #1f1f1f;
}
#learncontent-contents:not(.noPaddingBottom) {
padding-bottom: 60px;
}
.style-dark #learncontent-contents {
background-color: #222;
color: #fff;
}
#learncontent-contents strong,
#learncontent-contents b {
font-weight: bold;
}
#learncontent-contents i {
font-style: italic;
}
#learncontent-contents img {
vertical-align: bottom;
}
.learncontent a {
color: #0041c0;
font-weight: bold;
}
.style-dark .learncontent a {
color: #00a0c6;
}
#learncontent-contents .articlesection > section, #learncontent-contents .freeimage > section {
padding-top: 45px;
}
#learncontent-contents .sparateline {
max-width: 976px;
margin: 60px auto 10px;
border-bottom: 1px solid #c9c9c9;
}
#learncontent-contents .spacer {
height: 5px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .spacer.medium {
height: 32px;
}
#learncontent-contents .spacer.tall {
height: 64px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .spacer.medium {
height: 24px;
}
#learncontent-contents .spacer.tall {
height: 48px;
}
}
/* mouse over*/
#learncontent-contents .mouseover.opacity:hover img {
opacity: 0.7;
filter: alpha(opacity=70);
}
/*parsys_column*/
#learncontent-contents .parsys_column {
margin-right: -20px;
}
#learncontent-contents .parsys_column:after {
content: "";
display: block;
height: 0;
overflow: hidden;
clear: both;
}
#learncontent-contents .parsys_column .col {
margin-right: 20px;
}
#learncontent-contents .parsys_column.cols2 .col {
width: 478px;
float: left;
}
#learncontent-contents .parsys_column.cols3 .col {
width: 312px;
float: left;
}
#learncontent-contents .parsys_column.cols4 .col {
width: 229px;
float: left;
}
#learncontent-contents .parsys_column .col > .textimage > .image {
text-align: center;
}
#learncontent-contents .free-image img, #learncontent-contents .imagetext_column .image img, #learncontent-contents .textimage .image img {
max-width: 100%;
height: auto;
}
#learncontent-contents .articlesection > section.no-padding-bottom, #learncontent-contents .freeimage > section.no-padding-bottom {
padding-bottom: 0 !important;
}
#learncontent-contents .bg-light-gray {
background-color: #efefef;
}
#learncontent-contents .bg-dark-gray {
background-color: #484848;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .articlesection .container.narrow {
width: 640px;
}
#learncontent-contents .articlesection .container.wide {
max-width: none;
padding: 0;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .articlesection .container.wide {
padding: 0;
}
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .article-btn {
margin-top: 32px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1281px) {
#learncontent-contents .article-btn {
margin-top: 24px;
}
}
#learncontent-contents .image .modal-video {
display: block;
position: relative;
}
#learncontent-contents .image .modal-video::after {
content: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/icn-play-lg.png);
position: absolute;
display: block;
top: 50%;
left: 50%;
transform: translate(-50%, -47.8%);
opacity: .8;
}
/*rich text*/
#learncontent-contents .text.parbase.section,
#learncontent-contents .richtext.section {
font-size: 12px;
line-height: 17px;
}
#learncontent-contents .text.parbase.section a,
#learncontent-contents .richtext.section a {
color: #0041c0;
font-weight: bold;
}
.style-dark #learncontent-contents .text.parbase.section a, .style-dark #learncontent-contents .richtext.section a {
color: #00a0c6;
}
#learncontent-contents .text.parbase.section b,
#learncontent-contents .richtext.section b {
font-weight: bold;
}
#learncontent-contents .text.parbase.section i,
#learncontent-contents .richtext.section i {
font-style: italic;
}
#learncontent-contents .text.parbase.section p,
#learncontent-contents .text.parbase.section ul,
#learncontent-contents .text.parbase.section ol,
#learncontent-contents .text.parbase.section > div,
#learncontent-contents .richtext.section p,
#learncontent-contents .richtext.section ul,
#learncontent-contents .richtext.section ol,
#learncontent-contents .richtext.section > div {
margin-top: 15px;
}
#learncontent-contents .text.parbase.section:first-child > :first-child,
#learncontent-contents .richtext.section:first-child > :first-child {
margin-top: 0;
}
#learncontent-contents .text.parbase.section ul,
#learncontent-contents .richtext.section ul {
list-style: outside disc;
margin-left: 1.5em;
}
#learncontent-contents .text.parbase.section ol,
#learncontent-contents .richtext.section ol {
list-style: outside decimal;
margin-left: 1.5em;
}
#learncontent-contents .text.parbase.section .notice, #learncontent-contents .richtext.section .notice {
display: block;
background-color: #EFEFEF;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
text-align: center;
}
#learncontent-contents .blogText .text.parbase.section ul, #learncontent-contents .blogText .richtext.section ul {
list-style: outside square;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .text.parbase.section .notice, #learncontent-contents .richtext.section .notice {
padding: 15px 10px;
font-size: 24px;
line-height: 34px;
}
#learncontent-contents .blogText .text.parbase.section p, #learncontent-contents .blogText .text.parbase.section ul, #learncontent-contents .blogText .text.parbase.section ol, #learncontent-contents .blogText .text.parbase.section > div, #learncontent-contents .blogText .text.parbase.section ul li:not(:first-child), #learncontent-contents .blogText .richtext.section p, #learncontent-contents .blogText .richtext.section ul, #learncontent-contents .blogText .richtext.section ol, #learncontent-contents .blogText .richtext.section > div, #learncontent-contents .blogText .richtext.section ul li:not(:first-child) {
margin-top: 20px;
}
#learncontent-contents .blogText .text.parbase.section ul, #learncontent-contents .blogText .richtext.section ul {
font-size: 16px;
line-height: 23px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .text.parbase.section,
#learncontent-contents .richtext.section {
font-size: 0.625rem;
line-height: 0.875rem;
}
#learncontent-contents .text.parbase.section p,
#learncontent-contents .text.parbase.section ul,
#learncontent-contents .text.parbase.section ol,
#learncontent-contents .richtext.section p,
#learncontent-contents .richtext.section ul,
#learncontent-contents .richtext.section ol {
margin-top: 10px;
}
#learncontent-contents .text.parbase.section .notice, #learncontent-contents .richtext.section .notice {
padding: 10px 5px;
font-size: 20px;
line-height: 28px;
}
#learncontent-contents .blogText .text.parbase.section p, #learncontent-contents .blogText .text.parbase.section ul, #learncontent-contents .blogText .text.parbase.section ol, #learncontent-contents .blogText .text.parbase.section > div, #learncontent-contents .blogText .text.parbase.section ul li:not(:first-child), #learncontent-contents .blogText .richtext.section p, #learncontent-contents .blogText .richtext.section ul, #learncontent-contents .blogText .richtext.section ol, #learncontent-contents .blogText .richtext.section > div, #learncontent-contents .blogText .richtext.section ul li:not(:first-child) {
margin-top: 15px;
}
#learncontent-contents .blogText .text.parbase.section ul, #learncontent-contents .blogText .richtext.section ul {
font-size: 14px;
line-height: 20px;
}
}
/*layoutframe*/
#learncontent-contents .layoutframe:after {
content: "";
display: block;
height: 0;
overflow: hidden;
clear: both;
}
#learncontent-contents .layoutframe .l {
float: left;
}
#learncontent-contents .layoutframe .r {
float: right;
}
/*imagetext_column*/
#learncontent-contents .imagetext_column .l,
#learncontent-contents .imagetext_column .r {
width: 478px;
}
#learncontent-contents .imagetext_column .l.image {
text-align: left;
}
#learncontent-contents .imagetext_column .r.image {
text-align: right;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .l,
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .r {
width: 229px;
}
/* image640 video640 video */
#learncontent-contents .videotext {
max-width: 1200px;
margin-inline: auto;
}
#learncontent-contents .videotext > div {
margin-top: 15px;
}
#learncontent-contents .videotext > :first-child {
margin-top: 0;
}
#learncontent-contents .videotext > div,
#learncontent-contents .video .youtube-placeholder {
height: 100%;
}
#learncontent-contents .videotext .youtube-placeholder iframe {
display: block;
}
#learncontent-contents .layoutframe.image640 .copy,
#learncontent-contents .layoutframe.video640 .copy {
width: 270px;
}
#learncontent-contents .layoutframe.image640 .image,
#learncontent-contents .layoutframe.video640 .video {
width: 640px;
}
#learncontent-contents .layoutframe.image640 .image:after,
#learncontent-contents .layoutframe.video640 .video:after {
content: "";
display: block;
position: absolute;
height: 14px;
width: 640px;
background: url(learncontent-clientlibs/images/spr-hub-article-db.png) no-repeat;
background-position: left -50px;
}
#learncontent-contents .layoutframe.video640 .video {
font-size: 0;
}
#learncontent-contents .layoutframe.video640.aligncenter .video {
float: none;
margin: 0 auto;
}
#learncontent-contents .layoutframe.video640.aligncenter .copy {
display: none;
}
#learncontent-contents .layoutframe.video640 .video .youtube-placeholder {
height: 100%;
}
/* title */
#learncontent-contents .title h3 {
margin-top: 20px;
}
#learncontent-contents .title p {
margin-top: 5px;
}
/* free-image */
#learncontent-contents .free-image {
text-align: center;
}
#learncontent-contents .free-image.no-padding-top {
padding-top: 0px !important;
}
#learncontent-contents .free-image.no-padding {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
#learncontent-contents .free-image span {
width: 1200px;
margin-left: -112px;
display: block;
}
/* biopicture */
#learncontent-contents .layoutframe table.biopicture {
border-collapse: collapse;
border-spacing: 0;
padding: 0;
margin: 40px 0 0;
width: 421px;
table-layout: fixed;
float: right;
}
#learncontent-contents .layoutframe table.biopicture td {
text-align: center;
vertical-align: middle;
border: 1px solid #c9c9c9;
}
#learncontent-contents .layoutframe table.biopicture td.pic {
width: 196px;
}
#learncontent-contents .layoutframe table.biopicture td.text {
padding: 10px;
}
/* vote */
#learncontent-contents .vote dl {
display: inline-block;
background-color: #ebebeb;
padding: 9px 15px;
border-radius: 3px;
behavior: url(/etc/designs/panasonic/common-clientlibs/css/PIE.htc);
-pie-border-radius: 3px;
position: relative\9;
}
#learncontent-contents .vote dt,
#learncontent-contents .vote dd {
display: inline-block;
vertical-align: middle;
}
#learncontent-contents .vote dt {
font-size: 12px;
margin-right: 20px;
}
#learncontent-contents .vote dd {
height: 28px;
font-size: 12px;
}
#learncontent-contents .vote dd:before {
content: "";
display: inline-block;
height: 28px;
width: 15px;
margin-right: 5px;
background-image: url(learncontent-clientlibs/images/spr-hub-article-db.png);
background-repeat: no-repeat;
vertical-align: middle;
}
#learncontent-contents .vote dd {
margin-left: 10px;
}
#learncontent-contents .vote dd:first-child {
margin-left: 0;
}
#learncontent-contents .vote dd.thumbdown a {
color: #000;
}
#learncontent-contents .vote dd.thumbup:before {
background-position: -919px -50px;
}
#learncontent-contents .vote dd.thumbdown:before {
background-position: -940px -50px;
}
/* gallery-sizeL */
.gallery-sizeL .slider-wrapper .slide-controller {
top: 167px;
}
.gallery-sizeL .gallery-image:after {
content: "";
display: block;
position: absolute;
height: 14px;
width: 100%;
background: url(learncontent-clientlibs/images/spr-hub-article-db.png) no-repeat;
background-position: left -30px;
}
.gallery-sizeL .gallery-cap {
margin-top: 10px;
text-align: center;
}
/* gallery-sizeSM */
.gallery-sizeSM .slider-wrapper .slide-controller {
top: 50%;
margin-top: -37px;
}
.gallery-sizeSM .gallery-image {
text-align: center;
}
.gallery-sizeSM .gallery-cap {
margin-top: 10px;
text-align: center;
}
.gallery-sizeSM .gallery-video > div {
position: relative;
padding-top: 56.25%;
height: auto !important;
}
.gallery-sizeSM .gallery-video > div > .youtube-placeholder {
position: absolute;
top: 0;
width: 100%;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.gallery-sizeSM .gallery-video {
max-width: 640px;
margin: 0 auto;
}
}
/* gallery-size16-9 */
.gallery-size16-9 {
background: url(learncontent-clientlibs/images/bg-gallery.png) no-repeat 50% 60px;
}
.gallery-size16-9 .slider-wrapper .slide-controller {
top: 35%;
}
.gallery-size16-9 .gallery-image {
text-align: center;
}
.gallery-size16-9 .gallery-cap {
margin-top: 10px;
text-align: center;
}
/* gallery-size4-3 */
.gallery-size4-3 {
background: url(learncontent-clientlibs/images/bg-gallery.png) no-repeat 50% 60px;
}
.gallery-size4-3 .slider-wrapper .slide-controller {
top: 35%;
}
.gallery-size4-3 .gallery-image {
text-align: center;
}
.gallery-size4-3 .gallery-cap {
margin-top: 10px;
text-align: center;
}
/* image-sizeL */
.image-sizeL .image-image:after {
content: "";
display: block;
position: absolute;
height: 14px;
width: 100%;
background: url(learncontent-clientlibs/images/spr-hub-article-db.png) no-repeat;
background-position: left -30px;
}
/************************** more-expl *****************************/
#more-expl {
padding: 50px 0 65px;
background-color: #434343;
background-image: url(learncontent-clientlibs/images/img-more-expl-shadow.png);
background-repeat: no-repeat;
background-position: 50% 0;
color: #fff;
}
#more-expl h3 {
text-align: center;
margin-bottom: 45px;
}
#more-expl .more-expl-block:after {
content: "";
display: block;
height: 0;
overflow: hidden;
clear: both;
}
#more-expl .more-expl-block .more-expl-box {
float: left;
margin-left: 20px;
width: 229px;
}
#more-expl .more-expl-block .more-expl-box:first-child {
margin-left: 0;
}
#more-expl .more-expl-block .more-expl-box:before,
#more-expl .more-expl-block .more-expl-box:after {
content: "";
display: block;
width: 229px;
background-image: url(learncontent-clientlibs/images/spr-hub-article-db.png);
background-repeat: no-repeat;
}
#more-expl .more-expl-block .more-expl-box:before {
height: 2px;
background-position: -470px -65px;
}
#more-expl .more-expl-block .more-expl-box:after {
height: 14px;
background-position: -470px -85px;
}
#more-expl .more-expl-block .more-expl-box-in {
background: url(learncontent-clientlibs/images/img-more-expl-box-1px.png) repeat-y;
padding: 0 2px;
}
#more-expl .more-expl-block .more-expl-box a {
color: #fff;
}
#more-expl .more-expl-block .more-expl-box .more-expl-copy {
padding: 20px 20px 0;
height: 140px;
}
#more-expl .more-expl-block .more-expl-box .more-expl-copy .title {
font-weight: bold;
margin-bottom: 15px;
}
#more-expl .more-expl-block .more-expl-box .more-expl-type {
padding: 0 20px;
font-size: 12px;
font-weight: bold;
}
@media only screen and (min-width: 641px) {
#learncontent-contents .layoutframe.video640 .video {
font-size: 0;
min-height: 360px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.mobileHide {
display: none;
}
/*slider*/
.slider-wrapper {
height: auto;
}
.slider-wrapper .slider > .slide-block {
height: auto;
}
.slider-wrapper .slide-controller {
display: none;
}
.slider-wrapper .paginator-thumb-control {
position: relative;
width: auto;
height: auto;
margin: 10px auto 0;
padding: 0 10px;
overflow: hidden;
}
.slider-wrapper .paginator-thumb-control a.paginator-thumb-prev,
.slider-wrapper .paginator-thumb-control a.paginator-thumb-next {
display: none;
}
.slider-wrapper .paginator-wrapper {
width: auto;
height: auto !important;
}
.slider-wrapper .paginator-wrapper .paginator {
text-align: left;
position: static;
width: auto !important;
}
.slider-wrapper .paginator-wrapper .paginator a {
width: 13%;
height: auto;
margin-top: 7px;
margin-right: 1.5%;
font-size: 0;
}
.slider-wrapper .paginator-wrapper .paginator a:nth-child(7n) {
margin-right: 0;
}
.slider-wrapper .paginator-wrapper .paginator a img {
height: auto;
}
/************************** browsebar *****************************/
/************************** learncontent-header *****************************/
#learncontent-header {
padding: 15px 10px 0;
background: url(learncontent-clientlibs/images/img-header-shadow-1px-m.png) repeat-x #fff;
background-size: 100% 15px;
}
#learncontent-header .breadcrumbs {
display: none;
}
#learncontent-header .pagetitle {
margin-top: 20px;
}
#learncontent-header .pagetitle p {
margin-top: 10px;
}
/************************** learncontent-contents *****************************/
#learncontent-contents:not(.noPaddingBottom) {
padding-bottom: 20px;
}
#learncontent-contents .articlesection > section, #learncontent-contents .freeimage > section {
padding-top: 30px;
}
#learncontent-contents .sparateline {
width: auto;
margin: 20px 0 0;
}
#learncontent-contents .container {
padding: 0 10px;
}
/*parsys_column*/
#learncontent-contents .parsys_column {
margin-right: 0;
}
#learncontent-contents .parsys_column .col {
margin-right: 0;
margin-bottom: 20px;
}
#learncontent-contents .parsys_column.cols2 .col {
width: auto;
float: none;
}
#learncontent-contents .parsys_column.cols3 .col {
width: 47%;
float: left;
}
#learncontent-contents .parsys_column.cols4 .col {
width: 47%;
float: left;
}
#learncontent-contents .parsys_column.cols3 .col:nth-child(odd),
#learncontent-contents .parsys_column.cols4 .col:nth-child(odd) {
margin-right: 6%;
clear: both;
}
/*layoutframe*/
#learncontent-contents .layoutframe p.image img {
width: 100%;
}
/*imagetext_column*/
#learncontent-contents .imagetext_column .l,
#learncontent-contents .imagetext_column .r {
margin-right: 0;
float: none;
width: auto;
}
#learncontent-contents .imagetext_column .image {
margin-top: 20px;
}
#learncontent-contents .imagetext_column .l.image,
#learncontent-contents .imagetext_column .r.image {
text-align: center;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .l,
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .r {
width: 47%;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .l {
float: left;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .r {
float: right;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .image {
margin-top: 0;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .l.image {
text-align: left;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .r.image {
text-align: right;
}
/* image640 video640 */
#learncontent-contents .layoutframe.image640 .l,
#learncontent-contents .layoutframe.video640 .l,
#learncontent-contents .layoutframe.image640 .r,
#learncontent-contents .layoutframe.video640 .r {
margin-right: 0;
float: none;
}
#learncontent-contents .layoutframe.image640 .copy,
#learncontent-contents .layoutframe.video640 .copy {
width: auto;
}
#learncontent-contents .layoutframe.image640 .image,
#learncontent-contents .layoutframe.video640 .video {
width: auto;
margin-top: 20px;
}
#learncontent-contents .layoutframe.image640 .image.l,
#learncontent-contents .layoutframe.video640 .video.l {
margin-top: 0;
}
#learncontent-contents .layoutframe.image640 .image:after,
#learncontent-contents .layoutframe.video640 .video:after {
height: 7px;
width: 100%;
position: static;
background: url(learncontent-clientlibs/images/img-gallery-shadow-m.png) no-repeat 50% 0;
background-size: 100% 7px;
}
#learncontent-contents .layoutframe.video640 .video {
font-size: 0;
height: auto;
}
/* title */
#learncontent-contents .title h3 {
margin-top: 10px;
}
#learncontent-contents .title h3:first-child {
margin-top: 0;
}
#learncontent-contents .title p {
margin-top: 10px;
}
/* free-image */
#learncontent-contents .free-image span {
width: auto;
margin-left: 0;
}
#learncontent-contents .free-image.no-padding-top {
margin-top: -15px;
}
#learncontent-contents .free-image.no-padding-top span {
margin: 0 -10px;
}
#learncontent-contents .free-image.fullwidth-xs span {
margin: 0 -10px;
}
/* biopicture */
#learncontent-contents .layoutframe table.biopicture {
margin: 20px 0 0;
width: 100%;
float: none;
}
#learncontent-contents .layoutframe table.biopicture td {
text-align: center;
vertical-align: middle;
border: 1px solid #c9c9c9;
}
#learncontent-contents .layoutframe table.biopicture td.pic {
width: 40%;
}
#learncontent-contents .layoutframe table.biopicture td.text {
padding: 10px;
}
/* vote */
#learncontent-contents .vote dl {
display: block;
}
#learncontent-contents .vote dt,
#learncontent-contents .vote dd {
display: inline-block;
vertical-align: middle;
}
#learncontent-contents .vote dt {
font-size: 0.625rem;
margin-right: 0;
width: 50%;
}
#learncontent-contents .vote dd {
font-size: 0.625rem;
}
/* gallery-sizeL */
.gallery-sizeL .gallery-image:after {
height: 7px;
position: static;
background: url(learncontent-clientlibs/images/img-gallery-shadow-m.png) no-repeat 50% 0;
background-size: 100% 7px;
}
.gallery-sizeL .gallery-cap {
margin-top: 5px;
text-align: left;
}
/* gallery-sizeSM */
.gallery-sizeSM {
background: none;
}
.gallery-sizeSM .gallery-image:after {
content: "";
display: block;
height: 7px;
background: url(learncontent-clientlibs/images/img-gallery-shadow-m.png) no-repeat 50% 0;
background-size: 100% 7px;
}
.gallery-sizeSM .gallery-cap {
margin-top: 5px;
text-align: left;
}
/* gallery-size16-9 */
.gallery-size16-9 {
background: none;
}
.gallery-size16-9 .gallery-image:after {
content: "";
display: block;
height: 7px;
background: url(learncontent-clientlibs/images/img-gallery-shadow-m.png) no-repeat 50% 0;
background-size: 100% 7px;
}
.gallery-size16-9 .gallery-cap {
margin-top: 5px;
text-align: left;
}
/* gallery-size4-3 */
.gallery-size4-3 {
background: none;
}
.gallery-size4-3 .gallery-image:after {
content: "";
display: block;
height: 7px;
background: url(learncontent-clientlibs/images/img-gallery-shadow-m.png) no-repeat 50% 0;
background-size: 100% 7px;
}
.gallery-size4-3 .gallery-cap {
margin-top: 5px;
text-align: left;
}
/* image-sizeL */
.image-sizeL .image-image:after {
position: static;
height: 7px;
background: url(learncontent-clientlibs/images/img-gallery-shadow-m.png) no-repeat 50% 0;
background-size: 100% 7px;
}
/************************** more-expl *****************************/
#more-expl {
padding: 18px 10px 20px;
background-size: contain;
}
#more-expl h3 {
margin-bottom: 0;
}
#more-expl .more-expl-block .more-expl-box {
margin-left: 0;
margin-top: 20px;
width: 48%;
}
#more-expl .more-expl-block .more-expl-box:nth-child(even) {
float: right;
}
#more-expl .more-expl-block .more-expl-box:before,
#more-expl .more-expl-block .more-expl-box:after {
display: none;
}
#more-expl .more-expl-block .more-expl-box-in {
background: none;
padding: 0 0;
height: auto;
background: none;
background-color: #565656;
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4);
-webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4);
-moz-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4);
-o-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4);
-ms-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4);
}
#more-expl .more-expl-block .more-expl-box .more-expl-image img {
width: 100%;
}
#more-expl .more-expl-block .more-expl-box .more-expl-copy {
padding: 15px 15px 0;
height: 115px;
}
#more-expl .more-expl-block .more-expl-box .more-expl-type {
padding: 0 15px 15px;
font-size: 0.625rem;
}
}
/************************** products-list *****************************/
#products-list {
color: #1f1f1f;
}
#products-list h3, #products-list .products-list__title {
text-align: center;
}
#products-list .products-block {
display: -webkit-inline-flex;
display: inline-flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
#products-list .product-box {
display: flex;
flex-direction: column;
}
#products-list .product-box-in {
flex-grow: 1;
}
#products-list .products-seeall {
margin-top: 30px;
text-align: center;
}
#products-list .products-seeall button {
padding: 0;
border: none;
background: none;
-webkit-appearance: none;
appearance: none;
}
#products-list .products-seeall a, #products-list .products-seeall button {
display: inline-block;
box-sizing: border-box;
height: 34px;
padding: 0 12px;
background-image: linear-gradient(#fff, #f1f1f1);
border: 1px solid #d8d8d8;
border-radius: 3px;
}
#products-list .products-seeall a::after, #products-list .products-seeall button::after {
content: url("/etc/designs/panasonic/learncontent-clientlibs/images/icn-arrow-down-db.png");
display: inline-block;
width: 9px;
height: 7px;
vertical-align: middle;
line-height: 0;
}
#products-list .products-seeall a.opened::after, #products-list .products-seeall button.opened::after {
transform: scaleY(-1);
}
#products-list .products-seeall a > span, #products-list .products-seeall button > span {
display: inline-block;
vertical-align: middle;
line-height: 32px;
font-weight: bold;
color: #0041c0;
}
#products-list .products-seeall a > span::after, #products-list .products-seeall button > span::after {
content: "";
display: inline-block;
width: 12px;
}
#products-list .products-seeall a > span.hid, #products-list .products-seeall button > span.hid {
display: none;
}
#products-list .extras {
padding-bottom: 40px;
}
#products-list .extras dl {
margin-top: 30px;
}
#products-list .extras dt {
font-weight: bold;
margin-bottom: 10px;
}
#products-list .extras dt a {
display: inline-block;
padding-right: 14px;
background-position: 100% 50%;
background-repeat: no-repeat;
background-image: url(common-clientlibs/images/icn-arrow-darkgrey-right.png);
font-size: 11px;
color: #1f1f1f;
}
#products-list .extras dd span {
display: inline-block;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#products-list {
padding: 25px 0 30px;
}
#products-list h3, #products-list .products-list__title {
padding-bottom: 5px;
}
#products-list h3.header1, #products-list .products-list__title.header1 {
padding-bottom: 30px;
padding-top: 25px;
}
#products-list .products-block-wrapper.expanded {
text-align: center;
}
#products-list .products-block {
margin-right: -10px;
margin-left: -10px;
}
#products-list .product-box {
margin: 20px 10px 0;
}
#products-list .products-seeall a > span, #products-list .products-seeall button > span {
font-size: 12px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#products-list {
padding: 15px 0 30px;
}
#products-list .products-list__title {
padding-left: 10px;
padding-right: 10px;
}
#products-list .products-list__title.align-inherit {
text-align: inherit;
}
#products-list .products-block-wrapper {
padding: 0 10px 2px;
}
#products-list .products-block {
margin-right: -1%;
margin-left: -1%;
}
#products-list .product-box {
margin: 20px 1% 0;
}
#products-list .products-seeall a > span, #products-list .products-seeall button > span {
font-size: 0.75rem;
}
#products-list .extras {
padding: 0 10px;
}
#products-list .extras dl {
margin-top: 30px;
}
#products-list .extras dt {
font-weight: bold;
margin-bottom: 10px;
}
#products-list .extras dt a {
display: inline-block;
padding-right: 14px;
background-position: 100% 50%;
background-repeat: no-repeat;
background-image: url(common-clientlibs/images/icn-arrow-darkgrey-right.png);
font-size: 11px;
color: #1f1f1f;
}
#products-list .extras dd span {
display: inline-block;
}
}
/********** title text **********/
#learncontent-contents .titleText_in.aligncenter {
text-align: center;
}
#learncontent-contents .titleText img {
width: auto;
height: auto;
max-width: 100%;
}
/********** add categorystyle **********/
#learncontent-contents .product-box-in a {
font-weight: inherit;
}
#learncontent-contents .recommended-products-list .products-block, #learncontent-contents .category-products-column .products-block {
display: flex;
}
#learncontent-contents .recommended-products-list .product-box, #learncontent-contents .category-products-column .product-box {
display: flex;
flex-direction: column;
}
#learncontent-contents .recommended-products-list .category-image .modal-video, #learncontent-contents .category-products-column .category-image .modal-video {
display: block;
position: relative;
}
#learncontent-contents .recommended-products-list .category-image .modal-video::after, #learncontent-contents .category-products-column .category-image .modal-video::after {
content: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/icn-play-lg.png);
position: absolute;
display: block;
top: 50%;
left: 50%;
transform: translate(-50%, -47.8%);
opacity: .8;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .recommended-products-list .products-block, #learncontent-contents .category-products-column .products-block {
justify-content: center;
}
#learncontent-contents .recommended-products-list .product-box:not(:first-child), #learncontent-contents .category-products-column .product-box:not(:first-child) {
margin-left: 20px;
}
#learncontent-contents .recommended-products-list .product-box-in, #learncontent-contents .category-products-column .product-box-in {
flex-grow: 1;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .recommended-products-list .products-block, #learncontent-contents .category-products-column .products-block {
flex-wrap: wrap;
margin-left: -1%;
margin-right: -1%;
}
#learncontent-contents .recommended-products-list .products-block::after, #learncontent-contents .category-products-column .products-block::after {
content: "";
display: table;
clear: both;
}
#learncontent-contents .recommended-products-list .product-box, #learncontent-contents .category-products-column .product-box {
margin: 20px 1% 2px;
}
#learncontent-contents .recommended-products-list .product-box-in, #learncontent-contents .category-products-column .product-box-in {
box-sizing: border-box;
height: 100%;
}
}
#learncontent-contents .recommended-products-list {
text-align: center;
}
#learncontent-contents .recommended-products-list.borderbottom {
border-bottom: 1px solid #d6d6d6;
}
#learncontent-contents .recommended-products-list .recommended-products {
color: #1f1f1f;
}
.style-dark #learncontent-contents .recommended-products-list.borderbottom {
border-color: #616161;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .recommended-products-list {
padding: 25px 0 35px;
}
#learncontent-contents .recommended-products-list::after {
content: "";
display: table;
clear: both;
}
#learncontent-contents .recommended-products-list .recommended-products-title {
margin-bottom: 25px;
}
#learncontent-contents .recommended-products-list .recommended-products {
font-size: 0;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .recommended-products-list {
padding: 0 0 20px;
}
}
#learncontent-contents .category-products-column .category-products {
color: #1f1f1f;
}
#learncontent-contents .category-products-column .category-products .btn-area > a {
display: block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border: 1px solid #ddd;
background: #ececec;
position: relative;
text-align: center;
border-radius: 3px;
}
#learncontent-contents .category-products-column .category-products .btn-area > a > span {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
color: #1f1f1f;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .category-products-column {
margin-left: -10px;
margin-right: -10px;
text-align: center;
font-size: 0;
display: flex;
justify-content: center;
}
#learncontent-contents .category-products-column .category-image, #learncontent-contents .category-products-column .category-products {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0 10px;
width: 50%;
}
#learncontent-contents .category-products-column .category-products {
font-size: 0;
}
#learncontent-contents .category-products-column .category-products .btn-area {
margin-top: 20px;
}
#learncontent-contents .category-products-column .category-products .btn-area > a {
padding: 13px 10px;
-webkit-background: linear-gradient(#f5f5f5, #c8c8c8);
background: linear-gradient(#f5f5f5, #c8c8c8);
-webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
}
#learncontent-contents .category-products-column .category-products .btn-area > a > span {
font-size: 14px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .category-products-column .category-products .btn-area {
margin-top: 20px;
}
#learncontent-contents .category-products-column .category-products .btn-area > a {
padding: 7px 10px;
-webkit-background: linear-gradient(#fff, #f1f1f1) #f1f1f1;
background: linear-gradient(#fff, #f1f1f1) #f1f1f1;
}
#learncontent-contents .category-products-column .category-products .btn-area > a > span {
font-size: 0.938rem;
}
}
#learncontent-contents .category-anchorlinks {
font-size: 0;
display: flex;
gap: 20px;
}
#learncontent-contents .category-anchorlinks__item {
box-sizing: border-box;
}
#learncontent-contents .category-anchorlinks__item a {
display: flex;
}
#learncontent-contents .category-anchorlinks__item__title {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
color: #1f1f1f;
line-height: 1.4;
word-wrap: anywhere;
overflow-wrap: anywhere;
}
#learncontent-contents .category-anchorlinks__item__image img {
max-width: 100%;
}
#learncontent-contents .category-anchorlinks__item__icon svg path {
fill: none;
stroke: #1f1f1f;
stroke-width: 3px;
fill-rule: evenodd;
}
#learncontent-contents .category-anchorlinks a:hover .category-anchorlinks__item__title {
color: #0041c0;
}
#learncontent-contents .category-anchorlinks a:hover .category-anchorlinks__item__icon svg path {
stroke: #0041c0;
}
.style-dark #learncontent-contents .category-anchorlinks__item__title {
color: #FFF;
}
.style-dark #learncontent-contents .category-anchorlinks__item__icon svg path {
stroke: #FFF;
}
.style-dark #learncontent-contents .category-anchorlinks a:hover .category-anchorlinks__item__title {
color: #00a0c6;
}
.style-dark #learncontent-contents .category-anchorlinks a:hover .category-anchorlinks__item__icon svg path {
stroke: #00a0c6;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .category-anchorlinks {
justify-content: center;
}
#learncontent-contents .category-anchorlinks__item {
max-width: 233px;
width: 25%;
text-align: center;
}
#learncontent-contents .category-anchorlinks__item a {
flex-direction: column;
height: 100%;
}
#learncontent-contents .category-anchorlinks__item__title {
font-size: 14px;
min-height: 64px;
display: flex;
align-items: center;
justify-content: center;
margin: auto 0;
}
#learncontent-contents .category-anchorlinks__item__icon {
margin-top: 8px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .category-anchorlinks {
flex-direction: column;
}
#learncontent-contents .category-anchorlinks__item a {
align-items: center;
}
#learncontent-contents .category-anchorlinks__item__image {
width: 86px;
flex-shrink: 0;
}
#learncontent-contents .category-anchorlinks__item__title {
flex-grow: 1;
font-size: 12px;
margin-inline-start: 10px;
}
#learncontent-contents .category-anchorlinks__item__icon {
flex-shrink: 0;
padding: 10px;
}
}
/************************** addthissection *****************************/
.addthissection-in.aligncenter {
text-align: center;
}
.addthissection__items {
font-size: 0;
}
.addthissection__item {
display: inline-block;
border-radius: 4px;
overflow: hidden;
transition: all .2s ease-in-out;
text-decoration: none;
}
.addthissection__item-in {
display: block;
padding: 5px;
text-align: center;
}
.addthissection__item.fb {
background-color: #3b5998;
}
.addthissection__item.tw {
background-color: #1da1f2;
}
.addthissection__item.gp {
background-color: #dc4e41;
}
.addthissection__item.more {
background-color: #ff6550;
}
.addthissection__item:not(.more):focus, .addthissection__item:not(.more):hover {
transform: translateY(-4px);
}
.addthissection__item:not(.more) svg title {
display: none;
}
.addthissection__item .icn {
display: inline-block;
vertical-align: middle;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.addthissection-in {
padding-top: 45px;
}
.addthissection__title {
padding-bottom: 25px;
}
.addthissection__item {
margin: 0 2px 5px;
}
.addthissection__item:not(.more) .addthissection__item-in {
-webkit-box-sizing: border-box;
box-sizing: border-box;
min-width: 120px;
}
.addthissection__item .label {
color: #fff;
display: inline-block;
font-size: 11.4px;
font-family: helvetica neue,helvetica,arial,sans-serif;
font-weight: bold;
line-height: 32px;
margin-left: 5px;
padding-right: 15px;
vertical-align: middle;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.addthissection-in {
padding-top: 20px;
}
.addthissection__title {
padding-bottom: 20px;
padding-top: 10px;
}
.addthissection__item {
margin: 0 4px 5px;
}
.addthissection__item .label {
display: none;
}
}
/************************** categorytop hero *****************************/
#learncontent-contents .categorytop-hero {
padding-bottom: 20px;
position: relative;
max-width: 1200px;
margin-inline: auto;
}
#learncontent-contents .categorytop-hero::before {
content: "";
display: block;
height: 21px;
width: 100%;
position: absolute;
background: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/img-content-shadow-1px.png) repeat-x top;
z-index: 2;
top: 0;
}
#learncontent-contents .categorytop-hero .hid {
display: none;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu {
position: absolute;
top: 27px;
z-index: 10;
width: 100%;
text-align: center;
font-size: 0;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul {
display: inline-block;
font-size: 0;
border: 1px solid #e1e1e1;
border-radius: 3px;
position: relative;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li {
display: inline-block;
vertical-align: top;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li.startup {
height: 0;
width: 0;
overflow: hidden;
position: absolute;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li:last-child a {
border-right: none;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li a {
display: inline-block;
padding: 0 25px;
height: 34px;
border-right: 1px solid #e5ecec;
background: -webkit-linear-gradient(#ffffff, #ebebeb);
background: linear-gradient(#ffffff, #ebebeb);
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 13px;
font-weight: bold;
color: #1f1f1f;
position: relative;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li a::before {
content: "";
display: inline-block;
height: 34px;
vertical-align: middle;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li span {
display: inline-block;
vertical-align: middle;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li:hover a, #learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li.ui-state-active a {
background: -webkit-linear-gradient(top, #bfbfbf 0%, #d1d1d1 11%, #e9e9e9 93%);
background: linear-gradient(to bottom, #bfbfbf 0%, #d1d1d1 11%, #e9e9e9 93%);
color: #606060;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu form {
display: none;
}
#learncontent-contents .categorytop-hero .hero-tabs .ui-tabs-panel {
z-index: 2;
}
#learncontent-contents .categorytop-hero .slider-wrapper {
position: relative;
padding-bottom: 44px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .slider-ui-panel {
position: absolute;
width: 100%;
bottom: 0;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller {
padding-top: 9px;
min-height: 35px;
background: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/img-content-shadow-1px.png) repeat-x top;
text-align: center;
font-size: 0;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller > .container::after::after {
content: "";
display: table;
clear: both;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller .slide-button-paginator {
display: inline-block;
padding-top: 7px;
margin-left: 28px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller .first-child {
float: left;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller .last-child {
float: right;
}
#learncontent-contents .categorytop-hero .slider-wrapper .slide-pause {
float: right;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator {
display: inline-block;
padding: 3px 35px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator a {
display: inline-block;
padding: 0 5px;
vertical-align: middle;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator a > span {
display: block;
width: 11px;
height: 11px;
}
#learncontent-contents .categorytop-hero .slide-block {
min-height: 470px;
position: relative;
float: left;
}
#learncontent-contents .categorytop-hero .hero-image {
height: 470px;
text-align: center;
overflow: hidden;
}
#learncontent-contents .categorytop-hero .hero-image > .container > span {
display: inline-block;
margin-left: -112px;
}
#learncontent-contents .categorytop-hero .hero-image > .container > span > img {
height: 470px;
}
#learncontent-contents .categorytop-hero .keycopy {
width: 395px;
position: absolute;
left: 0px;
bottom: 40px;
}
#learncontent-contents .categorytop-hero .keycopy.position-right {
left: auto;
right: 0px;
text-align: right;
}
#learncontent-contents .categorytop-hero .keycopy p {
margin-top: 10px;
}
#learncontent-contents .categorytop-hero .keycopy .seemore {
margin-top: 15px;
}
#learncontent-contents .categorytop-hero .keycopy .seemore a {
position: relative;
display: inline-block;
height: 43px;
padding: 0 18px;
border-radius: 3px;
box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.3);
}
#learncontent-contents .categorytop-hero .keycopy .seemore a::before {
content: "";
display: inline-block;
height: 43px;
vertical-align: middle;
}
#learncontent-contents .categorytop-hero .keycopy .seemore a span {
display: inline-block;
vertical-align: middle;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
}
#learncontent-contents .categorytop-hero .keycopy .seemore.type-video a {
padding-left: 13px;
}
#learncontent-contents .categorytop-hero .keycopy .seemore.type-video a::before {
margin-right: 13px;
height: 43px;
width: 28px;
background-image: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/spr-dynamichomepage.png);
background-repeat: no-repeat;
}
#learncontent-contents .categorytop-hero .style-dark {
color: #fff;
}
#learncontent-contents .categorytop-hero .style-dark .keycopy .seemore a {
background: #ececec;
background: -webkit-linear-gradient(#f5f5f5, #e4e4e4);
background: linear-gradient(#f5f5f5, #e4e4e4);
color: #1f1f1f;
}
#learncontent-contents .categorytop-hero .style-dark .keycopy .seemore a:hover, #learncontent-contents .categorytop-hero .style-dark .keycopy .seemore a:focus {
background: #262525;
background: -webkit-linear-gradient(#464444, #262525);
background: linear-gradient(#464444, #262525);
color: #fff;
}
#learncontent-contents .categorytop-hero .style-dark .keycopy .seemore.type-video a::before {
background-position: -28px 0;
}
#learncontent-contents .categorytop-hero .style-dark .keycopy .seemore.type-video a:hover::before, #learncontent-contents .categorytop-hero .style-dark .keycopy .seemore.type-video a:focus::before {
background-position: 0 0;
}
#learncontent-contents .categorytop-hero .style-light {
color: #1f1f1f;
}
#learncontent-contents .categorytop-hero .style-light .keycopy .seemore a {
background: #262525;
background: -webkit-linear-gradient(#464444, #262525);
background: linear-gradient(#464444, #262525);
color: #fff;
}
#learncontent-contents .categorytop-hero .style-light .keycopy .seemore a:hover, #learncontent-contents .categorytop-hero .style-light .keycopy .seemore a:focus {
background: #ececec;
background: -webkit-linear-gradient(#f5f5f5, #e4e4e4);
background: linear-gradient(#f5f5f5, #e4e4e4);
color: #1f1f1f;
}
#learncontent-contents .categorytop-hero .style-light .keycopy .seemore.type-video a::before {
background-position: 0 0;
}
#learncontent-contents .categorytop-hero .style-light .keycopy .seemore.type-video a:hover::before, #learncontent-contents .categorytop-hero .style-light .keycopy .seemore.type-video a:focus::before {
background-position: -28px 0;
}
html.touch-device #learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li:hover a {
background: -webkit-linear-gradient(#ffffff, #ebebeb);
background: linear-gradient(#ffffff, #ebebeb);
color: #1f1f1f;
}
html.touch-device #learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li.ui-state-active a {
background: -webkit-linear-gradient(top, #bfbfbf 0%, #d1d1d1 11%, #e9e9e9 93%);
background: linear-gradient(to bottom, #bfbfbf 0%, #d1d1d1 11%, #e9e9e9 93%);
color: #606060;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .categorytop-hero .style-light.textShadow {
-webkit-text-shadow: 0 0 3px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1);
text-shadow: 0 0 3px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1);
}
#learncontent-contents .categorytop-hero .style-light.textShadow-strong1 {
-webkit-text-shadow: -1px -1px 0 rgba(255,255,255,1), 1px -1px 0 rgba(255,255,255,1), 1px 1px 0 rgba(255,255,255,1), -1px 1px 0 rgba(255,255,255,1), 0 0 7px rgba(255,255,255,1), 0 0 6px rgba(255,255,255,1), 0 0 5px rgba(255,255,255,1), 0 0 4px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1), 0 0 2px rgba(255,255,255,1), 0 0 1px rgba(255,255,255,1);
text-shadow: -1px -1px 0 rgba(255,255,255,1), 1px -1px 0 rgba(255,255,255,1), 1px 1px 0 rgba(255,255,255,1), -1px 1px 0 rgba(255,255,255,1), 0 0 7px rgba(255,255,255,1), 0 0 6px rgba(255,255,255,1), 0 0 5px rgba(255,255,255,1), 0 0 4px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1), 0 0 2px rgba(255,255,255,1), 0 0 1px rgba(255,255,255,1);
}
#learncontent-contents .categorytop-hero .style-light.textShadow-strong2 {
-webkit-text-shadow: 0 0 5px rgba(255,255,255,1), 0 0 4px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1), 0 0 2px rgba(255,255,255,1), 0 0 1px rgba(255,255,255,1);
text-shadow: 0 0 5px rgba(255,255,255,1), 0 0 4px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1), 0 0 2px rgba(255,255,255,1), 0 0 1px rgba(255,255,255,1);
}
#learncontent-contents .categorytop-hero .style-dark.textShadow {
-webkit-text-shadow: 0 0 3px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1);
text-shadow: 0 0 3px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1);
}
#learncontent-contents .categorytop-hero .style-dark.textShadow-strong1 {
-webkit-text-shadow: -1px -1px 0 rgba(0,0,0,1), 1px -1px 0 rgba(0,0,0,1), 1px 1px 0 rgba(0,0,0,1), -1px 1px 0 rgba(0,0,0,1), 0 0 7px rgba(0,0,0,1), 0 0 6px rgba(0,0,0,1), 0 0 5px rgba(0,0,0,1), 0 0 4px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1), 0 0 2px rgba(0,0,0,1), 0 0 1px rgba(0,0,0,1);
text-shadow: -1px -1px 0 rgba(0,0,0,1), 1px -1px 0 rgba(0,0,0,1), 1px 1px 0 rgba(0,0,0,1), -1px 1px 0 rgba(0,0,0,1), 0 0 7px rgba(0,0,0,1), 0 0 6px rgba(0,0,0,1), 0 0 5px rgba(0,0,0,1), 0 0 4px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1), 0 0 2px rgba(0,0,0,1), 0 0 1px rgba(0,0,0,1);
}
#learncontent-contents .categorytop-hero .style-dark.textShadow-strong2 {
-webkit-text-shadow: 0 0 5px rgba(0,0,0,1), 0 0 4px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1), 0 0 2px rgba(0,0,0,1), 0 0 1px rgba(0,0,0,1);
text-shadow: 0 0 5px rgba(0,0,0,1), 0 0 4px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1), 0 0 2px rgba(0,0,0,1), 0 0 1px rgba(0,0,0,1);
}
#learncontent-contents .categorytop-hero .keycopy .seemore {
text-shadow: none;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .categorytop-hero {
margin-top: -15px;
padding-bottom: 0;
background-color: #202020;
}
#learncontent-contents .categorytop-hero::before {
background-image: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/img-content-shadow-1px-m.png);
background-size: 1px 5px;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu {
top: 15px;
left: 10px;
width: auto;
text-align: left;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu-text {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 0.688rem;
font-weight: bold;
color: #1f1f1f;
display: inline-block;
vertical-align: middle;
padding-right: 18px;
background: url(/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-down-m.png) no-repeat 100% 50%;
background-size: 13px 8px;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu nav {
display: inline-block;
height: 30px;
background: #ececec;
background: -webkit-linear-gradient(#f5f5f5, #e4e4e4);
background: linear-gradient(#f5f5f5, #e4e4e4);
position: relative;
border-radius: 3px;
border: 1px solid #e1e1e1;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding-left: 6px;
padding-right: 6px;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu nav form {
display: inherit;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu nav form::before {
content: "";
display: inline-block;
height: 28px;
vertical-align: middle;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu nav form select {
width: 100%;
height: 28px !important;
position: absolute;
top: 0;
left: 0;
opacity: 0;
font-size: 18px;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu .container {
padding: 0 !important;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul {
display: none;
}
#learncontent-contents .categorytop-hero .style-dark, #learncontent-contents .categorytop-hero .style-light {
color: #fff;
}
#learncontent-contents .categorytop-hero .slider-wrapper {
padding-bottom: 68px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller {
background: none;
padding: 25px 0;
min-height: 0;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller .slide-button-paginator {
padding-top: 0;
margin-left: 0;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller .first-child, #learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller .last-child {
display: none;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator {
text-align: center;
height: 12px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator img {
display: none;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator a {
padding: 0 2px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator a span {
display: inline-block;
width: 12px;
height: 12px;
background-image: url(/etc/designs/panasonic/common-clientlibs/images/icn-slideshow-dot-grey-off-m.png);
background-position: left top;
background-size: 12px 12px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator .selected span {
background-position: left top;
background-image: url(/etc/designs/panasonic/common-clientlibs/images/icn-slideshow-dot-grey-on-m.png);
}
#learncontent-contents .categorytop-hero .slide-pause {
display: none;
}
#learncontent-contents .categorytop-hero .slide-block {
min-height: 0;
position: relative;
float: left;
}
#learncontent-contents .categorytop-hero .hero-image {
height: 167px;
background-color: #000;
}
#learncontent-contents .categorytop-hero .hero-image > .container > span {
margin-left: -112px;
margin-right: -112px;
}
#learncontent-contents .categorytop-hero .hero-image > .container > span > img {
height: 167px;
}
#learncontent-contents .categorytop-hero .keycopy {
width: auto !important;
position: static;
padding: 20px 10px 0;
text-align: left!important;
}
#learncontent-contents .categorytop-hero .keycopy p {
margin-top: 10px;
}
#learncontent-contents .categorytop-hero .keycopy .seemore {
margin-top: 25px;
text-align: center !important;
}
#learncontent-contents .categorytop-hero .keycopy .seemore a, #learncontent-contents .categorytop-hero .keycopy .seemore a:hover {
padding: 0 !important;
height: 31px;
font-size: 0.938rem;
color: #1f1f1f !important;
background: #ececec !important;
background: -webkit-linear-gradient(#f5f5f5, #e4e4e4) #ececec !important;
background: linear-gradient(#f5f5f5, #e4e4e4) #ececec !important;
}
#learncontent-contents .categorytop-hero .keycopy .seemore a::before {
height: 31px !important;
width: 0 !important;
background: none !important;
margin-right: 0 !important;
}
#learncontent-contents .categorytop-hero .keycopy .seemore a span {
padding: 0 15px;
}
}
/************************** modalwindow *****************************/
#modalwindow {
padding: 18px;
}
#modalwindow-wrapper {
width: 976px;
height: 0;
overflow: hidden;
position: absolute;
z-index: 1000;
}
#modalwindow-bg {
background-color: #fff;
position: relative;
}
#modalwindow-bg .btn-close {
position: absolute;
display: block;
top: 16px;
right: 18px;
width: 45px;
height: 45px;
cursor: pointer;
overflow: hidden;
z-index: 10;
}
#modalwindow-wrapper.visual {
width: auto;
overflow: auto;
}
#modalwindow-wrapper.visual #modalwindow-bg {
padding: 0 60px;
background: none;
}
#modalwindow-wrapper.visual #modalwindow-bg .btn-close {
top: 0px;
right: 0;
}
#modalwindow-wrapper.visual #modalwindow {
padding: 0;
}
#modalwindow-wrapper.visual #modalwindow .video {
background-color: #000;
width: 854px;
/*height:480px;*/
}
.lightbox_title {
margin-bottom: 20px;
margin-right: 55px;
}
.lightbox_title:after {
content: "";
display: table;
clear: both;
}
.lightbox_title .Title {
float: left;
}
#modalwindow .lightbox_title .printbut {
float: right;
display: inline-block;
height: 41px;
padding: 0 16px 0 55px;
border-radius: 3px;
position: relative;
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
background: url(/etc/designs/panasonic/basicpage-clientlibs/images/icn-button-print.png) no-repeat 0 50%, url(/etc/designs/panasonic/basicpage-clientlibs/images/btn-darkgrey-1px.png) repeat-x;
}
.lightbox_title .printbut:before,
.lightbox_title .printbut:after {
display: inline-block;
content: "";
overflow: hidden;
height: 41px;
background-repeat: no-repeat;
vertical-align: middle;
}
.lightbox_title .printbut span {
display: inline-block;
vertical-align: middle;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
color: #fff;
}
.modal_content {
overflow: auto;
}
.modal_content .container {
padding: 0 0;
max-width: 940px;
margin: 0 auto;
}
.modal_content .jspVerticalBar {
width: 33px;
background: none;
margin: 8px 0;
}
.modal_content .jspVerticalBar .jspCap {
display: block;
width: 9px;
height: 7px;
margin: 0 auto;
background-image: url(/etc/designs/panasonic/basicpage-clientlibs/images/spr-global-lightbox.png);
background-repeat: no-repeat;
}
.modal_content .jspVerticalBar .jspCap.jspCapTop {
background-position: -61px -51px;
margin-top: -8px;
}
.modal_content .jspVerticalBar .jspCap.jspCapBottom {
background-position: -61px -64px;
margin-bottom: -8px;
}
.modal_content .jspVerticalBar .jspTrack {
background: none;
background: url(/etc/designs/panasonic/basicpage-clientlibs/images/img-lightbox-scroll-track-1px.png) repeat-y center;
}
.modal_content .jspVerticalBar .jspDrag {
position: relative;
background: none;
background: url(/etc/designs/panasonic/basicpage-clientlibs/images/img-lightbox-scroll-slider-3line.png) no-repeat 50% 50% #323131;
border: 1px solid #555;
border-radius: 3px;
}
html.touch-device .modal_content {
-webkit-overflow-scrolling: touch !important;
overflow: auto !important;
}
.printlightbox .printbut {
display: none;
}
.printlightbox .jspScrollable {
overflow: visible !important;
height: auto !important;
width: auto !important;
}
.printlightbox .jspContainer {
height: auto !important;
width: auto !important;
}
.printlightbox .jspPane {
position: static !important;
width: auto !important;
}
.printlightbox .jspVerticalBar {
display: none;
}
/*video*/
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link {
background-color: #1f1f1f;
padding: 0 20px;
color: #fff;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .richtext {
padding-top: 15px;
padding-bottom: 10px;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore {
padding-bottom: 20px;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a {
margin-top: 8px;
position: relative;
display: inline-block;
height: 43px;
padding: 0 18px;
margin-right: 10px;
border-radius: 3px;
box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.3);
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a:before {
content: "";
display: inline-block;
height: 43px;
vertical-align: middle;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a span {
display: inline-block;
vertical-align: middle;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a {
background: #ececec;
background: -webkit-linear-gradient(#f5f5f5, #e4e4e4);
background: linear-gradient(#f5f5f5, #e4e4e4);
color: #1f1f1f;
}
#modalwindow-wrapper.visual #modalwindow .video .closed {
height: 100%;
text-align: center;
}
#modalwindow-wrapper.visual #modalwindow .video .closed:before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
#modalwindow-wrapper.visual #modalwindow .video .closed > span {
color: #fff;
font-size: 13px;
}
#modalwindow-wrapper .richtext.section {
font-size: 12px;
line-height: 17px;
}
#modalwindow-wrapper .richtext.section a {
color: #00a0c6;
font-weight: bold;
}
#modalwindow-wrapper .richtext.section b {
font-weight: bold;
}
#modalwindow-wrapper .richtext.section i {
font-style: italic;
}
#modalwindow-wrapper .richtext.section p,
#modalwindow-wrapper .richtext.section ul,
#modalwindow-wrapper .richtext.section ol,
#modalwindow-wrapper .richtext.section > div {
margin-top: 15px;
}
#modalwindow-wrapper .richtext.section:first-child > :first-child {
margin-top: 0;
}
#modalwindow-wrapper .richtext.section ul {
list-style: outside disc;
margin-left: 1.5em;
}
#modalwindow-wrapper .richtext.section ol {
list-style: outside decimal;
margin-left: 1.5em;
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#modalwindow-wrapper {
width: 100%;
top: 0;
}
#modalwindow-bg {
margin: 10px;
background-color: #fff;
}
#modalwindow-bg .btn-close {
top: 7px;
right: 7px;
width: 32px;
height: 32px;
background: url(/etc/designs/panasonic/common-clientlibs/images/btn-lightbox-close.png) no-repeat;
background-size: 32px 32px;
}
#modalwindow-bg .btn-close img {
display: none;
}
#modalwindow {
padding: 15px;
}
#modalwindow-wrapper.visual {
width: 100%;
}
#modalwindow-wrapper.visual #modalwindow-bg {
padding: 40px 0 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#modalwindow-wrapper.visual #modalwindow .video {
width: 100%;
height: auto;
margin: 0 auto;
}
#modalwindow-wrapper.visual #modalwindow .video > div {
margin-top: 0;
}
#modalwindow .lightbox_title {
margin-bottom: 0;
height: 32px;
}
#modalwindow .lightbox_title .printbut {
display: none;
}
.modal_content {
overflow: auto;
}
.modal_content .jspVerticalBar {
width: 15px;
}
#modalwindow-wrapper .jScrollbar_draggable {
/* slider container */
display: none !important;
}
#modalwindow-wrapper.android2 .jScrollbar_draggable {
/* slider container */
display: block !important;
}
/*video*/
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link {
padding: 0 10px;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .richtext {
padding-top: 10px;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore {
text-align: center;
padding-bottom: 10px;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a {
margin: 5px 5px 0;
padding: 0 !important;
height: 31px;
font-size: 0.938rem;
color: #1f1f1f !important;
background: -webkit-linear-gradient(#f5f5f5, #e4e4e4) !important;
background: linear-gradient(#f5f5f5, #e4e4e4) !important;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a:before {
height: 31px;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a span {
padding: 0 15px;
}
}
/******************** categorytop-linklis ********************/
#learncontent-contents .categorylink, #learncontent-contents .categorylist {
background-color: #fff;
border-bottom: 1px solid #d6d6d6;
color: #1f1f1f;
}
#learncontent-contents .categorylink img, #learncontent-contents .categorylist img {
max-width: 100%;
width: auto;
height: auto;
}
#learncontent-contents .categorylink__title, #learncontent-contents .categorylist__title {
text-align: center;
}
#learncontent-contents .categorylink__seeall, #learncontent-contents .categorylist__seeall {
text-align: center;
}
#learncontent-contents .categorylink__seeall::before, #learncontent-contents .categorylist__seeall::before {
content: "";
display: table;
}
#learncontent-contents .categorylink__seeall__link, #learncontent-contents .categorylist__seeall__link {
color: #0041c0 !important;
font-weight: normal;
font-size: 14px;
}
#learncontent-contents .categorylink .icn, #learncontent-contents .categorylist .icn {
display: inline-block;
vertical-align: middle;
line-height: 0;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .categorylink, #learncontent-contents .categorylist {
padding: 60px 0;
}
#learncontent-contents .categorylink__title, #learncontent-contents .categorylist__title {
margin-bottom: 25px;
}
#learncontent-contents .categorylink__seeall-in, #learncontent-contents .categorylist__seeall-in {
margin-top: 15px;
}
#learncontent-contents .categorylink .icn, #learncontent-contents .categorylist .icn {
margin-left: 7px;
position: relative;
}
#learncontent-contents .categorylink .icn-swapimg_db::after, #learncontent-contents .categorylist .icn-swapimg_db::after {
content: url(/etc/designs/panasonic/common-clientlibs/images/icn-see-more-ro-db.gif);
display: inline-block;
height: 10px;
width: 10px;
position: absolute;
top: 0;
left: 0;
opacity: 0;
}
#learncontent-contents .categorylink a:hover .icn-swapimg_db img, #learncontent-contents .categorylist a:hover .icn-swapimg_db img {
opacity: 0;
}
#learncontent-contents .categorylink a:hover .icn-swapimg_db::after, #learncontent-contents .categorylist a:hover .icn-swapimg_db::after {
opacity: 1;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .categorylink, #learncontent-contents .categorylist {
padding: 15px 0;
}
#learncontent-contents .categorylink-in, #learncontent-contents .categorylist-in {
padding: 0;
}
#learncontent-contents .categorylink__title, #learncontent-contents .categorylist__title {
padding: 15px 10px 10px;
}
#learncontent-contents .categorylink__seeall-in, #learncontent-contents .categorylist__seeall-in {
margin-top: 15px;
}
#learncontent-contents .categorylink .icn, #learncontent-contents .categorylist .icn {
margin-left: 7px;
}
#learncontent-contents .categorylink .icn img, #learncontent-contents .categorylist .icn img {
width: 8px;
height: 8px;
}
}
/******************** categorylink ********************/
#learncontent-contents .categorylink-in.container {
max-width: none;
padding: 0;
}
#learncontent-contents .categorylink__content {
font-size: 0;
}
#learncontent-contents .categorylink__content a {
color: #1f1f1f;
text-decoration: none;
}
#learncontent-contents .categorylink__content a:hover {
color: #0041c0;
}
#learncontent-contents .categorylink__parentitem {
-webkit-appearance: none;
appearance: none;
border: none;
border-radius: 0;
background: none;
padding: 0;
margin: 0;
display: block;
width: 100%;
cursor: pointer;
text-align: center;
}
#learncontent-contents .categorylink__parentitem > a, #learncontent-contents .categorylink__parentitem > span {
display: block;
cursor: pointer;
}
#learncontent-contents .categorylink__parentitem-label {
color: #1f1f1f;
text-decoration: none;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
#learncontent-contents .categorylink__parentitem-icn {
position: relative;
}
#learncontent-contents .categorylink__parentitem-icn::after {
content: "";
display: block;
position: absolute;
width: 100%;
bottom: 0;
}
#learncontent-contents .categorylink__parentitem a:hover .categorylink__parentitem-icn::after, #learncontent-contents .categorylink__parentitem.active .categorylink__parentitem-icn::after {
border-bottom: 3px solid #0041c0;
}
#learncontent-contents .categorylink__parentitem a:hover .categorylink__parentitem-icn svg, #learncontent-contents .categorylink__parentitem.active .categorylink__parentitem-icn svg {
fill: #0041c0;
}
#learncontent-contents .categorylink__child {
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: none;
}
#learncontent-contents .categorylink__child a {
display: block;
}
#learncontent-contents .categorylink__child__top {
-webkit-box-sizing: border-box;
box-sizing: border-box;
background-color: #fff;
border-radius: 3px;
}
#learncontent-contents .categorylink__child__top-label {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
#learncontent-contents .categorylink__child__top-description {
margin-top: 2px;
font-weight: normal;
font-size: 12px;
line-height: 17px;
max-height: 28px;
overflow: hidden;
}
#learncontent-contents .categorylink__child__item {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#learncontent-contents .categorylink__child__item-label {
font-weight: normal;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .categorylink__content {
position: relative;
}
#learncontent-contents .categorylink__content::before {
content: "";
display: block;
position: absolute;
width: 100%;
height: 180px;
left: 0;
bottom: 0;
background-color: #f6f6f6;
}
#learncontent-contents .categorylink__content::after {
content: "";
display: block;
position: absolute;
width: 100%;
height: 8px;
left: 0;
bottom: 172px;
background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0));
}
#learncontent-contents .categorylink__parentlist {
text-align: center;
}
#learncontent-contents .categorylink__parentlist__li {
display: inline-block;
width: 112px;
margin: 0 5px;
vertical-align: bottom;
}
#learncontent-contents .categorylink__parentitem-img {
margin-bottom: 10px;
}
#learncontent-contents .categorylink__parentitem-img img {
width: 102px;
}
#learncontent-contents .categorylink__parentitem-label {
font-size: 13px;
line-height: 19px;
height: 34px;
}
#learncontent-contents .categorylink__parentitem-icn {
padding: 8px 0;
}
#learncontent-contents .categorylink__child {
position: absolute;
width: 100%;
left: 0;
z-index: 1;
height: 180px;
padding: 20px 10px;
}
#learncontent-contents .categorylink__child__top {
display: inline-block;
width: 168px;
height: 140px;
padding: 5px 3px;
vertical-align: middle;
}
#learncontent-contents .categorylink__child__top-img img {
width: 80px;
}
#learncontent-contents .categorylink__child__top-label {
font-size: 13px;
line-height: 19px;
height: 34px;
}
#learncontent-contents .categorylink__child__list {
display: inline-block;
vertical-align: middle;
padding: 12px 0;
margin-left: 20px;
max-width: 768px;
text-align: left;
}
#learncontent-contents .categorylink__child__list__li {
display: inline-block;
vertical-align: middle;
width: 192px;
}
#learncontent-contents .categorylink__child__item a {
display: block;
}
#learncontent-contents .categorylink__child__item-in::before {
content: "";
display: inline-block;
height: 58px;
vertical-align: middle;
}
#learncontent-contents .categorylink__child__item-img {
display: inline-block;
vertical-align: middle;
padding: 0 5px;
}
#learncontent-contents .categorylink__child__item-img img {
width: 54px;
}
#learncontent-contents .categorylink__child__item-label {
width: 120px;
display: inline-block;
vertical-align: middle;
font-size: 12px;
line-height: 17px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .categorylink__content-in {
padding: 0;
}
#learncontent-contents .categorylink__parentlist {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
border-top: 1px solid #c1c1c1;
position: relative;
}
#learncontent-contents .categorylink__parentlist::after {
content: "";
display: block;
position: absolute;
width: 100%;
bottom: 0;
left: 0;
border-bottom: 1px solid #c1c1c1;
}
#learncontent-contents .categorylink__parentlist__li {
width: 50%;
-webkit-flex-shrink: 0;
flex-shrink: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#learncontent-contents .categorylink__parentlist__li:nth-child(2n+1) .categorylink__parentitem {
border-right: 1px solid #c1c1c1;
}
#learncontent-contents .categorylink__parentlist__li:nth-child(2n) .categorylink__child {
left: -100%;
}
#learncontent-contents .categorylink__parentitem {
border-bottom: 1px solid #c1c1c1;
}
#learncontent-contents .categorylink__parentitem.active .categorylink__parentitem-icn svg {
transform: scaleY(-1);
}
#learncontent-contents .categorylink__parentitem-in {
padding: 10px 10px 0;
}
#learncontent-contents .categorylink__parentitem-img {
margin-bottom: 6px;
}
#learncontent-contents .categorylink__parentitem-img img {
width: 108px;
height: 80px;
}
#learncontent-contents .categorylink__parentitem-label {
font-size: 13px;
line-height: 19px;
height: 30px;
}
#learncontent-contents .categorylink__parentitem-icn {
padding: 8px 0;
}
#learncontent-contents .categorylink__child {
width: 100vw;
position: relative;
}
#learncontent-contents .categorylink__child-in {
background-color: #e3e3e3;
border-bottom: 1px solid #c1c1c1;
padding: 20px;
}
#learncontent-contents .categorylink__child__top-in {
display: -webkit-flex;
display: flex;
align-items: center;
}
#learncontent-contents .categorylink__child__top-img {
-webkit-flex-shrink: 0;
flex-shrink: 0;
}
#learncontent-contents .categorylink__child__top-img img {
width: 108px;
height: 80px;
}
#learncontent-contents .categorylink__child__top-label_description {
padding: 0 10px;
-webkit-flex-grow: 1;
flex-grow: 1;
}
#learncontent-contents .categorylink__child__top-label {
font-size: 14px;
line-height: 20px;
}
#learncontent-contents .categorylink__child__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin: 10px -5px 0;
}
#learncontent-contents .categorylink__child__list__li {
width: calc(50% - 10px);
-webkit-flex-shrink: 0;
flex-shrink: 0;
margin: 10px 5px 0;
}
#learncontent-contents .categorylink__child__item {
text-align: center;
background-color: #fff;
border-radius: 3px;
}
#learncontent-contents .categorylink__child__item-in {
padding: 5px;
}
#learncontent-contents .categorylink__child__item-img {
margin-bottom: 5px;
}
#learncontent-contents .categorylink__child__item-img img {
width: 60px;
height: 45px;
}
#learncontent-contents .categorylink__child__item-label {
font-size: 12px;
line-height: 17px;
height: 30px;
overflow: hidden;
}
}
/******************** categorylist ********************/
#learncontent-contents .categorylist__item a {
color: #1f1f1f;
text-decoration: none;
display: inline-block;
}
#learncontent-contents .categorylist__item a:hover {
color: #0041c0;
}
#learncontent-contents .categorylist__item-img::before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-label-main {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
#learncontent-contents .categorylist__item.child .categorylist__item-label {
font-weight: normal;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .categorylist__content {
text-align: center;
font-size: 0;
}
#learncontent-contents .categorylist__content::after {
content: "";
display: table;
clear: both;
}
#learncontent-contents .categorylist__content > .categorylist__list {
margin: -40px -20px 0;
display: inline-block;
text-align: left;
}
#learncontent-contents .categorylist__content > .categorylist__list > .categorylist__list__li {
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 254px;
padding: 0 20px;
margin-top: 40px;
float: left;
}
#learncontent-contents .categorylist__content > .categorylist__list > .categorylist__list__li:nth-child(4n+1) {
clear: both;
}
#learncontent-contents .categorylist__item.parent {
text-align: center;
border-bottom: 2px solid #a8a8a8;
padding-bottom: 13px;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-label-sub {
margin-top: 5px;
font-size: 13px;
line-height: 19px;
overflow: hidden;
font-weight: normal;
height: 30px;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-label-main {
font-size: 20px;
line-height: 28px;
height: 48px;
overflow: hidden;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-img {
margin-bottom: 30px;
height: 92px;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-img img {
max-width: 123px;
max-height: 92px;
}
#learncontent-contents .categorylist__item.parent + .categorylist__list {
margin-top: 12px;
}
#learncontent-contents .categorylist__item.child {
margin-top: 4px;
}
#learncontent-contents .categorylist__item.child .categorylist__item-label-main {
font-size: 12px;
line-height: 17px;
}
#learncontent-contents .categorylist__item.child .categorylist__item-img {
display: none;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .categorylist__content {
border-top: 1px solid #c9c9c9;
}
#learncontent-contents .categorylist__list {
position: relative;
}
#learncontent-contents .categorylist__item {
font-size: 0;
border-bottom: 1px solid #c9c9c9;
}
#learncontent-contents .categorylist__item a {
display: block;
}
#learncontent-contents .categorylist__item-in {
display: -webkit-flex;
display: flex;
}
#learncontent-contents .categorylist__item-img {
width: 64px;
height: 48px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-flex-shrink: 0;
flex-shrink: 0;
text-align: center;
}
#learncontent-contents .categorylist__item-label {
-webkit-flex-grow: 1;
flex-grow: 1;
padding: 0 18px;
white-space: nowrap;
}
#learncontent-contents .categorylist__item-label::before {
content: "";
display: inline-block;
height: 48px;
vertical-align: middle;
}
#learncontent-contents .categorylist__item-label-sub {
display: none;
}
#learncontent-contents .categorylist__item-label-main {
display: inline-block;
vertical-align: middle;
white-space: normal;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-img img {
max-width: 64px;
max-height: 48px;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-label {
font-size: 14px;
line-height: 20px;
}
#learncontent-contents .categorylist__item.parent + .categorylist__list::after {
content: "";
display: block;
position: absolute;
width: 100%;
height: 9px;
left: 0;
top: 0;
background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0));
}
#learncontent-contents .categorylist__item.child {
background-color: #f6f6f6;
}
#learncontent-contents .categorylist__item.child .categorylist__item-img {
padding: 6px 0;
}
#learncontent-contents .categorylist__item.child .categorylist__item-img img {
max-width: 48px;
max-height: 36px;
}
#learncontent-contents .categorylist__item.child .categorylist__item-label {
font-size: 12px;
line-height: 17px;
}
}
/************************** btn style *****************************/
.btn-style2 {
display: inline-block;
height: 45px;
padding: 0 1px;
margin: 0 12px 0 49px;
background-repeat: repeat-x;
background-image: url(productpage-clientlibs/images/btn-product-darkgrey-1px.png);
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 13px;
font-weight: bold;
text-transform: uppercase;
color: #fff;
}
.btn-style2::before, .btn-style2::after {
display: inline-block;
content: "";
height: 45px;
background-repeat: no-repeat;
background-image: url(productpage-clientlibs/images/spr-global-product-db.png);
vertical-align: middle;
}
.btn-style2::before {
width: 51px;
margin-left: -51px;
}
.btn-style2::after {
width: 14px;
margin-right: -14px;
background-position: -371px -72px;
}
.btn-style2 span {
display: inline-block;
vertical-align: middle;
padding-top: 2px;
color: #fff;
}
.type-pdf .btn-style2::before {
background-position: -86px -72px;
}
.type-download .btn-style2::before {
background-position: -314px -72px;
}
.type-spec .btn-style2::before {
background-position: -257px -72px;
}
.type-overview .btn-style2::before {
background-position: -143px -72px;
}
.type-buy .btn-style2::before {
background-position: -143px -72px;
}
.touch-device .btn-style2 span {
padding-top: 0;
}
/************************** support *****************************/
.support_bg a {
color: #0041c0;
}
.support-content {
margin-top: 70px;
}
.support-content::after {
content: "";
display: table;
clear: both;
}
.support-content .col dt {
font-weight: bold;
}
.support-content .col dd.pdf {
background: url(common-clientlibs/images/icn-pdf-large.png) no-repeat left;
}
.support-content .col a {
font-weight: bold;
color: #0041c0 !important;
}
.supportsection .fitch {
margin-top: 45px;
text-align: center;
}
.supportsection .fitch a {
font-weight: bold;
color: #0041c0 !important;
}
.supportsection .fitch a img {
margin-left: 3px;
vertical-align: middle;
max-width: 13px;
max-height: 15px;
width: auto;
height: auto;
}
.supportsection .support-notes {
margin-top: 45px;
}
.supportsection .fitch + .support-notes {
margin-top: 18px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.support_bg {
min-height: 460px;
}
.support_bg .sectionContents {
padding: 45px 0;
}
.support-content .col {
float: left;
width: 229px;
}
.support-content .col:not(:first-child) {
margin-left: 20px;
}
.support-content .col dt, .support-content .col dd, .support-content .col li {
font-size: 13px;
line-height: 19px;
}
.support-content .col dd:not(:first-child) {
margin-top: 20px;
}
.support-content .col dd.pdf {
padding-left: 37px;
}
.support-content .col li:not(:first-child) {
margin-top: 35px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.support_bg .sectionContents {
padding: 20px 0;
}
.support-title {
text-align: center;
}
.support-title h3 {
margin-top: 0;
}
.support-content {
padding: 0 10px;
margin-top: 0;
}
.support-content .col {
margin-top: 20px;
}
.support-content .col dl::after {
content: "";
display: table;
clear: both;
}
.support-content .col dt, .support-content .col dd, .support-content .col li {
font-size: 0.625rem;
line-height: 0.875rem;
}
.support-content .col dd {
margin-top: 15px;
float: left;
width: 48%;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.support-content .col dd:nth-of-type(even) {
float: right;
}
.support-content .col dd.pdf {
padding-left: 31px;
background-size: 26px 26px;
}
.support-content .col li:not(:first-child) {
margin-top: 5px;
}
.support-notes {
padding: 0 10px;
margin-top: 40px;
}
#learncontent-contents .supportsection .container {
padding: 0;
}
}
/************************** disclaimer *****************************/
.disclaimer-detail .title {
text-align: center;
padding: 15px 60px 20px;
border-bottom: 1px solid #c9c9c9;
margin-bottom: 20px;
}
.disclaimer-detail .title h1, .disclaimer-detail .title h2, .disclaimer-detail .title h3, .disclaimer-detail .title h4, .disclaimer-detail .title h5, .disclaimer-detail .title h6 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 20px;
font-weight: bold;
line-height: 28px;
}
.disclaimer-detail .spech_lightbox {
margin-bottom: 20px;
}
.disclaimer-detail .content {
padding: 0 40px 40px;
}
.disclaimer-detail .content p.leftmargin {
margin-left: 1.5em;
}
.disclaimer-detail .firmware_download {
padding-top: 20px;
border-top: 1px solid #c9c9c9;
text-align: right;
}
.disclaimer-detail .firmware_download .check-accept {
display: inline-block;
margin-right: 20px;
font-size: 12px;
line-height: 17px;
color: #5d5d5d;
}
.disclaimer-detail .firmware_download .check-accept > span {
display: inline-block;
min-height: 16px;
padding-top: 1px;
padding-left: 21px;
background-repeat: no-repeat;
background-position: left top;
background-image: url(common-clientlibs/images/img-checkbox-inactive.png);
}
.disclaimer-detail .firmware_download .check-accept input {
position: absolute;
top: 0;
left: 0;
filter: alpha(opacity=0) \9 ;
opacity: 0;
margin: 0;
}
.disclaimer-detail .firmware_download .check-accept label {
display: inline-block;
min-height: 16px;
padding-top: 1px;
padding-left: 21px;
cursor: pointer;
position: relative;
color: #1f1f1f;
}
.disclaimer-detail .firmware_download .check-accept label > span {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 16px;
height: 16px;
background-repeat: no-repeat;
background-position: left top;
background-image: url(common-clientlibs/images/img-checkbox-off-hc.png);
}
.disclaimer-detail .firmware_download .check-accept label.checked > span {
background-image: url(common-clientlibs/images/img-checkbox-on-hc.png);
}
.disclaimer-detail .firmware_download .main-btn {
display: inline-block;
visibility: hidden;
}
.disclaimer-detail .firmware_download.accepted .main-btn {
visibility: visible;
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.disclaimer-detail .title {
padding: 10px 30px 15px;
margin-bottom: 20px;
}
.disclaimer-detail .title h1, .disclaimer-detail .title h2, .disclaimer-detail .title h3, .disclaimer-detail .title h4, .disclaimer-detail .title h5, .disclaimer-detail .title h6 {
font-size: 1.125rem;
line-height: 1.575rem;
}
.disclaimer-detail .spech_lightbox {
margin-bottom: 15px;
}
.disclaimer-detail .content {
padding: 0 10px 20px;
}
.disclaimer-detail .firmware_download {
padding-top: 15px;
border-top: 1px solid #c9c9c9;
text-align: right;
}
.disclaimer-detail .check-accept {
margin-right: 20px;
font-size: 0.625rem;
line-height: 0.875rem;
}
.disclaimer-detail .check-accept input {
font-size: 18px;
opacity: 0;
z-index: 2;
}
}
/*
recipe
*/
/* appearance reset */
.ingredients button, .ingredients select, .ingredients input[type="checkbox"], .ingredients input[type="text"], .quickfilter button, .quickfilter select, .quickfilter input[type="checkbox"], .quickfilter input[type="text"], .recipelistcomplex button, .recipelistcomplex select, .recipelistcomplex input[type="checkbox"], .recipelistcomplex input[type="text"] {
-webkit-appearance: none;
appearance: none;
border: none;
border-radius: 0;
background: none;
padding: 0;
margin: 0;
}
/* cookingtime */
.cookingtime__container {
display: -webkit-flex;
display: flex;
align-items: center;
}
.cookingtime__icon {
margin-right: 10px;
-webkit-flex-shrink: 0;
flex-shrink: 0;
}
.cookingtime__text {
font-weight: bold;
line-height: 1.41;
}
.cookingtime__text__time, .cookingtime__text__fw, .cookingtime__text__date {
display: inline-flex;
}
.cookingtime__text__time:not(:last-child)::after, .cookingtime__text__fw:not(:last-child)::after, .cookingtime__text__date:not(:last-child)::after {
content: "";
display: inline-block;
}
.cookingtime__difficulty {
-webkit-flex-grow: 1;
flex-grow: 1;
-webkit-flex-shrink: 0;
flex-shrink: 0;
text-align: right;
font-weight: bold;
line-height: 1.41;
}
.cookingtime__difficulty::before {
content: "";
display: inline-block;
width: 20px;
}
.cookingtime__difficulty__label {
color: #484848;
}
.cookingtime__difficulty__label::after {
content: " ";
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.cookingtime__text {
font-size: 14px;
}
.cookingtime__text__time:not(:last-child)::after, .cookingtime__text__fw:not(:last-child)::after, .cookingtime__text__date:not(:last-child)::after {
width: 20px;
}
.cookingtime__difficulty {
font-size: 14px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.cookingtime__text {
font-size: 12px;
}
.cookingtime__text__time:not(:last-child)::after, .cookingtime__text__fw:not(:last-child)::after, .cookingtime__text__date:not(:last-child)::after {
width: 10px;
}
.cookingtime__difficulty {
font-size: 12px;
}
}
/* nutrition */
.nutrition__title {
margin-bottom: 10px;
font-weight: bold;
}
.nutrition__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.nutrition__list__item {
box-sizing: border-box;
border: 1px solid #c1c1c1;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
text-align: center;
}
.nutrition__list__item__layout {
position: relative;
padding-top: 100%;
}
.nutrition__list__item__layout__in {
position: absolute;
top: 0;
width: 100%;
height: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
}
.nutrition__list__item__value {
margin-top: 5px;
color: #484848;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.nutrition__title {
font-size: 16px;
line-height: 23px;
}
.nutrition__list {
margin: 0 -10px;
}
.nutrition__list__wrapper {
margin-top: -20px;
}
.nutrition__list__item {
margin: 20px 10px 0;
width: calc(12.5% - 20px);
}
.nutrition__list__item__label {
font-size: 16px;
}
.nutrition__list__item__value {
font-size: 30px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.nutrition__title {
font-size: 12px;
line-height: 17px;
}
.nutrition__list {
margin: 0 -5px;
}
.nutrition__list__wrapper {
margin-top: -10px;
}
.nutrition__list__item {
margin: 10px 5px 0;
width: calc(25% - 10px);
}
.nutrition__list__item__label {
font-size: 10px;
}
.nutrition__list__item__value {
font-size: 16px;
}
}
/* ingredients */
.ingredients__title {
margin-bottom: 20px;
}
.ingredients__servings {
margin-bottom: 20px;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
display: -webkit-flex;
display: flex;
align-items: center;
}
.ingredients__servings__btn {
position: relative;
background-color: #707070 !important;
border-radius: 3px !important;
overflow: hidden;
text-indent: -9999px;
}
.ingredients__servings__btn::before, .ingredients__servings__btn::after {
content: "";
display: block;
box-sizing: border-box;
position: absolute;
margin: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: #fff;
}
.ingredients__servings__btn::before {
height: 2px;
border: 1px solid #fff;
}
.ingredients__servings__btn.ingredients-decrease::after {
display: none;
}
.ingredients__servings__btn.ingredients-increase::after {
width: 2px;
border: 1px solid #fff;
}
.ingredients__content {
font-weight: bold;
}
.ingredients__content::before {
content: "";
display: table;
}
.ingredients__content__block__list {
color: #484848;
}
.ingredients__content__block__list__item__data:first-child::after {
content: " ";
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.ingredients__servings {
margin-top: -3px;
}
.ingredients__servings__label {
margin-right: 15px;
font-size: 18px;
-webkit-order: 0;
order: 0;
}
.ingredients__servings__count {
font-size: 24px;
-webkit-order: 2;
order: 2;
margin: 0 14px;
}
.ingredients__servings__btn {
width: 24px;
height: 24px;
}
.ingredients__servings__btn::before {
width: 12px;
}
.ingredients__servings__btn.ingredients-increase {
-webkit-order: 3;
order: 3;
}
.ingredients__servings__btn.ingredients-increase::after {
height: 12px;
}
.ingredients__content {
display: -webkit-flex;
display: flex;
margin: 0 -10px;
}
.ingredients__content__col {
box-sizing: border-box;
padding: 0 10px;
width: 50%;
margin-top: -20px;
}
.ingredients__content__block {
margin-top: 20px;
font-size: 16px;
line-height: 23px;
}
.ingredients__content__block__title {
padding-bottom: 10px;
}
.ingredients__content__block__list {
border-left: 1px solid #c1c1c1;
border-right: 1px solid #c1c1c1;
border-top: 1px solid #c1c1c1;
}
.ingredients__content__block__list__item {
padding: 10px;
border-bottom: 1px solid #c1c1c1;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.ingredients__servings {
background-color: #efefef;
padding: 5px 10px;
margin-top: -1px;
}
.ingredients__servings__label {
font-size: 14px;
margin-right: .25em;
}
.ingredients__servings__count {
font-size: 16px;
flex-grow: 1;
}
.ingredients__servings__btn {
width: 35px;
height: 25px;
margin-left: 10px !important;
}
.ingredients__servings__btn::before {
width: 13px;
}
.ingredients__servings__btn.ingredients-increase::after {
height: 13px;
}
.ingredients__content {
margin-top: -20px;
}
.ingredients__content__block {
margin-top: 20px;
font-size: 12px;
line-height: 17px;
}
.ingredients__content__block__title {
margin-bottom: 10px;
}
.ingredients__content__block__list {
margin-left: 1.5em;
list-style: disc;
}
.ingredients__content__block__list__item {
margin-top: 5px;
}
}
/* stepsofmaking */
.stepsofmaking__content::before {
content: "";
display: table;
}
.stepsofmaking__content__item {
box-sizing: border-box;
}
.stepsofmaking__content__item__tx__label {
font-weight: bold;
}
.stepsofmaking__content__item__img__video {
height: auto !important;
padding-top: 56.25%;
position: relative;
}
.stepsofmaking__content__item__img__video .youtube-placeholder {
position: absolute;
top: 0;
width: 100%;
height: 100%;
}
.stepsofmaking__content__item__img .modal-video {
display: block;
position: relative;
}
.stepsofmaking__content__item__img .modal-video::after {
content: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/icn-play-lg.png);
position: absolute;
display: block;
top: 50%;
left: 50%;
transform: translate(-50%, -47.8%);
opacity: .8;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.stepsofmaking__title {
margin-bottom: 20px;
}
.stepsofmaking__content__in {
margin: -20px -10px 0;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.stepsofmaking__content__item {
width: 50%;
padding: 0 10px;
margin-top: 20px;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
}
.stepsofmaking__content__item__tx {
-webkit-flex-grow: 1;
flex-grow: 1;
-webkit-flex-shrink: 0;
flex-shrink: 0;
-webkit-flex-basis: auto;
flex-basis: auto;
}
.stepsofmaking__content__item__tx__label {
margin-bottom: 8px;
font-size: 16px;
line-height: 23px;
}
.stepsofmaking__content__item__img {
margin-top: 20px;
-webkit-flex-shrink: 0;
flex-shrink: 0;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.stepsofmaking__title {
margin-bottom: 10px;
}
.stepsofmaking__content__in {
margin-top: -20px;
}
.stepsofmaking__content__item {
margin-top: 20px;
}
.stepsofmaking__content__item__tx__label {
margin-bottom: 5px;
font-size: 12px;
line-height: 17px;
}
.stepsofmaking__content__item__img {
margin-top: 10px;
}
}
/* relatedrecipes */
.relatedrecipes a {
font-weight: normal !important;
color: #1f1f1f !important;
}
.relatedrecipes__content::before {
content: "";
display: table;
}
.relatedrecipes__content__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.relatedrecipes__content__list__item {
box-sizing: border-box;
}
.relatedrecipes__content__list__item .tagscategories {
margin-top: 15px;
}
.relatedrecipes__content__list__item__txt__name, .relatedrecipes__content__list__item__txt__description {
display: block;
}
.relatedrecipes__content__list__item__txt__name {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
.relatedrecipes__content__list__item .icn-externallink {
vertical-align: middle !important;
margin-left: 7px;
}
.relatedrecipes__content__list__item__more__in {
position: relative;
padding-top: 100%;
}
.relatedrecipes__content__list__item__more__in > span {
position: absolute;
width: 100%;
display: block;
text-align: center;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
color: #0041C0;
top: 50%;
transform: translateY(-50%);
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.relatedrecipes__container:not(.align-inherit) {
text-align: center;
}
.relatedrecipes__title {
margin-bottom: 20px;
}
.relatedrecipes__content {
display: inline-block;
max-width: 100%;
text-align: left;
}
.relatedrecipes__content__list {
margin: -20px -10px 0;
}
.relatedrecipes__content__list__item {
margin-top: 20px;
padding: 0 10px;
width: 249px;
}
.relatedrecipes__content__list__item__txt__name {
margin-top: 10px;
font-size: 16px;
line-height: 23px;
}
.relatedrecipes__content__list__item__txt__description {
margin-top: 5px;
font-size: 12px;
line-height: 17px;
}
.relatedrecipes__content__list__item__more__in > span {
font-size: 18px;
line-height: 26px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.relatedrecipes__title {
margin-bottom: 10px;
}
.relatedrecipes__content__list {
margin: -20px -5px 0;
}
.relatedrecipes__content__list__item {
margin-top: 20px;
padding: 0 5px;
width: 50%;
}
.relatedrecipes__content__list__item__txt__name {
margin-top: 10px;
font-size: 14px;
line-height: 20px;
}
.relatedrecipes__content__list__item__txt__description {
margin-top: 5px;
font-size: 10px;
line-height: 14px;
}
.relatedrecipes__content__list__item .icn-externallink {
width: 8px;
height: 8px;
}
.relatedrecipes__content__list__item__more__in > span {
font-size: 14px;
line-height: 20px;
}
}
/* tagscategories */
.tagscategories::before {
content: "";
display: table;
}
.tagscategories a, .tagscategories .nolink {
display: block;
color: #1f1f1f !important;
}
.tagscategories a > span, .tagscategories .nolink > span {
font-size: 12px;
font-weight: bold;
line-height: 17px;
display: inline-block;
vertical-align: middle;
}
.tagscategories a:hover {
color: #0041C0 !important;
}
.tagscategories__container {
margin-top: -10px;
}
.tagscategories__tags__list, .tagscategories__categories__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.tagscategories__tags__list__item {
margin-top: 10px;
}
.tagscategories__tags__list__item:not(:last-child) a::after, .tagscategories__tags__list__item:not(:last-child) .nolink::after {
content: "";
box-sizing: border-box;
display: inline-block;
border-left: 1px solid #484848;
height: 14px;
width: 1px;
vertical-align: middle;
}
.tagscategories__categories__list__item {
border: 1px solid #707070;
border-radius: 2px;
margin-top: 10px;
box-sizing: border-box;
max-width: 100%;
}
.tagscategories__categories__list__item:not(:last-child) {
margin-right: 10px;
}
.tagscategories__categories__list__item a, .tagscategories__categories__list__item .nolink {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
padding: 0 10px;
}
.tagscategories__categories__list__item a > span, .tagscategories__categories__list__item .nolink > span {
font-weight: normal;
white-space: nowrap;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.tagscategories__tags__list__item:not(:last-child) a::after, .tagscategories__tags__list__item:not(:last-child) .nolink::after {
margin: 0 8px;
}
.tagscategories__categories__list__item a, .tagscategories__categories__list__item .nolink {
height: 24px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.tagscategories__tags__list__item:not(:last-child) a::after, .tagscategories__tags__list__item:not(:last-child) .nolink::after {
margin: 0 15px;
}
.tagscategories__categories__list__item a, .tagscategories__categories__list__item .nolink {
height: 28px;
}
}
/* customize-recipecheckbox */
.customize-recipecheckbox {
--box-bg-color: #fff;
--box-bg-color-checked: #707070;
--box-border-color: #707070;
--box-icn-filter: none;
display: inline-block;
position: relative;
width: 14px;
height: 14px;
border-radius: 2px;
}
.style-dark .customize-recipecheckbox {
--box-bg-color: #000;
--box-bg-color-checked: #c1c1c1;
--box-border-color: #313131;
--box-icn-filter: invert(1);
}
.customize-recipecheckbox input[type="checkbox"] {
width: 100%;
height: 100%;
border-radius: 2px;
}
.customize-recipecheckbox input[type="checkbox"]:checked + .customize-recipecheckbox__box {
background-color: var(--box-bg-color-checked);
}
.customize-recipecheckbox input[type="checkbox"]:checked + .customize-recipecheckbox__box::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI5LjMxMyIgaGVpZ2h0PSI4LjA1NiIgdmlld0JveD0iMCAwIDkuMzEzIDguMDU2Ij4KICA8ZyBpZD0iY2hlY2tlZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTc3OC4zNDQgLTEwMTMuMDc2KSI+CiAgICA8cGF0aCBpZD0iY2hlY2tlZC0yIiBkYXRhLW5hbWU9ImNoZWNrZWQiIGQ9Ik03LjU4Myw2Mi41MDcsMi44NzUsNjguMDQuNDE3LDY1LjE1MSwwLDY1LjY0MSwyLjg3NSw2OS4wMiw4LDYzWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNzc5IDk1MS4zNDEpIiBmaWxsPSIjZmZmIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMSIvPgogIDwvZz4KPC9zdmc+);
position: absolute;
margin: auto;
left: 0;
bottom: 0;
right: 0;
top: 0;
width: 9.313px;
height: 8.056px;
font-size: 0;
filter: var(--box-icn-filter);
}
.customize-recipecheckbox__box {
display: block;
box-sizing: border-box;
border: 1px solid var(--box-border-color);
border-radius: 2px;
position: absolute;
background-color: var(--box-bg-color);
width: 100%;
height: 100%;
top: 0;
left: 0;
}
/* quickfilter */
.quickfilter {
--bar-bg-color: #efefef;
--bar-icn-filter: none;
--panel-bg-color: #f6f6f6;
--panel-label-color: #484848;
--panel-border-color: #c1c1c1;
}
.style-dark .quickfilter {
--bar-bg-color: #313131;
--bar-icn-filter: brightness(0) invert(1);
--panel-bg-color: #1f1f1f;
--panel-label-color: #efefef;
--panel-border-color: #484848;
}
.quickfilter__container {
position: relative;
}
.quickfilter__bar {
background-color: var(--bar-bg-color);
}
.quickfilter__bar__in button {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
cursor: pointer;
display: -webkit-flex;
display: flex;
align-items: center;
color: inherit;
}
.quickfilter__bar__in button::after {
font-size: 0;
filter: var(--bar-icn-filter);
}
.quickfilter__bar__in button[aria-expanded="true"]::after {
transform: rotate(180deg);
}
.quickfilter__panel {
position: absolute;
background-color: var(--panel-bg-color);
width: 100%;
z-index: 1;
overflow: hidden;
display: none;
}
.quickfilter__panel::before, .quickfilter__panel::after {
content: "";
display: block;
position: absolute;
left: 0;
width: 100%;
}
.quickfilter__panel::before {
top: 0;
border-top: 1px solid var(--panel-border-color);
}
.quickfilter__panel::after {
bottom: 0;
border-bottom: 1px solid var(--panel-border-color);
}
.quickfilter__panel[aria-hidden="false"] {
z-index: 20;
}
.quickfilter__panel__col__title {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
.quickfilter__panel__submit__btn {
text-align: center;
}
.quickfilter__panel__submit__btn button {
background-color: #0041c0;
border-radius: 2px;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
text-transform: uppercase;
color: #fff;
display: -webkit-inline-flex;
display: inline-flex;
-webkit-align-items: center;
align-items: center;
cursor: pointer;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.quickfilter__container:not(.no-padding-top) {
padding-top: 45px;
}
.quickfilter__bar__in {
height: 48px;
margin: auto;
width: 976px;
display: -webkit-flex;
display: flex;
align-items: center;
}
.quickfilter__bar__in button {
font-size: 20px;
}
.quickfilter__bar__in button::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOS4yNDQiIGhlaWdodD0iOS42MjIiIHZpZXdCb3g9IjAgMCAxOS4yNDQgOS42MjIiPgogIDxnIGlkPSJhcnJvdy1kcm9wLWRvd24iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE5LjI0NCA5LjYyMikgcm90YXRlKDE4MCkiPgogICAgPHBhdGggZD0iTTAsNjMuNzVsOS42MjIsOS42MjIsOS42MjItOS42MjJaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxOS4yNDQgNzMuMzcyKSByb3RhdGUoMTgwKSIgZmlsbD0iIzFmMWYxZiIvPgogIDwvZz4KPC9zdmc+);
width: 19.244px;
height: 9.622px;
}
.quickfilter__bar__in button > span::after {
content: "";
display: inline-block;
width: 10px;
}
.quickfilter__panel__in {
padding: 20px 0;
margin: auto;
width: 976px;
}
.quickfilter__panel__row {
display: -webkit-flex;
display: flex;
}
.quickfilter__panel__row:first-of-type {
justify-content: center;
}
.quickfilter__panel__row:not(:first-of-type) {
margin-top: 20px;
border-top: 1px solid var(--panel-border-color);
}
.quickfilter__panel__col {
position: relative;
padding: 18px 0;
}
.quickfilter__panel__col + .quickfilter__panel__col::after {
content: "";
display: block;
height: 100%;
border-left: 1px solid var(--panel-border-color);
position: absolute;
top: 0;
left: 0;
}
.quickfilter__panel__col-md-3 {
width: 25%;
}
.quickfilter__panel__col-md-12 {
width: 100%;
}
.quickfilter__panel__col-md-12 .quickfilter__panel__checkboxes__list__item {
max-width: 25%;
flex-basis: 25%;
}
.quickfilter__panel__col__title {
padding: 0 20px;
margin-bottom: 15px;
font-size: 16px;
line-height: 23px;
}
.quickfilter__panel__checkboxes__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.quickfilter__panel__checkboxes__list__item {
box-sizing: border-box;
min-height: 24px;
margin-top: 10px;
padding: 0 20px;
width: 244px;
}
.quickfilter__panel__checkboxes__list__item__checkbox {
vertical-align: middle;
margin-right: 10px;
}
.quickfilter__panel__checkboxes__list__item__label {
font-weight: bold;
font-size: 13px;
line-height: 19px;
color: var(--panel-label-color);
}
.quickfilter__panel__checkboxes.limitedheight {
max-height: 170px;
overflow: auto;
}
.quickfilter__panel__multipleselect {
display: none;
}
.quickfilter__panel__submit {
margin-top: 20px;
}
.quickfilter__panel__submit__btn button {
height: 35px;
padding: 0 20px;
font-size: 16px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.quickfilter__container:not(.no-padding-top) {
padding-top: 30px;
}
.quickfilter__container.no-padding-top {
margin-top: -15px;
}
.quickfilter__bar__in button {
height: 42px;
font-size: 16px;
width: 100%;
padding: 0 10px;
text-align: left;
}
.quickfilter__bar__in button::after {
content: "";
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOS4yNDQiIGhlaWdodD0iOS42MjIiIHZpZXdCb3g9IjAgMCAxOS4yNDQgOS42MjIiPgogIDxnIGlkPSJhcnJvdy1kcm9wLWRvd24iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE5LjI0NCA5LjYyMikgcm90YXRlKDE4MCkiPgogICAgPHBhdGggZD0iTTAsNjMuNzVsOS42MjIsOS42MjIsOS42MjItOS42MjJaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxOS4yNDQgNzMuMzcyKSByb3RhdGUoMTgwKSIgZmlsbD0iIzFmMWYxZiIvPgogIDwvZz4KPC9zdmc+);
background-repeat: no-repeat;
background-size: contain;
width: 9px;
height: 4.5px;
}
.quickfilter__bar__in button > span {
-webkit-flex-grow: 1;
flex-grow: 1;
}
.quickfilter__panel__in {
padding: 10px;
}
.quickfilter__panel__col {
margin-bottom: 15px;
}
.quickfilter__panel__col__title {
font-size: 15px;
margin-bottom: 10px;
}
.quickfilter__panel__checkboxes {
display: none;
}
.quickfilter__panel__multipleselect {
border: 1px solid #707070;
border-radius: 2px;
background-color: #fff;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
}
.quickfilter__panel__multipleselect::after {
content: "";
display: block;
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOS4yNDQiIGhlaWdodD0iOS42MjIiIHZpZXdCb3g9IjAgMCAxOS4yNDQgOS42MjIiPgogIDxnIGlkPSJhcnJvdy1kcm9wLWRvd24iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE5LjI0NCA5LjYyMikgcm90YXRlKDE4MCkiPgogICAgPHBhdGggZD0iTTAsNjMuNzVsOS42MjIsOS42MjIsOS42MjItOS42MjJaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxOS4yNDQgNzMuMzcyKSByb3RhdGUoMTgwKSIgZmlsbD0iIzcwNzA3MCIvPgogIDwvZz4KPC9zdmc+Cg==);
background-repeat: no-repeat;
background-size: contain;
width: 9px;
height: 4.5px;
font-size: 0;
margin: 0 10px;
}
.quickfilter__panel__multipleselect select {
font-size: 16px;
width: 100%;
height: 42px;
box-sizing: border-box;
padding: 10px;
color: #707070;
}
.quickfilter__panel__submit {
margin-top: 20px;
margin-bottom: 10px;
}
.quickfilter__panel__submit__btn button {
height: 35px;
padding: 0 20px;
font-size: 12px;
}
}
/* recipelistcomplex */
.recipelistcomplex-header1, .recipelistcomplex-subheader1 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipelistcomplex-header1 {
font-size: 24px;
line-height: 36px;
}
.recipelistcomplex-subheader1 {
font-size: 16px;
line-height: 23px;
}
.recipelistcomplex__layoutcontainer {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin: 0 -10px;
}
.recipelistcomplex__header, .recipelistcomplex__main, .recipelistcomplex__sub {
box-sizing: border-box;
padding-left: 10px;
padding-right: 10px;
}
.recipelistcomplex__header {
width: calc( 100% * 2 / 3);
}
.recipelistcomplex__main {
width: calc( 100% * 2 / 3);
}
.recipelistcomplex__sub {
width: calc( 100% * 1 / 3);
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipelistcomplex-header1 {
font-size: 18px;
}
.recipelistcomplex-subheader1 {
font-size: 14px;
line-height: 20px;
}
}
/*.recipequery*/
.recipequery::before {
content: "";
display: table;
}
.recipequery__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-top: -10px;
}
.recipequery__list__item {
margin-top: 10px;
display: -webkit-flex;
display: flex;
}
.recipequery__list__item:not(:last-child)::after {
content: "";
width: 1px;
box-sizing: border-box;
border-left: 1px solid #1f1f1f;
display: inline-block;
vertical-align: middle;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipequery {
margin-bottom: 20px;
}
.recipequery__list__item:not(:last-child)::after {
margin: 0 15px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipequery {
margin-bottom: 20px;
}
.recipequery__list__item:not(:last-child)::after {
margin: 0 15px;
}
}
/*.recipelist*/
.recipelist__content {
border-top: 1px solid #a3a3a3;
min-height: 470px;
}
.recipelist__content__list__item {
border-bottom: 1px solid #a3a3a3;
}
.recipelist__content__list__item__in {
display: -webkit-flex;
display: flex;
}
.recipelist__content__list__item__main {
-webkit-order: 1;
order: 1;
}
.recipelist__content__list__item__main__top {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
}
.recipelist__content__list__item__textarea {
-webkit-order: 1;
order: 1;
}
.recipelist__content__list__item__textarea a {
color: inherit !important;
}
.recipelist__content__list__item__textarea a:hover {
color: #0041C0 !important;
}
.recipelist__content__list__item__title {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
font-size: 16px;
line-height: 23px;
}
.recipelist__content__list__item__description {
font-weight: normal;
font-size: 14px;
line-height: 20px;
}
.recipelist__content__list__item__image img {
width: 100%;
height: auto;
}
.recipelist__content__searchtips {
display: none;
margin-top: 30px;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
.recipelist__content__searchtips ul, .recipelist__content__searchtips ol {
margin-left: 1.5em;
}
.recipelist__content__searchtips ul {
list-style: disc;
}
.recipelist__content__searchtips ol {
list-style: decimal;
}
.recipelist__content.noresults .recipelist__content__searchtips {
display: block;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipelist__title {
margin-bottom: 20px;
}
.recipelist__content__list__item__in {
padding: 20px 0;
margin: 0 -10px;
}
.recipelist__content__list__item__main {
width: 409px;
margin: 0 10px;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
}
.recipelist__content__list__item__main__top {
-webkit-flex-grow: 1;
flex-grow: 1;
margin-bottom: 20px;
}
.recipelist__content__list__item__main__top .blogdate {
margin-bottom: 5px;
}
.recipelist__content__list__item__title, .recipelist__content__list__item__description {
margin-top: 10px;
}
.recipelist__content__list__item__image {
width: 215px;
margin: 0 10px;
}
.recipelist__content__searchtips {
font-size: 16px;
line-height: 24px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipelist__title {
margin-bottom: 10px;
}
.recipelist__content__list__item__in {
padding: 10px 0 20px;
-webkit-flex-direction: column;
flex-direction: column;
}
.recipelist__content__list__item__main__btm {
margin-top: 15px;
}
.recipelist__content__list__item__image {
margin-bottom: 10px;
}
.recipelist__content__list__item__title, .recipelist__content__list__item__description {
margin-top: 10px;
}
.recipelist__content__searchtips {
font-size: 15px;
line-height: 21px;
}
}
/*.recipepagination*/
.recipepagination {
text-align: center;
}
.recipepagination__in {
display: -webkit-inline-flex;
display: inline-flex;
}
.recipepagination__pagelist, .recipepagination__pagenum {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
.recipepagination__prev, .recipepagination__next {
display: -webkit-flex;
display: flex;
font-size: 0;
}
.recipepagination__prev.disabled, .recipepagination__next.disabled {
visibility: hidden;
}
.recipepagination__prev {
-webkit-order: 0;
order: 0;
}
.recipepagination__prev__prev {
margin: 0 10px;
}
.recipepagination__next {
-webkit-order: 2;
order: 2;
}
.recipepagination__next__next {
margin: 0 10px;
}
.recipepagination__btn__box {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
width: 35px;
height: 35px;
border-radius: 2px;
box-sizing: border-box;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipepagination {
margin-top: 45px;
}
.recipepagination__pagelist {
display: -webkit-flex;
display: flex;
margin: 0 25px;
}
.recipepagination__pagelist__item__box {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
border-radius: 2px;
box-sizing: border-box;
width: 35px;
height: 35px;
margin: 0 2px;
font-size: 15px;
}
.recipepagination__pagelist__item__box > span {
color: #1f1f1f;
}
.recipepagination__pagelist__item__box.current {
background-color: #707070;
}
.recipepagination__pagelist__item__box.current > span {
color: #fff;
}
.recipepagination__pagenum {
display: none;
}
.recipepagination__prev__first {
display: none;
}
.recipepagination__next__last {
display: none;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipepagination {
margin-top: 20px;
}
.recipepagination__in {
width: 100%;
}
.recipepagination__pagelist {
display: none;
}
.recipepagination__pagenum {
flex-grow: 1;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
height: 35px;
color: #707070;
font-size: 19.2px;
}
.recipepagination__pagenum__current {
color: #484848;
}
.recipepagination__prev__prev .recipepagination__btn__box > span {
width: 9px;
background: url("/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-left-m.png") no-repeat left top;
background-size: contain;
}
.recipepagination__prev__first .recipepagination__btn__box > span {
width: 15px;
background: url("/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-left-m.png") no-repeat left top, url("/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-left-m.png") no-repeat 6px top;
background-size: contain;
}
.recipepagination__next__next .recipepagination__btn__box > span {
width: 9px;
background: url("/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-right-m.png") no-repeat right top;
background-size: contain;
}
.recipepagination__next__last .recipepagination__btn__box > span {
width: 15px;
background: url("/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-right-m.png") no-repeat right 0 top, url("/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-right-m.png") no-repeat right 6px top;
background-size: contain;
}
.recipepagination__btn__box {
border: 1px solid #707070;
}
.recipepagination__btn__box > span {
height: 13px;
}
.recipepagination__btn__box img {
opacity: 0;
}
}
/*.recipesearch*/
.recipesearch__content__in {
display: -webkit-flex;
display: flex;
}
.recipesearch__content__inputtext {
-webkit-flex-grow: 1;
flex-grow: 1;
}
.recipesearch__content__inputtext input[type="text"] {
border: 1px solid #707070;
border-radius: 2px;
background-color: #fff;
box-sizing: border-box;
width: calc( 100% - 10px);
height: 35px;
padding: 5px 10px;
font-size: 16px;
}
.recipesearch__content__submit button {
border-radius: 2px;
background-color: #707070;
box-sizing: border-box;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
width: 45px;
height: 35px;
}
.recipesearch__content__submit button img {
width: 17px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipesearch__title {
margin-bottom: 20px;
text-align: center;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipesearch {
margin-top: 30px;
}
.recipesearch__title {
margin-bottom: 10px;
}
}
/*.recipeproducts*/
.recipeproducts__content__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin: -10px -5px 0;
}
.recipeproducts__content__list__item {
box-sizing: border-box;
width: calc(50% - 10px);
border-radius: 2px;
position: relative;
text-align: center;
min-height: 160px;
padding: 5px 5px 10px;
margin: 10px 5px 0;
}
.recipeproducts__content__list__item label {
cursor: pointer;
}
.recipeproducts__content__list__item__checkbox {
position: absolute;
top: 10px;
left: 10px;
}
.recipeproducts__content__list__item__image, .recipeproducts__content__list__item__label {
display: block;
}
.recipeproducts__content__list__item__image {
margin-bottom: 5px;
}
.recipeproducts__content__list__item__image img {
width: 130px;
height: auto;
}
.recipeproducts__content__list__item__label {
font-weight: bold;
font-size: 12px;
line-height: 17px;
}
.recipeproducts__content__submit {
text-align: center;
}
.recipeproducts__content__submit button {
background-color: #707070;
border-radius: 2px;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
text-transform: uppercase;
color: #fff;
display: -webkit-inline-flex;
display: inline-flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
height: 35px;
box-sizing: border-box;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipeproducts:not(:first-child) {
margin-top: 45px;
}
.recipeproducts__title {
margin-bottom: 20px;
text-align: center;
}
.recipeproducts__content {
padding: 20px 10px;
border-radius: 2px;
border: 1px solid #A3A3A3;
}
.recipeproducts__content__list__item.checked, .recipeproducts__content__list__item:hover {
background-color: #f6f6f6;
}
.recipeproducts__content__submit {
margin-top: 30px;
}
.recipeproducts__content__submit button {
width: 100%;
font-size: 16px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipeproducts {
margin: 30px -10px;
background-color: #f6f6f6;
}
.recipeproducts__in {
padding: 20px 10px;
}
.recipeproducts__title {
margin-bottom: 10px;
}
.recipeproducts__content__list__item {
border: 1px solid #C1C1C1;
}
.recipeproducts__content__list__item.checked {
border-color: #707070;
background-color: #fff;
}
.recipeproducts__content__submit {
margin-top: 20px;
}
.recipeproducts__content__submit button {
padding: 0 20px;
font-size: 12px;
}
}
/*
imggallery
*/
#colorbox, #cboxOverlay, #cboxWrapper {
position: absolute;
top: 0;
left: 0;
z-index: 9999;
overflow: hidden;
-webkit-transform: translate3d(0, 0, 0);
}
#cboxWrapper {
max-width: none;
}
#cboxOverlay {
position: fixed;
width: 100%;
height: 100%;
}
#cboxMiddleLeft, #cboxBottomLeft {
clear: left;
}
#cboxContent {
position: relative;
}
#cboxLoadedContent {
overflow: auto;
-webkit-overflow-scrolling: touch;
}
#cboxTitle {
margin: 0;
}
#cboxLoadingOverlay, #cboxLoadingGraphic {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {
cursor: pointer;
}
.cboxPhoto {
float: left;
margin: auto;
border: 0;
display: block;
max-width: none;
-ms-interpolation-mode: bicubic;
}
.cboxIframe {
width: 100%;
height: 100%;
display: block;
border: 0;
padding: 0;
margin: 0;
}
#colorbox, #cboxContent, #cboxLoadedContent {
box-sizing: content-box;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
}
#cboxOverlay {
background-color: #1f1f1f;
}
#cboxCurren, #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {
display: none !important;
}
#colorbox {
color: #fff;
}
html:not(.pressTabkey) #colorbox:focus {
outline: none;
}
@media (min-width: 641px), (min-device-width: 1281px) {
#cboxContent {
max-width: 100%;
}
}
button.commonbtn {
border: none;
background: none;
padding: 0;
margin: 0;
cursor: pointer;
}
.commonbtn {
display: block;
border-radius: 3px;
box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.2);
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
}
.commonbtn .label, .commonbtn .icon {
-webkit-flex-shrink: 0;
flex-shrink: 0;
}
.commonbtn .label {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
font-size: 13px;
padding: 0 12px;
}
.commonbtn .icon {
position: relative;
}
.commonbtn .icon img {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
}
.commonbtn.color-dark {
background: linear-gradient(#464444, #262525) !important;
}
.commonbtn.color-dark .label {
color: #fff;
}
.commonbtn.color-dark.type-wtxt .icon::before {
background-color: rgba(255, 255, 255, 0.1);
}
.commonbtn.color-dark.type-wtxt .icon::after {
background-color: rgba(0, 0, 0, 0.3);
}
.commonbtn.type-wtxt .icon::before, .commonbtn.type-wtxt .icon::after {
content: "";
display: block;
height: 100%;
width: 1px;
top: 0;
position: absolute;
}
.commonbtn.type-wtxt .icon::before {
right: -1px;
}
.commonbtn.type-wtxt .icon::after {
right: 0;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.commonbtn .icon {
height: 41px;
width: 41px;
}
.commonbtn.type-wtxt .icon {
width: 37px;
margin-right: 4px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.commonbtn .icon {
height: 29px;
width: 29px;
}
.commonbtn .icon-close img {
width: 8px;
height: 8px;
}
}
.imggallery__container {
background-color: #000;
max-width: 1200px;
margin-inline: auto;
}
.imggallery__list__item a {
display: block;
overflow: hidden;
}
.imggallery__list__item a:hover .imggallery__list__item__thumb {
-webkit-transform: scale(1.075);
transform: scale(1.075);
}
.imggallery__list__item .imggallery-video__icon {
position: absolute;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
top: 50%;
left: 50%;
width: 45px;
height: 45px;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-color: rgba(0, 0, 0, 0.7);
text-align: center;
border-radius: 50%;
border: solid 2px rgba(255, 255, 255, 0.7);
-webkit-transition: opacity 1s;
transition: opacity 1s;
}
.imggallery__list__item .imggallery-video__icon svg {
width: 100%;
height: 40%;
-webkit-transform: translateX(2px);
transform: translateX(2px);
}
.imggallery__list__item .imggallery-video::after {
content: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/icn-play-lg.png);
position: absolute;
display: block;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -47.8%);
transform: translate(-50%, -47.8%);
opacity: .8;
}
.imggallery__list__item__thumb {
display: block;
max-width: none;
width: 100%;
height: auto;
-webkit-transition: transform 0.4s;
transition: transform 0.4s;
}
.imggallery__list__item__thumb.not-loaded + .imggallery-video__icon {
opacity: 0;
}
.imggallery__gbox {
position: relative;
height: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-justify-content: center;
justify-content: center;
max-width: 976px;
box-sizing: border-box;
}
.imggallery__gbox__controls, .imggallery__gbox__imagebox, .imggallery__gbox__caption, .imggallery__gbox__relitems {
flex-shrink: 0;
}
.imggallery__gbox__controls {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row-reverse;
flex-direction: row-reverse;
}
.imggallery__gbox__arrows {
font-size: 0;
}
.imggallery__gbox__arrows__prev, .imggallery__gbox__arrows__next {
display: inline-block;
}
.imggallery__gbox__arrows__prev img, .imggallery__gbox__arrows__next img {
display: block;
}
.imggallery__gbox__imagebox {
position: relative;
text-align: center;
}
.imggallery__gbox__imagebox__in {
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
}
.imggallery__gbox__imagebox__img {
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
display: block;
margin: auto;
}
.imggallery__gbox__imagebox .video-container {
position: relative;
padding-bottom: 56.25%;
box-sizing: border-box;
}
.imggallery__gbox__imagebox .video-container iframe, .imggallery__gbox__imagebox .video-container .closed {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.imggallery__gbox__imagebox .videoplayer {
height: 100%;
width: fit-content;
margin-inline: auto;
}
.imggallery__gbox__imagebox .videoplayer video {
max-height: 100%;
}
.imggallery__gbox__imagebox .videoplayer .vjs-poster {
max-height: 100%;
}
.imggallery__gbox__caption__in {
background-color: #333;
}
.imggallery__gbox__caption__in a {
color: #6BF0FF;
}
.imggallery__gbox__relitems__in {
background-color: #333;
}
.imggallery__gbox__relitems__list {
display: -webkit-flex;
display: flex;
}
.imggallery__gbox__relitems__list__item {
-webkit-flex-shrink: 0;
flex-shrink: 0;
box-sizing: border-box;
}
.imggallery__gbox__relitems__list__item__link {
border-radius: 3px;
}
.imggallery__gbox__relitems__list__item__img {
font-size: 0;
}
.imggallery__gbox__relitems__list__item__img img {
width: auto;
height: auto;
max-width: 100%;
}
.imggallery__gbox__relitems__list__item__label {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
color: #fff;
word-wrap: break-word;
}
.imggallery__gbox__lastfocus {
pointer-events: none;
position: absolute;
width: 100%;
height: 100%;
}
:where(.imggallery__gbox) button {
border: none;
background: none;
padding: 0;
margin: 0;
cursor: pointer;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.imggallery__list__sizer {
width: 25%;
}
.imggallery__list__item {
width: 25%;
}
.imggallery__list__item-width2 {
width: 50%;
}
.imggallery__list__item-width3 {
width: 75%;
}
.imggallery__list__item-width4 {
width: 100%;
}
.imggallery__gbox {
margin: 0 60px;
padding: 15px 0;
}
.imggallery__gbox__controls {
padding-bottom: 15px;
}
.imggallery__gbox__controls__close, .imggallery__gbox__controls__download {
margin-left: 10px;
}
.imggallery__gbox__arrows__prev, .imggallery__gbox__arrows__next {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.imggallery__gbox__arrows__prev {
left: -52px;
}
.imggallery__gbox__arrows__next {
right: -52px;
}
.imggallery__gbox__imagebox .video-container {
max-width: 976px;
width: 100%;
}
.imggallery__gbox__caption__in {
padding: 15px;
font-size: 12px;
line-height: 17px;
}
:empty + .imggallery__gbox__relitems .imggallery__gbox__relitems__in {
padding-top: 15px;
}
.imggallery__gbox__relitems__in {
padding: 0 15px 15px;
}
.imggallery__gbox__relitems__list {
margin: 0 -10px;
}
.imggallery__gbox__relitems__list__item {
width: 25%;
padding: 0 10px;
}
.imggallery__gbox__relitems__list__item__link {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
}
.imggallery__gbox__relitems__list__item__link:hover {
background-color: #454545;
}
.imggallery__gbox__relitems__list__item__img {
-webkit-flex-shrink: 0;
flex-shrink: 0;
width: 123px;
}
.imggallery__gbox__relitems__list__item__label {
padding: 5px 10px;
font-size: 16px;
line-height: 20px;
box-sizing: border-box;
width: calc(100% - 123px);
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.imggallery__list__sizer {
width: 50%;
}
.imggallery__list__item {
width: 50%;
}
.imggallery__list__item-width2 {
width: 100%;
}
.imggallery__list__item-width3 {
width: 100%;
}
.imggallery__list__item-width4 {
width: 100%;
}
.imggallery__gbox {
margin: 0 10px;
padding: 10px 0;
}
.imggallery__gbox__controls {
padding-bottom: 10px;
}
.imggallery__gbox__controls__close, .imggallery__gbox__controls__download {
margin-left: 10px;
}
.imggallery__gbox__arrows {
-webkit-flex-grow: 1;
flex-grow: 1;
}
.imggallery__gbox__arrows__prev, .imggallery__gbox__arrows__next {
position: relative;
}
.imggallery__gbox__arrows__prev img, .imggallery__gbox__arrows__next img {
width: 11px;
height: 29px;
opacity: 0;
}
.imggallery__gbox__arrows__prev::before, .imggallery__gbox__arrows__next::before {
content: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMTAuNnB4IgoJIGhlaWdodD0iMTYuN3B4IiB2aWV3Qm94PSIwIDAgMTAuNiAxNi43Ij4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDozO3N0cm9rZS1taXRlcmxpbWl0OjEwO30KPC9zdHlsZT4KPGRlZnM+CjwvZGVmcz4KPHBvbHlsaW5lIGNsYXNzPSJzdDAiIHBvaW50cz0iOS4zLDEuMSAyLjEsOC4zIDkuNSwxNS42ICIvPgo8L3N2Zz4K);
width: 11px;
height: 17px;
display: block;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
}
.imggallery__gbox__arrows__next {
margin-left: 35px !important;
}
.imggallery__gbox__arrows__next::before {
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}
.imggallery__gbox__imagebox .video-container {
width: calc(100vw - 20px);
}
.imggallery__gbox__caption__in {
font-size: 12px;
line-height: 14.4px;
padding: 10px;
}
:empty > .imggallery__gbox__relitems .imggallery__gbox__relitems__in {
padding-top: 10px;
}
.imggallery__gbox__relitems__in {
padding-bottom: 10px;
}
.imggallery__gbox__relitems__list {
-wetkit-justify-content: center;
justify-content: center;
}
.imggallery__gbox__relitems__list__item {
width: 50%;
}
.imggallery__gbox__relitems__list__item__link {
display: block;
text-align: center;
}
.imggallery__gbox__relitems__list__item__label {
display: block;
padding: 0 10px 10px;
font-size: 14px;
line-height: 16.8px;
}
.imggallery__gbox__relitems__list__item__img {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
height: 80px;
}
.imggallery__gbox__relitems__list__item__img img {
max-height: 100%;
}
}
.video-container {
background-color: #282828;
color: #fff;
}
.video-container > div.closed {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
.video-container > div.closed a {
font-weight: inherit !important;
color: inherit !important;
text-decoration: underline;
}
.video-container > div.closed a:hover {
text-decoration: none;
}
.video-container > div.closed > span {
padding: 0 10px;
line-height: 1.834;
white-space: normal;
text-align: center;
box-sizing: border-box;
max-height: 100%;
overflow: auto;
}
@media (min-width: 641px), (min-device-width: 1281px) {
.video-container > div.closed > span {
font-size: 14px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.video-container > div.closed > span {
font-size: 0.75rem;
}
}
/*
ext-table-regular
*/
.ext-table-regular {
--tablewidth: 100%;
}
.ext-table-regular .matrix-table-regular {
border-collapse: collapse;
border-spacing: 0;
width: 100%;
}
.ext-table-regular .matrix-table-regular th, .ext-table-regular .matrix-table-regular td {
text-align: left;
vertical-align: top;
}
.ext-table-regular .matrix-table-regular.vmiddle-th th {
vertical-align: middle;
}
.ext-table-regular .matrix-table-regular.vmiddle-td td {
vertical-align: middle;
}
.ext-table-regular .matrix-table-regular.style-dark td, .ext-table-regular .matrix-table-regular.style-dark th {
border: 1px solid #707070;
color: #fff;
}
.ext-table-regular .matrix-table-regular.style-dark th {
background-color: #484848;
}
.ext-table-regular .matrix-table-regular.style-dark td {
background-color: #222222;
}
.ext-table-regular .matrix-table-regular.style-light td, .ext-table-regular .matrix-table-regular.style-light th {
border: 1px solid #C1C1C1;
color: #1f1f1f;
}
.ext-table-regular .matrix-table-regular.style-light th {
background-color: #EFEFEF;
}
.ext-table-regular .matrix-table-regular.style-light td {
background-color: #fff;
}
.ext-table-regular .matrix-table-regular .w1 {
width: 1%;
}
.ext-table-regular .matrix-table-regular .w2 {
width: 2%;
}
.ext-table-regular .matrix-table-regular .w3 {
width: 3%;
}
.ext-table-regular .matrix-table-regular .w4 {
width: 4%;
}
.ext-table-regular .matrix-table-regular .w5 {
width: 5%;
}
.ext-table-regular .matrix-table-regular .w6 {
width: 6%;
}
.ext-table-regular .matrix-table-regular .w7 {
width: 7%;
}
.ext-table-regular .matrix-table-regular .w8 {
width: 8%;
}
.ext-table-regular .matrix-table-regular .w9 {
width: 9%;
}
.ext-table-regular .matrix-table-regular .w10 {
width: 10%;
}
.ext-table-regular .matrix-table-regular .w11 {
width: 11%;
}
.ext-table-regular .matrix-table-regular .w12 {
width: 12%;
}
.ext-table-regular .matrix-table-regular .w13 {
width: 13%;
}
.ext-table-regular .matrix-table-regular .w14 {
width: 14%;
}
.ext-table-regular .matrix-table-regular .w15 {
width: 15%;
}
.ext-table-regular .matrix-table-regular .w16 {
width: 16%;
}
.ext-table-regular .matrix-table-regular .w17 {
width: 17%;
}
.ext-table-regular .matrix-table-regular .w18 {
width: 18%;
}
.ext-table-regular .matrix-table-regular .w19 {
width: 19%;
}
.ext-table-regular .matrix-table-regular .w20 {
width: 20%;
}
.ext-table-regular .matrix-table-regular .w21 {
width: 21%;
}
.ext-table-regular .matrix-table-regular .w22 {
width: 22%;
}
.ext-table-regular .matrix-table-regular .w23 {
width: 23%;
}
.ext-table-regular .matrix-table-regular .w24 {
width: 24%;
}
.ext-table-regular .matrix-table-regular .w25 {
width: 25%;
}
.ext-table-regular .matrix-table-regular .w26 {
width: 26%;
}
.ext-table-regular .matrix-table-regular .w27 {
width: 27%;
}
.ext-table-regular .matrix-table-regular .w28 {
width: 28%;
}
.ext-table-regular .matrix-table-regular .w29 {
width: 29%;
}
.ext-table-regular .matrix-table-regular .w30 {
width: 30%;
}
.ext-table-regular .matrix-table-regular .w31 {
width: 31%;
}
.ext-table-regular .matrix-table-regular .w32 {
width: 32%;
}
.ext-table-regular .matrix-table-regular .w33 {
width: 33%;
}
.ext-table-regular .matrix-table-regular .w34 {
width: 34%;
}
.ext-table-regular .matrix-table-regular .w35 {
width: 35%;
}
.ext-table-regular .matrix-table-regular .w36 {
width: 36%;
}
.ext-table-regular .matrix-table-regular .w37 {
width: 37%;
}
.ext-table-regular .matrix-table-regular .w38 {
width: 38%;
}
.ext-table-regular .matrix-table-regular .w39 {
width: 39%;
}
.ext-table-regular .matrix-table-regular .w40 {
width: 40%;
}
.ext-table-regular .matrix-table-regular .w41 {
width: 41%;
}
.ext-table-regular .matrix-table-regular .w42 {
width: 42%;
}
.ext-table-regular .matrix-table-regular .w43 {
width: 43%;
}
.ext-table-regular .matrix-table-regular .w44 {
width: 44%;
}
.ext-table-regular .matrix-table-regular .w45 {
width: 45%;
}
.ext-table-regular .matrix-table-regular .w46 {
width: 46%;
}
.ext-table-regular .matrix-table-regular .w47 {
width: 47%;
}
.ext-table-regular .matrix-table-regular .w48 {
width: 48%;
}
.ext-table-regular .matrix-table-regular .w49 {
width: 49%;
}
.ext-table-regular .matrix-table-regular .w50 {
width: 50%;
}
.ext-table-regular .matrix-table-regular .w51 {
width: 51%;
}
.ext-table-regular .matrix-table-regular .w52 {
width: 52%;
}
.ext-table-regular .matrix-table-regular .w53 {
width: 53%;
}
.ext-table-regular .matrix-table-regular .w54 {
width: 54%;
}
.ext-table-regular .matrix-table-regular .w55 {
width: 55%;
}
.ext-table-regular .matrix-table-regular .w56 {
width: 56%;
}
.ext-table-regular .matrix-table-regular .w57 {
width: 57%;
}
.ext-table-regular .matrix-table-regular .w58 {
width: 58%;
}
.ext-table-regular .matrix-table-regular .w59 {
width: 59%;
}
.ext-table-regular .matrix-table-regular .w60 {
width: 60%;
}
.ext-table-regular .matrix-table-regular .w61 {
width: 61%;
}
.ext-table-regular .matrix-table-regular .w62 {
width: 62%;
}
.ext-table-regular .matrix-table-regular .w63 {
width: 63%;
}
.ext-table-regular .matrix-table-regular .w64 {
width: 64%;
}
.ext-table-regular .matrix-table-regular .w65 {
width: 65%;
}
.ext-table-regular .matrix-table-regular .w66 {
width: 66%;
}
.ext-table-regular .matrix-table-regular .w67 {
width: 67%;
}
.ext-table-regular .matrix-table-regular .w68 {
width: 68%;
}
.ext-table-regular .matrix-table-regular .w69 {
width: 69%;
}
.ext-table-regular .matrix-table-regular .w70 {
width: 70%;
}
.ext-table-regular .matrix-table-regular .w71 {
width: 71%;
}
.ext-table-regular .matrix-table-regular .w72 {
width: 72%;
}
.ext-table-regular .matrix-table-regular .w73 {
width: 73%;
}
.ext-table-regular .matrix-table-regular .w74 {
width: 74%;
}
.ext-table-regular .matrix-table-regular .w75 {
width: 75%;
}
.ext-table-regular .matrix-table-regular .w76 {
width: 76%;
}
.ext-table-regular .matrix-table-regular .w77 {
width: 77%;
}
.ext-table-regular .matrix-table-regular .w78 {
width: 78%;
}
.ext-table-regular .matrix-table-regular .w79 {
width: 79%;
}
.ext-table-regular .matrix-table-regular .w80 {
width: 80%;
}
.ext-table-regular .matrix-table-regular .w81 {
width: 81%;
}
.ext-table-regular .matrix-table-regular .w82 {
width: 82%;
}
.ext-table-regular .matrix-table-regular .w83 {
width: 83%;
}
.ext-table-regular .matrix-table-regular .w84 {
width: 84%;
}
.ext-table-regular .matrix-table-regular .w85 {
width: 85%;
}
.ext-table-regular .matrix-table-regular .w86 {
width: 86%;
}
.ext-table-regular .matrix-table-regular .w87 {
width: 87%;
}
.ext-table-regular .matrix-table-regular .w88 {
width: 88%;
}
.ext-table-regular .matrix-table-regular .w89 {
width: 89%;
}
.ext-table-regular .matrix-table-regular .w90 {
width: 90%;
}
.ext-table-regular .matrix-table-regular .w91 {
width: 91%;
}
.ext-table-regular .matrix-table-regular .w92 {
width: 92%;
}
.ext-table-regular .matrix-table-regular .w93 {
width: 93%;
}
.ext-table-regular .matrix-table-regular .w94 {
width: 94%;
}
.ext-table-regular .matrix-table-regular .w95 {
width: 95%;
}
.ext-table-regular .matrix-table-regular .w96 {
width: 96%;
}
.ext-table-regular .matrix-table-regular .w97 {
width: 97%;
}
.ext-table-regular .matrix-table-regular .w98 {
width: 98%;
}
.ext-table-regular .matrix-table-regular .w99 {
width: 99%;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.ext-table-regular .matrix-table-regular.onstyle th, .ext-table-regular .matrix-table-regular.onstyle td {
padding: 10px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.ext-table-regular[style*="tablewidth"] {
overflow: auto;
}
.ext-table-regular__in {
min-width: var(--tablewidth);
}
.ext-table-regular .matrix-table-regular.onstyle th, .ext-table-regular .matrix-table-regular.onstyle td {
padding: 10px;
}
}
.widgetsection__layoutblock {
position: relative;
overflow: hidden;
}
.widgetsection__widget.align-center {
display: flex;
justify-content: center;
}
.widgetsection__widget__in {
max-width: 100%;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.widgetsection__layoutblock.with-title-text {
display: flex;
justify-content: space-between;
}
.widgetsection__layoutblock.with-title-text.layout-reverse {
flex-direction: row-reverse;
}
.widgetsection__layoutblock.with-title-text > * {
box-sizing: border-box;
width: calc(50% - 10px);
flex-shrink: 0;
}
.widgetsection__layoutblock.with-title-text .valign-center {
align-self: center;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.widgetsection__layoutblock.with-title-text .widgetsection__widget:not(:first-child) {
margin-top: 24px;
}
}
/* Slick Slider */
.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list {
position: relative;
overflow: hidden;
display: block;
margin: 0;
padding: 0;
}
.slick-list:focus {
outline: none;
}
.slick-list.dragging {
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track {
position: relative;
left: 0;
top: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before, .slick-track:after {
content: "";
display: table;
}
.slick-track:after {
clear: both;
}
.slick-loading .slick-track {
visibility: hidden;
}
.slick-slide {
float: left;
height: 100%;
min-height: 1px;
outline-offset: -3px;
display: none;
}
[dir="rtl"] .slick-slide {
float: right;
}
.slick-slide.slick-loading img {
display: none;
}
.slick-slide.dragging img {
pointer-events: none;
}
.slick-initialized .slick-slide {
display: block;
}
.slick-loading .slick-slide {
visibility: hidden;
}
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
main, #colorbox, .ui-modalwindow {
--dark: #1f1f1f;
--dark-2: #222222;
--dgray: #484848;
--lgray: #c1c1c1;
--slgray: #efefef;
}
/************************** generic style *****************************/
/* layout */
.productpagecontents {
color: var(--dark);
}
.productpagecontents a {
color: inherit;
}
.productpagecontents img {
max-width: 100%;
height: auto;
}
.pagecontainer {
width: 100%;
box-sizing: border-box;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.hidden-sm {
display: none;
}
.pagecontainer {
margin: 0 auto;
max-width: 976px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.hidden-xs {
display: none;
}
.pagecontainer {
padding: 0 10px;
}
}
.pagelayoutframe {
display: flex;
flex-wrap: wrap;
margin-left: -10px;
margin-right: -10px;
}
.pagelayoutframe > [class*="col-"] {
position: relative;
padding: 0 10px;
flex-shrink: 0;
box-sizing: border-box;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.pagelayoutframe > .col-sm-1 {
width: calc(1 / 12 * 100% - .01px);
}
.pagelayoutframe > .col-sm-2 {
width: calc(2 / 12 * 100% - .01px);
}
.pagelayoutframe > .col-sm-3 {
width: calc(3 / 12 * 100% - .01px);
}
.pagelayoutframe > .col-sm-4 {
width: calc(4 / 12 * 100% - .01px);
}
.pagelayoutframe > .col-sm-5 {
width: calc(5 / 12 * 100% - .01px);
}
.pagelayoutframe > .col-sm-6 {
width: calc(6 / 12 * 100% - .01px);
}
.pagelayoutframe > .col-sm-7 {
width: calc(7 / 12 * 100% - .01px);
}
.pagelayoutframe > .col-sm-8 {
width: calc(8 / 12 * 100% - .01px);
}
.pagelayoutframe > .col-sm-9 {
width: calc(9 / 12 * 100% - .01px);
}
.pagelayoutframe > .col-sm-10 {
width: calc(10 / 12 * 100% - .01px);
}
.pagelayoutframe > .col-sm-11 {
width: calc(11 / 12 * 100% - .01px);
}
.pagelayoutframe > .col-sm-12 {
width: calc(12 / 12 * 100% - .01px);
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.pagelayoutframe > .col-xs-1 {
width: calc(1 / 12 * 100%);
}
.pagelayoutframe > .col-xs-2 {
width: calc(2 / 12 * 100%);
}
.pagelayoutframe > .col-xs-3 {
width: calc(3 / 12 * 100%);
}
.pagelayoutframe > .col-xs-4 {
width: calc(4 / 12 * 100%);
}
.pagelayoutframe > .col-xs-5 {
width: calc(5 / 12 * 100%);
}
.pagelayoutframe > .col-xs-6 {
width: calc(6 / 12 * 100%);
}
.pagelayoutframe > .col-xs-7 {
width: calc(7 / 12 * 100%);
}
.pagelayoutframe > .col-xs-8 {
width: calc(8 / 12 * 100%);
}
.pagelayoutframe > .col-xs-9 {
width: calc(9 / 12 * 100%);
}
.pagelayoutframe > .col-xs-10 {
width: calc(10 / 12 * 100%);
}
.pagelayoutframe > .col-xs-11 {
width: calc(11 / 12 * 100%);
}
.pagelayoutframe > .col-xs-12 {
width: calc(12 / 12 * 100%);
}
}
/* sectiontitle */
.sectiontitle__in {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
}
@supports (--css: variables) {
.sectiontitle {
transition: all .5s ease-in-out;
}
html[data-scroll-dir-y="1"] .pagesection[data-scroll="out"] .sectiontitle {
opacity: 0;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.sectiontitle__in {
height: 184px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.sectiontitle__in {
height: 136px;
}
}
/* sectioncontent */
@media (min-width: 641px), (min-device-width: 1281px), print {
.sectioncontent:not(.nopadding) {
padding-top: 64px;
padding-bottom: 64px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.sectioncontent:not(.nopadding) {
padding-top: 48px;
padding-bottom: 48px;
}
}
/* font */
.heading-1, .heading-2, .heading-3, .subtitle-1, .subtitle-2 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
line-height: 1.4;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.heading-1 {
font-size: 44.8px;
}
.heading-2 {
font-size: 32px;
}
.heading-3 {
font-size: 28.8px;
}
.subtitle-1 {
font-size: 19.2px;
}
.subtitle-2 {
font-size: 16px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.heading-1 {
font-size: 32px;
}
.heading-2 {
font-size: 25.6px;
}
.heading-3 {
font-size: 19.2px;
}
.subtitle-1 {
font-size: 19.2px;
}
.subtitle-2 {
font-size: 16px;
}
}
.typ-body-1, .typ-body-2 {
line-height: 1.65;
}
.typ-body-1 {
font-size: 14.55px;
}
.typ-body-2 {
font-size: 12.12px;
}
.text-uppercase {
text-transform: uppercase;
}
.text-underline {
text-decoration: underline;
}
/* productpage-rt */
.productpage-rt {
font-size: 14.55px;
line-height: 1.65;
}
.productpage-rt p:not(:first-child), .productpage-rt ul:not(:first-child), .productpage-rt ol:not(:first-child) {
margin-top: 1em;
}
.productpage-rt ul, .productpage-rt ol {
margin-left: 1.5em;
}
.productpage-rt ul {
list-style: disc;
}
.productpage-rt ul ul {
list-style: circle;
}
.productpage-rt ol {
list-style: decimal;
}
.productpage-rt ol ol {
list-style: lower-roman;
}
.productpage-rt i, .productpage-rt em {
font-style: italic;
}
.productpage-rt a {
color: #0041C0;
font-weight: bold;
}
.productpage-rt b, .productpage-rt strong {
font-weight: bold;
}
/* link */
.link-text {
text-decoration: underline;
}
.link-text:hover {
text-decoration: none;
}
.link-w-icn {
-webkit-appearance: none;
appearance: none;
border: none;
margin: 0;
padding: 0;
background: none;
display: inline-flex;
align-items: center;
cursor: pointer;
}
.link-w-icn__icn {
display: flex;
width: 48px;
height: 48px;
align-items: center;
justify-content: center;
}
.link-w-icn__text {
text-decoration: underline;
}
.link-w-icn:hover .link-w-icn__text {
text-decoration: none;
}
/* externallink */
.icn-externallink {
margin-left: 10px;
}
/* button */
.btnstyle {
-webkit-appearance: none;
appearance: none;
border: 1px solid transparent;
margin: 0;
padding: 0;
background: none;
min-height: 48px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 2px;
transition: background-color .15s ease-in-out, color .15s ease-in-out;
box-sizing: border-box;
cursor: pointer;
position: relative;
}
.btnstyle__text {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
font-size: 19.2px;
line-height: 1.4;
padding: 3px;
}
.btnstyle .icn-newwin {
font-size: 0;
position: relative;
margin-left: 7px;
}
.btnstyle.color-db, .btnstyle.buybtnstyle {
background-color: #0041C0;
color: #fff;
text-transform: uppercase;
}
.btnstyle.color-yl {
background-color: #FFB300;
color: var(--dark);
}
.btnstyle.color-lb {
background-color: #00A0C6;
color: var(--dark);
}
.btnstyle.color-gr {
background-color: var(--dgray);
color: #fff;
}
.style-dark .btnstyle.color-gr {
background-color: var(--slgray);
color: var(--dgray);
}
.style-dark .btnstyle.color-gr .icn-newwin img {
opacity: 0;
}
.style-dark .btnstyle.color-gr .icn-newwin::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiI+CiAgPGRlZnM+CiAgICA8Y2xpcFBhdGggaWQ9ImNsaXAtcGF0aCI+CiAgICAgIDxyZWN0IHdpZHRoPSIxNiIgaGVpZ2h0PSIxNi4wMDEiIGZpbGw9Im5vbmUiLz4KICAgIDwvY2xpcFBhdGg+CiAgPC9kZWZzPgogIDxnIGNsaXAtcGF0aD0idXJsKCNjbGlwLXBhdGgpIj4KICAgIDxyZWN0IHdpZHRoPSIxMi42MjIiIGhlaWdodD0iMTIuNjIzIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzLjM3OCkiIGZpbGw9IiM0ODQ4NDgiLz4KICAgIDxwYXRoIGQ9Ik0xOS4xMjIsMjcuMXYyLjAySDYuNVYxNi41SDguNTE5VjI3LjFaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNi41IC0xMy4xMjIpIiBmaWxsPSIjNDg0ODQ4Ii8+CiAgPC9nPgo8L3N2Zz4=);
display: block;
width: 16px;
height: 16px;
position: absolute;
top: 0;
left: 0;
}
.btnstyle.color-wh {
background-color: #FFF;
color: var(--dgray);
}
.btnstyle.border-gr {
border: 1px solid var(--dgray);
}
.btnstyle.wtbbtnstyle {
border: 1px solid var(--dgray);
color: var(--dgray);
}
.btnstyle.color-tp {
border: 1px solid transparent;
color: var(--dgray);
}
.style-light .btnstyle.color-tp {
color: var(--dgray);
}
.style-dark .btnstyle.color-tp {
color: var(--slgray);
}
.btnstyle.only-icn {
min-width: 0 !important;
width: 48px;
overflow: hidden;
}
.btnstyle.only-icn img {
display: block;
width: 48px;
height: 48px;
position: absolute;
left: -1px;
top: -1px;
}
.btnstyle.w-icn .icn-img {
width: 48px;
height: 48px;
position: absolute;
left: -1px;
top: -1px;
}
.btnstyle.w-icn::before {
display: block;
width: 48px;
height: 48px;
position: absolute;
left: -1px;
top: -1px;
}
.btnstyle.w-icn.icn-print::before {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTEuNSAxMi41KSI+CiAgICA8cGF0aCBkPSJNNiw5LjY4OVYySDIxLjIxMlY5LjY4OSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEuMTA2IC0xLjUpIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+CiAgICA8cGF0aCBkPSJNNi44LDE4Ljg4Nkg0LjRhMi4zMDUsMi4zMDUsMCwwLDEtMi40LTIuMlYxMS4yQTIuMzA1LDIuMzA1LDAsMCwxLDQuNCw5SDIzLjZBMi4zMDUsMi4zMDUsMCwwLDEsMjYsMTEuMnY1LjQ5MmEyLjMwNSwyLjMwNSwwLDAsMS0yLjQsMi4ySDIxLjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xLjUgLTAuNTE5KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNDg0ODQ4IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMSIvPgogICAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNC44OTQgMTQuNzEyKSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNDg0ODQ4IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMSI+CiAgICAgIDxyZWN0IHdpZHRoPSIxNS4yMTIiIGhlaWdodD0iOC43ODgiIHN0cm9rZT0ibm9uZSIvPgogICAgICA8cmVjdCB4PSIwLjUiIHk9IjAuNSIgd2lkdGg9IjE0LjIxMiIgaGVpZ2h0PSI3Ljc4OCIgZmlsbD0ibm9uZSIvPgogICAgPC9nPgogIDwvZz4KPC9zdmc+");
}
.btnstyle.w-icn.icn-write::before {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPGRlZnM+CiAgICA8Y2xpcFBhdGggaWQ9ImNsaXAtcGF0aCI+CiAgICAgIDxyZWN0IHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgZmlsbD0ibm9uZSIvPgogICAgPC9jbGlwUGF0aD4KICA8L2RlZnM+CiAgPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAtcGF0aCkiPgogICAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTY5NyAtOTYxKSI+CiAgICAgIDxwYXRoIGQ9Ik0tMTY5NSw5NjFoNDRhMi4wMDYsMi4wMDYsMCwwLDEsMiwydjQ0YTIuMDA2LDIuMDA2LDAsMCwxLTIsMmgtNDRhMi4wMDYsMi4wMDYsMCwwLDEtMi0yVjk2M0EyLjAwNiwyLjAwNiwwLDAsMS0xNjk1LDk2MVoiIGZpbGw9Im5vbmUiLz4KICAgICAgPHBhdGggZD0iTS0xNjk1LDk2MS41aDQ0YTEuNTM4LDEuNTM4LDAsMCwxLDEuNSwxLjV2NDRhMS41MzgsMS41MzgsMCwwLDEtMS41LDEuNWgtNDRhMS41MzgsMS41MzgsMCwwLDEtMS41LTEuNVY5NjNBMS41MzgsMS41MzgsMCwwLDEtMTY5NSw5NjEuNVoiIGZpbGw9Im5vbmUiLz4KICAgIDwvZz4KICAgIDxwYXRoIGQ9Ik0zMS42LDIyLjFWMTkuMkwyNC40LDEySDE0LjhhMi40MzMsMi40MzMsMCwwLDAtMi40LDIuNGgwVjMzLjZBMi40MzMsMi40MzMsMCwwLDAsMTQuOCwzNkgyOS4yYTIuNDMzLDIuNDMzLDAsMCwwLDIuNC0yLjR2LS45IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjYpIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+CiAgICA8cGF0aCBkPSJNMjQuNCwxMi4ydjdoNyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC42KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNDg0ODQ4IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMSIvPgogICAgPGxpbmUgeDE9IjkuNiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTcuOCAyNS4yKSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNDg0ODQ4IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMSIvPgogICAgPGxpbmUgeDE9IjcuNiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTcuOCAzMCkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzQ4NDg0OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjEiLz4KICAgIDxsaW5lIHgxPSIyLjQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE3LjggMjAuNCkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzQ4NDg0OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjEiLz4KICAgIDxwYXRoIGQ9Ik0zNS40LDIwLjRsMy4yLDMuMi04LjgsOC44SDI2LjZWMjkuMloiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuNikiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzQ4NDg0OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjEiLz4KICA8L2c+Cjwvc3ZnPg==");
}
.btnstyle.w-icn.icn-download::before, .btnstyle.w-icn.type-download::before {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPGRlZnM+CiAgICA8Y2xpcFBhdGggaWQ9ImNsaXAtcGF0aCI+CiAgICAgIDxyZWN0IHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgZmlsbD0ibm9uZSIvPgogICAgPC9jbGlwUGF0aD4KICA8L2RlZnM+CiAgPGcgaWQ9ImRvd25sb2FkIiBjbGlwLXBhdGg9InVybCgjY2xpcC1wYXRoKSI+CiAgICA8cmVjdCB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHJ4PSIyIiBmaWxsPSJub25lIi8+CiAgICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNjAwLjUgLTY5NTcpIj4KICAgICAgPHBhdGggZD0iTTIsMTcuMzY1djQuNjY3YTIuNCwyLjQsMCwwLDAsMi40MzksMi4zMzNIMjMuNTYxQTIuMzg4LDIuMzg4LDAsMCwwLDI2LDIyLjAzMlYxNy4zNjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDYxMC41IDY5NjYuNjM1KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNDg0ODQ4IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMSIvPgogICAgICA8cGF0aCBkPSJNMTkuNzU3LDEwLjQxM2wtNiw2LjA4Ny02LTYuMDg3bTYsNS42NVYyLjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDYxMC43NDQgNjk2Ny41KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNDg0ODQ4IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMSIvPgogICAgPC9nPgogIDwvZz4KPC9zdmc+");
}
.btnstyle.w-icn.icn-arrow-l::before {
content: url("data:image/svg+xml;base64,PHN2ZyBpZD0icHJldiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHJlY3Qgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4IiBmaWxsPSJub25lIiAvPgogIDxwYXRoIGQ9Ik0xOSwyOCw4LDE3LDE5LDZoMCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoOSA3KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNDg0ODQ4IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMSIvPgo8L3N2Zz4=");
}
.btnstyle.w-icn.icn-sheet::before, .btnstyle.w-icn.type-spec::before {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPGRlZnM+CiAgICA8Y2xpcFBhdGggaWQ9ImNsaXAtcGF0aCI+CiAgICAgIDxyZWN0IHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgZmlsbD0ibm9uZSIvPgogICAgPC9jbGlwUGF0aD4KICA8L2RlZnM+CiAgPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAtcGF0aCkiPgogICAgPGcgaWQ9ImZpbGUtdGV4dCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAuNCAxMCkiPgogICAgICA8cGF0aCBkPSJNMTYsMkg2LjRBMi40LDIuNCwwLDAsMCw0LDQuNFYyMy42QTIuNDA3LDIuNDA3LDAsMCwwLDYuNCwyNkgyMC44YTIuNCwyLjQsMCwwLDAsMi40LTIuNFY5LjJaIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+CiAgICAgIDxwYXRoIGQ9Ik0xNS4yLDJWOWg3bS00LjYsNkg4bTkuNiw0LjhIOG0yLjQtOS42SDgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuOCAwLjIpIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+CiAgICA8L2c+CiAgICA8cmVjdCB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHJ4PSIyIiBmaWxsPSJub25lIi8+CiAgPC9nPgo8L3N2Zz4=");
}
.btnstyle.w-icn.icn-pdf::before, .btnstyle.w-icn.type-pdf::before {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij4KICA8cmVjdCB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHJ4PSIyIiBmaWxsPSJub25lIi8+CiAgPHBhdGggZD0iTTMxLjYsMjIuMVYxOS4yTDI0LjQsMTJIMTQuOGEyLjQzMywyLjQzMywwLDAsMC0yLjQsMi40aDBWMzMuNkEyLjQzMywyLjQzMywwLDAsMCwxNC44LDM2SDI5LjJhMi40MzMsMi40MzMsMCwwLDAsMi40LTIuNHYtLjkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuNikiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzQ4NDg0OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjEiLz4KICA8cGF0aCBkPSJNMjQuNCwxMi4ydjdoNyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC42KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNDg0ODQ4IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMSIvPgogIDxwYXRoIGQ9Ik0tMTEuMy00LjIxNmExLjgsMS44LDAsMCwwLTEuOTM4LTEuODM2aC0yLjNWMGguOTE4Vi0yLjM4aDEuMzc3QTEuOCwxLjgsMCwwLDAtMTEuMy00LjIxNlptLS45MTgsMGEuOTY1Ljk2NSwwLDAsMS0xLjA3MSwxaC0xLjMyNlYtNS4yMjdoMS4zMjZBLjk3Mi45NzIsMCwwLDEtMTIuMjE0LTQuMjE2Wm02LjUsMS4xNDhhMy4xMywzLjEzLDAsMCwwLS42MTItMi40MTQsMi4xNiwyLjE2LDAsMCwwLTEuNTY0LS41NjloLTIuMTI1VjBoMi4xMjVBMi4xNiwyLjE2LDAsMCwwLTYuMzI0LS41NywzLjMzNCwzLjMzNCwwLDAsMC01LjcxMi0zLjA2OVptLS45MTgsMGEyLjkzNSwyLjkzNSwwLDAsMS0uMzIzLDEuODM2LDEuMzA5LDEuMzA5LDAsMCwxLTEuMDI5LjQwOEgtOS4wOTV2LTQuNGgxLjExM2ExLjMwOSwxLjMwOSwwLDAsMSwxLjAyOS40MDhDLTYuNjM4LTQuNDcxLTYuNjMtMy45LTYuNjMtMy4wNjlaTS0uMzE0LTUuMjI3di0uODI1SC00LjE4MlYwaC45MThWLTIuNTU5SC0uNzQ4di0uODI0SC0zLjI2NFYtNS4yMjdaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0MCAzMC4zKSIgZmlsbD0iIzQ4NDg0OCIvPgo8L3N2Zz4=");
}
.btnstyle.w-icn.icn-check::before, .btnstyle.w-icn.type-buy::before, .btnstyle.w-icn.type-overview::before {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOTU4IC0xMTA2KSI+CiAgICA8cGF0aCBpZD0iY2hlY2siIGQ9Ik0yNCw2LDEwLjI1LDIwLDQsMTMuNjM2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg5NjggMTExNykiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzQ4NDg0OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjEiLz4KICA8L2c+Cjwvc3ZnPg==");
}
.btnstyle:hover.color-db, .btnstyle:hover.buybtnstyle {
background-color: #002A7D;
color: var(--slgray);
}
.btnstyle:hover.color-yl {
background-color: #D99800;
color: #000;
}
.btnstyle:hover.color-lb {
background-color: #0088A8;
color: #000;
}
.btnstyle:hover.color-gr {
background-color: var(--dark-2);
color: var(--slgray);
}
.style-dark .btnstyle:hover.color-gr {
background-color: var(--lgray);
color: var(--dgray);
}
.btnstyle:hover.color-wh {
background-color: var(--slgray);
}
.btnstyle:hover.color-tp, .btnstyle:hover.wtbbtnstyle {
color: var(--dark);
}
.style-light .btnstyle:hover.color-tp, .style-light .btnstyle:hover.wtbbtnstyle {
color: var(--dark);
}
.style-dark .btnstyle:hover.color-tp, .style-dark .btnstyle:hover.wtbbtnstyle {
color: #fff;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.btnstyle:not(.seemorebtn) {
display: inline-flex;
padding: 0 20px;
min-width: 146px;
}
.btnstyle.w-icn {
padding-left: 48px;
}
/* IE11 */
_:-ms-lang(x)::-ms-backdrop, .btnstyle::after {
content: "";
height: 46px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.btnstyle {
width: 100%;
}
.btnstyle.w-icn {
padding: 0 48px;
}
.btnstyle.seemorebtn {
border-radius: 0;
}
}
/* checkboxstyle */
.checkboxstyle {
box-sizing: border-box;
color: var(--dgray);
transition: opacity .15s ease-in-out;
min-height: 48px;
display: inline-flex;
align-items: center;
position: relative;
padding-left: 48px;
padding-right: 12px;
}
.checkboxstyle:hover {
color: var(--dark);
}
.checkboxstyle__text {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
font-size: 19.2px;
line-height: 1.4;
padding: 3px;
flex-grow: 1;
text-align: center;
}
.checkboxstyle__icn {
width: 48px;
height: 48px;
position: absolute;
top: 0;
left: 0;
}
.checkboxstyle__icn::before {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPGRlZnM+CiAgICA8Y2xpcFBhdGggaWQ9ImNsaXAtcGF0aCI+CiAgICAgIDxyZWN0IHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgZmlsbD0ibm9uZSIvPgogICAgPC9jbGlwUGF0aD4KICA8L2RlZnM+CiAgPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAtcGF0aCkiPgogICAgPGcgZmlsbD0iI2ZmZiIgc3Ryb2tlPSIjNDg0ODQ4IiBzdHJva2Utd2lkdGg9IjEiIG9wYWNpdHk9IjAiPgogICAgICA8cmVjdCB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHJ4PSIyIiBzdHJva2U9Im5vbmUiLz4KICAgICAgPHJlY3QgeD0iMC41IiB5PSIwLjUiIHdpZHRoPSI0NyIgaGVpZ2h0PSI0NyIgcng9IjEuNSIgZmlsbD0ibm9uZSIvPgogICAgPC9nPgogICAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTIgMTIpIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS13aWR0aD0iMSI+CiAgICAgIDxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgcng9IjIiIHN0cm9rZT0ibm9uZSIvPgogICAgICA8cmVjdCB4PSIwLjUiIHk9IjAuNSIgd2lkdGg9IjIzIiBoZWlnaHQ9IjIzIiByeD0iMS41IiBmaWxsPSJub25lIi8+CiAgICA8L2c+CiAgPC9nPgo8L3N2Zz4=);
display: block;
width: 48px;
height: 48px;
}
.checkboxstyle__icn::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPGRlZnM+CiAgICA8Y2xpcFBhdGggaWQ9ImNsaXAtcGF0aCI+CiAgICAgIDxyZWN0IHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgZmlsbD0ibm9uZSIvPgogICAgPC9jbGlwUGF0aD4KICA8L2RlZnM+CiAgPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAtcGF0aCkiPgogICAgPHBhdGggaWQ9ImNoZWNrIiBkPSJNMTcsNyw4LjM3NSwxNiw0LDExLjQ1NSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTMuNSAxMi41KSIgIHN0cm9rZT0iIzQ4NDg0OCIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIi8+CiAgPC9nPgo8L3N2Zz4=);
display: none;
width: 48px;
height: 48px;
position: absolute;
top: 0;
left: 0;
}
.checkboxstyle input[type="checkbox"] {
position: absolute;
opacity: 0;
}
.checkboxstyle input[type="checkbox"]:checked + .checkboxstyle__icn::after {
display: block;
}
.pressTabkey .checkboxstyle input[type="checkbox"]:focus + .checkboxstyle__icn {
outline-width: 3px;
outline-style: dotted;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
/* IE11 */
_:-ms-lang(x)::-ms-backdrop, .checkboxstyle::after {
content: "";
height: 46px;
}
}
/* tabslist-style */
.tabslist-style {
display: flex;
justify-content: center;
}
.tabslist-style.tabs-2 .tabslist-style__tab {
width: 50%;
}
.tabslist-style__tab {
max-width: 322px;
color: var(--dgray);
}
.style-dark .tabslist-style__tab {
color: var(--slgray);
}
.tabslist-style__tab__in {
border: 1px solid var(--dgray);
min-height: 48px;
display: flex;
align-items: center;
justify-content: center;
transition: background-color .15s ease-in-out, color .15s ease-in-out;
box-sizing: border-box;
padding: 2px 10px;
background-color: #FFF;
}
.style-dark .tabslist-style__tab__in {
background-color: var(--dark-2);
border-color: var(--slgray);
}
.tabslist-style__tab__text {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
font-size: 19.2px;
line-height: 1.4;
}
.tabslist-style__tab + .tabslist-style__tab .tabslist-style__tab__in {
border-left: none;
}
.tabslist-style__tab:first-child .tabslist-style__tab__in {
border-top-left-radius: 2px;
border-bottom-left-radius: 2px;
}
.tabslist-style__tab:last-child .tabslist-style__tab__in {
border-top-right-radius: 2px;
border-bottom-right-radius: 2px;
}
.tabslist-style__tab.ui-tabs-active .tabslist-style__tab__in {
background-color: var(--dgray);
color: #fff;
}
.style-dark .tabslist-style__tab.ui-tabs-active .tabslist-style__tab__in {
background-color: var(--slgray);
color: var(--dgray);
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.tabslist-style__tab__in:hover {
background-color: var(--slgray);
}
.style-dark .tabslist-style__tab__in:hover {
background-color: #000;
}
.tabslist-style__tab.ui-tabs-active .tabslist-style__tab__in:hover {
background-color: var(--dark-2);
color: var(--slgray);
}
.style-dark .tabslist-style__tab.ui-tabs-active .tabslist-style__tab__in:hover {
background-color: #fff;
}
/* IE11 */
_:-ms-lang(x)::-ms-backdrop, .tabslist-style__tab__in::after {
content: "";
height: 46px;
}
}
/* extra-badges */
.extra-badges__list {
display: flex;
}
.extra-badges__list__item__in {
position: relative;
padding-top: 75%;
}
.extra-badges__list__item img {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: auto;
height: auto;
max-height: 100%;
max-width: 100%;
}
@media (min-width: 641px), (min-device-width: 641px), print {
.extra-badges {
width: 266px;
margin-left: auto;
}
.extra-badges__list {
margin: -10px -5px 0;
flex-wrap: wrap;
}
.extra-badges__list__item {
margin: 10px 5px 0;
width: 128px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.extra-badges__list {
margin: 0 -10px 0;
}
.extra-badges__list__item {
margin: 0 10px;
width: calc(25% - 20px);
}
}
/* scrollbar style */
.scrollbar-style {
overflow: auto;
scrollbar-color: var(--dgray);
scrollbar-width: thin;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
}
.scrollbar-style::-webkit-scrollbar {
height: 4px;
}
.scrollbar-style::-webkit-scrollbar-track {
background-color: var(--slgray);
}
.scrollbar-style::-webkit-scrollbar-thumb {
background-color: var(--dgray);
}
.scrollbar-style.track-white::-webkit-scrollbar-track {
background-color: #fff;
}
.scrollbar-style__in {
padding-bottom: 16px;
}
@media (min-width: 641px), (min-device-width: 1281px) {
.scrollbar-style::-webkit-scrollbar {
height: 16px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.scrollbar-mobile-style {
overflow: auto;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
}
.scrollbar-mobile-style::-webkit-scrollbar {
height: 4px;
}
.scrollbar-mobile-style::-webkit-scrollbar-track {
background-color: var(--slgray);
}
.scrollbar-mobile-style::-webkit-scrollbar-thumb {
background-color: var(--dgray);
}
}
/* ui-seemore */
.ui-seemore__in {
border-bottom: 1px solid var(--dgray);
}
.ui-seemore__btnarea .btnstyle.seemorebtn {
width: 100%;
padding: 0 10px;
color: var(--dgray);
}
.ui-seemore__btnarea .btnstyle.seemorebtn .btnstyle__text {
flex-grow: 1;
text-align: left;
}
.ui-seemore__btnarea .btnstyle.seemorebtn .btnstyle__text .tx-close {
display: none;
}
.ui-seemore__btnarea .btnstyle.seemorebtn:hover {
opacity: .75;
}
.ui-seemore__btnarea .btnstyle.seemorebtn::after {
width: 48px;
height: 48px;
}
.ui-seemore__btnarea .btnstyle.seemorebtn[aria-expanded="true"] .btnstyle__text .tx-open {
display: none;
}
.ui-seemore__btnarea .btnstyle.seemorebtn[aria-expanded="true"] .btnstyle__text .tx-close {
display: inline;
}
.ui-seemore__panelarea {
display: none;
}
.ui-seemore.active .ui-seemore__btnarea .btnstyle.seemorebtn {
background-color: var(--dgray);
color: #fff;
}
.ui-seemore.active .ui-seemore__btnarea .btnstyle.seemorebtn::after {
-webkit-transform: scaleY(-1);
transform: scaleY(-1);
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.ui-seemore__in {
max-width: 976px;
margin-left: auto;
margin-right: auto;
}
.ui-seemore__btnarea .btnstyle.seemorebtn::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHBhdGggaWQ9ImNoZXZyb24tbGVmdCIgZD0iTTgsMjgsMTksMTcsOCw2SDgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQxIDExKSByb3RhdGUoOTApIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+Cjwvc3ZnPg==");
}
.ui-seemore.active .ui-seemore__btnarea .btnstyle.seemorebtn::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHBhdGggaWQ9ImNoZXZyb24tbGVmdCIgZD0iTTgsMjgsMTksMTcsOCw2SDgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQxIDExKSByb3RhdGUoOTApIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+Cjwvc3ZnPg==");
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.ui-seemore__btnarea .btnstyle.seemorebtn {
padding-right: 0;
}
.ui-seemore__btnarea .btnstyle.seemorebtn::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDIzKSIgZmlsbD0iIzQ4NDg0OCIvPgogIDxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjE2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyMyAxNikiIGZpbGw9IiM0ODQ4NDgiLz4KPC9zdmc+");
}
.ui-seemore__btnarea .btnstyle.seemorebtn .btnstyle__text {
padding-left: 10px;
}
.ui-seemore__panelarea {
padding: 0 10px;
}
.ui-seemore.active .ui-seemore__btnarea .btnstyle.seemorebtn::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDIzKSIgZmlsbD0iI2ZmZiIvPgo8L3N2Zz4=");
}
}
/* ui-itemsslider */
.ui-itemsslider {
display: flex;
flex-direction: column-reverse;
}
.ui-itemsslider button {
-webkit-appearance: none;
appearance: none;
box-sizing: border-box;
border: none;
padding: 0;
margin: 0;
background: none;
font-size: 0;
line-height: 0;
cursor: pointer;
}
.ui-itemsslider__controls {
margin-top: 16px;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.ui-itemsslider__controls button:hover {
opacity: .75;
}
.ui-itemsslider__dots {
display: inline-flex;
max-width: calc(100% - 130px);
}
.ui-itemsslider__dots li {
box-sizing: border-box;
margin: 0 5px;
}
.ui-itemsslider__dots li.slick-active button {
border: 1px solid var(--dark);
background-color: var(--dark);
}
.ui-itemsslider__dots button {
display: block;
width: 100%;
height: 100%;
border: 1px solid var(--lgray);
background-color: var(--lgray);
}
.ui-itemsslider__prev, .ui-itemsslider__next {
position: absolute;
bottom: 0;
}
.ui-itemsslider__prev {
left: 0;
}
.ui-itemsslider__next {
right: 0;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.ui-itemsslider__controls {
height: 34px;
}
.ui-itemsslider__dots li {
width: 48px;
height: 4px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.ui-itemsslider:not(.available-xs) {
margin: 0 -10px;
overflow: auto;
scroll-snap-type: x proximity;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
}
.ui-itemsslider:not(.available-xs)::-webkit-scrollbar {
height: 4px;
}
.ui-itemsslider:not(.available-xs)::-webkit-scrollbar-track {
background-color: var(--slgray);
}
.ui-itemsslider:not(.available-xs)::-webkit-scrollbar-thumb {
background-color: var(--dgray);
}
.ui-itemsslider:not(.available-xs) .product-itemsbox {
margin-left: 0;
margin-right: 0;
}
.ui-itemsslider:not(.available-xs) .ui-itemsslider__container {
display: inline-flex;
padding-bottom: 16px;
}
.ui-itemsslider:not(.available-xs) .ui-itemsslider__item {
flex-shrink: 0;
}
.ui-itemsslider.available-xs .ui-itemsslider__dots {
max-width: 100%;
}
.ui-itemsslider.available-xs .ui-itemsslider__dots li {
width: 8px;
border-radius: 4px;
position: relative;
}
.ui-itemsslider.available-xs .ui-itemsslider__dots li button {
border-radius: 4px;
padding-bottom: calc(100% - 2px);
}
.ui-itemsslider.available-xs .ui-itemsslider__prev, .ui-itemsslider.available-xs .ui-itemsslider__next {
display: none !important;
}
}
/* product-item */
.product-itemsbox {
margin-right: -10px;
margin-left: -10px;
display: inline-flex;
}
.product-itemsbox .product-item {
flex-shrink: 0;
padding-right: 10px;
padding-left: 10px;
}
.product-item {
width: 229px;
}
.product-item a, .product-item .nolink {
display: block;
width: 100%;
height: 100%;
}
.product-item a:hover {
opacity: .75;
}
.product-item__in {
display: flex;
flex-direction: column-reverse;
}
.product-item__text__ttl, .product-item__text__body, .product-item__text__price, .product-item__text__note {
margin-top: 16px;
}
.product-item__text__ttl .icn {
vertical-align: middle;
margin-left: 10px;
}
.product-item__text__price .prefix, .product-item__text__price .price-nu {
display: block;
}
.product-item__text__price .prefix {
margin-bottom: 8px;
}
.product-item__img {
position: relative;
padding-bottom: 75%;
}
.product-item__img__in {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.product-item__img.square {
padding-bottom: 100%;
background-color: var(--slgray);
}
.product-item__img.square .product-item__img__in img {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.product-itemsbox .product-item {
scroll-snap-align: start;
}
}
/* ui-modalwindow */
.ui-modalwindow {
box-sizing: border-box;
position: fixed;
background-color: rgba(0, 0, 0, 0.85);
width: 100%;
height: 100vh;
top: 0;
z-index: 1005;
}
.ui-modalwindow .btn-close {
position: absolute;
top: 10px;
right: 10px;
}
.ui-modalwindow .focusFirst, .ui-modalwindow .focusLast {
position: absolute;
width: 100%;
}
.ui-modalwindow .focusFirst {
top: 0;
}
.ui-modalwindow .focusLast {
bottom: 0;
}
.ui-modalwindow__in {
box-sizing: border-box;
width: 100%;
height: 100%;
}
.ui-modalwindow__container {
box-sizing: border-box;
background-color: #fff;
max-height: 100%;
max-width: 100%;
position: relative;
}
.ui-modalwindow__contents {
overflow: auto;
max-height: 100%;
min-height: 0%;
height: 100%;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.ui-modalwindow__in {
padding: 32px;
display: flex;
align-items: center;
justify-content: center;
}
.ui-modalwindow__container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 68px 0;
min-width: 0px;
}
.ui-modalwindow__contents {
width: 976px;
padding: 0 20px;
max-width: calc(100% - 40px);
}
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
*::-ms-backdrop, .ui-modalwindow__contents {
max-width: none;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.ui-modalwindow__container {
height: 100%;
padding: 68px 0 48px;
}
.ui-modalwindow__contents {
padding: 0 10px;
}
}
/************************** product-features *****************************/
.product-features.style-light {
background-color: #fff;
color: var(--dark);
}
.product-features.style-light .contents-tabs__subtitle {
background-color: var(--slgray);
color: var(--dgray);
}
.product-features.style-light .layout-carousel {
background-color: var(--slgray);
}
.product-features.style-light .layout-carousel .contents-carousel__container {
background-color: #fff;
}
.product-features.style-light .layout-carousel .contents-carousel__prev svg, .product-features.style-light .layout-carousel .contents-carousel__next svg {
stroke: var(--dgray);
}
.product-features.style-light .layout-carousel .contents-carousel__thumbnails li.slick-active .thumbnail-img::before {
border-color: var(--dgray);
}
.product-features.style-light .layout-carousel .contents-carousel__thumbnails li.slick-active button {
background-color: var(--dgray);
}
.product-features.style-light .layout-carousel .contents-carousel__thumbnails .thumbnail-img::before {
border-color: #fff;
}
.product-features.style-light .layout-carousel .contents-carousel__thumbnails button {
background-color: var(--lgray);
}
.product-features.style-light .layout-demo {
background-color: var(--slgray);
}
.product-features.style-light .layout-demo .contents-demo__num__in {
color: var(--dgray);
border-color: var(--dgray);
background-color: #fff;
}
.product-features.style-light .layout-demo .contents-demo__num.selected .contents-demo__num__in {
color: #fff;
background-color: var(--dgray);
}
.product-features.style-light .layout-demo .contents-demo__num .tooltips {
color: var(--dark);
}
.product-features.style-light .layout-demo .contents-demo__num .tooltips::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNS43NSIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTUuNzUgOSI+CiAgPHBhdGggZD0iTTcuODc1LDAsMTUuNzUsOUgwWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTUuNzUgOSkgcm90YXRlKDE4MCkiIGZpbGw9IiNmZmYiLz4KPC9zdmc+);
}
.product-features.style-light .layout-demo .contents-demo__num .tooltips__in {
background-color: #fff;
}
.product-features.style-light .layout-demo .contents-demo li.slick-active .contents-demo__num__in {
color: #fff;
background-color: var(--dgray);
}
.product-features.style-light .layout-demo .contents-demo__details__container, .product-features.style-light .layout-demo .contents-demo__details__item__in {
background-color: #fff;
}
.product-features.style-light .layout-accordion .contents-accordion__title__btn {
color: var(--dgray);
}
.product-features.style-light .layout-accordion .contents-accordion__title__btn.selected {
background-color: var(--dgray);
color: #fff;
}
.product-features.style-dark {
background-color: var(--dark-2);
color: #fff;
}
.product-features.style-dark .contents-tabs__subtitle {
background-color: var(--dgray);
color: var(--slgray);
}
.product-features.style-dark .layout-carousel {
background-color: var(--dark-2);
}
.product-features.style-dark .layout-carousel .contents-carousel__container {
background-color: #000;
}
.product-features.style-dark .layout-carousel .contents-carousel__prev svg, .product-features.style-dark .layout-carousel .contents-carousel__next svg {
stroke: #fff;
}
.product-features.style-dark .layout-carousel .contents-carousel__thumbnails li.slick-active .thumbnail-img::before {
border-color: #fff;
}
.product-features.style-dark .layout-carousel .contents-carousel__thumbnails li.slick-active button {
background-color: #fff;
}
.product-features.style-dark .layout-carousel .contents-carousel__thumbnails .thumbnail-img::before {
border-color: var(--dgray);
}
.product-features.style-dark .layout-carousel .contents-carousel__thumbnails button {
background-color: #000;
}
.product-features.style-dark .layout-demo .contents-demo__num__in {
color: var(--slgray);
border-color: var(--slgray);
background-color: var(--dgray);
}
.product-features.style-dark .layout-demo .contents-demo__num.selected .contents-demo__num__in {
color: var(--dgray);
background-color: var(--slgray);
}
.product-features.style-dark .layout-demo .contents-demo__num .tooltips {
color: #fff;
}
.product-features.style-dark .layout-demo .contents-demo__num .tooltips::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNS43NSIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTUuNzUgOSI+CiAgPHBhdGggZD0iTTcuODc1LDAsMTUuNzUsOUgwWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTUuNzUgOSkgcm90YXRlKDE4MCkiIGZpbGw9IiMwMDAiLz4KPC9zdmc+);
}
.product-features.style-dark .layout-demo .contents-demo__num .tooltips__in {
background-color: #000;
}
.product-features.style-dark .layout-demo .contents-demo li.slick-active .contents-demo__num__in {
color: var(--dgray);
background-color: var(--slgray);
}
.product-features.style-dark .layout-demo .contents-demo__details__container, .product-features.style-dark .layout-demo .contents-demo__details__item__in {
background-color: #000;
}
.product-features.style-dark .layout-accordion .contents-accordion__title__btn {
color: var(--slgray);
}
.product-features.style-dark .layout-accordion .contents-accordion__title__btn.selected {
background-color: var(--slgray);
color: var(--dgray);
}
.product-features__layoutframe .contents-img {
box-sizing: border-box;
}
.product-features__layoutframe .contents-img img {
vertical-align: top;
width: 100%;
height: auto;
max-width: 100%;
}
.product-features__layoutframe .contents-img img[srcset] {
width: 100%;
}
.product-features__layoutframe .contents-img__video__in {
position: relative;
width: 100%;
}
.product-features__layoutframe .contents-img__video__in .youtube-placeholder {
width: 100%;
aspect-ratio: 16/9;
}
.product-features__layoutframe .contents-img__video__in .videoplayer {
background-color: transparent;
display: flex;
align-items: center;
}
.product-features__layoutframe .contents-img__video__in .videoplayer video {
max-height: 100%;
}
.product-features__layoutframe .contents-block {
box-sizing: border-box;
}
.product-features__layoutframe .contents-block__subtitle {
display: block;
margin-bottom: 16px;
}
.product-features__layoutframe .contents-block__body a {
text-decoration: underline;
}
.product-features__layoutframe .contents-block__body a:hover {
text-decoration: none;
}
.product-features__layoutframe .contents-block__body b {
font-weight: bold;
}
.product-features__layoutframe .contents-block__body__note {
margin-top: 16px;
}
.product-features__layoutframe .contents-table a {
text-decoration: underline;
}
.product-features__layoutframe .contents-table a:hover {
text-decoration: none;
}
.product-features__layoutframe .contents-table b {
font-weight: bold;
}
.product-features__layoutframe .contents-table__in {
overflow: auto;
scrollbar-color: var(--dgray);
scrollbar-width: thin;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
}
.product-features__layoutframe .contents-table__in::-webkit-scrollbar {
height: 4px;
}
.product-features__layoutframe .contents-table__in::-webkit-scrollbar-track {
background-color: var(--slgray);
}
.product-features__layoutframe .contents-table__in::-webkit-scrollbar-thumb {
background-color: var(--dgray);
}
.product-features__layoutframe .contents-table table {
min-width: 100%;
}
.product-features__layoutframe .contents-layoutframe__item {
display: flex;
flex-direction: column;
}
.product-features__layoutframe .contents-layoutframe:not(.steps) .contents-layoutframe__item .contents-block {
order: 1;
}
.product-features__layoutframe .contents-multiple__item {
display: flex;
}
.product-features__layoutframe .contents-carousel {
display: flex;
flex-direction: column-reverse;
}
.product-features__layoutframe .contents-carousel__item:not(.slick-active) .youtube-placeholder, .product-features__layoutframe .contents-carousel__item:not(.slick-active) .videoplayer {
visibility: hidden;
}
.product-features__layoutframe .contents-carousel__controls {
position: relative;
display: flex;
justify-content: center;
margin-top: 16px;
}
.product-features__layoutframe .contents-carousel__controls button {
-webkit-appearance: none;
appearance: none;
border: none;
padding: 0;
margin: 0;
background: none;
border-radius: 0;
cursor: pointer;
}
.product-features__layoutframe .contents-carousel__controls button:hover {
opacity: .75;
}
.product-features__layoutframe .contents-carousel__controls svg {
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 2px;
}
.product-features__layoutframe .contents-carousel__thumbnails {
display: flex;
}
.product-features__layoutframe .contents-carousel__thumbnails li {
margin: 0 5px;
}
.product-features__layoutframe .contents-carousel__thumbnails img {
vertical-align: middle;
width: 100%;
height: 100%;
}
.product-features__layoutframe .contents-demo__num {
display: inline-flex;
align-items: center;
justify-content: center;
width: 48px;
height: 48px;
}
.product-features__layoutframe .contents-demo__num__in {
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
border: 1px solid;
border-radius: 50%;
width: 36px;
height: 36px;
}
.product-features__layoutframe .contents-demo button[role="tab"] {
-webkit-appearance: none;
appearance: none;
margin: 0;
padding: 0;
background: none;
border: none;
pointer-events: none;
width: 100%;
height: 100%;
}
.product-features__layoutframe .contents-demo button[role="tab"]:hover .contents-demo__num__in {
opacity: .75;
}
.product-features__layoutframe .contents-demo button[role="tab"] .contents-demo__num {
cursor: pointer;
pointer-events: auto;
}
.product-features__layoutframe .contents-demo__img__list {
position: relative;
padding-top: 100%;
}
.product-features__layoutframe .contents-demo__img__list.temp {
display: none;
}
.product-features__layoutframe .contents-demo__img__list > li {
position: absolute;
width: 100%;
height: 100%;
top: 0;
pointer-events: none;
}
.product-features__layoutframe .contents-demo__img__list > li.slick-active .contents-demo__img__list__item__img {
opacity: 1;
}
.product-features__layoutframe .contents-demo__img__list__item__img {
pointer-events: none;
position: absolute;
top: 0;
left: 0;
opacity: 0;
width: 100%;
height: 100%;
}
.product-features__layoutframe .contents-demo__img .contents-demo__num {
position: absolute;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
z-index: 1;
}
.product-features__layoutframe .contents-demo__img:not(.no-effect) .contents-demo__img__list__item__img {
transition: opacity .3s ease-in-out;
}
.product-features__layoutframe .contents-demo__details__item:not(.slick-active) iframe {
visibility: hidden;
}
.product-features__layoutframe .contents-demo__details__item__in {
box-sizing: border-box;
padding: 8px 10px 16px;
height: 100%;
display: flex;
flex-direction: column;
}
.product-features__layoutframe .contents-demo__details__item__in .contents-block {
flex-grow: 1;
}
.product-features__layoutframe .contents-demo__details__item__in .contents-img {
min-height: 0%;
}
.product-features__layoutframe .contents-demo__details__item__num {
display: block;
text-align: center;
margin-bottom: 8px;
}
.product-features__layoutframe .contents-accordion__title__btn {
-webkit-appearance: none;
appearance: none;
border: none;
background: none;
box-sizing: border-box;
padding: 0;
text-align: inherit;
transition: background-color .3s ease-in-out;
cursor: pointer;
display: flex;
align-items: center;
width: 100%;
}
.product-features__layoutframe .contents-accordion__item {
display: none;
}
.product-features__layoutframe .contents-accordion__item__in {
display: flex;
}
.product-features__layoutframe .contents-accordion__item__in .contents-block {
order: 1;
}
.product-features__layoutframe .layout-1img-1blk, .product-features__layoutframe .layout-1table-1blk {
display: flex;
}
.product-features__layoutframe .layout-1fwimg-w-text {
display: flex;
flex-direction: column-reverse;
align-items: center;
}
.product-features__layoutframe .layout-carousel .contents-block {
order: 1;
}
.product-features__layoutframe .layout-demo .contents-img {
margin-top: 16px;
position: relative;
padding-bottom: 100%;
}
.product-features__layoutframe .layout-demo .contents-img > img, .product-features__layoutframe .layout-demo .contents-img > .contents-img__video {
position: absolute;
width: 100%;
top: 0;
}
.product-features__layoutframe .layout-demo .contents-img .contents-img__video {
height: 100%;
}
.product-features__layoutframe .layout-demo .contents-img .contents-img__video__in {
height: 100%;
}
.product-features__layoutframe .layout-demo .contents-img .contents-img__video__in .videoplayer {
margin: auto;
width: fit-content;
height: 100%;
align-items: flex-start;
justify-content: center;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.product-features.style-light .layout-accordion {
background-color: var(--slgray);
}
.product-features.style-light .layout-accordion .contents-accordion__item, .product-features.style-light .layout-accordion .contents-accordion__title__btn {
background-color: #fff;
}
.product-features.style-dark .layout-accordion .contents-accordion__item, .product-features.style-dark .layout-accordion .contents-accordion__title__btn {
background-color: #000;
}
.product-features__layoutframe__in {
padding: 64px 0;
}
.product-features__layoutframe__in:not(.layout-carousel):not(.layout-demo):not(.layout-accordion) {
max-width: 1200px;
margin-inline: auto;
}
.product-features__layoutframe .contents-title {
margin-bottom: 32px;
}
.product-features__layoutframe .contents-img__img {
display: flex;
align-items: center;
height: 100%;
}
.product-features__layoutframe .contents-block__title {
margin-bottom: 32px;
}
.product-features__layoutframe .contents-block__btn {
margin-top: 32px;
}
.product-features__layoutframe .contents-table__in::-webkit-scrollbar {
height: 16px;
}
.product-features__layoutframe .contents-tabs__subtitle {
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
padding: 10px;
min-height: 56px;
margin-bottom: 16px;
}
.product-features__layoutframe .contents-tabs__tabslist {
display: none;
}
.product-features__layoutframe .contents-layoutframe.steps .contents-layoutframe__in {
margin-top: -32px;
}
.product-features__layoutframe .contents-layoutframe.steps .contents-layoutframe__item {
margin-top: 32px;
}
.product-features__layoutframe .contents-multiple__item {
align-items: center;
}
.product-features__layoutframe .contents-multiple__item:nth-child(2n+1) {
flex-direction: row-reverse;
}
.product-features__layoutframe .contents-multiple__item:nth-child(2n+1) .contents-block::before {
content: "";
width: 20px;
flex-shrink: 0;
}
.product-features__layoutframe .contents-multiple__item:nth-child(2n) .contents-block::after {
content: "";
width: 20px;
flex-shrink: 0;
}
.product-features__layoutframe .contents-multiple__item .contents-block, .product-features__layoutframe .contents-multiple__item .contents-img {
width: 50%;
}
.product-features__layoutframe .contents-multiple__item .contents-block {
display: flex;
}
.product-features__layoutframe .contents-carousel__thumbnails li {
opacity: .6;
}
.product-features__layoutframe .contents-carousel__thumbnails li.slick-active {
opacity: 1;
}
.product-features__layoutframe .contents-carousel__thumbnails .thumbnail-img {
display: block;
position: relative;
width: 64px;
height: 64px;
}
.product-features__layoutframe .contents-carousel__thumbnails .thumbnail-img::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-sizing: border-box;
border: 1px solid;
}
.product-features__layoutframe .contents-carousel__thumbnails .thumbnail-img.inc-video::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDE4IDIwIj4KPHBhdGggZD0iTTQ1LDI0LDI3LDE0VjM0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjcgLTE0KSIgZmlsbD0iI2ZmZiIvPgo8L3N2Zz4=");
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 18px;
height: 20px;
margin: auto;
}
.product-features__layoutframe .contents-carousel__prev, .product-features__layoutframe .contents-carousel__next {
position: absolute;
top: 0;
bottom: 0;
margin: auto;
}
.product-features__layoutframe .contents-carousel__prev {
left: 0;
}
.product-features__layoutframe .contents-carousel__next {
right: 0;
}
.product-features__layoutframe .contents-demo__num .tooltips {
position: absolute;
z-index: 1;
bottom: calc(100% + 8px);
width: 312px;
pointer-events: none;
display: none;
}
.product-features__layoutframe .contents-demo__num .tooltips::after {
display: block;
position: absolute;
width: 15.75px;
height: 9px;
bottom: -8px;
font-size: 0;
}
.product-features__layoutframe .contents-demo__num .tooltips__in {
display: block;
box-sizing: border-box;
padding: 16px 20px;
border-radius: 3px;
}
.product-features__layoutframe .contents-demo__num.leftside .tooltips {
left: 0;
}
.product-features__layoutframe .contents-demo__num.leftside .tooltips::after {
left: calc(48px / 2 - 8px);
}
.product-features__layoutframe .contents-demo__num.rightside .tooltips {
right: 0;
}
.product-features__layoutframe .contents-demo__num.rightside .tooltips::after {
right: calc(48px / 2 - 8px);
}
.product-features__layoutframe .contents-demo button:hover .contents-demo__num {
z-index: 2;
}
.product-features__layoutframe .contents-demo button:hover .contents-demo__num .tooltips {
display: block;
}
.product-features__layoutframe .contents-accordion__container {
position: relative;
min-height: 312px;
}
.product-features__layoutframe .contents-accordion__title {
box-sizing: border-box;
width: 312px;
height: 78px;
padding-bottom: 1px;
}
.product-features__layoutframe .contents-accordion__title__btn {
height: 100%;
position: relative;
padding: 0 10px;
}
.product-features__layoutframe .contents-accordion__title__btn.selected::after {
content: "";
display: block;
position: absolute;
height: 100%;
width: 21px;
background: no-repeat;
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSI3OCIgdmlld0JveD0iMCAwIDIwIDc4Ij4KICA8cGF0aCBkPSJNMCwwLDIwLDM5aDBMMCw3OFoiIGZpbGw9IiM0ODQ4NDgiLz4KPC9zdmc+);
background-repeat: no-repeat;
background-size: 100% 100%;
top: 0;
left: calc(100% - 1px);
}
.style-dark .product-features__layoutframe .contents-accordion__title__btn.selected::after {
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSI3OCIgdmlld0JveD0iMCAwIDIwIDc4Ij4KICA8cGF0aCBkPSJNMCwwLDIwLDM5aDBMMCw3OFoiIGZpbGw9IiNFRkVGRUYiLz4KPC9zdmc+);
}
.product-features__layoutframe .contents-accordion__item {
position: absolute;
width: calc(100% - 312px - 20px);
right: 0;
top: 0;
}
.product-features__layoutframe .contents-accordion__item:nth-of-type(3) ~ .contents-accordion__item {
top: auto;
bottom: 0;
}
.product-features__layoutframe .contents-accordion__item .contents-img {
width: 312px;
flex-shrink: 0;
}
.product-features__layoutframe .contents-accordion__item .contents-block {
padding: 20px;
}
.product-features__layoutframe .contents-accordion__item:not(.only-tx) .contents-block {
flex-grow: 1;
}
.product-features__layoutframe .layout-1fwimg .contents-title, .product-features__layoutframe .layout-1img .contents-title, .product-features__layoutframe .layout-2img-2blk .contents-title, .product-features__layoutframe .layout-2img-2blk-w-tab .contents-title, .product-features__layoutframe .layout-steps .contents-title, .product-features__layoutframe .layout-mltpimg .contents-title, .product-features__layoutframe .layout-carousel .contents-title, .product-features__layoutframe .layout-demo .contents-title, .product-features__layoutframe .layout-accordion .contents-title, .product-features__layoutframe .layout-1table .contents-title {
text-align: center;
display: flex;
justify-content: center;
}
.product-features__layoutframe .layout-1fwimg .contents-title__in, .product-features__layoutframe .layout-1img .contents-title__in, .product-features__layoutframe .layout-2img-2blk .contents-title__in, .product-features__layoutframe .layout-2img-2blk-w-tab .contents-title__in, .product-features__layoutframe .layout-steps .contents-title__in, .product-features__layoutframe .layout-mltpimg .contents-title__in, .product-features__layoutframe .layout-carousel .contents-title__in, .product-features__layoutframe .layout-demo .contents-title__in, .product-features__layoutframe .layout-accordion .contents-title__in, .product-features__layoutframe .layout-1table .contents-title__in {
max-width: 644px;
}
.product-features__layoutframe .layout-1img-1blk {
padding: 0;
align-items: center;
}
.product-features__layoutframe .layout-1img-1blk.reverse {
flex-direction: row-reverse;
}
.product-features__layoutframe .layout-1img-1blk .contents-block, .product-features__layoutframe .layout-1img-1blk .contents-img {
width: 50%;
}
.product-features__layoutframe .layout-1img-1blk .contents-block__video__in, .product-features__layoutframe .layout-1img-1blk .contents-img__video__in {
aspect-ratio: 1/1;
display: flex;
align-items: center;
justify-content: center;
}
.product-features__layoutframe .layout-1img-1blk .contents-block__in {
max-width: 376px;
padding: 20px;
margin: auto;
}
.product-features__layoutframe .layout-1table-1blk.reverse {
flex-direction: row-reverse;
}
.product-features__layoutframe .layout-1table-1blk.reverse .contents-block {
padding-left: 20px;
}
.product-features__layoutframe .layout-1table-1blk:not(.reverse) .contents-block {
padding-right: 20px;
}
.product-features__layoutframe .layout-1table-1blk .contents-block, .product-features__layoutframe .layout-1table-1blk .contents-table {
width: 50%;
flex-shrink: 0;
}
.product-features__layoutframe .layout-1fwimg-w-text .contents-block {
margin-top: 32px;
}
.product-features__layoutframe .layout-1fwimg-w-text .contents-block__title-body-btn {
padding-right: 56px;
}
.product-features__layoutframe .layout-1fwimg .contents-img, .product-features__layoutframe .layout-1img .contents-img, .product-features__layoutframe .layout-1table .contents-img {
text-align: center;
}
.product-features__layoutframe .layout-1fwimg .contents-block, .product-features__layoutframe .layout-1img .contents-block, .product-features__layoutframe .layout-1table .contents-block {
margin-top: 32px;
text-align: center;
display: flex;
justify-content: center;
}
.product-features__layoutframe .layout-1fwimg .contents-block__in, .product-features__layoutframe .layout-1img .contents-block__in, .product-features__layoutframe .layout-1table .contents-block__in {
max-width: 644px;
}
.product-features__layoutframe .layout-1img .contents-img img {
max-width: 478px;
}
.product-features__layoutframe .layout-1img .contents-img__video {
max-width: 644px;
margin: 0 auto;
}
.product-features__layoutframe .layout-1table .contents-table {
margin-top: 32px;
}
.product-features__layoutframe .layout-1table .contents-table__note {
margin-top: 32px;
}
.product-features__layoutframe .layout-2img-2blk .contents-block, .product-features__layoutframe .layout-2img-2blk-w-tab .contents-block {
margin-top: 32px;
}
.product-features__layoutframe .layout-2img-2blk .contents-img, .product-features__layoutframe .layout-2img-2blk-w-tab .contents-img {
min-height: 0%;
}
.product-features__layoutframe .layout-steps .contents-block {
margin-bottom: auto;
}
.product-features__layoutframe .layout-steps .contents-img {
position: relative;
margin-top: 16px;
padding-bottom: 100%;
}
.product-features__layoutframe .layout-steps .contents-img > img, .product-features__layoutframe .layout-steps .contents-img > .contents-img__video {
position: absolute;
width: 100%;
top: 0;
}
.product-features__layoutframe .layout-steps .contents-img .contents-img__video {
height: 100%;
}
.product-features__layoutframe .layout-steps .contents-img .contents-img__video__in {
height: 100%;
}
.product-features__layoutframe .layout-steps .contents-img .contents-img__video__in .videoplayer {
margin: auto;
align-items: flex-start;
justify-content: center;
width: fit-content;
height: 100%;
}
.product-features__layoutframe .layout-carousel .contents-img {
min-height: 478px;
}
.product-features__layoutframe .layout-carousel .contents-img__video {
height: 478px;
}
.product-features__layoutframe .layout-carousel .contents-img__video__in {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.product-features__layoutframe .layout-carousel .contents-img__video__in .videoplayer {
height: 100%;
}
.product-features__layoutframe .layout-carousel .contents-block {
display: flex;
align-items: center;
}
.product-features__layoutframe .layout-carousel .contents-block__in {
padding-right: 20px;
}
.product-features__layoutframe .layout-accordion .contents-img {
min-height: 312px;
}
.product-features__layoutframe .layout-accordion .contents-img__video {
height: 312px;
}
.product-features__layoutframe .layout-accordion .contents-img__video__in {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.product-features__layoutframe .layout-accordion .contents-img__video__in .videoplayer {
height: 100%;
}
.product-features__layoutframe .layout-accordion .contents-block {
display: flex;
align-items: center;
min-height: 312px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.product-features__layoutframe__in {
padding: 48px 0;
}
.product-features__layoutframe .contents-img img {
width: 100%;
}
.product-features__layoutframe .contents-title {
margin-bottom: 24px;
}
.product-features__layoutframe .contents-block__title {
margin-bottom: 24px;
}
.product-features__layoutframe .contents-block__btn {
margin-top: 24px;
}
.product-features__layoutframe .contents-layoutframe:not(.steps) .contents-layoutframe__item:not(:first-child):not(.contents-tabs__tabpanel) {
margin-top: 48px;
}
.product-features__layoutframe .contents-layoutframe.steps .contents-layoutframe__in {
position: relative;
padding-bottom: 1px;
}
.product-features__layoutframe .contents-layoutframe.steps .contents-layoutframe__in::after {
content: "";
display: block;
border-bottom: 1px solid var(--lgray);
position: absolute;
bottom: 0;
left: 10px;
width: calc(100% - 20px);
}
.style-dark .product-features__layoutframe .contents-layoutframe.steps .contents-layoutframe__in::after {
border-color: #707070;
}
.product-features__layoutframe .contents-layoutframe.steps .contents-layoutframe__item {
padding-top: 9px;
padding-bottom: 8px;
flex-direction: row-reverse;
justify-content: flex-end;
position: relative;
}
.product-features__layoutframe .contents-layoutframe.steps .contents-layoutframe__item::before {
content: "";
display: block;
border-top: 1px solid var(--lgray);
position: absolute;
top: 0;
left: 10px;
width: calc(100% - 20px);
}
.style-dark .product-features__layoutframe .contents-layoutframe.steps .contents-layoutframe__item::before {
border-color: #707070;
}
.product-features__layoutframe .contents-layoutframe.steps .contents-layoutframe__item .contents-block {
flex-grow: 1;
display: flex;
}
.product-features__layoutframe .contents-layoutframe.steps .contents-layoutframe__item .contents-block::before {
content: "";
width: 10px;
flex-shrink: 0;
}
.product-features__layoutframe .contents-layoutframe.steps .contents-layoutframe__item .contents-img {
width: 145px;
flex-shrink: 0;
}
.product-features__layoutframe .contents-tabs__subtitle {
display: none;
}
.product-features__layoutframe .contents-tabs__tabslist {
margin-bottom: 16px;
}
.product-features__layoutframe .contents-multiple__item {
flex-direction: column;
}
.product-features__layoutframe .contents-multiple__item:not(:first-child) {
margin-top: 48px;
}
.product-features__layoutframe .contents-multiple__item .contents-block {
order: 1;
}
.product-features__layoutframe .contents-carousel__thumbnails li {
line-height: 0;
}
.product-features__layoutframe .contents-carousel__thumbnails li button {
border-radius: 50%;
width: 8px;
height: 8px;
}
.product-features__layoutframe .contents-carousel__thumbnails .thumbnail-img {
display: none;
}
.product-features__layoutframe .contents-carousel__prev, .product-features__layoutframe .contents-carousel__next {
display: none !important;
}
.product-features__layoutframe .contents-demo__num .tooltips {
display: none;
}
.product-features__layoutframe .contents-demo__details__controls {
margin-top: 16px;
display: flex;
justify-content: center;
}
.product-features__layoutframe .contents-demo__dummydots {
display: inline-flex;
}
.product-features__layoutframe .contents-demo__dummydots .dots {
margin: 0 5px;
border-radius: 50%;
width: 8px;
height: 8px;
background-color: var(--lgray);
}
.style-dark .product-features__layoutframe .contents-demo__dummydots .dots {
background-color: #000;
}
.product-features__layoutframe .contents-demo__dummydots .dots.selected {
background-color: var(--dgray);
}
.style-dark .product-features__layoutframe .contents-demo__dummydots .dots.selected {
background-color: #fff;
}
.product-features__layoutframe .contents-accordion__container {
position: relative;
padding-bottom: 1px;
}
.product-features__layoutframe .contents-accordion__container::after {
content: "";
width: calc(100% + 20px);
bottom: 0;
left: -10px;
position: absolute;
border-bottom: 1px solid var(--dgray);
}
.style-dark .product-features__layoutframe .contents-accordion__container::after {
border-color: var(--slgray);
}
.product-features__layoutframe .contents-accordion__title {
margin: 0 -10px;
}
.product-features__layoutframe .contents-accordion__title__btn {
border-top: 1px solid var(--dgray);
min-height: 56px;
}
.product-features__layoutframe .contents-accordion__title__btn::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDIzKSIgZmlsbD0iIzQ4NDg0OCIvPgogIDxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjE2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyMyAxNikiIGZpbGw9IiM0ODQ4NDgiLz4KPC9zdmc+);
height: 48px;
width: 48px;
flex-shrink: 0;
}
.product-features__layoutframe .contents-accordion__title__btn.selected::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDIzKSIgZmlsbD0iI2ZmZiIvPgo8L3N2Zz4=);
}
.style-dark .product-features__layoutframe .contents-accordion__title__btn {
border-color: var(--slgray);
}
.style-dark .product-features__layoutframe .contents-accordion__title__btn::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDIzKSIgZmlsbD0iI2VmZWZlZiIvPgogIDxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjE2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyMyAxNikiIGZpbGw9IiNlZmVmZWYiLz4KPC9zdmc+);
}
.style-dark .product-features__layoutframe .contents-accordion__title__btn.selected::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDIzKSIgZmlsbD0iIzQ4NDg0OCIvPgo8L3N2Zz4=);
}
.product-features__layoutframe .contents-accordion__title__btn span {
padding: 4px 10px;
flex-grow: 1;
}
.product-features__layoutframe .contents-accordion__item__in {
flex-direction: column;
padding: 16px 0 24px;
}
.product-features__layoutframe .layout-1fwimg-w-text .contents-img, .product-features__layoutframe .layout-1fwimg .contents-img {
width: 100%;
}
.product-features__layoutframe .layout-1img-1blk .contents-block, .product-features__layoutframe .layout-1table-1blk .contents-block, .product-features__layoutframe .layout-1fwimg .contents-block, .product-features__layoutframe .layout-1img .contents-block, .product-features__layoutframe .layout-2img-2blk .contents-block, .product-features__layoutframe .layout-2img-2blk-w-tab .contents-block, .product-features__layoutframe .layout-mltpimg .contents-block {
margin-top: 24px;
}
.product-features__layoutframe .layout-1table .contents-table {
margin-top: 24px;
}
.product-features__layoutframe .layout-1table .contents-table__note {
margin-top: 24px;
}
.product-features__layoutframe .layout-1img-1blk {
flex-direction: column-reverse;
}
.product-features__layoutframe .layout-1img-1blk.effect-xs .contents-img img {
-webkit-transition: all .5s ease-out;
transition: all .5s ease-out;
}
html[data-scroll-dir-y="1"] .product-features__layoutframe .layout-1img-1blk.effect-xs .contents-img[data-scroll="out"] img {
opacity: 0;
}
.product-features__layoutframe .layout-1img-1blk.effect-xs .contents-img img[data-lazy-observed]:not([data-lazy-loaded="true"]) {
opacity: 0;
}
html[data-scroll-dir-y="1"] .product-features__layoutframe .layout-1img-1blk.effect-xs:not(.reverse) .contents-img[data-scroll="out"] img {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
.product-features__layoutframe .layout-1img-1blk.effect-xs:not(.reverse) .contents-img img[data-lazy-observed]:not([data-lazy-loaded="true"]) {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
html[data-scroll-dir-y="1"] .product-features__layoutframe .layout-1img-1blk.effect-xs.reverse .contents-img[data-scroll="out"] img {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
.product-features__layoutframe .layout-1img-1blk.effect-xs.reverse .contents-img img[data-lazy-observed]:not([data-lazy-loaded="true"]) {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
.product-features__layoutframe .layout-1table-1blk {
flex-direction: column-reverse;
}
.product-features__layoutframe .layout-mltpimg.effect-xs .contents-img img {
-webkit-transition: all .5s ease-out;
transition: all .5s ease-out;
}
html[data-scroll-dir-y="1"] .product-features__layoutframe .layout-mltpimg.effect-xs .contents-img[data-scroll="out"] img {
opacity: 0;
}
.product-features__layoutframe .layout-mltpimg.effect-xs .contents-img img[data-lazy-observed]:not([data-lazy-loaded="true"]) {
opacity: 0;
}
html[data-scroll-dir-y="1"] .product-features__layoutframe .layout-mltpimg.effect-xs .contents-multiple__item:nth-child(2n+1) .contents-img[data-scroll="out"] img {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
.product-features__layoutframe .layout-mltpimg.effect-xs .contents-multiple__item:nth-child(2n+1) .contents-img img[data-lazy-observed]:not([data-lazy-loaded="true"]) {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
html[data-scroll-dir-y="1"] .product-features__layoutframe .layout-mltpimg.effect-xs .contents-multiple__item:nth-child(2n) .contents-img[data-scroll="out"] img {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
.product-features__layoutframe .layout-mltpimg.effect-xs .contents-multiple__item:nth-child(2n) .contents-img img[data-lazy-observed]:not([data-lazy-loaded="true"]) {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
.product-features__layoutframe .layout-1fwimg-w-text .contents-block__title-body-btn {
margin-top: 24px;
order: 1;
}
.product-features__layoutframe .layout-1fwimg-w-text .contents-block__badges {
margin-top: 24px;
}
.style-light .product-features__layoutframe .layout-2img-2blk-w-tab {
background-color: var(--slgray);
}
.product-features__layoutframe .layout-carousel .contents-block__in {
padding: 24px 10px;
}
.product-features__layoutframe .layout-accordion .contents-img {
margin-bottom: 24px;
}
}
/************************** product-support *****************************/
.product-support {
background-color: #D2D2D2;
}
.product-support a:not(.btnstyle) {
font-weight: bold;
text-decoration: underline;
}
.product-support a:not(.btnstyle):hover {
text-decoration: none;
}
.product-support__btn {
text-transform: uppercase;
text-align: center;
}
.product-support__links__title {
padding-bottom: 16px;
margin-bottom: 16px;
border-bottom: 1px solid var(--lgray);
}
.product-support__links__list .item-pdf, .product-support__links__list .item-download {
display: flex;
flex-direction: column;
}
.product-support__links__list .item-pdf .label-txt, .product-support__links__list .item-download .label-txt {
margin-bottom: 8px;
}
.product-support__links__list .item-pdf {
background: url("/etc/designs/panasonic/common-clientlibs/images/icn-pdf-large.png") no-repeat;
background-position: left top;
padding-left: 42px;
}
.product-support__etc__link {
text-align: center;
}
.product-support__etc__link img {
vertical-align: middle;
margin-left: 10px;
}
@media (min-width: 641px), (min-device-width: 1281px) {
.product-support__title {
text-align: center;
}
.product-support__widget {
margin-top: 32px;
display: flex;
justify-content: center;
}
.product-support__btn {
margin-top: 32px;
}
.product-support__links {
margin-top: 64px;
}
.product-support__links__list__item:not(:first-child) {
margin-top: 32px;
}
.product-support__etc {
margin-top: 64px;
}
.product-support__etc__note {
margin-top: 32px;
text-align: center;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.product-support__widget {
margin-top: 24px;
}
.product-support__btn {
margin-top: 24px;
}
.product-support__links__col {
margin-top: 48px;
}
.product-support__links__list__item:not(:first-child) {
margin-top: 24px;
}
.product-support__etc {
margin-top: 48px;
}
.product-support__etc__note {
margin-top: 24px;
}
}
.product-support .KnowledgeSyndication .rn_SearchArea {
display: flex;
height: 48px;
padding: 0;
}
.product-support .KnowledgeSyndication .rn_SearchArea input[type="text"], .product-support .KnowledgeSyndication .rn_SearchArea input[type="button"] {
-webkit-appearance: none;
appearance: none;
border: none;
padding: 0;
margin: 0;
box-sizing: border-box;
background: #fff;
width: 100%;
height: 100%;
}
.product-support .KnowledgeSyndication .rn_SearchArea input[type="text"] {
padding: 10px;
font-size: 16px;
}
.product-support .KnowledgeSyndication .rn_SearchArea .rn_SearchBox {
flex-grow: 1;
height: 100%;
}
.product-support .KnowledgeSyndication .rn_SearchArea .rn_SearchButton {
flex-shrink: 0;
width: 48px;
height: 48px;
position: relative;
}
.product-support .KnowledgeSyndication .rn_SearchArea .rn_SearchButton input[type="button"] {
cursor: pointer;
}
.product-support .KnowledgeSyndication .rn_SearchArea .rn_SearchButton:hover {
opacity: .75;
}
.product-support .KnowledgeSyndication .rn_SearchArea .rn_SearchButton::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPGRlZnM+CiAgICA8Y2xpcFBhdGggaWQ9ImNsaXAtcGF0aCI+CiAgICAgIDxyZWN0IHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgZmlsbD0ibm9uZSIvPgogICAgPC9jbGlwUGF0aD4KICA8L2RlZnM+CiAgPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAtcGF0aCkiPgogICAgPHJlY3Qgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4IiByeD0iMiIgZmlsbD0ibm9uZSIvPgogICAgPGcgaWQ9Inpvb20taW4iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDkgOSkiPgogICAgICA8Y2lyY2xlIGN4PSIxMSIgY3k9IjExIiByPSIxMSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMyAzKSIgc3Ryb2tlLXdpZHRoPSIxIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgZmlsbD0ibm9uZSIvPgogICAgICA8bGluZSB4MT0iNC4zNSIgeTE9IjQuMzUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIyLjY1IDIyLjY1KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNDg0ODQ4IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMSIvPgogICAgPC9nPgogIDwvZz4KPC9zdmc+);
position: absolute;
width: 48px;
height: 48px;
top: 0;
left: 0;
background-color: #fff;
pointer-events: none;
}
.product-support div.rn_Corrections, .product-support div.rn_Suggestions, .product-support div.rn_Documents, .product-support div.rn_Content, .product-support div.rn_Navigation {
margin-top: 16px;
padding: 0;
}
.product-support div.rn_Corrections, .product-support div.rn_Suggestions, .product-support div.rn_Documents h3, .product-support div.rn_Documents .rn_List, .product-support div.rn_Content .rn_List {
font-size: 14.55px;
line-height: 1.65;
}
.product-support div.rn_Content .rn_List li.rn_Item span.rn_Title a {
font-weight: bold;
}
.product-support div.rn_Content .rn_List li.rn_Item span.rn_Title a:hover {
text-decoration: none;
}
.product-support div.rn_Navigation a {
font-size: 14.55px;
font-weight: normal;
line-height: 1.65;
}
.product-support div.rn_screen_reader_only {
left: -10000px;
}
@media (min-width: 641px), (min-device-width: 1281px) {
.KnowledgeSyndication {
width: 478px;
}
}
.support-lbox {
height: 100%;
overflow: hidden;
}
.support-lbox__in {
display: flex;
flex-direction: column;
align-items: center;
height: 100%;
}
.support-lbox__title, .support-lbox__content, .support-lbox__download {
min-height: 0%;
}
.support-lbox__title, .support-lbox__download {
flex-shrink: 0;
}
.support-lbox__title {
text-align: center;
}
.support-lbox__content {
overflow: auto;
}
.support-lbox__download {
text-align: center;
}
.support-lbox__download:not(.accepted) .support-lbox__download__btn {
visibility: hidden;
}
@media (min-width: 641px), (min-device-width: 1281px) {
.support-lbox__title, .support-lbox__content, .support-lbox__download {
width: 644px;
}
.support-lbox__title {
margin-bottom: 32px;
}
.support-lbox__content {
overflow: auto;
}
.support-lbox__download {
margin-top: 32px;
}
.support-lbox__download__btn {
margin-top: 16px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.support-lbox__title, .support-lbox__content, .support-lbox__download {
width: 100%;
}
.support-lbox__title {
margin-bottom: 24px;
}
.support-lbox__download {
margin-top: 24px;
}
.support-lbox__download__btn {
margin-top: 24px;
}
}
/************************** image-text-products *****************************/
.image-text-products img {
max-width: 100%;
}
.image-text-products__products[open] .image-text-products__products__btn .open-tx {
display: none;
}
.image-text-products__products:not([open]) .image-text-products__products__btn .close-tx {
display: none;
}
.image-text-products__products__btn {
padding-inline-end: 48px !important;
}
.image-text-products__products__btn::after {
width: 48px;
height: 48px;
position: absolute;
left: 0;
right: 0;
margin-inline: auto -1px;
}
.image-text-products__products__summary {
display: block;
}
.image-text-products__products__summary::-webkit-details-marker {
display: none;
}
.image-text-products__products__content {
overflow: hidden;
}
.image-text-products__products__content__in {
border-bottom: 1px solid #c1c1c1;
}
.style-dark .image-text-products__products__content__in {
border-bottom-color: #707070;
}
.image-text-products__products__content__item {
display: grid;
grid-template-columns: 145px auto;
grid-template-rows: auto auto 1fr;
gap: 16px 10px;
}
.image-text-products__products__content__item .item-image {
grid-column: 1 / 2;
grid-row: 1 / 4;
width: 145px;
}
.image-text-products__products__content__item .item-image img {
height: auto;
}
.image-text-products__products__content__item .item-name {
grid-column: 2 / 3;
grid-row: 1 / 2;
}
.image-text-products__products__content__item .item-description {
grid-column: 2 / 3;
grid-row: 2 / 3;
}
.image-text-products__products__content__item .item-btn {
grid-column: 2 / 3;
grid-row: 3 / 4;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.image-text-products {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto 1fr;
gap: 0 20px;
}
.image-text-products.reverse .image-text-products__image {
grid-column: 2 / 3;
}
.image-text-products__text__title {
margin-bottom: 32px;
}
.image-text-products__image {
grid-column: 1 / 2;
grid-row: 1 / 3;
}
.image-text-products__products {
display: contents;
}
.image-text-products__products[open] .image-text-products__products__btn::after {
transform: scaleY(-1);
}
.image-text-products__products__btn::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHBhdGggaWQ9ImNoZXZyb24tbGVmdCIgZD0iTTgsMjgsMTksMTcsOCw2SDgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQxIDExKSByb3RhdGUoOTApIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+Cjwvc3ZnPg==");
top: -1px;
}
.style-dark .image-text-products__products__btn::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHBhdGggaWQ9ImNoZXZyb24tbGVmdCIgZD0iTTgsMjgsMTksMTcsOCw2SDgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQxIDExKSByb3RhdGUoOTApIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+Cjwvc3ZnPg==");
}
.image-text-products__products__summary {
margin-top: 32px;
width: fit-content;
height: fit-content;
}
.image-text-products__products__content {
width: calc(200% + 20px);
}
.image-text-products__products__content__in {
padding-block: 32px;
display: flex;
flex-wrap: wrap;
gap: 32px 20px;
}
.image-text-products__products__content__item {
width: calc(50% - 10px);
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.image-text-products {
display: flex;
flex-direction: column;
row-gap: 24px;
}
.image-text-products__image {
order: -1;
}
.image-text-products__products {
--btn-color: var(--dgray);
--btn-border-color: var(--dgray);
--btn-open-bg: var(--dgray);
--btn-open-color: #fff;
margin-inline: -10px;
}
.style-dark .image-text-products__products {
--btn-color: var(--slgray);
--btn-border-color: var(--slgray);
--btn-open-bg: var(--slgray);
--btn-open-color: var(--dgray);
}
.image-text-products__products[open] .image-text-products__products__btn {
background-color: var(--btn-open-bg);
color: var(--btn-open-color);
}
.image-text-products__products[open] .image-text-products__products__btn:hover {
background-color: var(--btn-open-bg);
color: var(--btn-open-color);
}
.image-text-products__products[open] .image-text-products__products__btn::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDIzKSIgZmlsbD0iI2ZmZiIvPgo8L3N2Zz4=");
}
.style-dark .image-text-products__products[open] .image-text-products__products__btn::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij4KICA8cmVjdCB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIGZpbGw9IiM0ODQ4NDgiIG9wYWNpdHk9IjAiLz4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMzI0IC0xNDApIj4KICAgIDxyZWN0IHdpZHRoPSIxNiIgaGVpZ2h0PSIyIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzNDAgMTYzKSIgZmlsbD0iIzQ4NDg0OCIvPgogICAgPHJlY3Qgd2lkdGg9IjIiIGhlaWdodD0iMTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDM0NyAxNTYpIiBmaWxsPSJub25lIi8+CiAgPC9nPgo8L3N2Zz4=");
}
.image-text-products__products:not([open]) .image-text-products__products__btn {
background-color: transparent;
color: var(--btn-color);
border-block-color: var(--btn-border-color);
}
.image-text-products__products:not([open]) .image-text-products__products__btn:hover {
background-color: transparent;
color: var(--btn-color);
}
.image-text-products__products:not([open]) .image-text-products__products__btn::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE2IDIzKSIgZmlsbD0iIzQ4NDg0OCIvPgogIDxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjE2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyMyAxNikiIGZpbGw9IiM0ODQ4NDgiLz4KPC9zdmc+");
}
.style-dark .image-text-products__products:not([open]) .image-text-products__products__btn::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij4KICA8cmVjdCB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIGZpbGw9IiNlZmVmZWYiIG9wYWNpdHk9IjAiLz4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMzI0IC0xNDApIj4KICAgIDxyZWN0IHdpZHRoPSIxNiIgaGVpZ2h0PSIyIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzNDAgMTYzKSIgZmlsbD0iI2VmZWZlZiIvPgogICAgPHJlY3Qgd2lkdGg9IjIiIGhlaWdodD0iMTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDM0NyAxNTYpIiBmaWxsPSIjZWZlZmVmIi8+CiAgPC9nPgo8L3N2Zz4=");
}
.image-text-products__products__btn {
border-radius: 0;
height: 56px;
padding-inline-start: 10px;
}
.image-text-products__products__btn::after {
top: 0;
bottom: 0;
margin-block: auto;
}
.image-text-products__products__btn .btnstyle__text {
margin-inline-end: auto;
}
.image-text-products__products__content__in {
padding: 24px 10px;
display: flex;
flex-direction: column;
row-gap: 24px;
}
.image-text-products__products__content__item .item-btn .btnstyle {
display: inline-flex;
width: auto;
padding-inline: 20px;
}
}
@media (hover: none) {
.image-text-products__products___btn.btnstyle:hover.color-gr {
background-color: var(--dgray);
}
}
.extended-size .subheader1 {
font-size: 22px;
line-height: 31px;
}
.extended-size .subheader2 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 19.2px;
line-height: 27px;
}
.extended-size .body_copyL {
font-size: 16px;
line-height: 26.4px;
}
.extended-size .body_copy1 {
font-size: 14.55px;
line-height: 24px;
}
.extended-size .body_copy2 {
font-size: 12px;
line-height: 20px;
}
.extended-size .bodycopyL {
font-size: 16px;
line-height: 26.4px;
}
.extended-size .bodycopy1 {
font-size: 14.55px;
line-height: 24px;
}
.extended-size .bodycopy2 {
font-size: 12.12px;
line-height: 20px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.extended-size .header1-l {
font-size: 44.8px;
line-height: 63px;
}
.extended-size .header1 {
font-size: 32px;
line-height: 45px;
}
.extended-size .header2 {
font-size: 28px;
line-height: 40px;
}
.extended-size .header3 {
font-size: 25px;
line-height: 35px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.extended-size .header1-l {
font-size: 32px;
line-height: 45px;
}
.extended-size .header1 {
font-size: 25.6px;
line-height: 36px;
}
.extended-size .header2 {
font-size: 22px;
line-height: 31px;
}
.extended-size .header3 {
font-size: 22px;
line-height: 31px;
}
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .articlesection > section.extended-size, #learncontent-contents .freeimage > section.extended-size {
padding-top: 64px;
padding-bottom: 64px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .articlesection > section.extended-size, #learncontent-contents .freeimage > section.extended-size {
padding-top: 48px;
padding-bottom: 48px;
}
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .extended-size .sparateline {
margin: 64px auto 16px;
}
#learncontent-contents .sparateline.extended-size {
margin: 64px auto 16px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .extended-size .sparateline {
margin: 48px auto 16px;
}
#learncontent-contents .sparateline.extended-size {
margin: 48px auto 16px;
}
}
#learncontent-contents .extended-size .spacer:not(.medium):not(.tall) {
height: 16px;
}
#learncontent-contents .spacer.extended-size:not(.medium):not(.tall) {
height: 16px;
}
#learncontent-contents .extended-size .text.parbase.section, #learncontent-contents .extended-size .richtext.section {
font-size: 14.55px;
line-height: 1.65;
}
#learncontent-contents .extended-size .text.parbase.section p, #learncontent-contents .extended-size .text.parbase.section ul, #learncontent-contents .extended-size .text.parbase.section ol, #learncontent-contents .extended-size .text.parbase.section > div, #learncontent-contents .extended-size .richtext.section p, #learncontent-contents .extended-size .richtext.section ul, #learncontent-contents .extended-size .richtext.section ol, #learncontent-contents .extended-size .richtext.section > div {
margin-top: 16px;
}
#learncontent-contents .extended-size .text.parbase.section .notice, #learncontent-contents .extended-size .richtext.section .notice {
font-size: 19.2px;
line-height: 27px;
padding: 16px 10px;
}
#learncontent-contents .text.parbase.section:first-child > :first-child,
#learncontent-contents .richtext.section:first-child > :first-child {
margin-top: 0;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.extended-size .titleText_in .text.parbase.section:not(:empty):not(:first-child) {
margin-top: 32px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
extended-size .titleText_in .text.parbase.section:not(:empty):not(:first-child) {
margin-top: 24px;
}
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .extended-size .textimage .text.parbase.section:not(:empty):not(:first-child) {
margin-top: 32px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .extended-size .textimage .text.parbase.section:not(:empty):not(:first-child) {
margin-top: 24px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .extended-size .imagetext_column {
display: flex;
flex-direction: column;
}
#learncontent-contents .extended-size .imagetext_column .l, #learncontent-contents .extended-size .imagetext_column .r {
width: 100% !important;
}
#learncontent-contents .extended-size .imagetext_column .image {
order: -1;
margin-bottom: 24px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .extended-size .parsys_column > .col {
width: auto !important;
float: none !important;
margin-bottom: 0;
margin-left: 0 !important;
margin-right: 0 !important;
}
#learncontent-contents .extended-size .parsys_column > .col:not(:first-child) {
margin-top: 48px;
}
}
#learncontent-contents .extended-size .category-anchorlinks__item__title {
font-size: 19.2px;
line-height: 27px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .extended-size .category-anchorlinks__item__title {
min-height: 84px;
}
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.addthissection-in.extended-size {
padding-top: 64px;
padding-bottom: 64px;
}
.addthissection-in.extended-size .addthissection__title {
padding-bottom: 32px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.addthissection-in.extended-size {
padding-top: 48px;
padding-bottom: 48px;
}
.addthissection-in.extended-size .addthissection__title {
padding-bottom: 24px;
}
}
.extended-size .product-box-in .product-copy .productname {
font-size: 19.2px;
line-height: 27px;
margin-bottom: 16px;
}
.extended-size .product-box-in .product-copy p.caption {
font-size: 14.55px;
line-height: 24px;
}
.extended-size .product-box-in .product-copy__colors {
margin-top: 32px;
}
.extended-size .product-box-in .product-colors__title, .extended-size .product-box-in .product-colors__list__item .color-label {
font-size: 14.55px;
}
.extended-size .product-box-in .product-price {
margin-top: 32px;
font-size: 19.2px;
}
.extended-size .product-box-in .product-price:not(.series-price) .price-nu {
font-size: 32px;
}
.extended-size .product-box-in .product-price .prefix, .extended-size .product-box-in .product-price .del-price {
font-size: 19.2px;
margin-bottom: 16px;
}
.extended-size .product-box-in .product-price .out-of-stock {
font-size: 14.55px;
}
.extended-size .product-box-in .buy-btn {
margin-left: 10px;
margin-right: 10px;
margin-top: 32px;
}
.extended-size .product-box-in .buy-btn + .buy-btn {
margin-top: 16px;
}
.extended-size .product-box-in .buy-btn .btn-blue, .extended-size .product-box-in .buy-btn .btn-white {
height: 48px;
display: flex;
align-items: center;
justify-content: center;
}
.extended-size .product-box-in .buy-btn .btn-blue span, .extended-size .product-box-in .buy-btn .btn-white span {
font-size: 19.2px;
}
.extended-size .product-box-in > .product-energy {
padding-top: 16px;
}
.extended-size .product-box-in > .product-energy .notes {
padding-top: 16px;
}
.extended-size .product-box-in .product-other-info {
padding-top: 16px;
}
.extended-size .product-box-in .notes {
padding-top: 6px;
font-size: 12.12px;
line-height: 20px;
}
.extended-size .product-box-in .product-image-label > span {
font-size: 12.12px;
font-weight: normal;
}
.extended-size .product-box::after, .extended-size .product-box::before {
display: none;
}
.extended-size .product-box:hover .product-box-in {
background-image: none;
background-color: #fff;
}
.extended-size .product-box-in {
background: #fff;
border: 1px solid #E5E5E5;
}
.extended-size .product-box-in .product-copy {
padding-top: 16px;
}
.extended-size .product-box-in .product-image-label {
top: 0px;
left: 0;
padding: 5px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.extended-size .product-box-in {
padding-bottom: 32px;
}
.extended-size .product-box-in .product-image {
margin-top: 32px;
}
.extended-size .product-box-in .product-price .out-of-stock {
margin-top: 32px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.extended-size .product-box {
width: 100%;
}
.extended-size .product-box-in {
-webkit-box-shadow: none;
box-shadow: none;
padding-bottom: 24px;
}
.extended-size .product-box-in .product-image {
margin-top: 32px;
}
.extended-size .product-box-in .product-price .out-of-stock {
margin-top: 24px;
}
.extended-size .product-box-in .product-energy img {
height: 26px;
}
.extended-size .product-box-in .repairability-index img {
height: 41px;
}
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .recommended-products-list.extended-size {
padding: 64px 0;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .recommended-products-list.extended-size {
padding: 48px 0;
}
#learncontent-contents .recommended-products-list.extended-size .products-block {
margin-left: 0;
margin-right: 0;
margin-top: -24px;
}
#learncontent-contents .recommended-products-list.extended-size .products-block .product-box {
margin: 24px 0 0;
}
}
#products-list.extended-size .products-seeall a, #products-list.extended-size .products-seeall button {
min-width: 164px;
height: 48px;
background: none;
border: none;
font-size: 19.2px;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
color: #484848;
text-decoration: underline;
justify-content: center;
align-items: center;
}
#products-list.extended-size .products-seeall a::after, #products-list.extended-size .products-seeall button::after {
display: none;
}
#products-list.extended-size .products-seeall a span, #products-list.extended-size .products-seeall button span {
font-size: inherit;
color: inherit;
text-decoration: inherit;
line-height: 1;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#products-list.extended-size {
padding-top: 64px;
padding-bottom: 64px;
}
#products-list.extended-size h3, #products-list.extended-size .products-list__title {
padding-bottom: 32px;
}
#products-list.extended-size h3.header1, #products-list.extended-size .products-list__title.header1 {
padding-top: 0;
}
#products-list.extended-size .products-block {
margin-top: -20px;
}
#products-list.extended-size .products-seeall {
margin-top: 32px;
}
#products-list.extended-size .products-seeall a, #products-list.extended-size .products-seeall button {
display: inline-flex;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#products-list.extended-size {
padding-top: 48px;
padding-bottom: 48px;
}
#products-list.extended-size h3, #products-list.extended-size .products-list__title {
padding-bottom: 24px;
}
#products-list.extended-size .products-block {
margin-left: 0;
margin-right: 0;
margin-top: -24px;
}
#products-list.extended-size .products-block .product-box {
margin: 24px 0 0;
}
#products-list.extended-size .products-seeall {
margin-top: 24px;
}
#products-list.extended-size .products-seeall a, #products-list.extended-size .products-seeall button {
display: flex;
}
}
#learncontent-contents .categorylink.extended-size .categorylink__seeall__link, #learncontent-contents .categorylink.extended-size .categorylist__seeall__link, #learncontent-contents .categorylist.extended-size .categorylink__seeall__link, #learncontent-contents .categorylist.extended-size .categorylist__seeall__link {
height: 48px;
justify-content: center;
align-items: center;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
color: #fff !important;
font-size: 19.2px;
line-height: 1.4;
background-color: #484848;
border-radius: 2px;
transition: background-color .15s ease-in-out, color .15s ease-in-out;
box-sizing: border-box;
cursor: pointer;
position: relative;
border: 1px solid transparent;
}
#learncontent-contents .categorylink.extended-size .categorylink__seeall__link:hover, #learncontent-contents .categorylink.extended-size .categorylist__seeall__link:hover, #learncontent-contents .categorylist.extended-size .categorylink__seeall__link:hover, #learncontent-contents .categorylist.extended-size .categorylist__seeall__link:hover {
background-color: #222;
color: #efefef !important;
}
#learncontent-contents .categorylink.extended-size .categorylink__seeall__link .icn img, #learncontent-contents .categorylink.extended-size .categorylist__seeall__link .icn img, #learncontent-contents .categorylist.extended-size .categorylink__seeall__link .icn img, #learncontent-contents .categorylist.extended-size .categorylist__seeall__link .icn img {
filter: brightness(0) invert(1);
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .categorylink.extended-size, #learncontent-contents .categorylist.extended-size {
padding: 64px 0;
}
#learncontent-contents .categorylink.extended-size .categorylink__title, #learncontent-contents .categorylink.extended-size .categorylist__title, #learncontent-contents .categorylist.extended-size .categorylink__title, #learncontent-contents .categorylist.extended-size .categorylist__title {
margin-bottom: 64px;
}
#learncontent-contents .categorylink.extended-size .categorylink__seeall-in, #learncontent-contents .categorylink.extended-size .categorylist__seeall-in, #learncontent-contents .categorylist.extended-size .categorylink__seeall-in, #learncontent-contents .categorylist.extended-size .categorylist__seeall-in {
margin-top: 32px;
}
#learncontent-contents .categorylink.extended-size .categorylink__seeall__link, #learncontent-contents .categorylink.extended-size .categorylist__seeall__link, #learncontent-contents .categorylist.extended-size .categorylink__seeall__link, #learncontent-contents .categorylist.extended-size .categorylist__seeall__link {
display: inline-flex;
padding: 0 20px;
min-width: 146px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .categorylink.extended-size, #learncontent-contents .categorylist.extended-size {
padding: 48px 0;
}
#learncontent-contents .categorylink.extended-size .icn img, #learncontent-contents .categorylist.extended-size .icn img {
height: auto;
width: auto;
}
#learncontent-contents .categorylink.extended-size .categorylink__title, #learncontent-contents .categorylink.extended-size .categorylist__title, #learncontent-contents .categorylist.extended-size .categorylink__title, #learncontent-contents .categorylist.extended-size .categorylist__title {
margin-bottom: 48px;
padding: 0;
}
#learncontent-contents .categorylink.extended-size .categorylink__seeall, #learncontent-contents .categorylink.extended-size .categorylist__seeall, #learncontent-contents .categorylist.extended-size .categorylink__seeall, #learncontent-contents .categorylist.extended-size .categorylist__seeall {
padding: 0 10px;
}
#learncontent-contents .categorylink.extended-size .categorylink__seeall-in, #learncontent-contents .categorylink.extended-size .categorylist__seeall-in, #learncontent-contents .categorylist.extended-size .categorylink__seeall-in, #learncontent-contents .categorylist.extended-size .categorylist__seeall-in {
margin-top: 24px;
}
#learncontent-contents .categorylink.extended-size .categorylink__seeall__link, #learncontent-contents .categorylink.extended-size .categorylist__seeall__link, #learncontent-contents .categorylist.extended-size .categorylink__seeall__link, #learncontent-contents .categorylist.extended-size .categorylist__seeall__link {
display: flex;
padding: 0 20px;
}
}
#learncontent-contents .categorylink.extended-size .categorylink__parentitem-label {
font-family: inherit !important;
font-size: 14.55px;
line-height: 24px;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__top-label {
font-size: 19.2px;
line-height: 27px;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__top-description {
font-size: 14.55px;
line-height: 24px;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__item-label {
font-size: 14.55px;
line-height: 24px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .categorylink.extended-size .categorylink__content {
padding-bottom: 306px;
}
#learncontent-contents .categorylink.extended-size .categorylink__content::before {
height: 306px;
}
#learncontent-contents .categorylink.extended-size .categorylink__content::after {
bottom: calc(306px - 8px);
}
#learncontent-contents .categorylink.extended-size .categorylink__parentlist {
display: flex;
justify-content: center;
}
#learncontent-contents .categorylink.extended-size .categorylink__parentitem {
height: 100%;
}
#learncontent-contents .categorylink.extended-size .categorylink__parentitem-in {
height: 100%;
display: flex;
flex-direction: column;
}
#learncontent-contents .categorylink.extended-size .categorylink__parentitem-label {
flex-grow: 1;
height: auto;
}
#learncontent-contents .categorylink.extended-size .categorylink__child {
height: 306px;
padding: 32px 0;
}
#learncontent-contents .categorylink.extended-size .categorylink__child-in {
height: 100%;
display: flex;
align-items: center;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__top {
height: 242px;
width: 179px;
flex-shrink: 0;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__top a {
height: 100%;
overflow: hidden;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__top-label {
height: auto;
margin-top: 16px;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__top-description {
margin-top: 16px;
max-height: none;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__list {
display: flex;
flex-wrap: wrap;
align-items: center;
margin-left: 0;
max-width: none;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__list__li {
width: 179px;
margin-left: 20px;
margin-top: 16px;
margin-bottom: 16px;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__item-in {
display: flex;
align-items: center;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__item-img {
padding: 0;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__item-label {
margin-left: 12px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .categorylink.extended-size .categorylink__parentitem-img {
margin-bottom: 16px;
}
#learncontent-contents .categorylink.extended-size .categorylink__parentitem-label {
height: 51px;
overflow: hidden;
margin-bottom: 8px;
}
#learncontent-contents .categorylink.extended-size .categorylink__child-in {
padding: 16px 10px;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__top-label_description {
padding: 16px 10px;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__top-description {
max-height: none;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__list {
margin-top: 0;
margin-left: -10px;
margin-right: -10px;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__list__li {
width: calc(50% - 20px);
-webkit-flex-shrink: 0;
flex-shrink: 0;
margin: 16px 10px 0;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__item {
height: 100%;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__item a {
height: 100%;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__item-in {
padding: 16px 10px;
box-sizing: border-box;
height: 100%;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__item-img {
margin-bottom: 16px;
}
#learncontent-contents .categorylink.extended-size .categorylink__child__item-label {
height: auto;
}
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .categorylist.extended-size .categorylist__item.parent {
padding-bottom: 16px;
}
#learncontent-contents .categorylist.extended-size .categorylist__item.parent .categorylist__item-label-sub {
margin-top: 16px;
font-size: 14.55px;
line-height: 24px;
height: 48px;
}
#learncontent-contents .categorylist.extended-size .categorylist__item.parent .categorylist__item-label-main {
font-size: 19.2px;
line-height: 27px;
height: 54px;
}
#learncontent-contents .categorylist.extended-size .categorylist__item.parent .categorylist__item-img {
margin-bottom: 16px;
}
#learncontent-contents .categorylist.extended-size .categorylist__item.parent + .categorylist__list {
margin-top: 16px;
}
#learncontent-contents .categorylist.extended-size .categorylist__item.child {
margin-top: 16px;
}
#learncontent-contents .categorylist.extended-size .categorylist__item.child .categorylist__item-label-main {
font-size: 14.55px;
line-height: 24px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .categorylist.extended-size .categorylist__item.parent .categorylist__item-label-main {
font-family: inherit !important;
font-size: 14.55px;
line-height: 24px;
}
#learncontent-contents .categorylist.extended-size .categorylist__item.child .categorylist__item-label-main {
font-size: 14.55px;
line-height: 24px;
}
}
#learncontent-contents .extended-size .applycheckboxbutton {
text-align: initial;
}
#learncontent-contents .extended-size .applycheckboxbutton .checkbox {
margin: 0 auto;
display: flex;
align-items: center;
width: -webkit-fit-content;
width: fit-content;
position: relative;
}
#learncontent-contents .extended-size .applycheckboxbutton .checkbox input {
width: 24px;
height: 24px;
margin: 12px;
flex-shrink: 0;
}
#learncontent-contents .extended-size .applycheckboxbutton .checkbox label {
margin-left: 0;
text-decoration: underline;
display: inline-flex;
align-items: center;
}
#learncontent-contents .extended-size .applycheckboxbutton .checkbox label::before {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICA8ZyBpZD0i6ZW35pa55b2iXzE0OTciIGRhdGEtbmFtZT0i6ZW35pa55b2iIDE0OTciIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzQ4NDg0OCIgc3Ryb2tlLXdpZHRoPSIxIj4KICAgIDxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgcng9IjIiIHN0cm9rZT0ibm9uZSIvPgogICAgPHJlY3QgeD0iMC41IiB5PSIwLjUiIHdpZHRoPSIyMyIgaGVpZ2h0PSIyMyIgcng9IjEuNSIgZmlsbD0ibm9uZSIvPgogIDwvZz4KPC9zdmc+");
background-color: #fff;
display: block;
width: 24px;
height: 24px;
position: absolute;
top: 12px;
left: 12px;
}
#learncontent-contents .extended-size .applycheckboxbutton .checkbox input:checked + label::before {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICA8ZyBpZD0i6ZW35pa55b2iXzE0OTciIGRhdGEtbmFtZT0i6ZW35pa55b2iIDE0OTciIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzQ4NDg0OCIgc3Ryb2tlLXdpZHRoPSIxIj4KICAgIDxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgcng9IjIiIHN0cm9rZT0ibm9uZSIvPgogICAgPHJlY3QgeD0iMC41IiB5PSIwLjUiIHdpZHRoPSIyMyIgaGVpZ2h0PSIyMyIgcng9IjEuNSIgZmlsbD0ibm9uZSIvPgogIDwvZz4KICA8cGF0aCBpZD0iY2hlY2siIGQ9Ik0xNyw3LDguMzc1LDE2LDQsMTEuNDU1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxLjUgMC41KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNDg0ODQ4IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMSIvPgo8L3N2Zz4=");
}
#learncontent-contents .extended-size .applycheckboxbutton .button a {
display: flex;
align-items: center;
justify-content: center;
height: 48px;
font-size: 19.2px;
line-height: 27px;
border: 1px solid;
border-radius: 2px;
padding: 0 20px;
}
#learncontent-contents .extended-size .applycheckboxbutton .button.disabled a {
color: #484848;
border-color: #484848;
background-color: #fff;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .extended-size .applycheckboxbutton .button {
margin-top: 32px;
}
#learncontent-contents .extended-size .applycheckboxbutton .button a {
width: -webkit-fit-content;
width: fit-content;
margin: 0 auto;
min-width: 146px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .extended-size .applycheckboxbutton .button {
margin-top: 24px;
}
}
#learncontent-contents .extended-size .category-products-column .category-products .btn-area > a {
display: flex;
justify-content: center;
align-items: center;
height: 48px;
border: 1px solid transparent;
border-radius: 2px;
background: none;
box-shadow: none;
background-color: #484848;
color: #fff;
padding: 0 20px;
transition: background-color .15s ease-in-out, color .15s ease-in-out;
}
.style-dark #learncontent-contents .extended-size .category-products-column .category-products .btn-area > a {
background-color: #efefef;
color: #484848;
}
.style-dark #learncontent-contents .extended-size .category-products-column .category-products .btn-area > a:hover {
background-color: #c1c1c1;
color: #484848;
}
#learncontent-contents .extended-size .category-products-column .category-products .btn-area > a > span {
color: inherit;
font-size: 19.2px;
line-height: 27px;
}
#learncontent-contents .extended-size .category-products-column .category-products .btn-area > a:hover {
background-color: #222;
color: #efefef;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .extended-size .category-products-column .category-products .btn-area > a {
width: -webkit-fit-content;
width: fit-content;
min-width: 146px;
margin: 32px auto;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .extended-size .category-products-column .category-products .btn-area > a {
margin-top: 24px;
}
}
.product-support a:not(.btnstyle) {
color: inherit;
}
.supportsection .support_bg.extended-size .sectionContents {
padding-top: 0;
}
.supportsection .extended-size .support-title .header1, .supportsection .extended-size .support-title .header3 {
line-height: 1.4;
}
.supportsection .extended-size .support-title h2 {
display: flex;
align-items: center;
justify-content: center;
}
.supportsection .extended-size .support-btn a {
box-sizing: border-box;
background-image: none;
align-items: center;
justify-content: center;
background-color: #484848;
color: #fff;
margin: 0;
min-height: 48px;
border-radius: 2px;
transition: background-color .15s ease-in-out, color .15s ease-in-out;
}
.supportsection .extended-size .support-btn a::after, .supportsection .extended-size .support-btn a::before {
display: none;
}
.supportsection .extended-size .support-btn a:hover {
background-color: #222;
color: #efefef;
}
.supportsection .extended-size .support-btn a span {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 19.2px;
line-height: 1.4;
color: inherit;
}
.supportsection .extended-size .support-content .col a {
color: inherit !important;
text-decoration: underline;
}
.supportsection .extended-size .support-content .col a:hover {
text-decoration: none;
}
.supportsection .extended-size .support-content .col dt {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 19.2px;
line-height: 1.4;
padding-bottom: 16px;
margin-bottom: 16px;
border-bottom: 1px solid #C1C1C1;
}
.supportsection .extended-size .support-content .col dt + dd {
margin-top: 0 !important;
}
.supportsection .extended-size .support-content .col dd {
font-size: 14.55px;
line-height: 1.65;
}
.supportsection .extended-size .support-content .col dd.pdf {
background-position: top left;
background-size: auto;
padding-left: 42px;
}
.supportsection .extended-size .support-content .col dd a:not(:first-child) {
display: inline-block;
margin-top: 8px;
}
.supportsection .extended-size .fitch a {
color: inherit !important;
text-decoration: underline;
}
.supportsection .extended-size .fitch a:hover {
text-decoration: none;
}
.supportsection .extended-size .fitch a img {
vertical-align: middle !important;
margin-left: 10px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.supportsection .extended-size.support_bg .sectionContents {
padding-bottom: 64px;
}
.supportsection .extended-size .support-title .header1 {
font-size: 44.8px;
}
.supportsection .extended-size .support-title .header3 {
font-size: 32px;
}
.supportsection .extended-size .support-title h2 {
height: 184px;
}
.supportsection .extended-size .support-title h3 {
margin-top: 64px;
}
.supportsection .extended-size .support-btn {
margin-top: 32px;
}
.supportsection .extended-size .support-btn a {
display: inline-flex;
padding: 0 20px;
min-width: 146px;
}
.supportsection .extended-size .support-content .col dd + dd {
margin-top: 32px !important;
}
.supportsection .extended-size .fitch {
margin-top: 64px;
}
.supportsection .extended-size .fitch + .support-notes {
margin-top: 32px;
}
.supportsection .extended-size .support-notes {
margin-top: 64px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.supportsection .extended-size.support_bg .sectionContents {
padding-bottom: 48px;
}
.supportsection .extended-size .support-title {
padding-left: 10px;
padding-right: 10px;
}
.supportsection .extended-size .support-title .header1 {
font-size: 32px;
}
.supportsection .extended-size .support-title .header3 {
font-size: 25.6px;
}
.supportsection .extended-size .support-title h2 {
height: 136px;
display: flex;
align-items: center;
justify-content: center;
}
.supportsection .extended-size .support-title h3 {
margin-top: 48px;
text-align: initial;
}
.supportsection .extended-size .support-btn {
margin-top: 24px;
}
.supportsection .extended-size .support-btn a {
display: flex;
}
.supportsection .extended-size .support-btn a span {
padding: 3px;
}
.supportsection .extended-size .support-content .col {
margin-top: 48px;
}
.supportsection .extended-size .support-content .col dd {
float: none !important;
width: auto;
}
.supportsection .extended-size .support-content .col dd + dd {
margin-top: 24px !important;
}
.supportsection .extended-size .fitch {
margin-top: 48px;
}
.supportsection .extended-size .fitch + .support-notes {
margin-top: 24px;
}
.supportsection .extended-size .support-notes {
margin-top: 48px;
}
}
.style-dark #learncontent-contents .product-support {
color: #1f1f1f;
}
.style-dark #learncontent-contents .product-support .btnstyle.color-gr {
background-color: #484848;
color: #fff;
}
:root {
--gap_l: 64px;
--gap_m: 32px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
:root {
--gap_l: 64px;
--gap_m: 32px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
:root {
--gap_l: 48px;
--gap_m: 24px;
}
}
.extended-size .customize-recipecheckbox {
--box-bg-color-checked: #484848;
--box-border-color: #484848;
width: 16px;
height: 16px;
}
.style-dark .extended-size .customize-recipecheckbox {
--box-bg-color-checked: #c1c1c1;
--box-border-color: #313131;
}
.extended-size .blogText__in .text.parbase.section:not(:empty):not(:first-child) {
margin-top: var(--gap_m);
}
.extended-size .tagscategories a > span, .extended-size .tagscategories .nolink > span {
font-size: 14.55px;
line-height: 16px;
}
.extended-size .tagscategories__container {
margin-top: -8px;
}
.extended-size .tagscategories__tags__list__item {
margin-top: 8px;
}
.extended-size .tagscategories__tags__list__item:not(:last-child) a::after, .extended-size .tagscategories__tags__list__item:not(:last-child) .nolink::after {
margin: 0 10px;
}
.extended-size .tagscategories__categories__list {
margin-top: -8px;
}
.extended-size .tagscategories__categories__list__item {
border-color: #484848;
margin-top: 8px;
}
.extended-size .tagscategories__categories__list__item a:hover {
background-color: #484848;
color: #fff !important;
}
.extended-size .tagscategories .tagscategories__tags + .tagscategories__categories {
margin-top: 16px;
}
.extended-size .cookingtime__container {
align-items: flex-start;
}
.extended-size .cookingtime__icon {
height: 26px;
}
.extended-size .cookingtime__text, .extended-size .cookingtime__difficulty {
font-size: 14.55px;
line-height: 24px;
}
.extended-size .cookingtime__text {
margin-top: -8px;
}
.extended-size .cookingtime__text__time, .extended-size .cookingtime__text__date, .extended-size .cookingtime__text__fw {
min-height: 26px;
display: inline-flex;
align-items: center;
margin-top: 8px;
}
.extended-size .cookingtime__difficulty {
min-height: 26px;
display: inline-flex;
align-items: center;
}
.extended-size .nutrition__title {
margin-bottom: 16px;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 19.2px;
line-height: 27px;
}
.extended-size .nutrition__list__item {
font-family: inherit !important;
}
.extended-size .nutrition__list__item__label {
font-size: 14.55px;
line-height: 24px;
}
.extended-size .nutrition__list__item__value {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
margin-top: 0;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.extended-size .nutrition__list__item__value {
font-size: 32px;
line-height: 45px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.extended-size .nutrition__list__item__value {
font-size: 25.6px;
line-height: 36px;
}
}
.extended-size .stepsofmaking__title {
margin-bottom: var(--gap_m);
}
.extended-size .stepsofmaking__content__in {
margin-top: calc(-1 * var(--gap_m));
}
.extended-size .stepsofmaking__content__item {
margin-top: var(--gap_m);
}
.extended-size .stepsofmaking__content__item__tx__label {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 19.2px;
line-height: 27px;
margin-bottom: 16px;
}
.extended-size .stepsofmaking__content__item__img {
margin-top: 16px;
}
.extended-size .ingredients__title {
margin-bottom: var(--gap_m);
}
.extended-size .ingredients__servings {
margin-top: 0;
margin-bottom: 16px;
}
.extended-size .ingredients__servings__label, .extended-size .ingredients__servings__count {
font-size: 19.2px;
line-height: 27px;
}
.extended-size .ingredients__content__block__title {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 19.2px;
line-height: 27px;
padding-bottom: 0;
margin-bottom: 16px;
}
.extended-size .ingredients__content__block__list {
font-size: 14.55px;
font-weight: normal;
line-height: 24px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.extended-size .ingredients__servings__label {
margin-right: 20px;
}
.extended-size .ingredients__servings__count {
margin: 0 20px;
}
.extended-size .ingredients__content__block__list__item {
padding: 8px 10px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.extended-size .ingredients__servings {
padding: 4px 10px;
}
.extended-size .ingredients__servings__btn {
width: 48px;
height: 48px;
border-radius: 2px !important;
background-color: #484848 !important;
}
.extended-size .ingredients__content__block {
margin-top: 24px;
}
}
.extended-size .relatedrecipes__title {
margin-bottom: var(--gap_l);
}
.extended-size .relatedrecipes__content__list__item .tagscategories {
margin-top: 16px;
}
.extended-size .relatedrecipes__content__list__item__txt__name, .extended-size .relatedrecipes__content__list__item__txt__description {
margin-top: 16px;
}
.extended-size .relatedrecipes__content__list__item__txt__name {
font-size: 19.2px;
line-height: 27px;
}
.extended-size .relatedrecipes__content__list__item__txt__description {
font-size: 14.55px;
line-height: 24px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.extended-size .relatedrecipes__content__list {
margin-top: calc(-1 * var(--gap_m));
}
.extended-size .relatedrecipes__content__list__item {
margin-top: var(--gap_m);
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.extended-size .relatedrecipes__title {
text-align: center;
}
.extended-size .relatedrecipes__content {
overflow: auto;
margin: 0 -10px;
padding-bottom: 16px;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
scroll-snap-type: x proximity;
}
.extended-size .relatedrecipes__content::-webkit-scrollbar {
height: 4px;
}
.extended-size .relatedrecipes__content::-webkit-scrollbar-track {
background-color: #EFEFEF;
}
.extended-size .relatedrecipes__content::-webkit-scrollbar-thumb {
background-color: #484848;
}
.extended-size .relatedrecipes__content__list {
flex-wrap: nowrap;
margin-top: 0;
margin-left: 0;
margin-right: 0;
}
.extended-size .relatedrecipes__content__list__item {
flex-shrink: 0;
margin-top: 0;
padding: 0 10px;
width: 229px;
scroll-snap-align: start;
}
}
.extended-size .recipequery__list {
margin-top: -8px;
}
.extended-size .recipequery__list__item {
margin-top: 8px;
}
.extended-size .recipequery__list__item:not(:last-child)::after {
margin: 0 10px;
}
.extended-size .recipelistcomplex-subheader1 {
font-family: inherit;
font-size: 14.55px;
line-height: 16px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.extended-size .recipelistcomplex-header1 {
font-size: 32px;
line-height: 45px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.extended-size .recipelistcomplex-header1 {
font-size: 25.6px;
line-height: 36px;
}
}
.extended-size .recipelist__title {
margin-bottom: var(--gap_m);
}
.extended-size .recipelist__content {
border-color: #C1C1C1;
}
.extended-size .recipelist__content__list__item {
border-color: #C1C1C1;
}
.extended-size .recipelist__content__list__item__in {
padding-top: 16px;
padding-bottom: 16px;
}
.extended-size .recipelist__content__list__item__title, .extended-size .recipelist__content__list__item__description {
margin-top: 16px;
}
.extended-size .recipelist__content__list__item__title {
font-size: 19.2px;
line-height: 27px;
}
.extended-size .recipelist__content__list__item__description {
font-size: 14.55px;
line-height: 24px;
}
.extended-size .recipelist__content__searchtips {
margin-top: var(--gap_m);
font-family: inherit;
font-weight: inherit;
}
.extended-size .recipelist__content__searchtips h2, .extended-size .recipelist__content__searchtips h3, .extended-size .recipelist__content__searchtips h4, .extended-size .recipelist__content__searchtips h5 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
font-size: 19.2px;
line-height: 27px;
}
.extended-size .recipelist__content__searchtips ul, .extended-size .recipelist__content__searchtips ol {
font-size: 14.55px;
line-height: 24px;
margin-top: 16px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.extended-size .recipelist__content__list__item__main {
width: 395px;
}
.extended-size .recipelist__content__list__item__image {
width: 229px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.extended-size .recipelist__content__list__item__image {
margin-bottom: 16px;
}
}
.recipepagination {
margin-top: var(--gap_l);
}
.recipepagination .recipepagination__prev__first .recipepagination__btn__box span::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzNC40MTQiIGhlaWdodD0iMzQuODI4IiB2aWV3Qm94PSIwIDAgMzQuNDE0IDM0LjgyOCI+CiAgPGcgaWQ9IlByZXYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMS40MTQpIj4KICAgIDxwYXRoIGlkPSJjaGV2cm9uLWxlZnQiIGQ9Ik0yNCwzOCw4LDIyLDI0LDZoMCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTggLTYpIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgPC9nPgogIDxnIGlkPSJQcmV2LTIiIGRhdGEtbmFtZT0iUHJldiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTcgMS40MTQpIj4KICAgIDxwYXRoIGlkPSJjaGV2cm9uLWxlZnQtMiIgZGF0YS1uYW1lPSJjaGV2cm9uLWxlZnQiIGQ9Ik0yNCwzOCw4LDIyLDI0LDZoMCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTggLTYpIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgPC9nPgo8L3N2Zz4K);
width: 18px;
height: 35px;
}
.recipepagination .recipepagination__prev__prev .recipepagination__btn__box span::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOC40MTQiIGhlaWdodD0iMzQuODI4IiB2aWV3Qm94PSIwIDAgMTguNDE0IDM0LjgyOCI+CiAgPGcgaWQ9IlByZXYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMS40MTQpIj4KICAgIDxwYXRoIGlkPSJjaGV2cm9uLWxlZnQiIGQ9Ik0yNCwzOCw4LDIyLDI0LDZoMCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTggLTYpIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgPC9nPgo8L3N2Zz4=);
width: 18px;
height: 35px;
}
.recipepagination .recipepagination__next__next .recipepagination__btn__box span::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOC40MTQiIGhlaWdodD0iMzQuODI4IiB2aWV3Qm94PSIwIDAgMTguNDE0IDM0LjgyOCI+CiAgPGcgaWQ9Ik5leHQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEuNDE0IDEuNDE0KSI+CiAgICA8cGF0aCBpZD0iY2hldnJvbi1sZWZ0IiBkPSJNOCwzOCwyNCwyMiw4LDZIOCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTggLTYpIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgPC9nPgo8L3N2Zz4=);
width: 18px;
height: 35px;
}
.recipepagination .recipepagination__next__last .recipepagination__btn__box span::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzNC40MTQiIGhlaWdodD0iMzQuODI4IiB2aWV3Qm94PSIwIDAgMzQuNDE0IDM0LjgyOCI+CiAgPGcgaWQ9IlByZXYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE3LjQxNCAzMy40MTQpIHJvdGF0ZSgxODApIj4KICAgIDxwYXRoIGlkPSJjaGV2cm9uLWxlZnQiIGQ9Ik0yNCwzOCw4LDIyLDI0LDZoMCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTggLTYpIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+CiAgPC9nPgogIDxnIGlkPSJQcmV2LTIiIGRhdGEtbmFtZT0iUHJldiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzMuNDE0IDMzLjQxNCkgcm90YXRlKDE4MCkiPgogICAgPHBhdGggaWQ9ImNoZXZyb24tbGVmdC0yIiBkYXRhLW5hbWU9ImNoZXZyb24tbGVmdCIgZD0iTTI0LDM4LDgsMjIsMjQsNmgwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOCAtNikiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzQ4NDg0OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiLz4KICA8L2c+Cjwvc3ZnPgo=);
width: 18px;
height: 35px;
}
.recipepagination__btn__box {
width: 48px;
height: 48px;
}
.recipepagination__btn__box span {
position: relative;
}
.recipepagination__btn__box span img {
opacity: 0;
position: absolute;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipepagination__pagelist__item__box {
width: 48px;
height: 48px;
font-size: 19.2px;
}
.recipepagination__pagelist__item__box > span {
color: #484848;
}
.recipepagination__pagelist__item__box.current {
background-color: #484848;
}
.recipepagination__pagelist__item__box.current > span {
color: #fff;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipepagination__pagenum {
height: 48px;
color: #707070;
}
.recipepagination__pagenum__current {
color: #1f1f1f;
}
.recipepagination__prev__prev .recipepagination__btn__box > span, .recipepagination__prev__first .recipepagination__btn__box > span, .recipepagination__next__next .recipepagination__btn__box > span, .recipepagination__next__last .recipepagination__btn__box > span {
width: auto;
background: none;
}
.recipepagination__btn__box {
border: none;
}
.recipepagination__btn__box > span {
height: auto;
}
}
.extended-size .recipesearch__content__inputtext input[type="text"] {
border-color: #484848;
height: 48px;
}
.extended-size .recipesearch__content__submit button {
background-color: #484848;
width: 48px;
height: 48px;
position: relative;
}
.extended-size .recipesearch__content__submit button img {
opacity: 0;
position: absolute;
}
.extended-size .recipesearch__content__submit button::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNS4yMDciIGhlaWdodD0iMjUuMjA3IiB2aWV3Qm94PSIwIDAgMjUuMjA3IDI1LjIwNyI+CiAgPGcgaWQ9Inpvb20taW4iIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yLjUgLTIuNSkiPgogICAgPGNpcmNsZSBpZD0i5qWV5YaG5b2iXzE5IiBkYXRhLW5hbWU9IualleWGhuW9oiAxOSIgY3g9IjExIiBjeT0iMTEiIHI9IjExIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzIDMpIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+CiAgICA8bGluZSBpZD0i57eaXzEiIGRhdGEtbmFtZT0i57eaIDEiIHgxPSI0LjM1IiB5MT0iNC4zNSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjIuNjUgMjIuNjUpIiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+CiAgPC9nPgo8L3N2Zz4=");
width: 25.207px;
height: 25.207px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.extended-size .recipesearch__title {
margin-bottom: 32px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.extended-size .recipesearch {
margin-top: 48px;
}
.extended-size .recipesearch__title {
margin-bottom: 24px;
}
}
.extended-size .recipeproducts__content__list__item__label {
font-size: 14.55px;
line-height: 24px;
}
.extended-size .recipeproducts__content__title {
margin-bottom: var(--gap_m);
}
.extended-size .recipeproducts__content__submit {
margin-top: var(--gap_m);
}
.extended-size .recipeproducts__content__submit button {
background-color: #484848;
height: 48px;
width: 100%;
font-size: 19.2px;
line-height: 27px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.extended-size .recipeproducts:not(:first-child) {
margin-top: 64px;
}
.extended-size .recipeproducts__content {
padding: 16px 10px;
border-color: #c1c1c1;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.extended-size .recipeproducts {
margin-top: 48px;
background-color: #efefef;
}
.extended-size .recipeproducts__in {
padding: 48px 10px 24px;
}
.extended-size .recipeproducts__content__list__item.checked {
border-color: #484848;
}
}
.quickfilter:not(.extended-size) .quickfilter__panel .quickfilter__bar {
display: none;
}
.quickfilter.extended-size {
--bar-bg-color-expd: #484848;
--bar-color-expd: #fff;
--bar-icn-filter-expd: brightness(0) invert(1);
--bar-icn-filter-xs-expd: none;
}
.style-dark .quickfilter.extended-size {
--bar-bg-color-expd: #efefef;
--bar-color-expd: #1f1f1f;
--bar-icn-filter-expd: none;
--bar-icn-filter-xs-expd: brightness(0.76) invert(1);
}
.quickfilter.extended-size .quickfilter__container:not(.no-padding-top) {
padding-top: var(--gap_l);
}
.quickfilter.extended-size .quickfilter__bar__in > * {
width: 100%;
}
.quickfilter.extended-size .quickfilter__bar__in button {
height: 48px;
width: 100%;
font-size: 19.2px;
line-height: 27px;
}
.quickfilter.extended-size .quickfilter__bar__in button::after {
background: none;
width: 48px;
height: 48px;
}
.quickfilter.extended-size .quickfilter__bar__in button span {
margin-right: auto;
}
.quickfilter.extended-size .quickfilter__bar__in button[aria-expanded="true"] {
background-color: var(--bar-bg-color-expd);
color: var(--bar-color-expd);
}
.quickfilter.extended-size .quickfilter__panel::after {
display: none;
}
.quickfilter.extended-size .quickfilter__panel__in {
padding-top: var(--gap_m);
padding-bottom: var(--gap_m);
}
.quickfilter.extended-size .quickfilter__panel__col__title {
font-size: 19.2px;
line-height: 27px;
}
.quickfilter.extended-size .quickfilter__panel__submit {
margin-top: var(--gap_m);
margin-bottom: 0;
}
.quickfilter.extended-size .quickfilter__panel__submit__btn button {
height: 48px;
font-size: 19.2px;
line-height: 27px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.quickfilter.extended-size .quickfilter__bar__in {
width: 100%;
}
.quickfilter.extended-size .quickfilter__bar__in button span {
margin-left: calc(50% - 976px / 2);
}
.quickfilter.extended-size .quickfilter__bar__in button::after {
margin-right: calc(50% - 976px / 2);
content: url(data:image/svg+xml;base64,PHN2ZyBpZD0iY2hldnJvbi1vcGVuIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij4KICA8cmVjdCBpZD0i6ZW35pa55b2iXzEwMDIiIGRhdGEtbmFtZT0i6ZW35pa55b2iIDEwMDIiIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgcng9IjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQ4KSByb3RhdGUoOTApIiBmaWxsPSJub25lIi8+CiAgPHBhdGggaWQ9ImNoZXZyb24tbGVmdCIgZD0iTTgsMjgsMTksMTcsOCw2SDgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQxIDExKSByb3RhdGUoOTApIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxIi8+Cjwvc3ZnPg==);
}
.quickfilter.extended-size .quickfilter__bar__in button[aria-expanded="true"]::after {
filter: var(--bar-icn-filter-expd);
}
.quickfilter.extended-size .quickfilter__panel__row:not(:first-of-type) {
margin-top: 16px;
padding-top: 32px;
}
.quickfilter.extended-size .quickfilter__panel__col {
padding: 0;
}
.quickfilter.extended-size .quickfilter__panel__col__title {
margin-bottom: 4px;
}
.quickfilter.extended-size .quickfilter__panel__checkboxes__list__item {
margin-top: 8px;
}
.quickfilter.extended-size .quickfilter__panel__checkboxes__list__item__label {
font-weight: normal;
font-size: 14.55px;
line-height: 24px;
}
.quickfilter.extended-size .quickfilter__panel__checkboxes__list__item__checkbox {
margin-right: 16px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.quickfilter.extended-size .quickfilter__bar__in button {
padding-right: 0;
}
.quickfilter.extended-size .quickfilter__bar__in button::after {
content: url(data:image/svg+xml;base64,PHN2ZyBpZD0i44Kz44Oz44Od44O844ON44Oz44OIXzk5Xzc2IiBkYXRhLW5hbWU9IuOCs+ODs+ODneODvOODjeODs+ODiCA5OSDigJMgNzYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4IiB2aWV3Qm94PSIwIDAgNDggNDgiPgogIDxyZWN0IGlkPSLplbfmlrnlvaJfMTQzNiIgZGF0YS1uYW1lPSLplbfmlrnlvaIgMTQzNiIgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4IiBmaWxsPSIjNDg0ODQ4IiBvcGFjaXR5PSIwIi8+CiAgPGcgaWQ9IuOCsOODq+ODvOODl18yMzM1IiBkYXRhLW5hbWU9IuOCsOODq+ODvOODlyAyMzM1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMzI0IC0xNDApIj4KICAgIDxyZWN0IGlkPSLplbfmlrnlvaJfMTQzNyIgZGF0YS1uYW1lPSLplbfmlrnlvaIgMTQzNyIgd2lkdGg9IjE2IiBoZWlnaHQ9IjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDM0MCAxNjMpIiBmaWxsPSIjNDg0ODQ4Ii8+CiAgICA8cmVjdCBpZD0i6ZW35pa55b2iXzE0MzgiIGRhdGEtbmFtZT0i6ZW35pa55b2iIDE0MzgiIHdpZHRoPSIyIiBoZWlnaHQ9IjE2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzNDcgMTU2KSIgZmlsbD0iIzQ4NDg0OCIvPgogIDwvZz4KPC9zdmc+);
}
.quickfilter.extended-size .quickfilter__bar__in button[aria-expanded="true"]::after {
content: url(data:image/svg+xml;base64,PHN2ZyBpZD0i44Kz44Oz44Od44O844ON44Oz44OIXzk5Xzc2IiBkYXRhLW5hbWU9IuOCs+ODs+ODneODvOODjeODs+ODiCA5OSDigJMgNzYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4IiB2aWV3Qm94PSIwIDAgNDggNDgiPgogIDxyZWN0IGlkPSLplbfmlrnlvaJfMTQzNiIgZGF0YS1uYW1lPSLplbfmlrnlvaIgMTQzNiIgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4IiBmaWxsPSIjNDg0ODQ4IiBvcGFjaXR5PSIwIi8+CiAgPGcgaWQ9IuOCsOODq+ODvOODl18yMzM1IiBkYXRhLW5hbWU9IuOCsOODq+ODvOODlyAyMzM1IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMzI0IC0xNDApIj4KICAgIDxyZWN0IGlkPSLplbfmlrnlvaJfMTQzNyIgZGF0YS1uYW1lPSLplbfmlrnlvaIgMTQzNyIgd2lkdGg9IjE2IiBoZWlnaHQ9IjIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDM0MCAxNjMpIiBmaWxsPSIjZmZmZmZmIi8+CiAgPC9nPgo8L3N2Zz4=);
transform: none;
filter: var(--bar-icn-filter-xs-expd);
}
.quickfilter.extended-size .quickfilter__panel__col {
margin-bottom: 16px;
}
.quickfilter.extended-size .quickfilter__panel__col__title {
margin-bottom: 16px;
}
.quickfilter.extended-size .quickfilter__panel__multipleselect {
border-color: #484848;
}
.quickfilter.extended-size .quickfilter__panel__submit__btn button {
width: 100%;
justify-content: center;
}
}
.images-carousel {
display: flex;
flex-direction: column;
align-items: center;
}
.images-carousel__container {
width: 100%;
}
.images-carousel__controls {
box-sizing: border-box;
order: 1;
}
.images-carousel__controls button {
-webkit-appearance: none;
appearance: none;
box-sizing: border-box;
border: none;
padding: 0;
margin: 0;
background: none;
font-size: 0;
line-height: 0;
cursor: pointer;
}
.images-carousel__controls__in {
position: relative;
display: flex;
justify-content: center;
align-items: center;
height: 64px;
}
.images-carousel__dots {
display: inline-flex;
margin: 0 40px;
font-size: 0;
}
.images-carousel__dots li {
box-sizing: border-box;
margin: 0 5px;
background-color: #C1C1C1;
}
.style-dark .images-carousel__dots li {
background-color: #707070;
}
.images-carousel__dots li button {
width: 100%;
height: 100%;
box-sizing: border-box;
}
.images-carousel__dots li.slick-active button {
border: 1px solid #1f1f1f;
background-color: #1f1f1f;
}
.style-dark .images-carousel__dots li.slick-active button {
border: 1px solid #EFEFEF;
background-color: #EFEFEF;
}
.images-carousel__prev, .images-carousel__next {
width: 16px;
height: 32px;
}
.images-carousel__prev::after, .images-carousel__next::after {
display: block;
width: 100%;
height: 100%;
}
.images-carousel__prev {
order: -1;
}
.images-carousel__prev::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOC40MTQiIGhlaWdodD0iMzQuODI4IiB2aWV3Qm94PSIwIDAgMTguNDE0IDM0LjgyOCI+CiAgPHBhdGggaWQ9ImNoZXZyb24tbGVmdCIgZD0iTTI0LDM4LDgsMjIsMjQsNmgwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNyAtNC41ODYpIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+Cjwvc3ZnPg==");
}
.style-dark .images-carousel__prev::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOC40MTQiIGhlaWdodD0iMzQuODI4IiB2aWV3Qm94PSIwIDAgMTguNDE0IDM0LjgyOCI+CiAgPGcgaWQ9ImNoZXZyb24tbGVmdCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMSAxLjQxNCkiPgogICAgPHBhdGggaWQ9ImNoZXZyb24tbGVmdC0yIiBkYXRhLW5hbWU9ImNoZXZyb24tbGVmdCIgZD0iTTI0LDM4LDgsMjIsMjQsNmgwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOCAtNikiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2VmZWZlZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiLz4KICA8L2c+Cjwvc3ZnPg==");
}
.images-carousel__next {
order: 1;
}
.images-carousel__next::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOC40MTQiIGhlaWdodD0iMzQuODI4IiB2aWV3Qm94PSIwIDAgMTguNDE0IDM0LjgyOCI+CiAgPHBhdGggaWQ9ImNoZXZyb24tbGVmdCIgZD0iTTgsMzgsMjQsMjIsOCw2SDgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC02LjU4NiAtNC41ODYpIiBmaWxsPSJub25lIiBzdHJva2U9IiM0ODQ4NDgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIi8+Cjwvc3ZnPgo=");
}
.style-dark .images-carousel__next::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOC40MTQiIGhlaWdodD0iMzQuODI4IiB2aWV3Qm94PSIwIDAgMTguNDE0IDM0LjgyOCI+CiAgPGcgaWQ9ImNoZXZyb24tbGVmdCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMS40MTQgMS40MTQpIj4KICAgIDxwYXRoIGlkPSJjaGV2cm9uLWxlZnQtMiIgZGF0YS1uYW1lPSJjaGV2cm9uLWxlZnQiIGQ9Ik04LDM4LDI0LDIyLDgsNkg4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtOCAtNikiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2VmZWZlZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiLz4KICA8L2c+Cjwvc3ZnPg==");
}
.images-carousel__play-pause {
position: absolute;
width: 48px;
height: 48px;
right: 0;
}
.images-carousel__play-pause.paused .pause {
display: none;
}
.images-carousel__play-pause:not(.paused) .play {
display: none;
}
.images-carousel__play-pause .play, .images-carousel__play-pause .pause {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.images-carousel__play-pause .play::after, .images-carousel__play-pause .pause::after {
display: block;
width: 100%;
height: 100%;
}
.images-carousel__play-pause .play::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij4KICA8ZyBpZD0icmVwbGF5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyOTQ1IC0xMzQ5KSI+CiAgICA8ZyBpZD0i5qWV5YaG5b2iXzM2IiBkYXRhLW5hbWU9IualleWGhuW9oiAzNiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI5NDUgMTM0OSkiIGZpbGw9IiM0ODQ4NDgiIHN0cm9rZT0iIzQ4NDg0OCIgc3Ryb2tlLXdpZHRoPSIxIj4KICAgICAgPGNpcmNsZSBjeD0iMjQiIGN5PSIyNCIgcj0iMjQiIHN0cm9rZT0ibm9uZSIvPgogICAgICA8Y2lyY2xlIGN4PSIyNCIgY3k9IjI0IiByPSIyMy41IiBmaWxsPSJub25lIi8+CiAgICA8L2c+CiAgICA8cGF0aCBpZD0icGxheSIgZD0iTTUsM2wxNCw5TDUsMjFaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjkzMSAxMzYxKSIgZmlsbD0iI2ZmZiIvPgogIDwvZz4KPC9zdmc+);
}
.style-dark .images-carousel__play-pause .play::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij4KICA8ZyBpZD0icmVwbGF5IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyOTQ1IC0xMzQ5KSI+CiAgICA8ZyBpZD0i5qWV5YaG5b2iXzM2IiBkYXRhLW5hbWU9IualleWGhuW9oiAzNiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI5NDUgMTM0OSkiIGZpbGw9IiNFRkVGRUYiIHN0cm9rZT0iI0VGRUZFRiIgc3Ryb2tlLXdpZHRoPSIxIj4KICAgICAgPGNpcmNsZSBjeD0iMjQiIGN5PSIyNCIgcj0iMjQiIHN0cm9rZT0ibm9uZSIvPgogICAgICA8Y2lyY2xlIGN4PSIyNCIgY3k9IjI0IiByPSIyMy41IiBmaWxsPSJub25lIi8+CiAgICA8L2c+CiAgICA8cGF0aCBpZD0icGxheSIgZD0iTTUsM2wxNCw5TDUsMjFaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjkzMSAxMzYxKSIgZmlsbD0iIzQ4NDg0OCIvPgogIDwvZz4KPC9zdmc+);
}
.images-carousel__play-pause .pause::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij4KICA8ZyBpZD0i44Kw44Or44O844OXXzk2MzQiIGRhdGEtbmFtZT0i44Kw44Or44O844OXIDk2MzQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMwMDkgLTEzNzUpIj4KICAgIDxnIGlkPSLmpZXlhoblvaJfMzciIGRhdGEtbmFtZT0i5qWV5YaG5b2iIDM3IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMzAwOSAxMzc1KSIgZmlsbD0iIzQ4NDg0OCIgc3Ryb2tlPSIjNDg0ODQ4IiBzdHJva2Utd2lkdGg9IjEiPgogICAgICA8Y2lyY2xlIGN4PSIyNCIgY3k9IjI0IiByPSIyNCIgc3Ryb2tlPSJub25lIi8+CiAgICAgIDxjaXJjbGUgY3g9IjI0IiBjeT0iMjQiIHI9IjIzLjUiIGZpbGw9Im5vbmUiLz4KICAgIDwvZz4KICAgIDxnIGlkPSJwYXVzZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI5OTcgMTM4NykiPgogICAgICA8cmVjdCBpZD0i6ZW35pa55b2iXzEzOTIiIGRhdGEtbmFtZT0i6ZW35pa55b2iIDEzOTIiIHdpZHRoPSI0IiBoZWlnaHQ9IjE2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg2IDQpIiBmaWxsPSIjZmZmIi8+CiAgICAgIDxyZWN0IGlkPSLplbfmlrnlvaJfMTM5MyIgZGF0YS1uYW1lPSLplbfmlrnlvaIgMTM5MyIgd2lkdGg9IjQiIGhlaWdodD0iMTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE0IDQpIiBmaWxsPSIjZmZmIi8+CiAgICA8L2c+CiAgPC9nPgo8L3N2Zz4=);
}
.style-dark .images-carousel__play-pause .pause::after {
content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDQ4IDQ4Ij4KICA8ZyBpZD0i44Kw44Or44O844OXXzk2MzQiIGRhdGEtbmFtZT0i44Kw44Or44O844OXIDk2MzQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMwMDkgLTEzNzUpIj4KICAgIDxjaXJjbGUgaWQ9IualleWGhuW9ol8zNyIgZGF0YS1uYW1lPSLmpZXlhoblvaIgMzciIGN4PSIyNCIgY3k9IjI0IiByPSIyNCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTMwMDkgMTM3NSkiIGZpbGw9IiNlZmVmZWYiLz4KICAgIDxnIGlkPSJwYXVzZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI5OTcgMTM4NykiPgogICAgICA8cmVjdCBpZD0i6ZW35pa55b2iXzEzOTIiIGRhdGEtbmFtZT0i6ZW35pa55b2iIDEzOTIiIHdpZHRoPSI0IiBoZWlnaHQ9IjE2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg2IDQpIiBmaWxsPSIjNDg0ODQ4Ii8+CiAgICAgIDxyZWN0IGlkPSLplbfmlrnlvaJfMTM5MyIgZGF0YS1uYW1lPSLplbfmlrnlvaIgMTM5MyIgd2lkdGg9IjQiIGhlaWdodD0iMTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE0IDQpIiBmaWxsPSIjNDg0ODQ4Ii8+CiAgICA8L2c+CiAgPC9nPgo8L3N2Zz4=");
}
.images-carousel__item {
position: relative;
}
.images-carousel__item__copy {
position: absolute;
width: 100%;
bottom: 0;
color: #fff;
background-color: rgba(0, 0, 0, 0.55);
}
.images-carousel__item__copy::before {
content: "";
display: block;
width: 100%;
position: absolute;
bottom: 100%;
background-image: -webkit-linear-gradient(to top, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0) 100%);
background-image: linear-gradient(to top, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0) 100%);
}
.images-carousel__item__copy a {
color: inherit;
}
.images-carousel__item__image img {
width: 100%;
}
.images-carousel__item__image::after {
content: "";
display: block;
position: absolute;
top: 0;
width: 100%;
height: 100%;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.images-carousel__container {
max-width: 1200px;
}
.images-carousel__controls__in {
width: 976px;
margin: auto;
}
.images-carousel__dots li {
width: 48px;
height: 4px;
}
.images-carousel__item__copy::before {
height: 100px;
}
.images-carousel__item__copy__in {
width: 976px;
padding: 64px 0;
margin: auto;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.images-carousel__controls {
padding: 0 10px;
width: 100%;
}
.images-carousel__dots li {
width: 8px;
height: 8px;
border-radius: 50%;
}
.images-carousel__dots li button {
border-radius: 50%;
}
.images-carousel__prev, .images-carousel__next {
display: none !important;
}
.images-carousel__item__copy::before {
height: 50px;
}
.images-carousel__item__copy__in {
padding: 24px 10px;
}
}
/* bannerset */
.bannerset {
color: #fff;
}
.bannerset__list {
display: flex;
}
.bannerset__list__item a {
color: inherit !important;
display: block;
height: 100%;
}
.bannerset__list__item__layout {
height: 100%;
position: relative;
}
.bannerset__list__item__copy {
position: absolute;
bottom: 0;
width: 100%;
box-sizing: border-box;
background-color: rgba(0, 0, 0, 0.55);
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
line-height: 1.40625;
text-align: center;
z-index: 1;
}
.bannerset__list__item__copy::before {
content: "";
display: block;
position: absolute;
left: 0;
bottom: 100%;
width: 100%;
background-image: linear-gradient(to top, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0) 100%);
}
.bannerset__list__item__copy .sub-copy {
margin-top: 16px;
font-size: 19.2px;
}
.bannerset__list__item__img {
height: 100%;
overflow: hidden;
}
.bannerset__list__item__img img {
object-fit: cover;
transition: transform .3s;
}
@media (hover: hover) {
.bannerset__list__item a.hover:hover .bannerset__list__item__img img {
transform: scale(105%);
}
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.bannerset.bnr-3 .bannerset__list__item {
flex-basis: calc(100% / 3);
}
.bannerset__list__item__copy {
height: 48.9%;
padding: 0 20px 20px;
}
.bannerset__list__item__copy::before {
height: 50px;
}
.bannerset__list__item__copy .main-copy {
font-size: 44.8px;
}
.bannerset__list__item__img img {
min-height: 100%;
min-width: 100%;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.bannerset {
margin-inline: -10px;
}
.bannerset__list {
flex-direction: column;
}
.bannerset__list__item__copy {
padding: 0 20px 32px;
}
.bannerset__list__item__copy::before {
height: 16px;
}
.bannerset__list__item__copy .main-copy {
font-size: 32px;
}
.bannerset__list__item__img img {
width: 100%;
}
}
.cmp-comparison {
--block-gap-m: 32px;
--row-hcell-width: 156px;
--cell-width: 249px;
--icon-checked-filter: none;
max-width: 976px;
margin-inline: auto;
}
.style-dark .cmp-comparison {
--icon-checked-filter: invert(1);
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.cmp-comparison {
--block-gap-m: 24px;
--row-hcell-width: 150px;
--cell-width: 170px;
}
}
.cmp-comparison__header {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
font-size: 19.2px;
line-height: 1.4;
margin-bottom: 8px;
}
.cmp-comparison__table-wrapper {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
}
.cmp-comparison__table-wrapper::-webkit-scrollbar {
height: 4px;
}
.cmp-comparison__table-wrapper::-webkit-scrollbar-track {
background-color: var(--slgray);
}
.cmp-comparison__table-wrapper::-webkit-scrollbar-thumb {
background-color: var(--dgray);
}
.cmp-comparison__table-container {
border-top: 1px solid #484848;
width: max-content;
min-width: 100%;
padding-bottom: 16px;
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.cmp-comparison__table-wrapper {
margin-inline: -10px;
}
.cmp-comparison__table-container {
padding-inline: 10px;
}
}
.cmp-comparison__table {
table-layout: fixed;
border-collapse: collapse;
border-spacing: 0;
}
.cmp-comparison__table tr {
border-bottom: 1px solid #C1C1C1;
}
.cmp-comparison__table th, .cmp-comparison__table td {
box-sizing: border-box;
width: var(--cell-width);
padding-inline: 10px;
padding-block: 16px;
text-align: start;
}
.cmp-comparison__table th:first-child, .cmp-comparison__table td:first-child {
padding-inline: 0 10px;
width: var(--row-hcell-width);
}
.cmp-comparison__table th:last-child, .cmp-comparison__table td:last-child {
padding-inline: 10px 0;
width: calc(var(--cell-width) - 10px);
}
.cmp-comparison__product-info {
height: 100%;
display: flex;
flex-direction: column;
row-gap: 16px;
position: relative;
}
.cmp-comparison__product-info .btn-delete {
position: absolute;
top: 0;
left: 0;
right: 0;
margin-inline-start: auto;
width: fit-content;
}
.cmp-comparison__product-info .btn-delete button {
all: unset;
cursor: pointer;
}
.cmp-comparison__product-name {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
font-size: 19.2px;
line-height: 1.4;
}
.cmp-comparison__product-img {
order: -1;
}
.cmp-comparison__product-img img {
width: 145px;
height: 109px;
object-fit: contain;
}
.cmp-comparison__product-description {
font-size: 14.55px;
line-height: 1.65;
}
.cmp-comparison__product-link {
margin-top: auto;
}
.cmp-comparison__product-link .btnstyle {
width: 100%;
}
.cmp-comparison__produnct-shop {
margin-top: auto;
display: flex;
flex-direction: column;
row-gap: 16px;
}
.cmp-comparison__produnct-shop + .cmp-comparison__product-link {
margin-top: 0;
}
.cmp-comparison__produnct-price {
display: flex;
flex-direction: column;
row-gap: 8px;
}
.cmp-comparison__produnct-price .out-of-stock {
font-weight: bold;
color: #D6151C;
}
.cmp-comparison__produnct-price .price-nu {
display: inline-block;
}
.cmp-comparison__produnct-price .del-price .price-nu {
text-decoration: line-through;
}
.cmp-comparison__produnct-labels {
display: flex;
flex-wrap: wrap;
gap: 8px 20px;
}
.cmp-comparison__produnct-shop-btn {
margin-top: auto;
}
.cmp-comparison__produnct-shop-btn + .cmp-comparison__produnct-shop-btn {
margin-top: 0;
}
.cmp-comparison__produnct-shop-btn .btnstyle {
width: 100%;
}
.cmp-comparison__product-data {
font-size: 14.55px;
line-height: 1.65;
}
.cmp-comparison__product-data th {
font-weight: bold;
vertical-align: middle;
}
.cmp-comparison__product-data td {
vertical-align: middle;
}
.cmp-comparison__product-data td img {
filter: var(--icon-checked-filter);
}
.cmp-comparison__footer {
text-align: center;
margin-top: var(--block-gap-m);
}
.cmp-comparison__note {
text-align: start;
font-size: 14.55px;
line-height: 1.65;
}
.cmp-comparison__empty-message {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
font-size: 19.2px;
line-height: 1.4;
display: none;
}
.cmp-comparison--noproducts .cmp-comparison__empty-message {
display: revert;
}
.cmp-comparison--noproducts .cmp-comparison__header, .cmp-comparison--noproducts .cmp-comparison__table-wrapper, .cmp-comparison--noproducts .cmp-comparison__footer {
display: none;
}
/************************** reviews-user-result *****************************/
.reviews-rate {
font-size: 0;
}
.reviews-rate .star {
display: inline-block;
padding: 0 1px;
width: 12px;
height: 12px;
background: url(/etc/designs/panasonic/productpage-clientlibs/images/icn-rate-star-off-s.png) no-repeat center top;
background-size: 12px 12px;
}
.reviews-rate .star span {
display: block;
overflow: hidden;
}
.reviews-rate .star img {
max-width: none;
width: 12px;
height: 12px;
}
/************************** review-rate *****************************/
.review-rate {
display: inline-flex;
flex-direction: row-reverse;
align-items: center;
}
.review-rate__text::before {
content: "";
display: inline-block;
width: .5em;
}
.review-rate__stars {
display: flex;
margin: 0 -1px;
position: relative;
}
.review-rate__stars .icn-star {
margin: 0 1px;
font-size: 0;
background: url("/etc/designs/panasonic/productpage-2-clientlibs/images/icons/icn-star-off.svg") no-repeat;
background-size: contain;
pointer-events: none;
}
.review-rate__stars .icn-star .star-on {
display: block;
overflow: hidden;
width: 100%;
height: 100%;
}
.review-rate__stars .icn-star img {
height: auto;
max-width: none;
}
.review-rate__stars.size-m .icn-star {
width: 17px;
height: 16px;
}
.review-rate__stars.size-m .icn-star img {
width: 17px;
}
.review-rate__stars.size-s .icn-star {
width: 13px;
height: 12px;
}
.review-rate__stars.size-s .icn-star img {
width: 13px;
}
.review-rate__tooltips {
position: absolute;
pointer-events: none;
white-space: nowrap;
font-size: 12px;
z-index: 5;
color: var(--dark);
background-color: #FFF;
padding: 5px;
margin-top: 10px;
margin-left: 10px;
box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.4);
}