@charset "UTF-8"; .kv-panel { position: relative; } .kv-panel .kv-contents { position: absolute; top: 50%; left: 50%; width: 100%; max-width: 960px; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } .kv-contents { zoom: 1 } .kv-contents:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size: 0; line-height: 0 } .kv-contents .contents-txt { float: left; padding-top: 25px } .kv-contents .contents-txt>* { margin: 0; line-height: 1 } .kv-contents .contents-txt .lead { border: 1px solid rgba(255, 255, 255, 0.8); padding: 9px 17px } .kv-contents .contents-txt .lead img { width: 384px; height: auto } .kv-contents .contents-txt .title { margin-top: 25px; padding-bottom: 30px; border-bottom: 1px solid rgba(255, 255, 255, 0.25) } .kv-contents .contents-txt .txt { margin-top: 29px } .kv-contents .contents-img { float: right } .kv-img { overflow: hidden; position: relative; height: 400px } .kv-img img { position: absolute; top: 0; left: 50%; width: auto; height: auto; min-width: 100%; min-height: 100%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%) } .anchors-panel { min-width: 1072px; border-bottom: 4px solid #d7233b; background: #fff } .anchors-panel.isFixed { position: fixed; top: 0; left: 0; z-index: 9500; width: 100% } .anchors-panel .panel-inner { max-width: 1028px; margin: 0 auto; padding: 0 10px } .lead-panel { zoom: 1; height: 440px } .lead-panel:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size: 0; line-height: 0 } .lead-panel>* { position: relative; width: 50%; height: 100%; -webkit-box-sizing: border-box; box-sizing: border-box } .lead-panel>* p { position: absolute; top: 50%; left: 50%; margin: 0; line-height: 1; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } .lead-panel .lead-shipping { float: left; background: #d7233b } .lead-panel .lead-shipping img { width: 406px; height: auto } .lead-panel .lead-series { float: right } .lead-panel+.downloads-panel { margin-top: -1px } .downloads-panel { border-top: 1px dotted #d7233b; border-bottom: 1px dotted #d7233b } .downloads-panel>.panel-inner { max-width: 960px; margin-left: auto; margin-right: auto; padding: 44px 10px 35px } * .downloads-panel>.panel-inner { padding-left: 0; padding-right: 0 } .block-downloads { display: table; width: 100% } .block-downloads>* { display: table-cell; vertical-align: middle } .block-downloads .downloads-txt>* { margin: 0 } .block-downloads .downloads-txt .sub-title { display: table; padding-bottom: 10px; border-bottom: 3px solid #d7233b; font-family: "Noto Sans Japanese"; font-weight: 900; line-height: 1; font-size: 16px; color: #d7233b; letter-spacing: .26em } .block-downloads .downloads-txt .title { margin-top: 8px; font-family: "Noto Sans Japanese"; font-weight: 700; font-size: 23px; line-height: 2; color: #d7233b; letter-spacing: .22em } .block-downloads .downloads-txt .txt { margin-top: -3px; font-size: 13px; font-weight: bold; line-height: 2.4; letter-spacing: .12em } .block-downloads .downloads-btn { width: 340px } .block-downloads .downloads-btn .btn { position: relative; width: auto; padding-left: 0; padding-right: 0; text-align: center } .block-downloads .downloads-btn .label { display: inline-block } .block-downloads .downloads-btn .label .icn-left, .block-downloads .downloads-btn .label .icn-right { overflow: hidden; position: absolute; top: 50%; display: block; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .block-downloads .downloads-btn .label .icn-left img, .block-downloads .downloads-btn .label .icn-right img { position: absolute; top: 0; left: 0 } .block-downloads .downloads-btn .label .icn-left { left: 26px; width: 16px; height: 18px } .block-downloads .downloads-btn .label .icn-right { right: 26px; width: 10px; height: 12px } .changes-panel { padding: 60px 0 0 } .changes-panel>.panel-inner { max-width: 960px; margin-left: auto; margin-right: auto } .changes-panel .changes-img { margin: 0 } .changes-panel .block-change { margin-top: 100px } .changes-panel .downloads-panel { margin-top: 100px } .block-change { zoom: 1; display: table; width: 100% } .block-change:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size: 0; line-height: 0 } .block-change .block-change-right { display: table-cell } .block-change:not(.has-img) .block-change-left { display: table-cell } .block-change>* .title { font-family: "Noto Sans Japanese"; font-weight: 700; font-size: 23px; line-height: 2; letter-spacing: .2em; margin: 0 } .block-change>* .title>* { margin: 0; line-height: 2; font-size: inherit } .block-change>* .txt { margin-top: 29px; font-size: 15px; letter-spacing: .0135em } .block-change>* .txt>* { margin: 0; line-height: 2.2 } .block-change>* .txt>:not(:first-child) { margin-top: 17px } .block-change.has-img { position: relative } .block-change.has-img .block-change-left { position: absolute } .block-change.pattern-intro>* .title { line-height: 2.1; letter-spacing: .3em } .block-change.pattern-intro>* .title>* { line-height: 2.1 } .block-change.pattern-intro>* .txt { margin-top: 0 } .block-change.pattern-intro .block-change-left { width: 440px; vertical-align: top } .block-change.pattern-intro .block-change-right { vertical-align: top; padding-left: 23px } .block-change.pattern-1 { min-height: 330px } .block-change.pattern-1 .block-change-left { top: 0; left: 0; width: 370px; vertical-align: top } .block-change.pattern-1 .block-change-left .img img { width: 370px; height: auto } .block-change.pattern-1 .block-change-right { padding-left: 430px; vertical-align: bottom } .block-change.pattern-2 { min-height: 416px } .block-change.pattern-2 .block-change-left { width: 320px; top: 0; right: 0 } .block-change.pattern-2 .block-change-left .img img { width: 320px; height: auto } .block-change.pattern-2 .block-change-right { padding-right: 430px; vertical-align: bottom } .voices-panel { margin-top: 100px; padding: 80px 0 100px; background-repeat: repeat; background-color: #d7233b } .voices-panel>.panel-inner { max-width: fit-content; margin-left: auto; margin-right: auto } .voices-panel .voices-title { display: table; margin: 0 auto; padding-bottom: 30px; border-bottom: 5px solid #fff } .voices-panel .voices-contents { margin-top: 60px } .voices-panel .voice-change { margin-top: 70px } .voices-panel .block-change>* .title { font-size: 20px } .voices-panel .block-change>* .txt { font-size: 15px; letter-spacing: .15em } .voices-panel .block-change>* .txt p { line-height: 2 } .voices-panel .block-change .block-change-left { width: 400px } .voices-panel .block-change.pattern-2 { height: 320px; min-height: 0 } .voices-panel .block-change.pattern-2 .block-change-left { right: -10px } .voices-panel .block-change.pattern-2 .block-change-left .img { position: relative } .voices-panel .block-change.pattern-2 .block-change-left .img:after { position: absolute; left: 0; bottom: 0; content: ''; display: block; width: 60px; height: 180px; background: #fff } .voices-panel .block-change.pattern-2 .block-change-left .img img { width: 400px; height: auto } .voices-panel .block-change.pattern-2 .block-change-right { padding-left: 50px; padding-right: 390px } .voices-panel .block-change.pattern-2 .txt { margin-top: 50px } .voices-panel .block-change.pattern-1 { height: 320px; min-height: 0 } .voices-panel .block-change.pattern-1 .block-change-left { left: -10px } .voices-panel .block-change.pattern-1 .block-change-left .img { position: relative } .voices-panel .block-change.pattern-1 .block-change-left .img:after { position: absolute; bottom: 0; right: 0; content: ''; display: block; width: 60px; height: 180px; background: #fff } .voices-panel .block-change.pattern-1 .block-change-left .img img { width: 400px; height: auto } .voices-panel .block-change.pattern-1 .block-change-right { vertical-align: top; padding-left: 390px; padding-right: 50px } .voices-panel .block-change.pattern-1 .title { margin-top: -.5em; padding-left: 60px } .voices-panel .block-change.pattern-1 .txt { margin-top: 45px } .voices-panel .voice-band { position: relative; margin: 80px -10px 0 } .voices-panel .voice-band img { width: 100%; height: auto } .voices-panel .voice-band .txt { position: absolute; top: 50%; left: 0; width: 100%; margin: 0; font-family: "Noto Sans Japanese"; font-weight: 700; font-size: 30px; text-align: center; color: #fff; letter-spacing: .2em; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .voices-panel .voice-band .txt h3, .voices-panel .voice-band .txt p { margin: 0; line-height: 1.4; font-size: inherit } .voices-panel .voice-lead { margin: 50px 50px 0; font-size: 15px } .voices-panel .voice-lead p { margin: 0; line-height: 2.2 } .voices-panel .voice-btns { margin-top: 80px } .voices-panel .voice-btns .btn { margin-left: auto; margin-right: auto } .block-voice { padding: 10px 10px 80px; background: #fff; -webkit-box-shadow: 0 0 55px rgba(0, 0, 0, 0.25); box-shadow: 0 0 55px rgba(0, 0, 0, 0.25) } .block-voice .voice-intro { position: relative } .block-voice .voice-intro .img { margin: 0 } .block-voice .voice-intro .label { position: absolute; right: 30px; bottom: 30px; padding: 8px 15px; font-family: "Noto Sans Japanese"; font-weight: 700; font-size: 14px; letter-spacing: .18em; background: #fff } .block-voice .voice-intro .label p { margin: 0; line-height: 1 } .block-voice .voice-intro .product { position: absolute; left: 29px; bottom: 0; -webkit-transform: translateY(50%); -ms-transform: translateY(50%); transform: translateY(50%) } .block-voice .product { overflow: hidden; width: 248px; height: 248px; padding: 30px 0 0; border-radius: 50%; background: #fff; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box } .block-voice .product .product-name { width: 117px; margin: 0 auto 17px; padding-bottom: 12px; border-bottom: 1px dotted #000; line-height: 1 } .block-voice .voice-btns .btn { position: relative } .block-voice .voice-btns .label { display: inline-block } .block-voice .voice-btns .icn-right { position: absolute; top: 50%; right: 24px; width: 22px; height: 8px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .functions-panel { padding: 100px 0 } .functions-panel>.panel-inner { max-width: 960px; margin-left: auto; margin-right: auto } .functions-panel .functions-title { display: table; margin: 0 auto; padding-bottom: 29px; border-bottom: 5px solid #d7233b; line-height: 1 } .functions-panel .functions-intro { margin-top: 26px; text-align: center } .functions-panel .functions-intro>* { margin: 0 } .functions-panel .functions-intro .lead { font-family: "Noto Sans Japanese"; font-weight: 700; font-size: 20px; color: #d7233b; line-height: 2.5; letter-spacing: .24em } .functions-panel .functions-intro .txt { margin-top: -8px; font-family: "Noto Sans Japanese"; font-weight: 700; font-size: 14px; line-height: 3.5; letter-spacing: .2em } .functions-panel .block-cards { margin-top: 83px } .functions-panel .block-cards .icn-right { overflow: hidden; position: absolute; top: 50%; right: 22px; display: block; width: 10px; height: 12px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .functions-panel .block-cards .icn-right img { -webkit-transition: opacity 0.2s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: opacity 0.2s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.2s cubic-bezier(0.19, 1, 0.22, 1) } .functions-panel .block-cards .icn-right img.before { position: absolute; top: -12px; left: 0 } .functions-panel .block-cards .icn-right img.after { position: absolute; top: 0; left: 0 } .functions-panel .block-cards a img.after { opacity: 0 } .functions-panel .block-cards a:hover img.before { opacity: 0 } .functions-panel .block-cards a:hover img.after { opacity: 1 } .block-cards { zoom: 1 } .block-cards:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size: 0; line-height: 0 } .block-cards .card { position: relative; width: calc((100%/3)); float: left; text-align: center; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; border-right: 1px dotted #d7233b; border-bottom: 1px dotted #d7233b } .block-cards .card .card-intro a { padding-top: 60px; padding-bottom: 142px } .block-cards .card .card-intro a:hover .img { opacity: .5 } .block-cards .card .card-intro a:hover .btn { color: #fff; border-color: #a11225; background: #a11225 } .block-cards .card .card-intro a:hover .btn .icn-right img.before { opacity: 0 } .block-cards .card .card-intro a:hover .btn .icn-right img.after { opacity: 1 } .block-cards .card:nth-child(3n) { border-right: 0 } .block-cards .card:nth-child(3n+1) { clear: left } .block-cards .card:nth-child(-n+3) .card-intro a { padding-top: 0 } .block-cards .card:nth-child(3n):nth-last-child(-n+4)~.card { border-bottom: 0 } .block-cards .card:nth-child(3n):nth-last-child(-n+4)~.card .card-intro a { padding-bottom: 70px } .block-cards .card:nth-child(3n):nth-last-child(-n+4)~.card .card-intro .btn { bottom: 0 } .block-cards .card .card-intro { position: relative; font-weight: bold } .block-cards .card .card-intro .img-wrap { position: relative; width: 220px; margin: 0 auto } .block-cards .card .card-intro .img-wrap .ballon { position: absolute; top: 0; right: -30px } .block-cards .card .card-intro .img-wrap .ballon img { width: 82px; height: auto } .block-cards .card .card-intro .img { overflow: hidden; width: 220px; height: 220px; margin-left: auto; margin-right: auto; border-radius: 50%; -webkit-transition: all .1125s linear; -o-transition: all .1125s linear; transition: all .1125s linear } .block-cards .card .card-intro .img img { width: 100%; height: auto } .block-cards .card .card-intro .type { margin-top: 30px; font-size: 12px; color: #a3a3a3 } .block-cards .card .card-intro .type p { margin: 0; overflow: hidden; height: 14px } .block-cards .card .card-intro .type.pattern-both img { margin-top: 0 } .block-cards .card .card-intro .type.pattern-820 img { margin-top: -56px; margin-left: 66px } .block-cards .card .card-intro .title { display: table; width: 100%; margin-top: 27px; font-size: 14px; letter-spacing: .12em } .block-cards .card .card-intro .title p { display: table-cell; vertical-align: middle; line-height: 2 } .block-cards .card .card-intro .title .sub-title, .block-cards .card .card-intro .title span.caution { display: block; margin-top: 5px; font-size: 11px; line-height: 1.4 } .block-cards .card .card-intro a { display: block } .block-cards .card .card-details { visibility: hidden; position: absolute; top: 0; bottom: -1px; left: -1px; right: -1px; background: #fff; -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.2); box-shadow: 0 0 30px rgba(0, 0, 0, 0.2); opacity: 0; -webkit-transform: translateY(25px); -ms-transform: translateY(25px); transform: translateY(25px); -webkit-transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), transform 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), transform 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1) } .block-cards .card .card-details .card-details-header { display: table; width: 100%; height: 124px; color: #fff; font-weight: bold; background: #d7233b } .block-cards .card .card-details .card-details-header .card-details-header-inner { display: table-cell; vertical-align: middle } .block-cards .card .card-details .card-details-header .title { font-size: 14px; line-height: 2; letter-spacing: .12em } .block-cards .card .card-details .card-details-header .sub-title { margin-top: 5px; font-size: 11px; line-height: 1.4; letter-spacing: .2em } .block-cards .card .card-details .card-details-body { padding: 27px 36px 0 } .block-cards .card .card-details .card-details-body p { margin: 0; line-height: 2; text-align: left } .block-cards .card .card-details .card-details-body p:not(.caution) { font-size: 14px } .block-cards .card .card-details .card-details-body p.caution { margin-top: 4px; font-size: 11px } .block-cards .card .card-details .btn .icn-right { position: absolute; top: 50%; right: 21px; overflow: hidden; display: block; width: 12px; height: 14px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .block-cards .card .card-details .btn .icn-right img { position: absolute; left: 0 } .block-cards .card .card-details .btn .icn-right img.before { top: -14px; opacity: 1 } .block-cards .card .card-details .btn .icn-right img.after { top: 0; opacity: 0 } .block-cards .card .card-details .btn:hover .icn-right img.before { opacity: 0 } .block-cards .card .card-details .btn:hover .icn-right img.after { opacity: 1 } .block-cards .card .btn { position: absolute; bottom: 60px; left: 50%; display: inline-block; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); -webkit-transition: all .1125s linear; -o-transition: all .1125s linear; transition: all .1125s linear } .block-cards .card.active .card-details { visibility: visible; opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } .features-panel { padding: 100px 0; background-repeat: repeat; background-color: #f9f9f9 } .features-panel>.panel-inner { max-width: 960px; margin-left: auto; margin-right: auto } .features-panel .features-title { display: table; margin: 0 auto; padding-bottom: 29px; border-bottom: 5px solid #d7233b; line-height: 1 } .features-panel .features-intro { margin-top: 26px; text-align: center } .features-panel .features-intro>* { margin: 0 } .features-panel .features-intro .lead { font-family: "Noto Sans Japanese"; font-weight: 700; font-size: 20px; color: #d7233b; line-height: 2.5; letter-spacing: .24em } .features-panel .block-features { margin-top: 85px } .block-features { zoom: 1 } .block-features:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size: 0; line-height: 0 } .block-features .feature { margin-bottom: 70px } .block-features .feature .feature-img img { width: 100%; height: auto } .block-features .feature:nth-child(2n):not(.pattern-1) .feature-img { position: relative } .block-features .feature:nth-child(2n):not(.pattern-1) .feature-img:after { position: absolute; top: 0; right: 0; content: ''; display: block; width: 1px; height: 100%; background: #f7f7f7 } .block-features .feature:nth-child(odd):nth-last-child(-n+3)~.feature { margin-bottom: 0 } .block-features .feature:not(.pattern-1) { float: left } .feature { width: 50%; margin-bottom: 70px } .feature .feature-contents { padding: 0 40px } .feature .lead { display: table; width: 100%; margin-top: 27px; margin-bottom: 0; font-family: "Noto Sans Japanese"; font-weight: 700; font-size: 16px; text-align: center; letter-spacing: .2em } .feature .lead h3, .feature .lead p { display: table-cell; vertical-align: middle; margin: 0; line-height: 2; font-size: inherit } .feature .txt { margin-top: 20px; font-size: 13px; letter-spacing: .12em } .feature .txt p { margin: 0; line-height: 2.3 } .feature .type { margin-top: 27px; padding: 14px 0 0; border-top: 1px solid rgba(0, 0, 0, 0.1); font-size: 12px; text-align: center } .feature .type p { overflow: hidden; height: 14px; margin: 0; line-height: 1 } .feature .type.pattern-both img { margin-top: 0 } .feature .type.pattern-820 img { margin-top: -56px; margin-left: 66px } .feature.pattern-1 { position: relative; display: table; width: 100%; min-height: 311px } .feature.pattern-1 .feature-img { position: absolute; top: 0; right: 0; width: 480px } .feature.pattern-1 .feature-contents { display: table-cell; vertical-align: top; padding-right: 539px; padding-left: 0 } .feature.pattern-1 .feature-contents>* { text-align: left } .feature.pattern-1 .feature-contents .lead { font-size: 20px; margin-top: -.5em } .feature.pattern-1 .feature-contents .lead p { line-height: 1.8 } .feature.pattern-1 .feature-contents .txt { margin-top: 14px } .feature.pattern-1 .feature-contents .txt .caution { margin-top: 10px; font-size: 11px; line-height: 1; letter-spacing: .135em } .period { display: inline-block; margin-right: -.5em } .has-cover { position: relative } .has-cover:after { position: absolute; top: 0; left: 0; content: ''; display: block; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3) } @media screen and (min-width:641px) and (max-width:1072px) { .kv-contents .contents-txt { width: 50%; padding: 0 0 0 15px; } .kv-contents .contents-txt img { width: 100%; } .kv-contents .contents-txt .lead img { width: 100%; } .kv-contents .contents-img { width: 40%; padding-right: 15px; } .kv-contents .contents-img img { width: 100%; } .anchors-panel.only-pc { display: none; } .anchors-panel.only-sp { display: block; } .anchor-menu-bg.only-sp { display: block; } .anchors-panel { position: relative; z-index: 9500; min-width: 0; border-bottom: 0; height: auto; background: transparent; } .anchors-panel.isFixed { position: fixed; top: 0; left: 0; width: 100% } .anchors-panel.is-active .anchors-label .anchor-menu .menu-icon .menu-icon-open { visibility: hidden; opacity: 0 } .anchors-panel.is-active .anchors-label .anchor-menu .menu-icon .menu-icon-close { visibility: visible; opacity: 1 } .anchors-panel.is-active .anchors-label .anchor-purchase, .anchors-panel.is-active .anchors-label .anchor-top { visibility: hidden; opacity: 0 } .anchors-panel.is-active .list-anchors { visibility: visible; opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } .anchors-panel .anchors-label { position: relative; border-bottom: 3px solid #d0033a; -webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.25); box-shadow: 0 3px 3px rgba(0, 0, 0, 0.25); z-index: 100; background: #fff; } .anchors-panel .anchors-label .panel-inner { max-width: none; zoom: 1; width: 100%; height: 52px; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; } .anchors-panel .anchors-label .anchor-top { -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); } .anchors-panel .anchors-label .anchor-purchase { position: absolute; top: 50%; right: 68px; width: 117px; padding: 5px 0 5px 39px; font-size: 11px; letter-spacing: .06em; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); background: #d7233b; border-color: #d7233b; -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); } .anchors-panel .anchors-label .anchor-purchase .label { position: static; } .anchors-panel .anchors-label .anchor-purchase .icn-left { position: absolute; top: 50%; left: 19px; width: 14px; height: 13px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .anchors-panel .anchors-label .anchor-purchase .icn-left img { display: inline; width: 14px; height: auto; } .anchors-panel .anchors-label .anchor-menu { position: relative; display: block; width: 56px; height: 100%; float: right; border-left: 1px solid #ededed; } .anchors-panel .anchors-label .anchor-menu .menu-icon { height: 100%; } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close, .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-open { position: absolute; top: 50%; left: 0; width: 100%; text-align: center; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .lines, .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-open .lines { margin: 0 auto; } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-open .lines { width: 18px; height: 16px; margin: auto; } .anchors-panel .anchors-label .anchor-menu .line { display: block; width: 18px; height: 3px; margin: 0 auto; background: #d7233b; } .anchors-panel .anchors-label .anchor-menu .line:not(:first-child) { margin-top: 3px; } .anchors-panel .anchors-label .anchor-menu .menu-icon .label { margin-top: 5px; display: block; font-size: 10px; font-weight: bold; color: #d7233b; letter-spacing: .05em; line-height: 1; } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close { visibility: hidden; opacity: 0; } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .lines { position: relative; width: 18px; height: 18px; } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .lines>* { position: absolute; top: 50%; left: 0; width: 23px; margin-top: -1px; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .lines>.line-1 { top: 0; left: 0; } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .lines>.line-3 { top: auto; bottom: 0; left: 0; } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .line-1 { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg) } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .line-3 { margin: 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg) } .anchors-panel .list-anchors { position: absolute; width: 100%; } .anchors-panel .anchors-label .anchor-top { display: block; width: 60px; float: left; font-size: 15px; line-height: 52px; font-weight: bold; text-align: center; color: #d1033a; letter-spacing: .06em; } .list-anchors { visibility: hidden; position: static; padding-right: 0; -webkit-transform: translateY(15px); -ms-transform: translateY(15px); transform: translateY(15px); opacity: 0; -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); } .list-anchors ul { width: 100%; -webkit-transform: none; -ms-transform: none; transform: none; font-size: 13px; background: #d7233b; } .list-anchors ul>* { width: 50% !important; height: 55px; border-bottom: 1px solid #b71e32; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: left; } .list-anchors ul>:nth-child(2n) { border-left: 1px solid #b71e32; } .list-anchors ul>* a { position: relative; padding: 0 15px; background: #d7233b; color: #fff; } .list-anchors ul>* a span.arrow { position: absolute; top: 25px; right: 15px; display: block; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 4px solid #f7d3d8; } .list-anchors ul>* a:after { content: none; } .anchor-menu-bg { visibility: hidden; opacity: 0; position: fixed; top: 0; left: 0; z-index: 9000; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.85); -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) } .anchor-menu-bg.is-active { visibility: visible; opacity: 1 } .lead-panel .lead-shipping img { width: 40vw; } .lead-panel .lead-series img { width: 40vw; } .lead-panel+.downloads-panel { padding: 0 15px; } .block-downloads { display: block; } .block-downloads>* { display: block; } .block-downloads .downloads-txt .sub-title { display: block; } .block-downloads .downloads-txt { text-align: center; } .block-downloads .downloads-btn { margin: 15px auto; } .changes-panel .changes-img img { width: 100%; } .block-change { display: block; } .block-change .block-change-right { display: block; } .block-change.pattern-intro .block-change-left { width: 45%; padding-left: 15px; display: inline-block; } .block-change>* .title { font-size: 20px; } .block-change.pattern-intro .block-change-right { width: 48%; padding-left: 0; float: right; } .block-change.pattern-intro>* .txt { padding-right: 15px; } .block-change.pattern-1 .block-change-left { width: 45%; display: inline-block; } .block-change.pattern-1 .block-change-left .img img { width: 100%; } .block-change.pattern-2 .block-change-left { position: static; width: 50%; display: inline-block; float: right; text-align: center; } .block-change.pattern-1 .block-change-right { width: 50%; padding-left: 0; float: right; } .block-change.pattern-2 .block-change-right { padding: 0 0 0 15px; width: 45%; } .voices-panel .voices-contents { text-align: center; } .block-voice img { width: 100%; } .voice-btns .btn { width: 100%; padding: 20px 0; } .block-voice .voice-btns .icn-right { top: 50%; right: 5%; } .block-cards .card { width: calc((100%/2)); height: 500px; } .block-cards .card:nth-child(2n) { border-right: 0; } .block-cards .card:nth-child(3n) { border-right: 1px dotted #d7233b; } .block-cards .card:nth-child(n-1) { border-bottom: 1px dotted #d7233b !important; } .block-cards .card:last-child { border-bottom: 0 !important; } .block-cards .card:nth-child(3) .card-intro a { padding-top: 70px; } .block-cards .card:nth-child(3n):nth-last-child(-n+4)~.card .card-intro a { padding-bottom: 65px; } .block-cards .card:nth-child(3n+1) { clear: none; } .feature.pattern-1 { display: block; } .feature.pattern-1 .feature-img { position: static; width: 40%; float: right; } .feature.pattern-1 .feature-contents { display: block; padding: 0 0 0 40px; width: 50%; } .purchases-panel>.panel-inner { padding: 0 15px; } .purchase .purchase-main .img { position: static; width: 100%; text-align: center; } .purchase .purchase-main .type img { height: 16px; margin: 25px auto; } .purchase .purchase-btns .btn { width: auto; padding: 10px 50px 10px 55px; font-size: 14px; } .block-bnrs .bnr a { width: 95%; height: auto; } .block-bnrs .bnr img.after, .block-bnrs .bnr img.before { position: static; width: 100%; } .block-bnrs .bnr img.after { display: none; } } @media screen and (max-width:640px) { .kv-panel .kv-contents { position: absolute; top: 0; left: 15px; right: 15px; z-index: 100; width: auto; -webkit-transform: none; -ms-transform: none; transform: none } .kv-panel .contents-txt { float: none; padding-top: 6.89655% } .kv-panel .contents-txt .lead { padding: 6px 0; text-align: center } .kv-panel .contents-txt .lead img { width: 93.44828%; height: auto } .kv-panel .contents-txt .title { margin-top: 6.89655%; padding-bottom: 0; border-bottom: 0; text-align: center } .kv-panel .contents-txt .title img { width: 100%; height: auto } .kv-panel .contents-txt .txt { margin-top: 5.51724%; text-align: center } .kv-panel .contents-txt .txt img { width: 64.82759%; height: auto } .kv-panel .contents-img { margin-top: 12.41379%; float: none; text-align: center } .kv-panel .contents-img img { width: 82.75862%; height: auto } .kv-panel img { vertical-align: middle } .kv-img { height: auto } .kv-img img { position: static; top: auto; left: auto; min-width: 0; min-height: 0; width: 100%; height: auto; -webkit-transform: none; -ms-transform: none; transform: none } .anchors-panel { position: relative; z-index: 9500; min-width: 0; border-bottom: 0; height: auto; background: transparent } .anchors-panel.isFixed { position: fixed; top: 0; left: 0; width: 100% } .anchors-panel.is-active .anchors-label .anchor-menu .menu-icon .menu-icon-open { visibility: hidden; opacity: 0 } .anchors-panel.is-active .anchors-label .anchor-menu .menu-icon .menu-icon-close { visibility: visible; opacity: 1 } .anchors-panel.is-active .anchors-label .anchor-purchase, .anchors-panel.is-active .anchors-label .anchor-top { visibility: hidden; opacity: 0 } .anchors-panel.is-active .list-anchors { visibility: visible; opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } .anchors-panel>.panel-inner { max-width: none; height: 100%; padding: 0 } .anchors-panel .anchors-label { position: relative; border-bottom: 3px solid #d0033a; -webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.25); box-shadow: 0 3px 3px rgba(0, 0, 0, 0.25); z-index: 100; background: #fff } .anchors-panel .anchors-label .panel-inner { zoom: 1; width: 100%; height: 52px; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box } .anchors-panel .anchors-label .panel-inner:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size: 0; line-height: 0 } .anchors-panel .anchors-label .anchor-top { display: block; width: 60px; float: left; font-size: 15px; line-height: 52px; font-weight: bold; text-align: center; color: #d1033a; letter-spacing: .06em } .anchors-panel .anchors-label .anchor-menu { position: relative; display: block; width: 56px; height: 100%; float: right; border-left: 1px solid #ededed } .anchors-panel .anchors-label .anchor-menu .menu-icon { height: 100% } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close, .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-open { position: absolute; top: 50%; left: 0; width: 100%; text-align: center; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .lines, .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-open .lines { margin: 0 auto } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-open .lines { width: 18px; height: 16px } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close { visibility: hidden; opacity: 0 } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .lines { position: relative; width: 18px; height: 18px } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .lines>* { position: absolute; top: 50%; left: 0; width: 23px; margin-top: -1px; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .lines>.line-1 { top: 0; left: 0 } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .lines>.line-3 { top: auto; bottom: 0; left: 0 } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .line-1 { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg) } .anchors-panel .anchors-label .anchor-menu .menu-icon .menu-icon-close .line-3 { margin: 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg) } .anchors-panel .anchors-label .anchor-menu .menu-icon .label { margin-top: 5px; display: block; font-size: 10px; font-weight: bold; color: #d7233b; letter-spacing: .05em; line-height: 1 } .anchors-panel .anchors-label .anchor-menu .menu-icon.close .line-2 { display: none } .anchors-panel .anchors-label .anchor-menu .line { display: block; width: 18px; height: 3px; margin: 0 auto; background: #d7233b } .anchors-panel .anchors-label .anchor-menu .line:not(:first-child) { margin-top: 3px } .anchors-panel .anchors-label .anchor-menu .label { display: block } .anchors-panel .anchors-label .anchor-top { -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) } .anchors-panel .anchors-label .anchor-purchase { position: absolute; top: 50%; right: 68px; width: 117px; padding: 5px 0 5px 39px; font-size: 11px; letter-spacing: .06em; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); background: #d7233b; border-color: #d7233b; -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) } .anchors-panel .anchors-label .anchor-purchase .label { position: static } .anchors-panel .anchors-label .anchor-purchase .icn-left { position: absolute; top: 50%; left: 19px; width: 14px; height: 13px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .anchors-panel .anchors-label .anchor-purchase .icn-left img { width: 14px; height: auto } .anchors-panel .list-anchors { position: absolute; width: 100% } .anchor-menu-bg { visibility: hidden; opacity: 0; position: fixed; top: 0; left: 0; z-index: 9000; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.85); -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) } .anchor-menu-bg.is-active { visibility: visible; opacity: 1 } .list-anchors { visibility: hidden; position: static; padding-right: 0; -webkit-transform: translateY(15px); -ms-transform: translateY(15px); transform: translateY(15px); opacity: 0; -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) } .list-anchors ul { width: 100%; -webkit-transform: none; -ms-transform: none; transform: none; font-size: 13px; background: #d7233b } .list-anchors ul>* { width: 50% !important; height: 55px; border-bottom: 1px solid #b71e32; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: left } .list-anchors ul>:nth-child(2n) { border-left: 1px solid #b71e32 } .list-anchors ul>.anchor-function, .list-anchors ul>.anchor-purchase, .list-anchors ul>.anchor-shipping, .list-anchors ul>.anchor-voice, .list-anchors ul>.anchro-top { width: auto } .list-anchors ul>.anchor-top { display: none } .list-anchors ul>:after { display: none !important } .list-anchors ul>* a { position: relative; padding: 0 15px; background: #d7233b; color: #fff } .list-anchors ul>* a span.arrow { position: absolute; top: 25px; right: 15px; display: block; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 4px solid #f7d3d8 } .list-anchors ul>* a:after { display: none } .lead-panel { height: auto } .lead-panel .lead-shipping { width: auto; height: 250px; float: none; text-align: center } .lead-panel .lead-shipping img { width: 260px; height: auto } .lead-panel .lead-series { width: auto; height: 250px; float: none } .lead-panel .lead-series img { width: 277px; text-align: center; height: auto } .downloads-panel { border-bottom: 0 } .downloads-panel>.panel-inner { margin: 0 15px; padding: 28px 0 40px } .downloads-panel .block-downloads { display: block } .downloads-panel .block-downloads>* { display: block } .downloads-panel .block-downloads .downloads-txt { text-align: center } .downloads-panel .block-downloads .downloads-txt .title { margin-top: 15px; font-size: 19px; line-height: 1.5 } .downloads-panel .block-downloads .downloads-txt .sub-title { margin: 0 auto; padding: 0 2px 7px; border-bottom-width: 2px; font-size: 13px } .downloads-panel .block-downloads .downloads-txt .txt { margin-top: 18px; font-size: 12px; line-height: 1.5 } .downloads-panel .block-downloads .downloads-btn .btn { padding: 15px 0; font-size: 16px; border-color: #d7233b; background: #d7233b; letter-spacing: .1em } .downloads-panel .block-downloads .downloads-btn .btn .icn-left { width: 16px; height: 16px; left: 20px } .downloads-panel .block-downloads .downloads-btn .btn .icn-left img { width: 100%; height: auto } .downloads-panel .block-downloads .downloads-btn .btn .icn-right { width: 11px; height: 11px; right: 20px } .downloads-panel .block-downloads .downloads-btn .btn .icn-right img { width: 100%; height: auto } .downloads-panel .downloads-btn { width: auto; margin-top: 20px } .changes-panel { padding-top: 0; border-bottom: 1px dotted #d7233b } .changes-panel .changes-img { position: relative } .changes-panel .changes-img img { width: 100%; height: auto } .changes-panel .changes-img .label { position: absolute; top: 50%; left: 0; width: 100%; margin: 0; font-size: 21px; line-height: 1.7; color: #fff; text-align: center; font-weight: bold; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%) } .changes-panel .changes-ups { padding: 22px 15px; border-bottom: 1px dotted #000 } .changes-panel .changes-ups img { width: 100%; height: auto } .changes-panel .block-change { margin-top: 22px } .changes-panel .downloads-panel { margin-top: 0 } .block-change { display: block; width: auto; margin: 0; padding: 0 15px 25px; border-bottom: 1px solid #e5e5e5 } .block-change>* .title { font-size: 15px } .block-change>* .title h3, .block-change>* .title p { line-height: 1.6 } .block-change>* .txt { font-size: 12px } .block-change>* .txt p { line-height: 2 } .block-change>* .txt p:not(:first-child) { margin-top: 9px } .block-change .block-change-left { position: static; display: block; width: auto } .block-change .block-change-left .img img { width: 100% !important; height: auto } .block-change .block-change-left .img:after { display: none !important } .block-change .block-change-right { position: static; display: block } .block-change.pattern-intro .block-change-right { margin-top: 16px; padding-left: 0 } .block-change.pattern-1 { margin-top: 30px; height: auto !important; min-height: 0 } .block-change.pattern-1 .block-change-left, .block-change.pattern-1 .block-change-right { position: static; width: auto } .block-change.pattern-1 .block-change-left .img img { width: 100%; height: auto } .block-change.pattern-1 .block-change-right { margin-top: 25px; padding-left: 0 } .block-change.pattern-1 .block-change-right .txt { margin-top: 17px } .block-change.pattern-2 { height: auto !important; border-bottom: 0 } .block-change.pattern-2 .block-change-left, .block-change.pattern-2 .block-change-right { position: static; width: auto } .block-change.pattern-2 .block-change-left .img img { width: 100%; height: auto } .block-change.pattern-2 .block-change-right { margin-top: 25px; padding-right: 0 } .block-change.pattern-2 .block-change-right .txt { margin-top: 17px } .voices-panel { margin-top: 40px; padding-top: 40px; padding-bottom: 40px } .voices-panel .voices-title { margin: 0 auto; padding-bottom: 15px; border-bottom-width: 2px; line-height: 1 } .voices-panel .voices-title img { width: 196px; height: auto } .voices-panel .voices-contents { margin: 30px 10px 0 } .block-voice { padding: 5px 5px 40px } .block-voice .voice-intro .img img { width: 100%; height: auto } .block-voice .voice-intro .label { position: absolute; bottom: -28px; right: auto; left: 15px; z-index: 10; margin-top: 28px; margin-right: 100px; padding: 0; font-size: 10px; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%) } .block-voice .voice-intro .label p { line-height: 1.5 } .block-voice .voice-intro .product { left: auto; right: 0; bottom: -110px; width: 141px; height: 141px; padding-top: 16px; -webkit-transform: none; -ms-transform: none; transform: none } .block-voice .voice-intro .product img { width: 48px; height: auto } .block-voice .voice-intro .product .product-name { width: 69px; margin-bottom: 10px; padding-bottom: 7px; line-height: 1; font-size: 0 } .block-voice .voice-intro .product .product-name img { width: 47px; height: auto } .the-voice { position: relative; z-index: 100; margin: 83px 15px 0; font-size: 14px; font-weight: bold } .the-voice p { margin: 0; line-height: 1.7 } .voices-panel .voice-band { margin: 0 -5px } .voices-panel .voice-band .txt { font-size: 14px } .voices-panel .voice-lead { margin: 24px 15px 0; font-size: 12px; letter-spacing: .06em } .voices-panel .voice-lead p { line-height: 2 } .voices-panel .block-change>* .title { font-size: 14px } .voices-panel .block-change>* .title h4, .voices-panel .block-change>* .title p { line-height: 1.7 } .voices-panel .block-change>* .txt { margin-top: 17px; font-size: 12px } .voices-panel .block-change>* .txt p { line-height: 2 } .voices-panel .block-change.pattern-2 { margin-top: 40px; padding-bottom: 35px } .voices-panel .block-change.pattern-2 .block-change-right { padding: 0 } .voices-panel .block-change.pattern-1 { margin-top: 40px; border-bottom: 0; padding-bottom: 0 } .voices-panel .block-change.pattern-1 .block-change-right { padding: 0 } .voices-panel .block-change.pattern-1 .block-change-right .title { margin-top: 0; padding-left: 0; letter-spacing: .12em } .voices-panel .voice-btns { margin: 40px 15px 0 } .voices-panel .voice-btns .btn { width: 100%; padding: 14px 17px; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 12px; background: #d7233b; border-color: #d7233b; letter-spacing: .1em } .voices-panel .voice-btns .btn .icn-right { right: 12px; width: 17px; height: 7px } .voices-panel .voice-btns .btn .icn-right img { width: 100%; height: auto } .functions-panel { padding: 40px 0 0 } .functions-panel .functions-title { padding-bottom: 15px; border-bottom-width: 2px; font-size: 0 } .functions-panel .functions-title img { width: 102px; height: auto } .functions-panel .functions-intro { margin-top: 17px } .functions-panel .functions-intro .lead { font-size: 14px; line-height: 2; letter-spacing: .1em } .functions-panel .functions-intro .txt { margin-top: 8px; font-size: 10px; line-height: 1.8; letter-spacing: .1em } .functions-panel .block-cards { margin-top: 0 } .functions-panel .block-cards .card .card-intro a .img { opacity: 1 } .functions-panel .block-cards .card .card-intro a span.btn { color: #d7233b; border-color: #d7233b; background: transparent } .functions-panel .block-cards .card .card-intro a span.btn .icn-right img { top: 0 } .functions-panel .block-cards .card .card-details a.btn { color: #d7233b; border-color: #d7233b; background: transparent } .block-cards { margin: 30px 15px 0 } .block-cards .card { width: 100%; float: none; border: 0; border-bottom: 1px dotted #d7233b !important } .block-cards .card:last-child { border-bottom: 0 !important } .block-cards .card .card-intro a { padding-top: 30px !important; padding-bottom: 106px !important } .block-cards .card .card-intro .btn { width: 175px; bottom: 30px !important; -webkit-box-sizing: border-box; box-sizing: border-box; padding-top: 15px; padding-bottom: 15px; letter-spacing: .1em } .block-cards .card .card-intro .btn .icn-right { right: 15px; width: 11px; height: 11px } .block-cards .card .card-intro .btn .icn-right img { width: 100%; height: auto } .block-cards .card .card-intro .img-wrap { width: 68.96552%; height: auto } .block-cards .card .card-intro .img-wrap .img { width: auto; height: auto } .block-cards .card .card-intro .img-wrap .ballon { width: 37% } .block-cards .card .card-intro .img-wrap .ballon img { width: 100%; height: auto } .block-cards .card .card-intro .type { margin-top: 25px } .block-cards .card .card-intro .type p { height: 12px } .block-cards .card .card-intro .type img { width: 118px; height: auto } .block-cards .card .card-intro .type.pattern-820 img { margin-top: -44px; margin-left: 52px } .block-cards .card .card-intro .title { margin-top: 17px; height: auto !important; font-size: 14px } .block-cards .card .card-intro .title .sub-title { margin-top: 5px; font-size: 11px; line-height: 1.4 } .block-cards .card .card-details .card-details-header { height: 109px } .block-cards .card .card-details .card-details-header .title { margin: 0; font-size: 14px; line-height: 2 } .block-cards .card .card-details .card-details-header .sub-title { margin: 0; font-size: 10px } .block-cards .card .card-details .card-details-body { padding: 26px 26px 0 } .block-cards .card .card-details .card-details-body p:not(.caution) { font-size: 12px } .block-cards .card .card-details .card-details-body p.caution { font-size: 10px } .block-cards .card .card-details .btn { width: 175px; bottom: 31px; -webkit-box-sizing: border-box; box-sizing: border-box; padding-top: 15px; padding-bottom: 15px } .block-cards .card .card-details .btn .icn-right { right: 15px; width: 11px; height: 11px } .block-cards .card .card-details .btn .icn-right img { width: 100%; height: auto } .features-panel { margin-top: 10px; padding: 40px 0 0 } .features-panel .features-title { padding-bottom: 15px; border-bottom-width: 2px } .features-panel .features-title img { width: 90px; height: auto } .features-panel .features-intro { margin-top: 13px } .features-panel .features-intro .lead { font-size: 14px; line-height: 2; letter-spacing: .1em } .features-panel .block-features { margin-top: 35px } .features-panel .block-features .feature { display: block; width: auto; margin: 0 15px 38px !important } .features-panel .block-features .feature>* { position: static; display: block; padding: 0 } .features-panel .block-features .feature .feature-img { width: auto } .features-panel .block-features .feature .feature-img img { width: 100%; height: auto } .features-panel .block-features .feature .feature-contents { margin-top: 23px } .features-panel .block-features .feature .feature-contents .lead { height: auto !important; margin: 0; font-size: 14px; text-align: center; letter-spacing: .05em } .features-panel .block-features .feature .feature-contents .lead p { line-height: 2 } .features-panel .block-features .feature .feature-contents .txt { font-size: 12px; letter-spacing: .08em } .features-panel .block-features .feature .feature-contents .txt p { line-height: 2 } .features-panel .block-features .feature .feature-contents .txt p.caution { margin-top: 10px; font-size: 10px } .features-panel .block-features .feature .feature-contents .type { margin-top: 25px; text-align: center } .features-panel .block-features .feature .feature-contents .type p { height: 12px } .features-panel .block-features .feature .feature-contents .type img { width: 118px; height: auto } .features-panel .block-features .feature .feature-contents .type.pattern-820 img { margin-top: -44px; margin-left: 52px } } /*# sourceMappingURL=top.css.map */