.forPC {
    display: block
}

@media (max-width: 767px) {
    .forPC {
        display: none
    }
}

.forSP {
    display: none
}

@media (max-width: 767px) {
    .forSP {
        display: block
    }
}

.mgt0 {
    margin-top: 0 !important
}

@media (max-width: 767px) {
    .mgt20_sp {
        margin-top: 20px !important
    }
}

.mb20 {
    margin-bottom: 20px !important
}

.addBnrs {
    margin-top: 50px
}

.addBnrs p {
    font-size: 14px;
    margin-bottom: 10px
}

@media (max-width: 767px) {
    .addBnrs p {
        margin-bottom: 4vw;
        font-size: 1.3rem
    }
}

.addBnrs ul li {
    margin-bottom: 10px
}

@media (max-width: 767px) {
    .addBnrs ul li {
        margin-bottom: 1.5vw
    }
}

@media (min-width: 768px) {
    .addBnrs ul li a {
        transition: opacity ease .4s
    }

    .addBnrs ul li a:hover {
        transition: opacity ease .4s;
        opacity: .75
    }
}

.addBnrs ul li a img {
    max-width: 100%
}

.underArrow {
    clear: both;
    background: url(../img/product/lens/b061/element/under-arrow_pc.png) no-repeat center center;
    height: 50px;
    width: 50px;
    float: left;
}

@media (max-width: 767px) {
    .underArrow {
        background: url(../img/product/lens/b061/element/under-arrow_sp.png) no-repeat center top;
        background-size: 40px 50px;
        height: 20vw
    }
}

body.lenses article section.FloatingSystem .block .right.right__flex {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

body.lenses article section.FloatingSystem .block .right.right__flex p {
    font-size: 10px;
    font-weight: bold;
    margin-bottom: 5px
}

body.lenses article section.FloatingSystem .block .right.right__flex figure {
    width: 49%
}

@media (max-width: 767px) {
    body.lenses article section.FloatingSystem .block .right.right__flex figure {
        width: 48% !important
    }
}

body.lenses article section.FloatingSystem .block .right.right__flex figure+p {
    margin-top: 8px;
    font-size: 1.2rem;
    line-height: 1.3;
    font-weight: normal;
    width: 100%
}

@media (max-width: 767px) {
    body.lenses article section.FloatingSystem .block .right.right__flex figure+p {
        margin-top: -12px
    }
}

body.lenses article section nav#maker.maker_custom ul {
    text-align: center
}

@media (max-width: 767px) {
    body.lenses article section nav#maker.maker_custom ul li:first-of-type {
        margin-bottom: 2vw
    }

    body.lenses article section nav#maker.maker_custom ul li img {
        max-width: 100%
    }
}

body.lenses article section nav#maker.maker_custom ul li a {
    width: auto;
    padding: 0;
    background: none;
    border: none;
    transition: all ease .4s
}

body.lenses article section nav#maker.maker_custom ul li a.active .on {
    display: block
}

body.lenses article section nav#maker.maker_custom ul li a.active .off {
    display: none
}

body.lenses article section nav#maker.maker_custom ul li a .on {
    display: none
}

body.lenses article section nav#maker.maker_custom ul li a .off {
    display: block
}

@media (min-width: 768px) {
    body.lenses article section nav#maker.maker_custom ul li a .off {
        transition: all ease .4s
    }

    body.lenses article section nav#maker.maker_custom ul li a .off:hover {
        transition: all ease .4s;
        filter: brightness(0.8)
    }
}

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

@media (max-width: 767px) {
    .commingsoon_custom {
        display: block
    }
}

@media (max-width: 767px) {
    .commingsoon_custom p:first-of-type {
        margin-bottom: 2vw
    }

    .commingsoon_custom p img {
        max-width: 100%
    }
}

.exDesignSlide {
    margin: 0 auto;
    max-width: 600px
}

.exDesignSlide .slick-arrow {
    width: 34px;
    height: 34px;
    margin-top: -17px
}

.exDesignSlide .slick-arrow:before {
    color: #000;
    font-size: 34px
}

.exDesignSlide .slick-prev {
    left: -34px
}

.exDesignSlide .slick-next {
    right: -34px
}

.exDesignSlide figure img {
    max-width: 100%;
    margin: 0 auto
}

@media (max-width: 767px) {
    .exDesignSlide .slick-dots {
        display: none !important
    }
}

.exDesignSlide-nav {
    margin: 0 auto;
    max-width: 800px;
    display: flex;
    justify-content: center
}

.exDesignSlide-nav * {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    outline: none
}

