@media (min-width: 1px) and (max-width: 860px) {
    .isPC {
        display: none !important;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    .isSP {
        display: none !important;
    }
}

html,
body,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
span {
    list-style-type: none;
    margin: 0;
    padding: 0;
    font-weight: inherit;
}

img,
svg,
small {
    display: block;
}

h1,
h2,
h3,
h4,
h5,
h6,
em {
    font-weight: inherit;
    font-style: normal;
}

a {
    color: #000;
    text-decoration: none;
}

*:focus {
    outline: none;
}

.footer-bar_3-logos {
    background-color: #fff;
    position: relative;
}

.o-mainFooter {
    position: relative;
    background-color: #bbb;
}

#modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 6000;
    height: 100%;
    display: none;
    background-color: rgba(0, 0, 0, 0.8);
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

@media (min-width: 1px) and (max-width: 860px) {
    #modal {
        width: calc(100% - 5px * 2);
        padding: 0 5px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    #modal {
        width: calc(100%);
        padding: 0 100px;
    }
}

#modal.open {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

#modal .frame-movie {
    width: 100%;
    max-width: 960px;
    position: relative;
}

#modal .frame-movie:before {
    content: "";
    display: block;
    padding-top: calc(9 / 16 * 100%);
}

#modal .frame-movie #target-movie {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#modal .frame-movie .btn-close {
    position: absolute;
}

@media (min-width: 1px) and (max-width: 860px) {
    #modal .frame-movie .btn-close {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/modal-close-sp.png");
        background-size: 100% 100%;
        width: 32px;
        height: 32px;
        display: block;
        bottom: calc(100% + 10px);
        right: 10px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    #modal .frame-movie .btn-close {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/modal-close.png");
        background-size: 100% 100%;
        width: 37px;
        height: 37px;
        display: block;
        top: 0;
        left: calc(100% + 18px);
    }
}

article#kv {
    background-color: #fff;
    position: relative;
    width: 100%;
    background-color: #e8ecee;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#kv {
        height: calc(1110px / 2);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#kv {
        height: 100vh;
    }
}

article#kv.in .area-front .box-copy-logo {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: 0.2s opacity linear, 1s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: 0.2s opacity linear, 1s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: 0.2s opacity linear, 1s transform cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: 0.2s opacity linear, 1s transform cubic-bezier(0.165, 0.84, 0.44, 1), 1s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1);
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#kv.in .area-front .box-copy-logo {
        margin: calc(230 / 1400 * 100vw) auto 0;
        position: relative;
        z-index: 100;
    }
}

article#kv.in .area-front .wrap-item {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: 0.2s opacity linear 0.6s, 1s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.6s;
    transition: 0.2s opacity linear 0.6s, 1s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.6s;
    transition: 0.2s opacity linear 0.6s, 1s transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.6s;
    transition: 0.2s opacity linear 0.6s, 1s transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.6s, 1s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.6s;
}

article#kv.in .scroll {
    opacity: 1;
    -webkit-transition: 0.4s opacity linear 1s;
    transition: 0.4s opacity linear 1s;
}

article#kv .bg {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#kv .bg {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/kv-sp.jpg");
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#kv .bg {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/kv.jpg");
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#kv .area-front {
        position: absolute;
        top: 81px;
        right: 30px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#kv .area-front {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
}

article#kv .area-front .box-copy-logo {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#kv .area-front .box-copy-logo {
        display: table;
    }
}

article#kv .area-front .box-copy-logo .copy .elem.isSP {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/kv-copy-sp.png");
    background-size: 100% 100%;
    width: 133px;
    height: 33px;
    display: block;
    position: relative;
    left: 4px;
    margin: 0 auto;
}

article#kv .area-front .box-copy-logo .copy .elem.isPC {
    margin: 0 auto;
    width: calc((306 / 1400) * 100vw);
    max-width: 9999px;
    position: relative;
}

article#kv .area-front .box-copy-logo .copy .elem.isPC:before {
    content: "";
    display: block;
    padding-top: 4.738562091503268%;
}

article#kv .area-front .box-copy-logo .copy .elem.isPC .photo {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/kv-copy.png");
    background-size: 100% 100%;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#kv .area-front .box-copy-logo .logo {
        width: calc(303px / 2);
        height: calc(134px / 2);
        margin-top: 26px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#kv .area-front .box-copy-logo .logo {
        width: calc(359 / 1400 * 100vw);
        margin: calc(0 / 1400 * 100vw) auto 0;
        /* margin-top: calc(43 / 1400 * 100vw); */
        position: relative;
    }
    article#kv .area-front .box-copy-logo .logo:before {
        content: "";
        display: block;
        padding-top: calc(159 / 359 * 100%);
    }
}

article#kv .area-front .box-copy-logo .logo svg {
    width: 100%;
    height: 100%;
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#kv .area-front .box-copy-logo .logo svg {
        position: absolute;
        top: 0;
        left: 0;
    }
}


/*
article#kv.in .area-front .bnr_kv_twitter {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition: 0.2s opacity linear 0.6s, 1s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.6s;
  transition: 0.2s opacity linear 0.6s, 1s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.6s;
  transition: 0.2s opacity linear 0.6s, 1s transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.6s;
  transition: 0.2s opacity linear 0.6s, 1s transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.6s, 1s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.6s;
}
*/

@media (min-width: 861px) and (max-width: 99999px) {
    article#kv .area-front .box-copy-logo .bnr_kv_twitter {
        width: calc(412 / 1400 * 100vw);
        margin: calc(70 / 1400 * 100vw) auto 0;
        position: relative;
    }
    article#kv .area-front .box-copy-logo .bnr_kv_twitter img {
        width: 100%;
    }
    article#kv .area-front .box-copy-logo .bnr_kv_twitter a:hover {
        opacity: .8;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    .bnr_kv_twitter {
        padding: 10vw 20px 3vw;
    }
    .bnr_kv_twitter img {
        width: 100%;
    }
}

article#kv .area-front .wrap-item {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
}

@media (min-width: 1px) and (max-width: 860px) {
    article#kv .area-front .wrap-item {
        margin-top: 24px;
        margin-right: -2px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#kv .area-front .wrap-item {
        position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
}

article#kv .area-front .wrap-item .item .elem.isSP {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/kv-item-sp.png");
    background-size: 100% 100%;
    width: 188px;
    height: 190px;
    display: block;
}

article#kv .area-front .wrap-item .item .elem.isPC {
    width: calc((443 / 1400) * 100vw);
    max-width: 9999px;
    position: relative;
    top: 36px;
    margin-right: calc(78 / 1400 * 100vw);
}

article#kv .area-front .wrap-item .item .elem.isPC:before {
    content: "";
    display: block;
    padding-top: 100.22573363431151%;
}

article#kv .area-front .wrap-item .item .elem.isPC .photo {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/kv-item.png");
    background-size: 100% 100%;
}

article#kv .scroll {
    position: absolute;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    right: 22px;
    opacity: 0;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#kv .scroll {
        display: none;
    }
}

article#kv .scroll .scroll-hint {
    overflow: hidden;
    position: relative;
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#kv .scroll .scroll-hint {
        width: 2px;
        height: 80px;
        margin-right: 6px;
    }
}

article#kv .scroll .scroll-hint .tip {
    width: 100%;
    position: absolute;
    left: 0;
    background-color: #456;
    height: 80%;
}

article#kv .scroll .scroll-hint .tip.tip-1 {
    -webkit-animation: scrollHintLineAnimation 2.4s ease-in-out 0s infinite;
    animation: scrollHintLineAnimation 2.4s ease-in-out 0s infinite;
}

article#kv .scroll .scroll-hint .tip.tip-2 {
    -webkit-animation: scrollHintLineAnimation 2.4s ease-in-out 1.2s infinite;
    animation: scrollHintLineAnimation 2.4s ease-in-out 1.2s infinite;
}

@-webkit-keyframes scrollHintLineAnimation {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    100% {
        -webkit-transform: translateY(125%);
        transform: translateY(125%);
    }
}

@keyframes scrollHintLineAnimation {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    100% {
        -webkit-transform: translateY(125%);
        transform: translateY(125%);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#kv .scroll h5 {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/kv-scroll-text.png");
        background-size: 100% 100%;
        width: 9px;
        height: 53px;
        display: block;
    }
}

article#overview {
    background-color: #ecf1f4;
    position: relative;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview {
        padding: 40px 0 112px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#overview {
        padding: 70px 0 0;
    }
}

article#overview section.normal {
    position: relative;
    width: 100%;
    max-width: 1800px;
    margin: 76px auto 0;
}

article#overview section.normal:before {
    content: "";
    display: block;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal:before {
        padding-top: 100%;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#overview section.normal:before {
        padding-top: calc(1575 / 2797 * 100%);
    }
}

article#overview section.normal .area-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-bg {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/normal-photo-sp.jpg");
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#overview section.normal .area-bg {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/normal-photo.jpg");
    }
}

article#overview section.normal .area-elem {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

article#overview section.normal .area-elem[animation-status="play"] h3 {
    opacity: 0;
    -webkit-transition: 0.2s opacity 0.8s linear;
    transition: 0.2s opacity 0.8s linear;
}

