@charset "utf-8"; @-ms-viewport { width: device-width } html { box-sizing: border-box; -ms-overflow-style: scrollbar } *, :after, :before { box-sizing: inherit } .local-section { padding: 1px 0; } .local-section_inner { max-width: 1052px; padding: 0 10px; margin: 54px auto; } @media screen and (max-width: 640px) { .local-section_inner { padding: 0 16px; margin: 24px auto 29px; } } .local-section-news { background: #f2f2f2; } .local-section-solution { background: url(../img/bg-solution-01.jpg) 50% 0 no-repeat; background-size: cover; } .local-section-solution .local-section_inner { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; height: 520px; margin-top: 0; margin-bottom: 0; } @media screen and (max-width: 640px) { .local-section-solution { background: none; } .local-section-solution .local-section_inner { display: block; height: auto; margin-bottom: 29px; } } .local-headingLv2 { margin: 40px 0; display: -webkit-flex; display: flex; } .local-headingLv2 h2, .local-headingLv2 h3, .local-headingLv2 h4, .local-headingLv2 h5, .local-headingLv2 h6 { font-size: 28px; line-height: 30px; margin: 0; font-weight: bold; -webkit-flex: 0 0 auto; flex: 0 0 auto; } .local-headingLv2_title { border-right: solid 1px #d2d4d9; margin-right: 20px; padding-right: 20px; } .local-headingLv2_link { -webkit-flex: 1 1 auto; flex: 1 1 auto; font-weight: bold; } .local-headingLv2_link a { font-size: 14px; line-height: 30px; } .local-headingLv2_link a:before { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #333; border-right: 2px solid #333; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -.25em; margin-right: 8px; } @media screen and (max-width: 640px) { .local-headingLv2 { margin: 20px 0; -webkit-justify-content: space-between; justify-content: space-between; } .local-headingLv2 h2, .local-headingLv2 h3, .local-headingLv2 h4, .local-headingLv2 h5, .local-headingLv2 h6 { font-size: 18px; line-height: 18px; } .local-headingLv2_title { border-right: none; padding-right: 0; } .local-headingLv2_link { -webkit-flex: 0 0 auto; flex: 0 0 auto; } .local-headingLv2_link a { font-size: 11px; line-height: 18px; } .local-headingLv2_link a:before { width: 5px; height: 5px; } } .local-headingLv3 { margin: 20px 0; } .local-headingLv3 h2, .local-headingLv3 h3, .local-headingLv3 h4, .local-headingLv3 h5, .local-headingLv3 h6 { font-size: 20px; line-height: 1.4; margin: 0; font-weight: bold; } .local-newsGrid .local-headingLv3 { margin-top: 0; } @media screen and (max-width: 640px) { .local-headingLv3 { margin: 15px 0; } .local-headingLv3 h2, .local-headingLv3 h3, .local-headingLv3 h4, .local-headingLv3 h5, .local-headingLv3 h6 { font-size: 16px; line-height: 1.4; margin: 0; font-weight: bold; } .local-newsGrid .local-headingLv3 { margin-top: 25px; margin-bottom: 10px; } } .local-newsGrid_inner { display: -webkit-flex; display: flex; margin-left: -40px; flex-wrap: wrap; } .local-newsGrid_item { width: calc((100% - 40px * 2) / 2); margin-left: 40px; margin-bottom: 0; margin-top: 40px; } @media screen and (min-width: 641px) { .local-newsGrid_item:nth-child(-n+2) { margin-top:0; } } @media screen and (max-width: 640px) { .local-newsGrid_inner { display: block; margin: 0; } .local-newsGrid_item { width: 100%; border-top: solid 1px #d2d4d9; margin: 20px 0 0; } } .local-notice { border: 1px solid #ea1e1f; background-color: #fff; padding: 20px 9%; margin: 40px 0; } .local-notice_inner { display: -webkit-flex; display: -webkit-box; display: flex; -webkit-align-items: center; -webkit-box-align: center; align-items: center; max-width: 750px; margin: 0 auto; justify-content: space-between; } .local-notice_item { margin-left: 0; width: auto; margin-bottom: 0; } .local-notice_heading { text-align: center; margin-top: 0.25em; } .local-notice_heading h2, .local-notice_heading h3, .local-notice_heading h4, .local-notice_heading h5, .local-notice_heading h6 { font-size: 1.429em; line-height: 1.4; margin: 0; font-weight: bold; } .local-notice_heading img { max-width: 20px; vertical-align: middle; margin-top: -0.25em; margin-right: 18px; } .local-notice_link a { display: inline-block; padding: 1em 2em 0.9em; border: 1px solid #ddd; min-width: 365px; box-sizing: border-box; text-align: center; font-weight: bold; } .local-notice_link a:before { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #333; border-right: 2px solid #333; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -.25em; margin-right: 8px; } @media screen and (max-width: 1024px) { .local-notice_inner { max-width: 600px; } .local-notice_heading h2, .local-notice_heading h3, .local-notice_heading h4, .local-notice_heading h5, .local-notice_heading h6 { font-size: 1.2em; } .local-notice_link a { min-width: 300px; } } @media screen and (max-width: 768px) { .local-notice { padding: 12px 15px 15px; margin: 24px 0; } .local-notice_inner { -webkit-flex-direction: column; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; margin: 0; max-width: none; } .local-notice_item { width: 100%; margin: 0; } .local-notice_item + .local-notice_item { margin-top: 12px; } .local-notice_heading { text-align: left; } .local-notice_heading h2, .local-notice_heading h3, .local-notice_heading h4, .local-notice_heading h5, .local-notice_heading h6 { font-size: 1em; } .local-notice_heading img { max-width: 15px; margin-right: 8px; margin-left: 3px; } .local-notice_link { font-size: 0.8571428em; } .local-notice_link a { width: 100%; min-width: inherit; padding: 0.8em; text-align:left; } } .local-dateList ul { list-style: none; margin: 0; padding: 0; padding: 0 0 20px; border-bottom: dotted 1px #d2d4d9; } .local-dateList li { border-top: dotted 1px #d2d4d9; padding: 20px 0 0; margin-top: 20px; } .local-dateList li:first-child { margin-top: 0; } .local-dateList_date { display: block; padding: 0 0 3px; font-weight: bold; } .local-dateList_description { display: block; margin-left: 1em; } .local-dateList_description a { margin-left: -1em; padding-left: 1em; text-indent: -1em; display: inline-block; } .local-dateList_description a:before { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #333; border-right: 2px solid #333; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -.25em; margin-right: 6px; } @media screen and (max-width: 768px) { .local-dateList ul { padding-bottom: 10px; } .local-dateList li { display: list-item; margin-top: 10px; padding-top: 10px; } .local-dateList_date, .local-dateList_description { display: block; } .local-dateList_date { padding: 0; } .local-dateList_description { font-size: 12px; } } @media screen and (max-width: 640px) { .local-dateList ul { border-bottom: none; padding-bottom: 0; } } .local-banner { margin: 40px 0; } .local-banner ul { list-style: none; margin: 0; padding: 0; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin-left: -20px; margin-bottom: -20px; } .local-banner li { width: calc(((100% - 20px * 3) / 3) - 0.1px); margin-left: 20px; margin-bottom: 20px; box-sizing: border-box; text-align: left; } .local-banner_img img { max-width: 100%; } .local-banner_heading { margin: 20px 0 0; font-size: 16px; line-height: 1.25; font-weight: bold; } .local-banner_heading a { padding-left: 16px; text-indent: -16px; display: inline-block; text-align: left; } .local-banner_heading a:before { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #333; border-right: 2px solid #333; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -.25em; margin-right: 8px; } .local-banner_paragraph { margin: 10px 0 0; } .local-banner_paragraph a { padding-left: 16px; text-indent: -16px; display: inline-block; text-align: left; } .local-banner_paragraph a:before { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #333; border-right: 2px solid #333; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -.25em; margin-right: 8px; } @media screen and (max-width: 640px) { .local-banner { margin: 20px 0; } .local-banner ul { display: block; margin: 0; } .local-banner li { width: auto; margin: 0 0 20px; display: -webkit-flex; display: flex; border-top: dotted 1px #d2d4d9; padding: 20px 0 0; } .local-banner_img { width: 33%; box-sizing: border-box; padding-right: 6px; } .local-banner_text { width: 66%; margin: 0; box-sizing: border-box; padding-left: 6px; } .local-banner_heading { margin-top: 0; font-size: 14px; } .local-banner_paragraph { font-size: 12px; margin-top: 7px; } } @media print { .local-banner li { width: 337px; } } .local-solution { color: #191919; } .local-solution_img { display: none; margin: 0 -16px; } .local-solution_img img { max-width: 100%; } .local-solution_heading { margin: 15px 0; } .local-solution_heading h2, .local-solution_heading h3, .local-solution_heading h4, .local-solution_heading h5, .local-solution_heading h6 { font-size: 36px; line-height: 1.5; margin: 0; font-weight: bold; } .local-solution_paragraph { margin: 15px 0; font-size: 16px; line-height: 1.75; } @media screen and (max-width: 768px) { .local-solution_heading h2, .local-solution_heading h3, .local-solution_heading h4, .local-solution_heading h5, .local-solution_heading h6 { font-size: 32px; } .local-solution_paragraph { font-size: 14px; } } .local-solution_link { margin: 35px 0; } .local-solution_link a { display: inline-block; padding: 1em 2em; background: #333; color: #fff; border-radius: 3px; } .local-solution_link a:before { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #333; border-right: 2px solid #333; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -.25em; border-color: #fff; margin-right: 8px; } @media screen and (max-width: 640px) { .local-solution { color: #333; } .local-solution_img { display: block; } .local-solution_heading { margin: 20px 0 10px; } .local-solution_heading h2, .local-solution_heading h3, .local-solution_heading h4, .local-solution_heading h5, .local-solution_heading h6 { font-size: 18px; line-height: 1.5; margin: 0; font-weight: bold; } .local-solution_paragraph { margin: 10px 0 15px; font-size: 12px; line-height: 1.75; } .local-solution_link { margin: 15px 0; } .local-solution_link a { display: block; text-align: center; padding: 1em 2em; font-size: 12px; } } /*重要なお知らせ*/ ul.notice { max-width: 705px; margin: 0 auto; } @media screen and (max-width: 1024px) { ul.notice { max-width: 600px; } } @media screen and (max-width: 768px) { ul.notice { margin-left:0; max-width: none; } } .wpn .container { width: 100%; max-width: 1052px; padding: 0 10px; margin-right: auto; margin-left: auto } @media (max-width:768px) { .wpn .container { max-width: 540px; padding: 0 } } .wpn .container-fluid { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto } .wpn .row { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px } .wpn .row2 { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -10px; margin-left: -10px } .wpn .no-gutters { margin-right: 0; margin-left: 0 } .wpn .no-gutters>.col, .wpn .no-gutters>[class*=col-] { padding-right: 0; padding-left: 0 } .wpn .col, .wpn .col-1, .wpn .col-2, .wpn .col-3, .wpn .col-4, .wpn .col-5, .wpn .col-6, .wpn .col-7, .wpn .col-8, .wpn .col-9, .wpn .col-10, .wpn .col-11, .wpn .col-12, .wpn .col-auto, .wpn .col-lg, .wpn .col-lg-1, .wpn .col-lg-2, .wpn .col-lg-3, .wpn .col-lg-4, .wpn .col-lg-5, .wpn .col-lg-6, .wpn .col-lg-7, .wpn .col-lg-8, .wpn .col-lg-9, .wpn .col-lg-10, .wpn .col-lg-11, .wpn .col-lg-12, .wpn .col-lg-auto, .wpn .col-md, .wpn .col-md-1, .wpn .col-md-2, .wpn .col-md-3, .wpn .col-md-4, .wpn .col-md-5, .wpn .col-md-6, .wpn .col-md-7, .wpn .col-md-8, .wpn .col-md-9, .wpn .col-md-10, .wpn .col-md-11, .wpn .col-md-12, .wpn .col-md-auto, .wpn .col-sm, .wpn .col-sm-1, .wpn .col-sm-2, .wpn .col-sm-3, .wpn .col-sm-4, .wpn .col-sm-5, .wpn .col-sm-6, .wpn .col-sm-7, .wpn .col-sm-8, .wpn .col-sm-9, .wpn .col-sm-10, .wpn .col-sm-11, .wpn .col-sm-12, .wpn .col-sm-auto, .wpn .col-xl, .wpn .col-xl-1, .wpn .col-xl-2, .wpn .col-xl-3, .wpn .col-xl-4, .wpn .col-xl-5, .wpn .col-xl-6, .wpn .col-xl-7, .wpn .col-xl-8, .wpn .col-xl-9, .wpn .col-xl-10, .wpn .col-xl-11, .wpn .col-xl-12, .wpn .col-xl-auto { position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px } .wpn .col { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100% } .wpn .col-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none } .wpn .col-1 { -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333% } .wpn .col-2 { -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667% } .wpn .col-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25% } .wpn .col-4 { -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333% } .wpn .col-5 { -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667% } .wpn .col-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50% } .wpn .col-7 { -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333% } .wpn .col-8 { -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667% } .wpn .col-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75% } .wpn .col-10 { -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333% } .wpn .col-11 { -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667% } .wpn .col-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100% } @media (min-width:576px) { .wpn .col-sm { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100% } .wpn .col-sm-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none } .wpn .col-sm-1 { -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333% } .wpn .col-sm-2 { -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667% } .wpn .col-sm-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25% } .wpn .col-sm-4 { -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333% } .wpn .col-sm-5 { -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667% } .wpn .col-sm-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50% } .wpn .col-sm-7 { -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333% } .wpn .col-sm-8 { -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667% } .wpn .col-sm-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75% } .wpn .col-sm-10 { -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333% } .wpn .col-sm-11 { -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667% } .wpn .col-sm-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100% } } @media (min-width:768px) { .wpn .col-md { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100% } .wpn .col-md-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none } .wpn .col-md-1 { -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333% } .wpn .col-md-2 { -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667% } .wpn .col-md-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25% } .wpn .col-md-4 { -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333% } .wpn .col-md-5 { -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667% } .wpn .col-md-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50% } .wpn .col-md-7 { -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333% } .wpn .col-md-8 { -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667% } .wpn .col-md-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75% } .wpn .col-md-10 { -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333% } .wpn .col-md-11 { -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667% } .wpn .col-md-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100% } } @media (min-width:992px) { .wpn .col-lg { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100% } .wpn .col-lg-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none } .wpn .col-lg-1 { -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333% } .wpn .col-lg-2 { -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667% } .wpn .col-lg-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25% } .wpn .col-lg-4 { -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333% } .wpn .col-lg-5 { -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667% } .wpn .col-lg-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50% } .wpn .col-lg-7 { -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333% } .wpn .col-lg-8 { -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667% } .wpn .col-lg-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75% } .wpn .col-lg-10 { -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333% } .wpn .col-lg-11 { -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667% } .wpn .col-lg-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100% } } @media (min-width:1200px) { .wpn .col-xl { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100% } .wpn .col-xl-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: none } .wpn .col-xl-1 { -ms-flex: 0 0 8.3333333333%; flex: 0 0 8.3333333333%; max-width: 8.3333333333% } .wpn .col-xl-2 { -ms-flex: 0 0 16.6666666667%; flex: 0 0 16.6666666667%; max-width: 16.6666666667% } .wpn .col-xl-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25% } .wpn .col-xl-4 { -ms-flex: 0 0 33.3333333333%; flex: 0 0 33.3333333333%; max-width: 33.3333333333% } .wpn .col-xl-5 { -ms-flex: 0 0 41.6666666667%; flex: 0 0 41.6666666667%; max-width: 41.6666666667% } .wpn .col-xl-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50% } .wpn .col-xl-7 { -ms-flex: 0 0 58.3333333333%; flex: 0 0 58.3333333333%; max-width: 58.3333333333% } .wpn .col-xl-8 { -ms-flex: 0 0 66.6666666667%; flex: 0 0 66.6666666667%; max-width: 66.6666666667% } .wpn .col-xl-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75% } .wpn .col-xl-10 { -ms-flex: 0 0 83.3333333333%; flex: 0 0 83.3333333333%; max-width: 83.3333333333% } .wpn .col-xl-11 { -ms-flex: 0 0 91.6666666667%; flex: 0 0 91.6666666667%; max-width: 91.6666666667% } .wpn .col-xl-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100% } } .wpn { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline } .wpn a, .wpn abbr, .wpn acronym, .wpn address, .wpn applet, .wpn article, .wpn aside, .wpn audio, .wpn b, .wpn big, .wpn blockquote, .wpn canvas, .wpn caption, .wpn center, .wpn cite, .wpn code, .wpn dd, .wpn del, .wpn details, .wpn dfn, .wpn div, .wpn dl, .wpn dt, .wpn em, .wpn embed, .wpn fieldset, .wpn figcaption, .wpn figure, .wpn footer, .wpn form, .wpn h1, .wpn h2, .wpn h3, .wpn h4, .wpn h5, .wpn h6, .wpn header, .wpn hgroup, .wpn iframe, .wpn img, .wpn ins, .wpn kbd, .wpn label, .wpn legend, .wpn li, .wpn mark, .wpn menu, .wpn nav, .wpn object, .wpn ol, .wpn output, .wpn p, .wpn pre, .wpn q, .wpn ruby, .wpn s, .wpn samp, .wpn section, .wpn small, .wpn span, .wpn strike, .wpn strong, .wpn sub, .wpn summary, .wpn sup, .wpn table, .wpn tbody, .wpn td, .wpn tfoot, .wpn th, .wpn thead, .wpn time, .wpn tr, .wpn tt, .wpn u, .wpn ul, .wpn var, .wpn video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; line-height: 1 } .wpn, body.wpn { font-size: 14px; color: #333; -webkit-text-size-adjust: 100% } .wpn a { color: inherit; text-decoration: none } .wpn a:visited { opacity: 1 } .wpn img { max-width: 100% } .wpn .no-gutters.container-fluid { padding-right: 0; padding-left: 0 } .wpn .component-container { overflow: hidden; margin: 30px auto 0 } .wpn .heading-container { margin-bottom: 1em } .wpn .component-heading { font-size: 28px; font-weight: bold; line-height: 1.22; color: #000; text-align: left; } .wpn .component-sub-heading { text-align: center; font-size: 16px; line-height: 1.38; color: #333 } .wpn .hide-bounce, .wpn .js-is-hidden { display: none } .wpn .no-margin-top { margin: 0 auto 3em } @media (max-width:640px) { .wpn .component-container { margin: 0 auto } .wpn .component-heading { line-height: 1.22; color: #000; font-size: 18px; } .wpn .component-sub-heading { font-size: 16px; line-height: 1.38; color: #333; font-size: 14px } } .wpn .container-fluid { padding-right: 30px; padding-left: 30px } @media only screen and (max-width:768px) { .wpn .col-sm-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100% } } .wpn .vi-hd { position: absolute; clip: rect(1px, 1px, 1px, 1px); -webkit-clip-path: inset(0 0 99.9% 99.9%); clip-path: inset(0 0 99.9% 99.9%); overflow: hidden; height: 1px; width: 1px; padding: 0; border: 0 } .wpn .first-component { margin-top: 1em } .wpn .offer-zone .offer-zone-container .promo-detail { position: absolute; bottom: 0; z-index: 1; width: 100%; overflow: hidden; padding: 0 30px 16px; background: hsla(0, 0%, 100%, .7) } .wpn .offer-zone .offer-zone-container .promo-detail p { font-size: 32px; line-height: 1.13; float: left; padding: 22px 0 0; margin-right: 25px } .wpn .offer-zone .offer-zone-container .promo-detail p span { color: #f79646 } .wpn .offer-zone .offer-zone-container .promo-detail .view-button { width: auto; font-size: 14px; line-height: 1.33; padding: 12px 22px; display: inline-block; margin: 16px 0 0; background-color: #1965e1; color: #fff; cursor: pointer; float: left } .wpn .offer-zone .offer-zone-container .promo-detail .view-button:hover { background-color: #1450b3 } .wpn .offer-zone .big-placeholder-offer .offer-zone-container .offer-detail, .wpn .offer-zone .big-placeholder-offer .offer-zone-container .promo-detail, .wpn .offer-zone .big-placeholder-promo .offer-zone-container .offer-detail, .wpn .offer-zone .big-placeholder-promo .offer-zone-container .promo-detail { padding-left: 50px } .wpn .offer-zone .small-placeholder-promo .row { display: -ms-flexbox; display: flex; display: -webkit-flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: justify; align-content: space-between; height: 100% } .wpn .offer-zone .promo-component-overview { margin: 3em auto } .wpn .offer-zone .promo-component-overview p { font-size: 28px; text-align: center; color: #1965e1 } .wpn .offer-zone .promo-component-overview p:first-child { margin-bottom: 8px } .wpn .offer-zone .promo-component-overview:after { content: ""; background-color: #f79646; width: 105px; height: 3px; display: block; text-align: center; margin: 0 auto; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%) } .wpn .view-all { text-align: center } .wpn .view-all a { width: auto; font-size: 14px; line-height: 1.33; padding: 12px 22px; display: inline-block; margin-top: 1em; background-color: #1965e1; color: #fff; cursor: pointer } .wpn .view-all a:hover { background-color: #1450b3 } @media (max-width:991.98px) { .wpn .offer-zone .offer-zone-container .promo-detail p { font-size: 26px; line-height: 1.13; margin-right: 10px; width: 100%; margin-left: 0 } } @media (max-width:767.98px) { .wpn .offer-zone .offer-zone-container { margin-bottom: 20px } .wpn .offer-zone .offer-zone-container .category-ttl h1 { font-size: 23px; padding: 10px 0 } .wpn .offer-zone .offer-zone-container .promo-detail { padding: 0 15px 16px } .wpn .offer-zone .offer-zone-container .promo-detail p { font-size: 20px; float: none; width: 100%; margin-right: 10px } .wpn .offer-zone .offer-zone-container .promo-detail a { font-size: 16px; padding: 6px 10px } .wpn .offer-zone .promo-component-overview p { font-size: 22px } .wpn .offer-zone .promo-component-overview p:first-child { margin-bottom: 12px } } .wpn .first-component { margin-top: 0; margin-bottom: 0 } .wpn .offer-zone-with-2-card { margin-bottom: 1em } .wpn .offer-zone a { display: block } .wpn .offer-zone .offer-zone-container { position: relative } .wpn .offer-zone .offer-zone-container img { width: 100% } .wpn .offer-zone .offer-zone-container .offer-detail { position: absolute; bottom: 0; z-index: 1; width: 100%; overflow: hidden; padding: 0 30px 16px; background: hsla(0, 0%, 100%, .7) } .wpn .offer-zone .offer-zone-container .offer-detail p { font-size: 20px; font-weight: bold; line-height: 1.13; float: left; padding-top: 22px; margin-right: 25px } .wpn .offer-zone .offer-zone-container .offer-detail p span { color: #f79646 } .wpn .offer-zone .offer-zone-container .offer-detail .view-button { width: auto; font-size: 11px; line-height: 1.33; padding: 12px 22px; display: inline-block; margin-top: 16px; background-color: #1965e1; color: #fff; cursor: pointer; float: left } .wpn .offer-zone .offer-zone-container .offer-detail .view-button:hover { background-color: #1450b3 } .wpn .offer-zone .small-placeholder-offer .row { display: -ms-flexbox; display: flex; display: -webkit-flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: justify; align-content: space-between; height: 100% } .wpn .offer-zone .offer-component-overview { margin: 3em auto } .wpn .offer-zone .offer-component-overview p { font-size: 28px; text-align: center; color: #333 } .wpn .offer-zone .offer-component-overview p:first-child { margin-bottom: 8px } .wpn .offer-zone .offer-component-overview:after { content: ""; background-color: #f79646; width: 105px; height: 3px; display: block; text-align: center; margin: 0 auto; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%) } @media (max-width:1199.98px) { .wpn .offer-zone.gtp .offer-zone-container .offer-detail .view-button { padding: 9px 14px; font-size: 12px } .wpn .offer-zone.gtp .offer-zone-container .offer-detail p { font-size: 20px } .wpn .offer-zone .offer-zone-container .promo-detail .view-button { padding: 9px 14px; font-size: 12px } .wpn .offer-zone .offer-zone-container .promo-detail p { font-size: 20px } } @media (min-width:768px) { .wpn .offer-zone.gtp .offer-zone-with-2-card .col-md-7.big-placeholder-promo { -ms-flex: 0 0 56.5%; flex: 0 0 56.5%; max-width: 56.5% } .wpn .offer-zone.gtp .offer-zone-with-2-card .col-md-5.small-placeholder-promo { -ms-flex: 0 0 43.5%; flex: 0 0 43.5%; max-width: 43.5% } } @media (max-width:991.98px) { .wpn .offer-zone.gtp .offer-zone-container .offer-detail p { line-height: 1.13; word-wrap: break-word } } @media (max-width:767.98px) { .wpn .offer-zone.gtp .offer-zone-container { margin-bottom: 10px } .wpn .offer-zone.gtp .offer-zone-container .offer-detail { padding: 0 15px 16px } .wpn .offer-zone.gtp .offer-zone-container .offer-detail p { float: none; word-wrap: break-word; font-size: 18px; } .wpn .offer-zone.gtp .offer-zone-container .offer-detail a { font-size: 16px; padding: 6px 10px } .wpn .offer-zone.gtp .big-placeholder-offer .offer-zone-container .offer-detail, .wpn .offer-zone.gtp .big-placeholder-offer .offer-zone-container .promo-detail, .wpn .offer-zone.gtp .big-placeholder-promo .offer-zone-container .offer-detail, .wpn .offer-zone.gtp .big-placeholder-promo .offer-zone-container .promo-detail { padding-left: 15px } .wpn .offer-zone .offer-zone-container { margin-bottom: 10px } .wpn .offer-zone .offer-zone-container .promo-detail { padding: 0 15px 16px } .wpn .offer-zone .offer-zone-container .promo-detail p { float: none; word-wrap: break-word } .wpn .offer-zone .offer-zone-container .promo-detail a { font-size: 16px; padding: 6px 10px } .wpn .offer-zone .big-placeholder-offer .offer-zone-container .offer-detail, .wpn .offer-zone .big-placeholder-offer .offer-zone-container .promo-detail, .wpn .offer-zone .big-placeholder-promo .offer-zone-container .offer-detail, .wpn .offer-zone .big-placeholder-promo .offer-zone-container .promo-detail { padding-left: 15px } .wpn .offer-component-overview { margin: 1em auto } .wpn .offer-component-overview p { font-size: 22px } .wpn .offer-component-overview p:first-child { margin-bottom: 12px } } @media only screen and (max-width:767px) { .wpn .first-component { margin-top: 0 } } .wpn .explore-products { background-color: #f2f2f2; padding: 54px 0 } .wpn .explore-products #explore-products-all { width: 100%; margin: 0 auto 20px; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap } .wpn .explore-products .explore-products-container { position: relative; overflow: hidden; display: inline-block; max-width: 22.7%; margin: 0 10px 30px; transform: scale(1); transition: all .3s ease-in-out } .wpn .explore-products .explore-products-container:hover img, .wpn .explore-products .explore-products-container img { width: 100% } .wpn .explore-products .explore-products-container a:hover img { opacity: .6 } .wpn .explore-products .explore-products-container .explore-products-title { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; width: 100%; padding: 0 9px; min-height: 70px; opacity: .9; background-color: #404040; color: #fff; font-size: 16px; line-height: 24px; text-align: center; position: absolute; bottom: 0; } .wpn .explore-products .explore-products-container .explore-products-title .explore-products-title-inner { height: 70px; width: 100%; position: relative } .wpn .explore-products .explore-products-container .explore-products-title span { display: block; width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%) } .wpn .explore-products .explore-products-container .explore-products-title span:after { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #333; border-right: 2px solid #333; -webkit-transform: rotate(45deg); transform: rotate(45deg); border-color: #fff; margin-left: 5px; } .wpn .explore-products .explore-products-container span.icon:after { content: "\f35d"; display: block; display: inline-block; margin-left: 10px; font-weight: 600; color: #fff; font-size: 14px } .wpn .explore-products .view-all { text-align: center; } .wpn .explore-products .explore-products-container { margin-bottom: 1em; max-width: calc((100% - 80px) / 4); } @media (max-width:1199.98px) { .wpn .explore-products .explore-products-container .explore-products-title { min-height: 50px; font-size: 16px; line-height: 20px } } @media only screen and (max-width:768px) { .wpn .explore-products #explore-products-all { width: 95% } .wpn .explore-products .explore-products-container { max-width: 48%; margin: 0 1% 12px } } @media (max-width:991.98px) { .wpn .explore-products { padding: 3em 20px } .wpn .explore-products .explore-products-container .explore-products-title { font-size: 13px } .wpn .explore-products .explore-products-container .explore-products-title .explore-products-title-inner { height: 50px } } @media (max-width:768px) { .wpn .explore-products { padding: 24px 16px } .wpn .explore-products .explore-products-container { max-width: calc((100% - 20px) / 2); margin: 0 5px 12px } } .wpn .individual-product .individual-product-container { background-color: #fff; max-width: 320px; width: calc(100% - 20px); padding: 20px; position: relative; margin: 0 auto } .wpn .individual-product .individual-product-container a.product-img-name-link { display: block; padding: 0; margin: 0 } .wpn .individual-product .individual-product-container a.product-img-name-link:hover img { opacity: .6 } .wpn .individual-product .individual-product-container a.product-img-name-link:hover .individual-product-name { color: #1450b3 } .wpn .individual-product .individual-product-container .individual-product-label { font-size: 12px; font-weight: 700; line-height: 18px; display: inline-block; background-color: #008931; color: #fff; padding: 5px 20px 5px 30px; position: absolute; left: 0; transform: translateX(-10px) } .wpn .individual-product .individual-product-container .individual-product-label:before { content: ""; border-top: 0 solid transparent; border-right: 10px solid #008931; border-bottom: 10px solid transparent; position: absolute; left: 0; bottom: -10px } .wpn .individual-product .individual-product-container .individual-product-thumbnail { text-align: center; margin-top: 27px } .wpn .individual-product .individual-product-container .individual-product-name { color: #1965e1; font-size: 20px; margin: 20px auto; font-weight: 600; line-height: 26px; margin: 20px auto 10px; text-align: center } .wpn .individual-product .individual-product-container .individual-product-desc { color: #404040; font-size: 12px; line-height: 16px; margin: 10px } .wpn .individual-product .individual-product-container .individual-product-rating { margin: 20px 10px; display: none } .wpn .individual-product .individual-product-container .individual-product-rating .star-rating .star { color: #f79646; font-size: 12px; margin-left: 3px } .wpn .individual-product .individual-product-container .individual-product-rating .star-rating .star:first-child { margin-left: 0 } .wpn .individual-product .individual-product-container .individual-product-rating .star-rating .star:after { content: "\f005"; display: block; display: inline-block; font-weight: 900 } .wpn .individual-product .individual-product-container .individual-product-rating .star-rating .star.star-half-filled:after { content: "\f5c0" } .wpn .individual-product .individual-product-container .individual-product-rating .star-rating .star.star-empty:after { font-weight: inherit } .wpn .individual-product .individual-product-container .individual-product-rating .reviews { color: #1965e1; font-size: 12px; font-weight: 700; margin-left: 5px } .wpn .individual-product .individual-product-container .individual-product-prize { margin: 10px } .wpn .individual-product .individual-product-container .individual-product-prize .original-prize { color: #b5b5b5; vertical-align: bottom; position: relative; display: inline-block } .wpn .individual-product .individual-product-container .individual-product-prize .original-prize:before { content: ""; display: block; width: 100%; height: 2px; background-color: #b5b5b5; position: absolute; top: 50%; transform: translateY(-50%) } .wpn .individual-product .individual-product-container .individual-product-prize .discounted-prize { color: #404040; font-size: 20px; font-weight: 700; margin-left: 10px; vertical-align: bottom } .wpn .individual-product .individual-product-container .individual-product-view a { display: block; text-align: center } .wpn .individual-product .individual-product-container .individual-product-compare { display: none; color: #404040; text-align: center; margin: 20px 10px; font-weight: 700 } .wpn .individual-product .individual-product-container .individual-product-compare input[type=checkbox] { margin: 0; vertical-align: bottom; border: 1px solid #000; box-shadow: 0 0 0 0; border-radius: 0; display: inline-block; background-color: #fff; width: 18px; -webkit-user-select: auto; -moz-user-select: auto; -ms-user-select: auto; user-select: auto; height: 18px } @media only screen and (max-width: 767px) { .wpn .offer-zone .offer-zone-container img { padding-bottom: 90px; } .wpn .offer-zone .offer-zone-container .offer-detail { background: none; } .wpn .offer-zone.gtp .small-placeholder-offer .offer-zone-container .offer-detail p { padding-top: 5px; margin-right: 0px; padding-right: 5px; } }