.exDesignSlide-nav figure {
    width: 20%;
    border: 1px solid #eeeeee;
    padding: 15px;
    box-sizing: border-box;
    margin: 0 10px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

@media (max-width: 767px) {
    .exDesignSlide-nav figure {
        padding: 2vw;
        margin: 0 1vw
    }
}

.exDesignSlide-nav figure.slick-current {
    background: #eeeeee
}

.exDesignSlide-nav figure img {
    max-width: 100%;
    margin: 0 auto
}

.exDesignSlide-nav figure.slick-slide {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    cursor: pointer
}

body.lenses article section#photoGallery .inner .photographerList ul li {
    padding: 16px !important
}

@media (max-width: 767px) {
    body.lenses article section#photoGallery .inner .photographerList ul li {
        padding: 2.933vw !important
    }
}

body.lenses article section#photoGallery .inner .photographerList ul li span {
    width: 1px !important;
    position: relative
}

body.lenses article section#photoGallery .inner .photographerList ul li span:before {
    content: "";
    width: 1px;
    position: absolute;
    background: #555;
    height: 1.5em;
    display: block;
    top: -1.1em;
    left: 18px
}

@media (max-width: 767px) {
    body.lenses article section#photoGallery .inner .photographerList ul li span:before {
        top: -1.1em;
        left: 2.5vw
    }
}

.feature_body sup {
    font-size: .55em;
    vertical-align: top
}

body.lenses article section.FloatingSystem#productsDetails .block .feature_header {
    margin-bottom: 10px
}

body.lenses article section.FloatingSystem#productsDetails .block .feature_body {
    padding-top: 0
}

@media (max-width: 767px) {
    body.lenses article section.FloatingSystem .block {
        padding-top: 0;
        margin-bottom: 0
    }
}

a.emount.emount02 {
    top: 82.5%;
    left: 23.5%
}

@media (max-width: 767px) {
    a.emount.emount02 {
        top: 81%;
        left: 55%
    }
}

.product_detail {
    text-align: center;
    padding-top: 50px
}

@media (max-width: 767px) {
    .product_detail {
        width: 100%
    }
}

.product_detail .image {
    position: relative;
    display: inline-block
}

@media (max-width: 767px) {
    .product_detail .image {
        width: 100%;
        margin-bottom: 40px
    }
}

.product_detail .image img {
    width: 985px
}

@media (max-width: 767px) {
    .product_detail .image img {
        width: 100%
    }
}

.product_detail .image .number {
    position: absolute
}

@media (min-width: 768px) {
    .product_detail .image .number {
        transition: opacity ease .4s
    }

    .product_detail .image .number:hover {
        transition: opacity ease .4s;
        opacity: .7
    }
}

.product_detail .image .number span {
    display: block;
    line-height: 1;
    width: 52px;
    height: 52px
}

@media (max-width: 767px) {
    .product_detail .image .number span {
        width: 8vw;
        height: 8vw
    }
}

.product_detail .image .number__01 {
    background: url(../img/product/lens/a057/image/number_1.png) no-repeat center center;
    background-size: contain
}

.product_detail .image .number__02 {
    background: url(../img/product/lens/a057/image/number_2.png) no-repeat center center;
    background-size: contain
}

.product_detail .image .number__03 {
    background: url(../img/product/lens/a057/image/number_3.png) no-repeat center center;
    background-size: contain
}

.product_detail .image .number__04 {
    background: url(../img/product/lens/a057/image/number_4.png) no-repeat center center;
    background-size: contain
}

.product_detail .image .number__05 {
    background: url(../img/product/lens/a057/image/number_5.png) no-repeat center center;
    background-size: contain
}

.product_detail_a057 .number {
    cursor: pointer
}

.product_detail_a057 .number__01 {
    top: 0;
    left: 110px
}

@media (max-width: 767px) {
    .product_detail_a057 .number__01 {
        top: 0;
        left: 11vw
    }
}

.product_detail_a057 .number__02 {
    top: 130px;
    left: 485px
}

@media (max-width: 767px) {
    .product_detail_a057 .number__02 {
        top: 9vw;
        left: 43vw
    }
}

.product_detail_a057 .number__03 {
    top: 10px;
    left: 560px
}

@media (max-width: 767px) {
    .product_detail_a057 .number__03 {
        top: 0vw;
        left: 50vw
    }
}

.product_detail_a057 .number__04 {
    top: 200px;
    right: 300px
}

@media (max-width: 767px) {
    .product_detail_a057 .number__04 {
        top: 16vw;
        right: 24vw
    }
}

.product_detail_a057 .number__05 {
    top: 170px;
    right: 110px
}