article#overview section.normal .area-elem h3 {
    position: relative;
    text-align: center;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem h3 {
        color: #456;
        font-size: 18px;
        font-weight: 500;
        font-size: calc(36 / 750 * 100vw);
        top: calc(170 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem h3 {
        color: #456;
        font-size: 27px;
        font-weight: 500;
        font-size: calc(27 / 1400 * 100vw);
        top: calc(166 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem h3 {
        top: 213.42857142857142px;
        color: #456;
        font-size: 34.714285714285715px;
        font-weight: 500;
    }
}

article#overview section.normal .area-elem ol.group[status="in"] li {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

article#overview section.normal .area-elem ol.group[status="in"] li[num="1"] {
    -webkit-transition: 0.6s opacity 0.8s linear, 1.2s -webkit-transform 0.8s cubic-bezier(0.39, 0.575, 0.565, 1);
    transition: 0.6s opacity 0.8s linear, 1.2s -webkit-transform 0.8s cubic-bezier(0.39, 0.575, 0.565, 1);
    transition: 0.6s opacity 0.8s linear, 1.2s transform 0.8s cubic-bezier(0.39, 0.575, 0.565, 1);
    transition: 0.6s opacity 0.8s linear, 1.2s transform 0.8s cubic-bezier(0.39, 0.575, 0.565, 1), 1.2s -webkit-transform 0.8s cubic-bezier(0.39, 0.575, 0.565, 1);
}

article#overview section.normal .area-elem ol.group[status="in"] li[num="2"] {
    -webkit-transition: 0.6s opacity 1.6s linear, 1.2s -webkit-transform 1.6s cubic-bezier(0.39, 0.575, 0.565, 1);
    transition: 0.6s opacity 1.6s linear, 1.2s -webkit-transform 1.6s cubic-bezier(0.39, 0.575, 0.565, 1);
    transition: 0.6s opacity 1.6s linear, 1.2s transform 1.6s cubic-bezier(0.39, 0.575, 0.565, 1);
    transition: 0.6s opacity 1.6s linear, 1.2s transform 1.6s cubic-bezier(0.39, 0.575, 0.565, 1), 1.2s -webkit-transform 1.6s cubic-bezier(0.39, 0.575, 0.565, 1);
}

article#overview section.normal .area-elem ol.group[status="in"] li[num="3"] {
    -webkit-transition: 0.6s opacity 2.4s linear, 1.2s -webkit-transform 2.4s cubic-bezier(0.39, 0.575, 0.565, 1);
    transition: 0.6s opacity 2.4s linear, 1.2s -webkit-transform 2.4s cubic-bezier(0.39, 0.575, 0.565, 1);
    transition: 0.6s opacity 2.4s linear, 1.2s transform 2.4s cubic-bezier(0.39, 0.575, 0.565, 1);
    transition: 0.6s opacity 2.4s linear, 1.2s transform 2.4s cubic-bezier(0.39, 0.575, 0.565, 1), 1.2s -webkit-transform 2.4s cubic-bezier(0.39, 0.575, 0.565, 1);
}

article#overview section.normal .area-elem ol.group li {
    opacity: 0;
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
    -webkit-transition: 0.3s opacity 0s linear, 0.6s -webkit-transform 0s cubic-bezier(0.39, 0.575, 0.565, 1);
    transition: 0.3s opacity 0s linear, 0.6s -webkit-transform 0s cubic-bezier(0.39, 0.575, 0.565, 1);
    transition: 0.3s opacity 0s linear, 0.6s transform 0s cubic-bezier(0.39, 0.575, 0.565, 1);
    transition: 0.3s opacity 0s linear, 0.6s transform 0s cubic-bezier(0.39, 0.575, 0.565, 1), 0.6s -webkit-transform 0s cubic-bezier(0.39, 0.575, 0.565, 1);
    position: absolute;
}

article#overview section.normal .area-elem ol.group li h4 {
    text-align: center;
    letter-spacing: 0.12em;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group li h4 {
        color: #456;
        font-size: 26px;
        font-weight: 500;
        font-size: calc(26 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group li h4 {
        color: #456;
        font-size: 24px;
        font-weight: 500;
        font-size: calc(24 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group li h4 {
        color: #456;
        font-size: 30.857142857142858px;
        font-weight: 500;
    }
}

article#overview section.normal .area-elem ol.group li h5 {
    text-align: center;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group li h5 {
        color: #456;
        font-size: 20px;
        font-weight: 500;
        font-size: calc(20 / 750 * 100vw);
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
        -webkit-transform-origin: top center;
        transform-origin: top center;
        margin-top: 4px;
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group li h5 {
        color: #456;
        font-size: 14px;
        font-weight: 500;
        font-size: calc(14 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group li h5 {
        color: #456;
        font-size: 18px;
        font-weight: 500;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group li h5 {
        margin-top: 0.6em;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="1"] li[num="1"] {
        top: calc(106 / 750 * 100vw);
        left: calc(67 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="1"] li[num="1"] {
        top: calc(123 / 1400 * 100vw);
        left: calc(232 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="1"] li[num="1"] {
        top: 158.14285714285714px;
        left: 298.2857142857143px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="1"] li[num="2"] {
        top: calc(319 / 750 * 100vw);
        left: calc(208 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="1"] li[num="2"] {
        top: calc(207 / 1400 * 100vw);
        left: calc(558 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="1"] li[num="2"] {
        top: 266.14285714285717px;
        left: 717.4285714285714px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="1"] li[num="3"] {
        top: calc(179 / 750 * 100vw);
        left: calc(403 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="1"] li[num="3"] {
        top: calc(87 / 1400 * 100vw);
        left: calc(908 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="1"] li[num="3"] {
        top: 111.85714285714286px;
        left: 1167.4285714285713px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="2"] li[num="1"] {
        top: calc(324 / 750 * 100vw);
        left: calc(70 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="2"] li[num="1"] {
        top: calc(209 / 1400 * 100vw);
        left: calc(188 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="2"] li[num="1"] {
        top: 268.7142857142857px;
        left: 241.71428571428572px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="2"] li[num="2"] {
        top: calc(237 / 750 * 100vw);
        left: calc(189 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="2"] li[num="2"] {
        top: calc(144 / 1400 * 100vw);
        left: calc(461 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="2"] li[num="2"] {
        top: 185.14285714285714px;
        left: 592.7142857142857px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="2"] li[num="3"] {
        top: calc(81 / 750 * 100vw);
        left: calc(429 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="2"] li[num="3"] {
        top: calc(66 / 1400 * 100vw);
        left: calc(912 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="2"] li[num="3"] {
        top: 84.85714285714286px;
        left: 1172.5714285714287px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="3"] li[num="1"] {
        top: calc(87 / 750 * 100vw);
        left: calc(100 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="3"] li[num="1"] {
        top: calc(95 / 1400 * 100vw);
        left: calc(137 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="3"] li[num="1"] {
        top: 122.14285714285714px;
        left: 176.14285714285714px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="3"] li[num="2"] {
        top: calc(263 / 750 * 100vw);
        left: calc(272 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="3"] li[num="2"] {
        top: calc(171 / 1400 * 100vw);
        left: calc(569 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="3"] li[num="2"] {
        top: 219.85714285714286px;
        left: 731.5714285714286px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="3"] li[num="3"] {
        top: calc(164 / 750 * 100vw);
        left: calc(555 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="3"] li[num="3"] {
        top: calc(193 / 1400 * 100vw);
        left: calc(1070 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="3"] li[num="3"] {
        top: 248.14285714285714px;
        left: 1375.7142857142858px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="4"] li[num="1"] {
        top: calc(169 / 750 * 100vw);
        left: calc(61 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="4"] li[num="1"] {
        top: calc(95 / 1400 * 100vw);
        left: calc(269 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="4"] li[num="1"] {
        top: 122.14285714285714px;
        left: 345.85714285714283px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="4"] li[num="2"] {
        top: calc(289 / 750 * 100vw);
        left: calc(312 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="4"] li[num="2"] {
        top: calc(237 / 1400 * 100vw);
        left: calc(511 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="4"] li[num="2"] {
        top: 304.7142857142857px;
        left: 657px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="4"] li[num="3"] {
        top: calc(88 / 750 * 100vw);
        left: calc(435 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="4"] li[num="3"] {
        top: calc(62 / 1400 * 100vw);
        left: calc(830 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="4"] li[num="3"] {
        top: 79.71428571428571px;
        left: 1067.142857142857px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="5"] li[num="1"] {
        top: calc(86 / 750 * 100vw);
        left: calc(51 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="5"] li[num="1"] {
        top: calc(122 / 1400 * 100vw);
        left: calc(177 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="5"] li[num="1"] {
        top: 156.85714285714286px;
        left: 227.57142857142858px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="5"] li[num="2"] {
        top: calc(243 / 750 * 100vw);
        left: calc(249 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="5"] li[num="2"] {
        top: calc(207 / 1400 * 100vw);
        left: calc(589 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="5"] li[num="2"] {
        top: 266.14285714285717px;
        left: 757.2857142857143px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="5"] li[num="3"] {
        top: calc(292 / 750 * 100vw);
        left: calc(519 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="5"] li[num="3"] {
        top: calc(87 / 1400 * 100vw);
        left: calc(929 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="5"] li[num="3"] {
        top: 111.85714285714286px;
        left: 1194.4285714285713px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="6"] li[num="1"] {
        top: calc(241 / 750 * 100vw);
        left: calc(84 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="6"] li[num="1"] {
        top: calc(206 / 1400 * 100vw);
        left: calc(160 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="6"] li[num="1"] {
        top: 264.85714285714283px;
        left: 205.71428571428572px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="6"] li[num="2"] {
        top: calc(114 / 750 * 100vw);
        left: calc(274 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="6"] li[num="2"] {
        top: calc(135 / 1400 * 100vw);
        left: calc(550 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="6"] li[num="2"] {
        top: 173.57142857142858px;
        left: 707.1428571428571px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.normal .area-elem ol.group[num="6"] li[num="3"] {
        top: calc(301 / 750 * 100vw);
        left: calc(455 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1800px) {
    article#overview section.normal .area-elem ol.group[num="6"] li[num="3"] {
        top: calc(66 / 1400 * 100vw);
        left: calc(1028 / 1400 * 100vw);
    }
}

@media (min-width: 1801px) and (max-width: 99999px) {
    article#overview section.normal .area-elem ol.group[num="6"] li[num="3"] {
        top: 84.85714285714286px;
        left: 1321.7142857142858px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.movie {
        padding: 0 25px;
    }
}

article#overview section.movie .btn-movie {
    width: 100%;
    max-width: 960px;
    position: relative;
    margin: 0 auto;
    overflow: hidden;
}

article#overview section.movie .btn-movie:before {
    content: "";
    display: block;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.movie .btn-movie:before {
        padding-top: 100%;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#overview section.movie .btn-movie:before {
        padding-top: calc(540 / 960 * 100%);
    }
}

article#overview section.movie .btn-movie.hover:hover .photo {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    -webkit-transition: 1.5s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: 1.5s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: 1.5s transform cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: 1.5s transform cubic-bezier(0.075, 0.82, 0.165, 1), 1.5s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
}

article#overview section.movie .btn-movie .photo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/overview-movie.jpg");
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: 0.2s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: 0.2s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: 0.2s transform cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: 0.2s transform cubic-bezier(0.075, 0.82, 0.165, 1), 0.2s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
}

article#overview section.movie .btn-movie .btn-play {
    width: 95px;
    height: 95px;
    background-color: #fff;
    border-radius: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    bottom: 10px;
    right: 10px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.movie .btn-movie .btn-play {
        width: 72px;
        height: 72px;
    }
}

article#overview section.movie .btn-movie .btn-play .tip {
    position: relative;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10.5px 0 10.5px 17px;
    border-color: transparent transparent transparent #ff5c7b;
    left: 2px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.movie .btn-movie .btn-play .tip {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 8px 0 8px 12px;
        border-color: transparent transparent transparent #ff5c7b;
        left: 2px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#overview section.movie .btn-movie .btn-play .tip {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 10.5px 0 10.5px 17px;
        border-color: transparent transparent transparent #ff5c7b;
        left: 2px;
    }
}

article#overview section.statement {
    padding-bottom: 73px;
}

article#overview section.statement .texts {
    margin-top: 105px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.statement .texts {
        margin-top: 50px;
    }
}

article#overview section.statement .texts h4 {
    color: #456;
    font-size: 17px;
    font-weight: 300;
    line-height: calc(38 / 17 * 1em);
    letter-spacing: 0.14em;
    text-align: center;
}

article#overview section.statement .texts h4:not(:first-child) {
    margin-top: 1.6em;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.statement .texts h4 {
        color: #456;
        font-size: 15px;
        font-weight: 300;
    }
}

article#overview section.statement .texts h4>span.line {
    display: block;
    opacity: 0;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
}

article#overview section.statement .texts h4>span.line.in {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: 0.2s opacity linear, 1s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: 0.2s opacity linear, 1s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: 0.2s opacity linear, 1s transform cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: 0.2s opacity linear, 1s transform cubic-bezier(0.165, 0.84, 0.44, 1), 1s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1);
}

article#overview section.statement .logo {
    margin: 23px auto 0;
    display: table;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.statement .logo {
        margin: 50px auto 0;
    }
}

article#overview section.statement .logo svg {
    width: 100%;
    height: 100%;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.statement .logo svg {
        width: 176.43px;
        height: 77.58px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#overview section.statement .logo svg {
        width: 176.43px;
        height: 77.58px;
    }
}

article#overview section.statement .logo svg path {
    fill: #3b5363;
}

article#overview section.whats {
    overflow: hidden;
    position: relative;
}

article#overview section.whats .bg {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/overview-whats-photo.jpg");
    width: calc(100% + 240px);
    max-width: 1660px;
    position: relative;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    left: 50%;
    margin-left: calc((100% + 240px) / -2);
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.whats .bg {
        display: none;
    }
}

@media (min-width: 1400px) and (max-width: 99999px) {
    article#overview section.whats .bg {
        margin-left: -830px;
    }
}

article#overview section.whats .bg:before {
    content: "";
    display: block;
    padding-top: calc(860 / 1660 * 100%);
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#overview section.whats .elem {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}

article#overview section.whats .elem .title {
    display: table;
    position: relative;
    z-index: 1;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.whats .elem .title {
        margin: 0 auto;
    }
}

@media (min-width: 861px) and (max-width: 1399px) {
    article#overview section.whats .elem .title {
        margin: calc(67 / 1400 * 100vw) auto 0;
    }
}

@media (min-width: 1400px) and (max-width: 99999px) {
    article#overview section.whats .elem .title {
        margin: 67px auto 0;
    }
}

article#overview section.whats .elem .title h3 {
    letter-spacing: -0.03em;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.whats .elem .title h3 {
        font-weight: 200;
        font-family: "Montserrat", sans-serif;
        color: #456;
        font-size: 45px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#overview section.whats .elem .title h3 {
        font-weight: 200;
        font-family: "Montserrat", sans-serif;
        color: #456;
        font-size: calc(54 / 1400 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#overview section.whats .elem .title h3 {
        font-size: 54px;
    }
}

article#overview section.whats .elem .title .line {
    width: 100%;
    height: 2px;
    background-color: #456;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
}

article#overview section.whats .elem .title.in .line {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transition: 0.6s -webkit-transform cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition: 0.6s -webkit-transform cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition: 0.6s transform cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition: 0.6s transform cubic-bezier(0.785, 0.135, 0.15, 0.86), 0.6s -webkit-transform cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

article#overview section.whats .elem .box-photo.isSP {
    position: relative;
    width: 100%;
    margin-top: calc(-75 / 750 * 100vw);
}

article#overview section.whats .elem .box-photo.isSP:before {
    content: "";
    display: block;
    padding-top: calc(540 / 750 * 100%);
}

article#overview section.whats .elem .box-photo.isSP .photo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/overview-whats-photo-sp.jpg");
}

article#overview section.whats .elem h4.heading {
    text-align: center;
    position: relative;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.whats .elem h4.heading {
        color: #456;
        font-size: 25px;
        font-weight: 500;
        line-height: calc(40 / 25 * 1em);
    }
    article#overview section.whats .elem h4.heading span.small {
        color: #456;
        font-size: 12px;
        font-weight: 500;
        position: relative;
        top: -0.7em;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#overview section.whats .elem h4.heading {
        color: #456;
        font-size: calc(27 / 1400 * 100vw);
        font-weight: 500;
    }
    article#overview section.whats .elem h4.heading span.small {
        color: #456;
        font-size: calc(14 / 1400 * 100vw);
        font-weight: 500;
        position: relative;
        top: -0.7em;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.whats .elem h4.heading {
        margin-top: calc(-62 / 750 * 100vw);
    }
}

@media (min-width: 861px) and (max-width: 1399px) {
    article#overview section.whats .elem h4.heading {
        margin-top: calc(410 / 1400 * 100vw);
    }
}

@media (min-width: 1400px) and (max-width: 99999px) {
    article#overview section.whats .elem h4.heading {
        margin-top: 410px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#overview section.whats .elem h4.heading {
        font-size: 27px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#overview section.whats .elem h4.heading span.small {
        font-size: 14px;
    }
}

article#overview section.whats .elem p {
    text-align: center;
    position: relative;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.whats .elem p {
        color: #456;
        font-size: 15px;
        font-weight: 300;
        line-height: calc(35 / 15 * 1em);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#overview section.whats .elem p {
        color: #456;
        font-size: calc(16 / 1400 * 100vw);
        font-weight: 300;
        line-height: calc(36 / 16 * 1em);
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.whats .elem p {
        margin-top: 30px;
    }
}

@media (min-width: 861px) and (max-width: 1399px) {
    article#overview section.whats .elem p {
        margin-top: calc(50 / 1400 * 100vw);
    }
}

@media (min-width: 1400px) and (max-width: 99999px) {
    article#overview section.whats .elem p {
        margin-top: 50px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#overview section.whats .elem p {
        font-size: 16px;
    }
}

article#overview section.whats .elem small {
    text-align: center;
    position: relative;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.whats .elem small {
        color: #456;
        font-size: 10px;
        font-weight: 300;
        line-height: calc(16 / 10 * 1em);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#overview section.whats .elem small {
        color: #456;
        font-size: calc(12 / 1400 * 100vw);
        font-weight: 300;
        line-height: calc(20 / 12 * 1em);
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#overview section.whats .elem small {
        margin-top: 20px;
    }
}

@media (min-width: 861px) and (max-width: 1399px) {
    article#overview section.whats .elem small {
        margin-top: calc(20 / 1400 * 100vw);
    }
}

@media (min-width: 1400px) and (max-width: 99999px) {
    article#overview section.whats .elem small {
        margin-top: 20px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#overview section.whats .elem small {
        font-size: 12px;
    }
}

article#products {
    background-color: #fff;
    position: relative;
    padding: 110px 50px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products {
        padding: 30px 25px;
    }
}

article#products ul.items {
    max-width: 1300px;
    margin: 0 auto;
}

article#products ul.items li.item {
    background-color: #ebf0f3;
    width: 100%;
    height: 300px;
    position: relative;
    overflow: hidden;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item {
        height: 250px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#products ul.items li.item {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
}

article#products ul.items li.item:not(:first-child) {
    margin-top: 10px;
}

article#products ul.items li.item .box-text {
    position: relative;
    z-index: 1;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item .box-text {
        padding: 18px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#products ul.items li.item .box-text {
        margin-left: 112px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item .box-text h4.heading {
        font-weight: 300;
        font-family: "Montserrat", sans-serif;
        color: #456;
        font-size: 26px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#products ul.items li.item .box-text h4.heading {
        font-weight: 300;
        font-family: "Montserrat", sans-serif;
        color: #456;
        font-size: 39px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item .box-text p {
        margin: 12px 0;
        color: #456;
        font-size: 12px;
        font-weight: 500;
        line-height: calc(22 / 12 * 1em);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#products ul.items li.item .box-text p {
        margin: 30px 0 20px;
        color: #456;
        font-size: 14px;
        font-weight: 500;
        line-height: calc(30 / 14 * 1em);
    }
}

article#products ul.items li.item .box-text a.btn {
    width: calc(206px - 22px - 29px);
    height: 46px;
    padding: 0 22px 0 29px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: solid 1px #456;
    border-radius: 46px;
    -webkit-transition: 0.2s;
    -moz-transform: 0.2s;
    transition: 0.2s;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item .box-text a.btn {
        width: calc(125px - 20px - 16px);
        height: 35px;
        padding: 0 20px 0 16px;
    }
}

article#products ul.items li.item .box-text a.btn.hover:hover {
    background-color: #456;
}

article#products ul.items li.item .box-text a.btn.hover:hover h6 {
    color: #fff;
}

article#products ul.items li.item .box-text a.btn.hover:hover .arrow svg path {
    fill: #fff;
}

article#products ul.items li.item .box-text a.btn h6 {
    color: #456;
    -webkit-transition: 0.2s;
    -moz-transform: 0.2s;
    transition: 0.2s;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item .box-text a.btn h6 {
        font-weight: 500;
        font-family: "Montserrat", sans-serif;
        color: #456;
        font-size: 11px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#products ul.items li.item .box-text a.btn h6 {
        font-weight: 500;
        font-family: "Montserrat", sans-serif;
        color: #456;
        font-size: 14px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item .box-text a.btn .arrow {
        width: 8px;
        height: 8px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#products ul.items li.item .box-text a.btn .arrow {
        width: 12px;
        height: 12px;
    }
}

article#products ul.items li.item .box-text a.btn .arrow svg {
    width: 100%;
    height: 100%;
}

article#products ul.items li.item .box-text a.btn .arrow svg path {
    fill: #456;
    -webkit-transition: 0.2s;
    -moz-transform: 0.2s;
    transition: 0.2s;
}