@media (max-width: 767px) {
    .product_detail_a057 .number__05 {
        right: 7vw;
        top: auto;
        bottom: 15vw
    }
}

.numberlist {
    margin-bottom: 20px
}

.numberlist li {
    border-bottom: 1px solid #757575
}

.numberlist li a {
    padding: 30px 0;
    font-size: 1.6rem;
    line-height: 1.3;
    padding-right: 40px;
    position: relative;
    display: block
}

@media (max-width: 767px) {
    .numberlist li a {
        display: flex;
        align-items: center
    }
}

.numberlist li a:after {
    position: absolute;
    right: 10px;
    top: 50%;
    z-index: 1;
    font-family: 'tmrnp';
    content: '\e805';
    display: block;
    font-size: 20px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    line-height: 1
}

.numberlist li a span {
    display: inline-block;
    position: relative;
    top: 2px;
    margin-right: 7px
}

@media all and (-ms-high-contrast: none) {
    .numberlist li a span {
        top: -1px
    }
}

@media (max-width: 767px) {
    .numberlist li a span {
        width: 9vw;
        top: 0
    }
}

.numberlist li a span span {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    color: #fff;
    background: #005cab;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    font-size: 12px;
    line-height: 1
}

@media all and (-ms-high-contrast: none) {
    .numberlist li a span span {
        line-height: 24px;
        display: inline-block
    }
}

@media (max-width: 767px) {
    .numberlist li a span span {
        width: 6vw;
        height: 6vw;
        font-size: 3.2vw
    }
}

.numberlist li a span.txt {
    width: calc(100% - 27px);
    margin: 0;
    top: 0
}

@media all and (-ms-high-contrast: none) {
    .numberlist li a span.txt {
        width: calc(100% - 35px)
    }
}

@media (max-width: 767px) {
    .numberlist li a span.txt {
        width: calc(100% - 7vw)
    }
}

body.lenses .details.box {
    min-width: 985px;
    padding: 40px 40px;
    box-sizing: border-box
}

@media (max-width: 767px) {
    body.lenses .details.box {
        width: 100%;
        min-width: 1px;
        padding: 20px 20px
    }
}

body.lenses .details.box.pt0 {
    padding: 0 40px 40px
}

@media (max-width: 767px) {
    body.lenses .details.box.pt0 {
        padding: 0 20px 20px
    }
}

body.lenses .details.box .image {
    float: none;
    width: 100%;
    margin-bottom: 40px;
    margin-left: -40px;
    width: calc(100% + 80px)
}

@media (max-width: 767px) {
    body.lenses .details.box .image {
        margin-left: -20px;
        width: calc(100% + 40px)
    }
}

body.lenses .details.box .image.movWrap {
    width: 516px;
    margin: 0 auto 40px
}

@media (max-width: 767px) {
    body.lenses .details.box .image.movWrap {
        width: 100%
    }
}

body.lenses .details.box .image img {
    width: auto;
    margin: 0 auto;
    max-width: 100%
}

@media (max-width: 767px) {
    body.lenses .details.box .image img {
        width: 100%
    }
}

body.lenses .details.box .title {
    float: none;
    width: 100%
}

body.lenses .details.box .body .txt {
    float: none;
    width: 100%
}

body.lenses .box figure.image.image__right {
    text-align: right
}

body.lenses .box figure.image.image__right img {
    width: auto;
    display: inline-block;
    max-width: 100%
}

@media (max-width: 767px) {
    body.lenses .box figure.image.image__right img {
        width: 100%;
        display: block
    }
}

@media (max-width: 767px) {
    body.lenses article section#photoGallery .slick .slider.slider-nav {
        display: none
    }
}

body.lenses article section #subGallery.slick.subGalleryCustom .slick-prev,
body.lenses article section #subGallery.slick.subGalleryCustom .slick-next {
    display: none !important
}

.image-row {
    display: flex;
    gap: 20px;
    align-items: flex-start; /* 保持图片顶部对齐 */
    justify-content: space-between; /* PC端两端对齐 */
}

/* 修改箭头样式：添加旋转90度 */
.image-row .underArrow {
    width: 50px;
    height: 50px;
    align-self: center; /* 箭头在Flex容器中垂直居中 */
    transform: rotate(-90deg); /* 旋转90度 */
}

/* 响应式调整保持原有设置 */
@media (max-width: 768px) {
    .image-row {
        flex-direction: column;
        align-items: center; /* 移动端垂直布局时居中对齐 */
    }
    
    .image-row .underArrow {
        width: 50px;
        height: 50px;
        margin-top: -15px;
        align-self: center; /* 小屏幕仍保持居中 */
        transform: rotate(0); /* 移动端保持0度 */
    }
}