article#products ul.items li.item .photo {
    position: absolute;
    bottom: 0;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item .photo {
        right: 0;
    }
}

@media (min-width: 861px) and (max-width: 1240px) {
    article#products ul.items li.item .photo {
        right: calc(100vw - 1240px);
    }
}

@media (min-width: 1241px) and (max-width: 99999px) {
    article#products ul.items li.item .photo {
        right: 0;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item .photo[name="yoga-slim-760-carbon"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/products-yoga-slim-760-carbon-sp.png");
        background-size: 100% 100%;
        width: 202.5px;
        height: 161px;
        display: block;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#products ul.items li.item .photo[name="yoga-slim-760-carbon"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/products-yoga-slim-760-carbon.png");
        background-size: 100% 100%;
        width: 710.5px;
        height: 300px;
        display: block;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item .photo[name="yoga-slim-750i-carbon"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/products-yoga-slim-750i-carbon-sp.png");
        background-size: 100% 100%;
        width: 202.5px;
        height: 161px;
        display: block;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#products ul.items li.item .photo[name="yoga-slim-750i-carbon"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/products-yoga-slim-750i-carbon.png");
        background-size: 100% 100%;
        width: 710.5px;
        height: 300px;
        display: block;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item .photo[name="yoga-slim-950i"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/products-yoga-slim-950i-sp.png");
        background-size: 100% 100%;
        width: 200.5px;
        height: 158.5px;
        display: block;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#products ul.items li.item .photo[name="yoga-slim-950i"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/products-yoga-slim-950i.png");
        background-size: 100% 100%;
        width: 706.5px;
        height: 300px;
        display: block;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item .photo[name="yoga-slim-750i-pro"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/products-yoga-slim-750i-pro-sp.png");
        background-size: 100% 100%;
        width: 207px;
        height: 159.5px;
        display: block;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#products ul.items li.item .photo[name="yoga-slim-750i-pro"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/products-yoga-slim-750i-pro.png");
        background-size: 100% 100%;
        width: 707.5px;
        height: 300px;
        display: block;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#products ul.items li.item .photo[name="yoga-660"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/products-yoga-660-sp.png");
        background-size: 100% 100%;
        width: 198.5px;
        height: 153.5px;
        display: block;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#products ul.items li.item .photo[name="yoga-660"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/products-yoga-660.png");
        background-size: 100% 100%;
        width: 703.5px;
        height: 300px;
        display: block;
    }
}

article#performance {
    overflow: hidden;
}

article#performance ul.items li.item .area-imma {
    width: 100%;
    position: relative;
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-imma {
        height: calc(100vh * 1.5);
    }
}

article#performance ul.items li.item .area-imma .box-photo {
    width: 100%;
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-imma .box-photo {
        height: 100vh;
        left: 0;
        position: absolute;
    }
}

article#performance ul.items li.item .area-imma .box-photo:before {
    content: "";
    display: block;
    padding-top: calc(1520 / 2800 * 100%);
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-imma .box-photo:before {
        padding-top: 100%;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-imma .box-photo:not([status="fixed"]).top {
        top: 0;
    }
    article#performance ul.items li.item .area-imma .box-photo:not([status="fixed"]).bottom {
        bottom: 0;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-imma .box-photo[status="fixed"] {
        position: fixed;
        top: 0;
    }
    article#performance ul.items li.item .area-imma .box-photo[status="fixed"] h3.copy {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
        -webkit-transition: 0.2s opacity linear, 1s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
        transition: 0.2s opacity linear, 1s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
        transition: 0.2s opacity linear, 1s transform cubic-bezier(0.075, 0.82, 0.165, 1);
        transition: 0.2s opacity linear, 1s transform cubic-bezier(0.075, 0.82, 0.165, 1), 1s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
    }
}

article#performance ul.items li.item .area-imma .box-photo .photo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-imma .box-photo .photo[num="1"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-1-sp.jpg");
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-imma .box-photo .photo[num="1"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-1.jpg");
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-imma .box-photo .photo[num="2"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-2-sp.jpg");
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-imma .box-photo .photo[num="2"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-2.jpg");
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-imma .box-photo .photo[num="3"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-3-sp.jpg");
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-imma .box-photo .photo[num="3"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-3.jpg");
    }
}

article#performance ul.items li.item .area-imma .box-photo h3.copy {
    position: absolute;
    letter-spacing: 0.2em;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-imma .box-photo h3.copy {
        color: #456;
        font-size: calc(17 / 375 * 100vw);
        font-weight: 300;
        line-height: calc(35 / 17 * 1em);
    }
    article#performance ul.items li.item .area-imma .box-photo h3.copy[num="1"] {
        top: calc(147 / 750 * 100%);
        left: calc(387 / 750 * 100%);
    }
    article#performance ul.items li.item .area-imma .box-photo h3.copy[num="2"] {
        top: calc(82 / 750 * 100%);
        left: calc(401 / 750 * 100%);
    }
    article#performance ul.items li.item .area-imma .box-photo h3.copy[num="3"] {
        top: calc(78 / 750 * 100%);
        left: calc(79 / 750 * 100%);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-imma .box-photo h3.copy {
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
        opacity: 0;
        -webkit-transition: 0.2s opacity linear, 0.2s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
        transition: 0.2s opacity linear, 0.2s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
        transition: 0.2s opacity linear, 0.2s transform cubic-bezier(0.075, 0.82, 0.165, 1);
        transition: 0.2s opacity linear, 0.2s transform cubic-bezier(0.075, 0.82, 0.165, 1), 0.2s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
        color: #456;
        font-size: calc(26 / 1400 * 100vw);
        font-weight: 300;
        line-height: calc(60 / 26 * 1em);
    }
    article#performance ul.items li.item .area-imma .box-photo h3.copy[num="1"] {
        top: calc(175 / 760 * 100%);
        left: calc(947 / 1400 * 100%);
    }
    article#performance ul.items li.item .area-imma .box-photo h3.copy[num="2"] {
        top: calc(189 / 760 * 100%);
        left: calc(223 / 1400 * 100%);
    }
    article#performance ul.items li.item .area-imma .box-photo h3.copy[num="3"] {
        top: calc(230 / 760 * 100%);
        left: calc(964 / 1400 * 100%);
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-imma .box-photo h3.copy {
        font-size: 26px;
    }
}

article#performance ul.items li.item .area-element {
    position: relative;
    z-index: 1;
    background-color: #fff;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element[num="1"] {
        padding: 55px 0 60px;
    }
    article#performance ul.items li.item .area-element[num="2"] {
        padding: 55px 0 30px;
    }
    article#performance ul.items li.item .area-element[num="3"] {
        padding: 55px 0 0;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element[num="1"] {
        padding: calc(93 / 1400 * 100vw) 0 calc(112 / 1400 * 100vw);
    }
    article#performance ul.items li.item .area-element[num="2"] {
        padding: calc(18 / 1400 * 100vw) 0 calc(67 / 1400 * 100vw);
    }
    article#performance ul.items li.item .area-element[num="3"] {
        padding: calc(97 / 1400 * 100vw) 0 0;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points {
        padding: 0 25px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points {
        padding: 0 100px;
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point {
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point[text-pos="right"] .frame-text {
        margin-left: calc(723 / 1200 * 100%);
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point[num="4"] {
        margin-top: 58px;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point[num="6"] {
        margin-top: 56px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point[num="1"] {
        padding: 0 0 calc(22 / 1400 * 100vw);
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point[num="2"] {
        padding: calc(16 / 1400 * 100vw) 0 0;
        margin-top: 116px;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point[num="3"] {
        padding: calc(111 / 1400 * 100vw) 0 calc(90 / 1400 * 100vw);
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point[num="4"] {
        padding: calc(97 / 1400 * 100vw) 0 calc(205 / 1400 * 100vw);
        margin-top: 20px;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point[num="5"] {
        padding: 0 0 204px;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point[num="6"] {
        margin-top: calc(145 / 1400 * 100vw);
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text {
    position: relative;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text {
        z-index: 2;
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .text-point {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .text-point .tip {
    width: 10px;
    height: 2px;
    background-color: #ff5c7b;
    margin-right: 12px;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .text-point .tip {
        width: 8px;
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .text-point h6 {
    opacity: 0;
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px);
    color: #ff5c7b !important;
    font-weight: 500;
    font-family: "Montserrat", sans-serif;
    color: #456;
    font-size: 12px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .text-point h6 {
        font-weight: 500;
        font-family: "Montserrat", sans-serif;
        color: #456;
        font-size: 11px;
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .text-point.in .tip {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transition: 0.4s -webkit-transform cubic-bezier(0.6, 0.04, 0.98, 0.335);
    transition: 0.4s -webkit-transform cubic-bezier(0.6, 0.04, 0.98, 0.335);
    transition: 0.4s transform cubic-bezier(0.6, 0.04, 0.98, 0.335);
    transition: 0.4s transform cubic-bezier(0.6, 0.04, 0.98, 0.335), 0.4s -webkit-transform cubic-bezier(0.6, 0.04, 0.98, 0.335);
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .text-point.in h6 {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: 0.1s opacity linear 0.4s, 0.6s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1) 0.4s;
    transition: 0.1s opacity linear 0.4s, 0.6s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1) 0.4s;
    transition: 0.1s opacity linear 0.4s, 0.6s transform cubic-bezier(0.075, 0.82, 0.165, 1) 0.4s;
    transition: 0.1s opacity linear 0.4s, 0.6s transform cubic-bezier(0.075, 0.82, 0.165, 1) 0.4s, 0.6s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1) 0.4s;
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text h4.heading {
    color: #456;
    font-size: calc(25 / 1400 * 100vw);
    font-weight: 500;
    margin-top: 40px;
    line-height: calc(45 / 25 * 1em);
}

@media (min-width: 1401px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text h4.heading {
        font-size: 25px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text h4.heading {
        margin-top: 30px;
        color: #456;
        font-size: 19px;
        font-weight: 500;
        line-height: calc(35 / 19 * 1em);
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .line {
    height: 1px;
    background-color: #dcddde;
    margin: 40px 0;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .line.in {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transition: 1s -webkit-transform cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition: 1s -webkit-transform cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition: 1s transform cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition: 1s transform cubic-bezier(0.785, 0.135, 0.15, 0.86), 1s -webkit-transform cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .line {
        width: 100%;
        margin: 25px 0;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .line {
        width: calc(714 / 1400 * 100vw);
        max-width: calc(714 / 1200 * 100%);
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail p.text {
    color: #456;
    font-size: calc(16 / 1400 * 100vw);
    font-weight: 300;
    line-height: calc(30 / 16 * 1em);
}

@media (min-width: 1401px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail p.text {
        font-size: 16px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail p.text {
        color: #456;
        font-size: 13px;
        font-weight: 300;
        line-height: calc(24 / 13 * 1em);
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail small {
    color: #456;
    font-size: calc(12 / 1400 * 100vw);
    font-weight: 300;
    line-height: calc(30 / 12 * 1em);
}

@media (min-width: 1401px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail small {
        font-size: 12px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail small {
        color: #456;
        font-size: 10px;
        font-weight: 300;
        line-height: 1em;
        margin-top: 10px;
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo {
    border: solid 1px #a1aab2;
    margin-top: 30px;
    background-color: #fff;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo {
        width: 100%;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo {
        width: calc(508 / 1400 * 100vw);
        max-width: 508px;
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo .inner {
    padding: 16px 22px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo .inner {
        padding: 16px 15px;
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo .inner h6 {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo .inner h6 {
        color: #456;
        font-size: 10px;
        font-weight: 300;
        line-height: calc(15 / 10 * 1em);
        margin-right: 14px;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo .inner h6 br:not(:first-child) {
        display: none;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo .inner h6 {
        color: #456;
        font-size: calc(12 / 1400 * 100vw);
        font-weight: 300;
        line-height: calc(20 / 12 * 1em);
        margin-right: 10px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo .inner h6 {
        font-size: 12px;
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo .inner .box-photo {
    width: calc((104 / 1400) * 100vw);
    max-width: 104px;
    position: relative;
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo .inner .box-photo:before {
    content: "";
    display: block;
    padding-top: 67.3076923076923%;
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo .inner .box-photo .photo {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/logo-evo.png");
    background-size: 100% 100%;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-text .detail .about-intel-evo .inner .box-photo {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/logo-evo-sp.png");
        background-size: 100% 100%;
        width: 74px;
        height: 49px;
        display: block;
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item {
    pointer-events: none;
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }
}

article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo {
    z-index: 1;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo {
        position: relative;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="1"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-point-1-sp.png");
        background-size: 100% 100%;
        width: 512.5px;
        height: 373.5px;
        display: block;
        margin-top: 25px;
        left: 50%;
        margin-left: -255px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="1"] {
        width: calc((761 / 1400) * 100vw);
        max-width: 761px;
        position: relative;
        position: absolute;
        left: calc(478 / 1200 * 100%);
        bottom: 0;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="1"]:before {
        content: "";
        display: block;
        padding-top: 72.93035479632063%;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="1"] .photo {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-point-1.png");
        background-size: 100% 100%;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo {
        position: relative;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="2"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-point-2-sp.png");
        background-size: 100% 100%;
        width: 478.5px;
        height: 237.5px;
        display: block;
        margin-top: 35px;
        left: 50%;
        margin-left: -305px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="2"] {
        width: calc((792 / 1400) * 100vw);
        max-width: 792px;
        position: relative;
        position: absolute;
        left: calc(-98 / 1200 * 100%);
        bottom: 0;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="2"]:before {
        content: "";
        display: block;
        padding-top: 49.621212121212125%;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="2"] .photo {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-point-2.png");
        background-size: 100% 100%;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo {
        position: relative;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="3"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-point-3-sp.png");
        background-size: 100% 100%;
        width: 355.5px;
        height: 355.5px;
        display: block;
        margin-top: -38px;
        left: 50%;
        margin-left: -153px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="3"] {
        width: calc((610 / 1400) * 100vw);
        max-width: 610px;
        position: relative;
        position: absolute;
        left: calc(600 / 1200 * 100%);
        bottom: 0;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="3"]:before {
        content: "";
        display: block;
        padding-top: 103.27868852459017%;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="3"] .photo {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-point-3.png");
        background-size: 100% 100%;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo {
        position: relative;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="4"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-point-4-sp.png");
        background-size: 100% 100%;
        width: 380px;
        height: 369.5px;
        display: block;
        margin-top: -18px;
        left: 50%;
        margin-left: -158px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="4"] {
        width: calc((623 / 1400) * 100vw);
        max-width: 623px;
        position: relative;
        position: absolute;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="4"]:before {
        content: "";
        display: block;
        padding-top: 90.0481540930979%;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="4"] .photo {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-point-4.png");
        background-size: 100% 100%;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo {
        position: relative;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="5"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-point-5-sp.png");
        background-size: 100% 100%;
        width: 396.5px;
        height: 325px;
        display: block;
        margin-top: 23px;
        left: 50%;
        margin-left: -245px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="5"] {
        width: calc((661.5 / 1400) * 100vw);
        max-width: 661.5px;
        position: relative;
        position: absolute;
        left: calc(-46 / 1200 * 100%);
        bottom: 0;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="5"]:before {
        content: "";
        display: block;
        padding-top: 81.7838246409675%;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="5"] .photo {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-point-5.png");
        background-size: 100% 100%;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo {
        position: relative;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="6"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-point-6-sp.png");
        background-size: 100% 100%;
        width: 600px;
        height: 368.5px;
        display: block;
        margin-top: -50px;
        left: 50%;
        margin-left: -316px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="6"] {
        width: calc((630 / 1400) * 100vw);
        max-width: 630px;
        position: relative;
        position: absolute;
        left: calc(600 / 1200 * 100%);
        bottom: 0;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="6"]:before {
        content: "";
        display: block;
        padding-top: 100%;
    }
    article#performance ul.items li.item .area-element .inner ul.points li.point .frame-item .box-photo[num="6"] .photo {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/performance-point-6.png");
        background-size: 100% 100%;
    }
}

article#b8ta {
    background-color: #fff;
    position: relative;
    padding: 160px 118px 140px;
    overflow: hidden;
}


/*20220228*/

article#b8ta .movie .inner {
    position: relative;
    max-width: 960px;
    width: 100%;
    padding-top: 39.7%;
    margin: 40px auto;
    /* margin: 20px auto */
}

article#b8ta .movie .inner iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    pointer-events: none
}


/* 20220228 end*/

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta {
        padding: 85px 25px;
    }
}

article#b8ta h4 {
    text-align: center;
    letter-spacing: 0.2em;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta h4 {
        color: #456;
        font-size: 23px;
        font-weight: 300;
        line-height: calc(40 / 23 * 1em);
    }
}


/*20220228*/

article#b8ta .movie .inner {
    /* padding-top: 55.7%; */
    padding-top: 39.7%;
}

article#b8ta .movie .inner iframe {
    pointer-events: auto
}


/* 20220228 end*/

@media (min-width: 861px) and (max-width: 99999px) {
    article#b8ta h4 {
        color: #456;
        font-size: calc(31 / 1400 * 100vw);
        font-weight: 300;
        line-height: calc(32 / 31 * 1em);
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#b8ta h4 {
        font-size: 31px;
    }
}

article#b8ta .area-slide {
    position: relative;
    margin: 40px auto 0;
    width: 100%;
    max-width: 960px;
}

article#b8ta .area-slide ul.slide {
    position: relative;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta .area-slide ul.slide {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: calc((100vw - 50px) * 4 + (10px * 3));
        left: calc((100vw - 50px + 10px) * -1);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#b8ta .area-slide ul.slide {
        width: 100%;
    }
    article#b8ta .area-slide ul.slide:before {
        content: "";
        display: block;
        padding-top: calc(580 / 960 * 100%);
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta .area-slide ul.slide li.box-photo {
        width: calc(100vw - 50px);
        position: relative;
    }
    article#b8ta .area-slide ul.slide li.box-photo:not(:first-child) {
        margin-left: 10px;
    }
    article#b8ta .area-slide ul.slide li.box-photo:before {
        content: "";
        display: block;
        padding-top: calc(580 / 960 * 100%);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#b8ta .area-slide ul.slide li.box-photo {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}

article#b8ta .area-slide ul.slide li.box-photo .photo {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta .area-slide ul.slide li.box-photo .photo {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
}

article#b8ta .area-slide ul.slide li.box-photo[num="1"] .photo {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/b8ta-1.jpg");
}

article#b8ta .area-slide ul.slide li.box-photo[num="2"] .photo {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/b8ta-2.jpg");
}

article#b8ta .area-slide ul.slide li.box-photo[num="3"] .photo {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/b8ta-3.jpg");
}

article#b8ta .area-slide ul.slide li.box-photo[num="4"] .photo {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/b8ta-4.jpg");
}

article#b8ta .area-slide .btn-arrow {
    width: 60px;
    height: 60px;
    background-color: #fff;
    border-radius: 100%;
    -webkit-box-shadow: 0 0 12px rgba(76, 76, 76, 0.2);
    box-shadow: 0 0 12px rgba(76, 76, 76, 0.2);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    -webkit-transition: 0.2s;
    -moz-transform: 0.2s;
    transition: 0.2s;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta .area-slide .btn-arrow {
        width: 44px;
        height: 44px;
    }
}

article#b8ta .area-slide .btn-arrow[direct="prev"] {
    left: -30px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta .area-slide .btn-arrow[direct="prev"] {
        left: -22px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta .area-slide .btn-arrow[direct="prev"] .arrow {
        left: -1px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#b8ta .area-slide .btn-arrow[direct="prev"] .arrow {
        left: -2px;
    }
}

article#b8ta .area-slide .btn-arrow[direct="next"] {
    right: -30px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta .area-slide .btn-arrow[direct="next"] {
        right: -22px;
    }
}

article#b8ta .area-slide .btn-arrow[direct="next"] .arrow {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta .area-slide .btn-arrow[direct="next"] .arrow {
        right: -1px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#b8ta .area-slide .btn-arrow[direct="next"] .arrow {
        right: -2px;
    }
}

article#b8ta .area-slide .btn-arrow .arrow {
    position: relative;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta .area-slide .btn-arrow .arrow {
        width: 11px;
        height: 17px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta .area-slide .btn-arrow .arrow svg {
        width: 100%;
        height: 100%;
    }
}

article#b8ta .area-slide .btn-arrow .arrow svg path {
    fill: #ff5c7b;
    fill-rule: evenodd;
    -webkit-transition: 0.2s;
    -moz-transform: 0.2s;
    transition: 0.2s;
}

article#b8ta .area-slide .btn-arrow.hover:hover {
    background-color: #ff5c7b;
}

article#b8ta .area-slide .btn-arrow.hover:hover .arrow svg path {
    fill: #fff;
}

article#b8ta .info {
    margin: 0 auto;
    display: table;
}

article#b8ta .info h5 {
    text-align: center;
    margin: 26px 0;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta .info h5 {
        color: #456;
        font-size: 13px;
        font-weight: 300;
        line-height: calc(24 / 13 * 1em);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#b8ta .info h5 {
        color: #456;
        font-size: 16px;
        font-weight: 300;
        line-height: calc(30 / 16 * 1em);
    }
}

article#b8ta .info .box-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

article#b8ta .info .box-text:not(:first-child) {
    margin-top: 0.5em;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#b8ta .info .box-text h6 {
        color: #456;
        font-size: 13px;
        font-weight: 300;
        line-height: calc(24 / 13 * 1em);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#b8ta .info .box-text h6 {
        color: #456;
        font-size: 16px;
        font-weight: 300;
        line-height: calc(30 / 16 * 1em);
    }
}

article#b8ta .info .box-text h6.heading {
    margin-right: 1em;
}

article#b8ta .info .box-text h6.text {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

article#custom {
    background-color: #fff;
    position: relative;
}

article#specification {
    background-color: #fff;
    position: relative;
    padding: 160px 118px 32px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification {
        padding: 95px 0 92px 15px;
    }
}

article#specification .article-heading {
    margin: 0 auto;
    display: table;
}

article#specification .article-heading h4 {
    text-align: center;
    letter-spacing: 0.32em;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification .article-heading h4 {
        color: #456;
        font-size: 23px;
        font-weight: 300;
        line-height: calc(40 / 23 * 1em);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#specification .article-heading h4 {
        color: #456;
        font-size: calc(31 / 1400 * 100vw);
        font-weight: 300;
        line-height: calc(32 / 31 * 1em);
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#specification .article-heading h4 {
        font-size: 31px;
    }
}

article#specification .article-heading h5 {
    text-align: center;
    letter-spacing: 0.15em;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification .article-heading h5 {
        color: #456;
        font-size: 12px;
        font-weight: 300;
        line-height: calc(24 / 12 * 1em);
        margin-top: 4px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#specification .article-heading h5 {
        color: #456;
        font-size: calc(16 / 1400 * 100vw);
        font-weight: 300;
        line-height: calc(32 / 16 * 1em);
        margin-top: 24px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#specification .article-heading h5 {
        font-size: 16px;
    }
}

article#specification .frame {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 45px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification .frame {
        margin-top: 33px;
    }
}

article#specification .frame ol.area-heading {
    width: 120px;
    white-space: nowrap;
}

article#specification .frame ol.area-heading>li:first-child {
    height: 260px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification .frame ol.area-heading>li:first-child {
        height: 190px;
    }
}

article#specification .frame ol.area-heading>li:not(:first-child) {
    border-top: solid 1px #c7ccd1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification .frame ol.area-heading>li:not(:first-child) {
        height: 36px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#specification .frame ol.area-heading>li:not(:first-child) {
        height: 50px;
    }
}

article#specification .frame ol.area-heading>li h5 {
    font-size: 12px;
}

article#specification .frame .area-scroll {
    overflow: auto;
}

article#specification .frame .area-scroll ul.detail {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification .frame .area-scroll ul.detail>li {
        width: 206px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#specification .frame .area-scroll ul.detail>li {
        width: 260px;
    }
}

article#specification .frame .area-scroll ul.detail>li:nth-child(odd) {
    background-color: #f5f6f7;
}

article#specification .frame .area-scroll ul.detail>li ol>li:first-child {
    height: 260px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification .frame .area-scroll ul.detail>li ol>li:first-child {
        height: 190px;
    }
}

article#specification .frame .area-scroll ul.detail>li ol>li:not(:first-child) {
    border-top: solid 1px #c7ccd1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification .frame .area-scroll ul.detail>li ol>li:not(:first-child) {
        height: 36px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#specification .frame .area-scroll ul.detail>li ol>li:not(:first-child) {
        height: 50px;
    }
}

article#specification .frame .area-scroll ul.detail>li ol>li h5 {
    font-size: 12px;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 40px 0 30px;
    height: calc(100% - 70px);
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification .frame .area-scroll ul.detail>li ol>li>.inner {
        padding: 30px 0 20px;
        height: calc(100% - 50px);
    }
}


/*760*/

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-slim-760-carbon"] {
    width: calc((167 / 260) * 100%);
    max-width: 167px;
    position: relative;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-slim-760-carbon"]:before {
    content: "";
    display: block;
    padding-top: 93.7125748502994%;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-slim-760-carbon"] .photo {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url("//static.lenovo.com/jp/yoga/yoga-flc/specification-yoga-slim-760-carbon.png");
    background-size: 100% 100%;
}


/*760*/

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-slim-750i-carbon"] {
    width: calc((167 / 260) * 100%);
    max-width: 167px;
    position: relative;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-slim-750i-carbon"]:before {
    content: "";
    display: block;
    padding-top: 93.7125748502994%;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-slim-750i-carbon"] .photo {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/specification-yoga-slim-750i-carbon.png");
    background-size: 100% 100%;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-slim-950i"] {
    width: calc((185 / 260) * 100%);
    max-width: 185px;
    position: relative;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-slim-950i"]:before {
    content: "";
    display: block;
    padding-top: 87.56756756756758%;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-slim-950i"] .photo {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/specification-yoga-slim-950i.png");
    background-size: 100% 100%;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-slim-750i-pro"] {
    width: calc((165 / 260) * 100%);
    max-width: 165px;
    position: relative;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-slim-750i-pro"]:before {
    content: "";
    display: block;
    padding-top: 93.63636363636364%;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-slim-750i-pro"] .photo {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/specification-yoga-slim-750i-pro.png");
    background-size: 100% 100%;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-660"] {
    width: calc((176 / 260) * 100%);
    max-width: 176px;
    position: relative;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-660"]:before {
    content: "";
    display: block;
    padding-top: 77.27272727272727%;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner .box-photo[name="yoga-660"] .photo {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/specification-yoga-660.png");
    background-size: 100% 100%;
}

article#specification .frame .area-scroll ul.detail>li ol>li>.inner h4.name {
    text-align: center;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification .frame .area-scroll ul.detail>li ol>li>.inner h4.name {
        font-weight: 500;
        font-family: "Montserrat", sans-serif;
        color: #456;
        font-size: 14px;
    }
}

p.note {
    max-width: 900px;
    margin: 30px auto 0;
    font-size: calc(12 / 1400 * 100vw);
}

article#specification .btn-radius {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #456;
    border: solid 1px #456;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #fff;
    max-width: 100%;
    -webkit-transition: 0.2s;
    -moz-transform: 0.2s;
    transition: 0.2s;
    margin: 60px auto 0;
}

article#specification .btn-radius.hover:hover {
    background-color: #fff;
    color: #456;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification .btn-radius {
        width: 316px;
        height: 58px;
        border-radius: 58px;
    }
    article#specification .btn-radius p {
        font-size: 16px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#specification .btn-radius {
        width: 420px;
        height: 70px;
        border-radius: 70px;
    }
    article#specification .btn-radius p {
        font-size: 18px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#specification .btn-radius {
        margin: 35px auto 0;
    }
}

article#movies {
    padding-bottom: 80px;
    background-color: #fff;
    position: relative;
}

article#movies .frame-elem {
    background-color: #ecf1f4;
    position: relative;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#movies .frame-elem {
        padding: 50px 25px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#movies .frame-elem {
        padding: 60px 48px 70px;
    }
}

article#movies .frame-elem .article-heading {
    margin: 0 auto;
    display: table;
}

article#movies .frame-elem .article-heading h4 {
    text-align: center;
    letter-spacing: 0.1em;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#movies .frame-elem .article-heading h4 {
        color: #456;
        font-size: 23px;
        font-weight: 300;
        line-height: calc(40 / 23 * 1em);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#movies .frame-elem .article-heading h4 {
        color: #456;
        font-size: calc(31 / 1400 * 100vw);
        font-weight: 300;
        line-height: calc(32 / 31 * 1em);
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#movies .frame-elem .article-heading h4 {
        font-size: 31px;
    }
}

article#movies .frame-elem .article-heading h5 {
    text-align: center;
    letter-spacing: 0.14em;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#movies .frame-elem .article-heading h5 {
        color: #456;
        font-size: 12px;
        font-weight: 300;
        line-height: calc(24 / 12 * 1em);
        margin-top: 4px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#movies .frame-elem .article-heading h5 {
        color: #456;
        font-size: calc(16 / 1400 * 100vw);
        font-weight: 300;
        line-height: calc(32 / 16 * 1em);
        margin-top: 24px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#movies .frame-elem .article-heading h5 {
        font-size: 16px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#movies .frame-elem ul.items {
        margin: 32px 0 0;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#movies .frame-elem ul.items {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        max-width: 1304px;
        margin: 22px auto 0;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#movies .frame-elem ul.items li {
        width: 100%;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#movies .frame-elem ul.items li {
        width: calc(640 / (1400 - 48 * 2) * 100%);
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#movies .frame-elem ul.items li:not(:first-child) {
        margin-top: 20px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#movies .frame-elem ul.items li:nth-child(3) {
        margin: 40px auto 0;
    }
}

article#movies .frame-elem ul.items li .box-photo {
    position: relative;
    overflow: hidden;
}

article#movies .frame-elem ul.items li .box-photo:before {
    content: "";
    display: block;
    padding-top: calc(362 / 640 * 100%);
}

article#movies .frame-elem ul.items li .box-photo.hover:hover .photo {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    -webkit-transition: 1.5s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: 1.5s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: 1.5s transform cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: 1.5s transform cubic-bezier(0.075, 0.82, 0.165, 1), 1.5s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
}

article#movies .frame-elem ul.items li .box-photo .photo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: 0.2s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: 0.2s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: 0.2s transform cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: 0.2s transform cubic-bezier(0.075, 0.82, 0.165, 1), 0.2s -webkit-transform cubic-bezier(0.075, 0.82, 0.165, 1);
}

article#movies .frame-elem ul.items li .box-photo .photo[num="1"] {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/movies-1.jpg");
}

article#movies .frame-elem ul.items li .box-photo .photo[num="2"] {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/movies-2.jpg");
}

article#movies .frame-elem ul.items li .box-photo .photo[num="3"] {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/movies-3.jpg");
}

article#movies .frame-elem ul.items li .btn-play {
    width: 95px;
    height: 95px;
    background-color: #fff;
    border-radius: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    bottom: 10px;
    right: 10px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#movies .frame-elem ul.items li .btn-play {
        width: 72px;
        height: 72px;
    }
}

article#movies .frame-elem ul.items li .btn-play .tip {
    position: relative;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10.5px 0 10.5px 17px;
    border-color: transparent transparent transparent #ff5c7b;
    left: 2px;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#movies .frame-elem ul.items li .btn-play .tip {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 8px 0 8px 12px;
        border-color: transparent transparent transparent #ff5c7b;
        left: 2px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#movies .frame-elem ul.items li .btn-play .tip {
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 10.5px 0 10.5px 17px;
        border-color: transparent transparent transparent #ff5c7b;
        left: 2px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#movies .frame-elem ul.items li h6 {
        color: #456;
        font-size: 16px;
        font-weight: 300;
        margin-top: 9px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#movies .frame-elem ul.items li h6 {
        color: #456;
        font-size: 20px;
        font-weight: 300;
        margin-top: 7px;
    }
}

article#links {
    overflow: hidden;
    background-color: #f1f1f1;
    position: relative;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links {
        padding: 30px 0 36px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links {
        padding: 65px 0 73px;
    }
}

article#links h4.heading {
    text-align: center;
    letter-spacing: 0.2em;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links h4.heading {
        color: #456;
        font-size: 16px;
        font-weight: 300;
        margin-bottom: 20px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links h4.heading {
        color: #456;
        font-size: calc(27 / 1400 * 100vw);
        font-weight: 300;
        margin-bottom: 40px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#links h4.heading {
        font-size: 27px;
    }
}

article#links .frame-slide {
    margin: 0 auto;
    position: relative;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide {
        width: calc(100vw - 72px);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide {
        width: calc(((355 + 50) * 3 - 50) / 1400 * 100vw);
        max-width: calc((355px + 50px) * 3 - 50px);
    }
}

article#links .frame-slide .btn-arrow {
    position: absolute;
    top: 0;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #f1f1f1;
    z-index: 1;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide .btn-arrow {
        width: 36px;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
}

@media (min-width: 861px) and (max-width: 1399px) {
    article#links .frame-slide .btn-arrow {
        width: calc(100vw - (((355 + 50) * 3 - 50) / 1400 * 100vw));
    }
}

@media (min-width: 1400px) and (max-width: 99999px) {
    article#links .frame-slide .btn-arrow {
        width: calc((100vw - ((355px + 50px) * 3 - 50px)) / 2);
    }
}

article#links .frame-slide .btn-arrow.hover:hover .arrow {
    opacity: 0.5;
}

article#links .frame-slide .btn-arrow .arrow {
    -webkit-transition: 0.2s;
    -moz-transform: 0.2s;
    transition: 0.2s;
}

article#links .frame-slide .btn-arrow[direct="prev"] {
    right: 100%;
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide .btn-arrow[direct="prev"] {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide .btn-arrow[direct="prev"] .arrow {
        margin-right: 50px;
    }
}

article#links .frame-slide .btn-arrow[direct="next"] {
    left: 100%;
}

article#links .frame-slide .btn-arrow[direct="next"] .arrow {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide .btn-arrow[direct="next"] .arrow {
        margin-left: 50px;
    }
}

article#links .frame-slide ul.items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide ul.items {
        width: calc((100vw - 72px + 36px) * 6 - 36px);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide ul.items {
        width: calc(((355 + 50) * 6 - 50) / 1400 * 100vw);
        max-width: calc(((355px + 50px) * 6 - 50px));
    }
}

@media (min-width: 861px) and (max-width: 1399px) {
    article#links .frame-slide ul.items {
        margin-left: calc((355 + 50) / 1400 * 100vw * -1);
    }
}

@media (min-width: 1400px) and (max-width: 99999px) {
    article#links .frame-slide ul.items {
        margin-left: calc((355px + 50px) * -1);
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide ul.items li {
        width: calc(100vw - 72px);
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide ul.items li {
        width: calc(355 / 1400 * 100vw);
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide ul.items li:not(:last-child) {
        margin-right: 36px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide ul.items li:not(:last-child) {
        margin-right: calc(50 / 1400 * 100vw);
    }
}

article#links .frame-slide ul.items li a {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

article#links .frame-slide ul.items li a .box-photo {
    width: 100%;
    position: relative;
}

article#links .frame-slide ul.items li a .box-photo:before {
    content: "";
    display: block;
    padding-top: calc(235 / 355 * 100%);
}

article#links .frame-slide ul.items li a .box-photo .photo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

article#links .frame-slide ul.items li a .box-photo .photo[name="ascll"] {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/links-photo-ascll.jpg");
}

article#links .frame-slide ul.items li a .box-photo .photo[name="netlab"] {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/links-photo-netlab.jpg");
}

article#links .frame-slide ul.items li a .box-photo .photo[name="tabi"] {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/links-photo-tabi.jpg");
}

article#links .frame-slide ul.items li a .box-photo .photo[name="engadget"] {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/links-photo-engadget.jpg");
}

article#links .frame-slide ul.items li a .box-photo .photo[name="itmedia"] {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/links-photo-itmedia.jpg");
}

article#links .frame-slide ul.items li a .box-photo .photo[name="kakaku"] {
    background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/links-photo-kakaku.jpg");
}

article#links .frame-slide ul.items li a .box-logo {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide ul.items li a .box-logo {
        height: 45px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide ul.items li a .box-logo {
        height: 60px;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide ul.items li a .box-logo .logo[name="ascll"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/link-logo-ascll-sp.png");
        background-size: 100% 100%;
        width: 77px;
        height: 23px;
        display: block;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide ul.items li a .box-logo .logo[name="ascll"] {
        width: calc((91 / 1400) * 100vw);
        max-width: 91px;
        position: relative;
        opacity: 1;
    }
    article#links .frame-slide ul.items li a .box-logo .logo[name="ascll"]:before {
        content: "";
        display: block;
        padding-top: 30.76923076923077%;
    }
    article#links .frame-slide ul.items li a .box-logo .logo[name="ascll"] .photo {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/link-logo-ascll.png");
        background-size: 100% 100%;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide ul.items li a .box-logo .logo[name="netlab"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/link-logo-netlab-sp.png");
        background-size: 100% 100%;
        width: 86px;
        height: 33px;
        display: block;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide ul.items li a .box-logo .logo[name="netlab"] {
        width: calc((101 / 1400) * 100vw);
        max-width: 101px;
        position: relative;
        opacity: 1;
    }
    article#links .frame-slide ul.items li a .box-logo .logo[name="netlab"]:before {
        content: "";
        display: block;
        padding-top: 38.613861386138616%;
    }
    article#links .frame-slide ul.items li a .box-logo .logo[name="netlab"] .photo {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/link-logo-netlab.png");
        background-size: 100% 100%;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide ul.items li a .box-logo .logo[name="tabi"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/link-logo-tabi-sp.png");
        background-size: 100% 100%;
        width: 127px;
        height: 15px;
        display: block;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide ul.items li a .box-logo .logo[name="tabi"] {
        width: calc((150 / 1400) * 100vw);
        max-width: 150px;
        position: relative;
        opacity: 1;
    }
    article#links .frame-slide ul.items li a .box-logo .logo[name="tabi"]:before {
        content: "";
        display: block;
        padding-top: 12%;
    }
    article#links .frame-slide ul.items li a .box-logo .logo[name="tabi"] .photo {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/link-logo-tabi.png");
        background-size: 100% 100%;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide ul.items li a .box-logo .logo[name="engadget"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/link-logo-engadget-sp.png");
        background-size: 100% 100%;
        width: 107px;
        height: 23px;
        display: block;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide ul.items li a .box-logo .logo[name="engadget"] {
        width: calc((126 / 1400) * 100vw);
        max-width: 126px;
        position: relative;
        opacity: 1;
    }
    article#links .frame-slide ul.items li a .box-logo .logo[name="engadget"]:before {
        content: "";
        display: block;
        padding-top: 21.428571428571427%;
    }
    article#links .frame-slide ul.items li a .box-logo .logo[name="engadget"] .photo {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/link-logo-engadget.png");
        background-size: 100% 100%;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide ul.items li a .box-logo .logo[name="itmedia"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/link-logo-itmedia-sp.png");
        background-size: 100% 100%;
        width: 96px;
        height: 32px;
        display: block;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide ul.items li a .box-logo .logo[name="itmedia"] {
        width: calc((113 / 1400) * 100vw);
        max-width: 113px;
        position: relative;
        opacity: 1;
    }
    article#links .frame-slide ul.items li a .box-logo .logo[name="itmedia"]:before {
        content: "";
        display: block;
        padding-top: 33.6283185840708%;
    }
    article#links .frame-slide ul.items li a .box-logo .logo[name="itmedia"] .photo {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/link-logo-itmedia.png");
        background-size: 100% 100%;
    }
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide ul.items li a .box-logo .logo[name="kakaku"] {
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/link-logo-kakaku-sp.png");
        background-size: 100% 100%;
        width: 104px;
        height: 18px;
        display: block;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide ul.items li a .box-logo .logo[name="kakaku"] {
        width: calc((122 / 1400) * 100vw);
        max-width: 122px;
        position: relative;
        opacity: 1;
    }
    article#links .frame-slide ul.items li a .box-logo .logo[name="kakaku"]:before {
        content: "";
        display: block;
        padding-top: 17.21311475409836%;
    }
    article#links .frame-slide ul.items li a .box-logo .logo[name="kakaku"] .photo {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background-image: url("//static.lenovo.com/jp/yoga/yoga-top/update-1230/link-logo-kakaku.png");
        background-size: 100% 100%;
    }
}

article#links .frame-slide ul.items li a .box-text h5 {
    text-align: center;
    margin: 0 0 20px;
    line-height: calc(20 / 13 * 1em);
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide ul.items li a .box-text h5 {
        color: #456;
        font-size: 11px;
        font-weight: 300;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide ul.items li a .box-text h5 {
        color: #456;
        font-size: calc(12 / 1400 * 100vw);
        font-weight: 300;
    }
}

@media (min-width: 861px) and (max-width: 1100px) {
    article#links .frame-slide ul.items li a .box-text h5 br {
        display: none;
    }
}

@media (min-width: 861px) and (max-width: 99999px) and (min-width: 1401px) and (max-width: 99999px) {
    article#links .frame-slide ul.items li a .box-text h5 {
        font-size: 12px;
    }
}

article#links .frame-slide ul.items li a .btn-radius {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #456;
    border: solid 1px #456;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #fff;
    max-width: 100%;
    -webkit-transition: 0.2s;
    -moz-transform: 0.2s;
    transition: 0.2s;
    display: flex;
    margin-top: auto;
}

article#links .frame-slide ul.items li a .btn-radius.hover:hover {
    background-color: #fff;
    color: #456;
}

@media (min-width: 1px) and (max-width: 860px) {
    article#links .frame-slide ul.items li a .btn-radius {
        width: 240px;
        height: 54px;
        border-radius: 54px;
    }
    article#links .frame-slide ul.items li a .btn-radius p {
        font-size: 15px;
    }
}

@media (min-width: 861px) and (max-width: 99999px) {
    article#links .frame-slide ul.items li a .btn-radius {
        width: 240px;
        height: 54px;
        border-radius: 54px;
    }
    article#links .frame-slide ul.items li a .btn-radius p {
        font-size: 15px;
    }
}


/*2022 LFC*/

article .bnr-LFC {
    max-width: 1300px;
    margin: 0 auto 80px;
    text-align: center;
}

article .bnr-LFC .bnr {
    margin-bottom: 20px;
    display: block;
}

article .bnr-LFC a.btn {
    width: calc(206px - 22px - 29px);
    height: 46px;
    padding: 0 22px 0 29px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: solid 1px #456;
    border-radius: 46px;
    -webkit-transition: 0.2s;
    -moz-transform: 0.2s;
    transition: 0.2s;
    margin: auto;
}

@media (min-width: 1px) and (max-width: 860px) {
    article .bnr-LFC {
        padding: 20px;
    }
    article .bnr-LFC img {
        width: 100%;
    }
    article .bnr-LFC a.btn {
        width: calc(125px - 20px - 16px);
        height: 35px;
        padding: 0 20px 0 16px;
    }
}

article .bnr-LFC a.btn.hover:hover {
    background-color: #456;
}

article .bnr-LFC a.btn.hover:hover h6 {
    color: #fff;
}

article .bnr-LFC a.btn.hover:hover .arrow svg path {
    fill: #fff;
}

article .bnr-LFC a.btn h6 {
    color: #456;
    -webkit-transition: 0.2s;
    -moz-transform: 0.2s;
    transition: 0.2s;
}


/* /2022 LFC*/


/*2022 02 twittercamp*/

#twitterCamp202202 {
    max-width: 1300px;
    margin: 0 auto 100px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0px 10px 30px 0px rgba(199, 216, 226, 0.7);
}

#twitterCamp202202 .inner {
    padding: 10px 6.7% 0;
}

#twitterCamp202202 .row01 {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    flex-wrap: wrap;
    margin: 0 0 30px;
}

#twitterCamp202202 .row01 .colL {
    margin: 0 30px 0 0;
}

#twitterCamp202202 .row01 .tit {
    margin: 0 0 10px 15px;
}

#twitterCamp202202 .row01 h4 {
    color: #f277a5;
    text-align: center;
    font-size: 32px;
}

#twitterCamp202202 .row02 {
    background: #f5f8f9;
    padding: 5%;
    font-size: 16px;
    line-height: calc(32 / 16 * 1em);
    margin: 0 0 30px;
}

#twitterCamp202202 .row02 .item {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
}

#twitterCamp202202 .row02 .itemL {
    width: 170px;
    background: #e3e7ea;
    padding: 2px 0;
    text-align: center;
}

#twitterCamp202202 .row02 .itemR {
    width: calc(100% - 200px);
}

#twitterCamp202202 .row02 .item01 {
    margin: 0 0 50px;
}

#twitterCamp202202 .row02 .item02 {
    margin: 0 0 50px;
}

#twitterCamp202202 .row02 .item02 .itemR {
    display: flex;
}

#twitterCamp202202 .row02 .step01 {
    margin: 0 60px 0 0;
    position: relative;
}

#twitterCamp202202 .row02 .step01:before {
    content: '';
    position: absolute;
    top: 30px;
    left: 75%;
    width: 195px;
    height: 1px;
    border-bottom: 1px dashed #456;
}

#twitterCamp202202 .row02 .step {
    text-align: center;
}

#twitterCamp202202 .row02 .step img {
    margin: 0 auto;
}

#twitterCamp202202 .row02 .step .txt {
    font-size: 14px;
    line-height: calc(28 / 14 * 1em);
    margin: 10px 0 15px;
}

#twitterCamp202202 .btn {
    max-width: 400px;
    margin: 0 auto;
    background: #445666;
    color: #fff;
    padding: 18px 0 12px;
    text-align: center;
    font-size: 22px;
    line-height: 1;
    display: block;
    border-radius: 10px;
    border: 1px solid #445666;
    box-shadow: 0px 5px 10px 0px rgba(68, 85, 102, 0.4);
}

#twitterCamp202202 .btn span {
    font-size: 14px;
    padding: 0 21px 7px 13px;
    background: url("//static.lenovo.com/jp/yoga/yoga-top/update-0301/ic_line.png") no-repeat bottom left/100% auto;
    display: inline-block;
    margin: 15px 0 0 0;
}

#twitterCamp202202 .btn:hover {
    background: #fff;
    color: #456;
}

#twitterCamp202202 .btn:hover span {
    background: url("//static.lenovo.com/jp/yoga/yoga-top/update-0301/ic_line_dark.png") no-repeat bottom left/100% auto;
}

#twitterCamp202202 .link {
    text-align: right;
    padding: 20px;
    font-size: 14px;
}

#twitterCamp202202 .link a {
    text-decoration: underline;
    color: inherit;
}

#twitterCamp202202 .link a:hover {
    opacity: .8;
}

@media (min-width: 1px) and (max-width: 860px) {
    #twitterCamp202202 img {
        max-width: 100%;
    }
    #twitterCamp202202 .inner {
        padding: 10px 15px 0;
    }
    #twitterCamp202202 .row01 .colL {
        margin: 0 0 10px;
    }
    #twitterCamp202202 .row01 h4 {
        font-size: 4.5vw;
    }
    #twitterCamp202202 .row02 {
        padding: 20px 10px;
        font-size: 14px;
    }
    #twitterCamp202202 .row02 .itemL {
        margin: 0 auto 10px;
    }
    #twitterCamp202202 .row02 .itemR {
        width: 100%;
    }
    #twitterCamp202202 .row02 .item02 .itemR {
        flex-wrap: wrap;
    }
    #twitterCamp202202 .row02 .step {
        width: 100%;
        padding: 0 0 0 55px;
        position: relative;
    }
    #twitterCamp202202 .row02 .step .tit {
        position: absolute;
        top: 0;
        left: 0;
        width: 50px;
    }
    #twitterCamp202202 .row02 .step .txt {
        font-size: 12px;
    }
    #twitterCamp202202 .row02 .step01 {
        margin: 0;
        height: 220px;
    }
    #twitterCamp202202 .row02 .step01:before {
        width: 1px;
        height: auto;
        left: 25px;
        top: 60px;
        bottom: 10px;
        border-bottom: none;
        border-left: 1px dashed #456;
    }
    #twitterCamp202202 .btn {
        font-size: 18px;
    }
    #twitterCamp202202 .btn span {
        font-size: 12px;
    }
    #twitterCamp202202 .link {
        font-size: 12px;
    }
}


/*/2022 02 twittercamp*/

html body #main-container {
    font-family: "Noto Sans JP", sans-serif;
    color: #456;
}

html body #main-container .hover {
    cursor: pointer;
}

html body #main-container span.c.left {
    margin-left: -0.2em;
}

html body #main-container span.c.right {
    letter-spacing: -0.2em;
}

html body #main-container .scroll-animation[animation-type="blinking"] span.c {
    opacity: 0;
}

html body #main-container .scroll-animation[animation-type="default"] {
    opacity: 0;
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
}

html body #main-container .scroll-animation[animation-type="default"][animation-diff="30"] {
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
}

html body #main-container .scroll-animation[animation-type="default"].in {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: 0.2s opacity linear, 1.4s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: 0.2s opacity linear, 1.4s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: 0.2s opacity linear, 1.4s transform cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: 0.2s opacity linear, 1.4s transform cubic-bezier(0.165, 0.84, 0.44, 1), 1.4s -webkit-transform cubic-bezier(0.165, 0.84, 0.44, 1);
}


/*# sourceMappingURL=style.css.map */