/* sub_menu */
.sub_menu {
    text-align: center;
    padding-top: 58px;
    background-color: #fff;
}
.sub_menu ul {
    display: flex;
    align-items: center;
    border: 1px solid #707070;
    border-radius: 20px 20px 0px 0px;
    /* max-width: 1086px; */
    margin: 67px auto 0px;
}
.sub_menu li {
    width: 33.3%;
    display: block;
    position: relative;
}
.sub_menu a {
    font-size: 22px;
    font-weight: 500;
    color: #222;
    width: 100%;
    line-height: 100px;
    display: inline-block;
}
.sub_menu a:hover {
    font-weight: 700;
    color: #cb9d6c;
}
.sub_menu li:after {
    content: '';
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 64px;
    background-color: #707070;
}
.sub_menu li:last-child::after {
    display: none;
}
.sub_menu img {
    transform: translateY(0px);
    animation: arrow 2s ease-in-out infinite;
}
@keyframes arrow {
    0% {
        transform: translateY(0px);
        opacity: 1;
    }
    /* 50% {
                                transform: translateY(-10px);
                                opacity: 1;
                            } */
    100% {
        transform: translateY(30px);
        opacity: 0;
    }
}

/* nano01 */
.nano01 {
    position: relative;
    background-color: #fff;
    padding: 156px 0px 156px;
    text-align: center;
    color: #222;
}
.nano01::before {
    content: '';
    display: block;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 540px;
    background: linear-gradient(to bottom, #cb9d6c, #fff);
    opacity: 0.2;
    position: absolute;
}
.nano01 h2 {
    font-size: 46px;
    font-weight: 400;
    line-height: 66px;
}
.nano01 h2 span {
    color: #cb9d6c;
    font-weight: 700;
}
.nano01 > div {
    position: relative;
}
.nano01 > div > p {
    font-size: 24px;
    font-weight: 400;
    margin: 54px auto 69px;
}
.nano01_con {
    display: flex;
    align-items: center;
    justify-content: center;
}
.nano01_con span {
    font-size: 18px;
    font-weight: 300;
    color: #cb9d6c;
}
.nano01_con > div > div {
    margin-top: 12px;
    border-radius: 20px;
    border: 2px solid #cb9d6c;
    padding: 26px 0px 25px;
    width: 260px;
}
.nano01_con h3 {
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 9px;
}
.nano01_con p {
    font-size: 20px;
    font-weight: 300;
    color: #cb9d6c;
}
.nano01_con02 {
    margin: 0px 42px;
}

/* nano02 */
.nano02 {
    background-image: url(../img/sub/nano02.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
    padding-top: 231px;
    text-align: center;
}
.nano02 h2 {
    font-size: 46px;
    font-weight: 400;
    line-height: 66px;
}
.nano02 h2 span {
    color: #ffc98f;
    font-weight: 700;
}
.nano02 > p {
    font-size: 18px;
    font-weight: 400;
    margin: 38px auto 170px;
    opacity: 0.3;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.nano02_con {
    width: 100%;
    padding: 28px 0px;
    border-top: 1px solid #ffc98f;
    backdrop-filter: blur(15px);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: left;
    background-color: rgba(255, 255, 255, 0.1);
}
.nano02_con > div {
    padding-left: 47px;
}
.nano02_con h3 {
    font-size: 32px;
    font-weight: 400;
    margin-bottom: 51px;
}
.nano02_con h3 span {
    color: #ffc98f;
}
.nano02_con p {
    font-size: 24px;
    font-weight: 300;
    line-height: 44px;
}
.nano02_con p span {
    color: #ffc98f;
}

/* nano03 */
.nano03 {
    position: relative;
    background-color: #fff;
}
.nano03::after {
    content: '';
    display: block;
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 394px;
    background: linear-gradient(to top, #fff, transparent);
}

/* nano04 */
.nano04 {
    padding-top: 183px;
    text-align: center;
    background-color: #fff;
}
.nano04 h2 {
    font-size: 46px;
    font-weight: 400;
    color: #222;
    margin-bottom: 102px;
}
.nano04 h2 span {
    font-weight: 700;
    color: #cb9d6c;
}
.nano04 img {
    transform: translateX(4%);
}

/* nano05 */
.nano05 {
    padding: 174px 0px 200px;
    text-align: center;
    color: #222;
    background-color: #fff;
}
.nano05_wrap {
    max-width: 1600px;
    width: 100%;
    margin: 0 auto;
}
.nano05 h2 {
    font-size: 46px;
    font-weight: 400;
    line-height: 66px;
    margin-bottom: 122px;
}
.nano05 h2 span {
    font-weight: 700;
    color: #cb9d6c;
}
.nano05 p {
    font-size: 24px;
    font-weight: 400;
    line-height: 44px;
    margin: 130px auto 0px;
}
.nano05 p span {
    font-weight: 700;
    color: #cb9d6c;
}
.nano05 h3 {
    font-size: 20px;
    font-weight: 400;
    line-height: 34px;
    padding: 31px 0px;
    border-radius: 20px;
    background-color: #f0f1f3;
    max-width: 1600px;
    margin: 38px auto 0px;
}

/* nano06 */
.nano06 {
    height: 396px;
    position: relative;
    background-image: url(../img/sub/nano06_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}
.nano06_video_wrap {
    /* width: 100%;
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    z-index: -1;
    height: 960px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden; */
}
.nano06_con {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    color: #fff;
}
.nano06_line {
    width: 374px;
    height: 1px;
    background-color: #fff;
    margin: 0px 76px;
}
.nano06_con h2 {
    font-size: 60px;
    font-weight: 700;
}

/* nano07 */
.nano07 {
    padding: 323px 0px 395px;
    color: #222;
    background-color: #fff;
    position: relative;
}
.nano07 h2 {
    font-size: 46px;
    font-weight: 400;
    line-height: 66px;
    margin-bottom: 144px;
}
.nano07 h2 span {
    color: #cb9d6c;
    font-weight: 700;
}
.nano07 p {
    font-size: 24px;
    font-weight: 400;
    line-height: 44px;
}
.nano07 p span {
    color: #cb9d6c;
    font-weight: 700;
}
.nano07_con {
    position: absolute;
    right: 160px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 947px;
}
.nano07_con > div {
    position: absolute;
    overflow: hidden;
    width: 456px;
    height: 593px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s;
}
.nano07_con01 {
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
}
.nano07_con02 {
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
}
.nano07_con > div:hover {
    width: 628px;
    height: 817px;
    z-index: 1;
}
.nano07_con video {
    height: 100%;
    width: auto;
}
/* nano08 */
.nano08 {
    padding-bottom: 403px;
    background-color: #fff;
    overflow: hidden;
    user-select: none;
}
.nano08_con01,
.nano08_con05 {
    animation: wave01 60s infinite linear;
}
.nano08_con02,
.nano08_con04,
.nano08_con06,
.nano08_con08 {
    transform: translateY(60px);
    animation: wave02 60s infinite linear;
}
.nano08_con03,
.nano08_con07 {
    transform: translateY(150px);
    animation: wave03 60s infinite linear;
}
.nano08_swiper {
    width: 100%;
}
.nano08_swiper .swiper-slide {
    border-radius: 20px;
    overflow: hidden;
}
.nano08_swiper .swiper-wrapper {
    transition-timing-function: linear !important;
}
@keyframes wave01 {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(150px);
    }
    100% {
        transform: translateY(0px);
    }
}
@keyframes wave02 {
    0% {
        transform: translateY(60px);
    }
    25% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(60px);
    }
    75% {
        transform: translateY(150px);
    }
    100% {
        transform: translateY(60px);
    }
}
@keyframes wave03 {
    0% {
        transform: translateY(150px);
    }
    50% {
        transform: translateY(0px);
    }
    100% {
        transform: translateY(150px);
    }
}

/* nano09 */
.nano09 {
    background-image: url(../img/sub/nano09_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    padding: 189px 0px 251px;
    color: #fff;
}
.nano09 h2 {
    font-size: 46px;
    font-weight: 400;
}
.nano09 h2 span {
    color: #ffc98f;
}
.nano09 > div > p {
    font-size: 24px;
    font-weight: 400;
    line-height: 40px;
    margin: 54px auto 128px;
}
.nano09_img {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}
.nano09_img > div {
    position: relative;
}
.nano09_img02 > img {
    filter: grayscale(1);
}
.nano09_img02 > span {
    display: block;
    border-radius: 50%;
    width: 337px;
    height: 337px;
    border: 2px solid #fff;
    position: absolute;
    top: 93px;
    left: 50%;
    transform: translateX(-50%) !important;
    background-image: url(../img/sub/nano09_img02.png);
    background-repeat: no-repeat;
    background-position: -286px -93px;
}
.nano09_img03 p {
    font-size: 20px;
    font-weight: 300;
    color: #ffc98f;
    position: absolute;
    line-height: 28px;
    text-align: left;
}
.nano09_img03 p:first-of-type {
    top: 145px;
    right: 148px;
}
.nano09_img03 p:last-of-type {
    bottom: 142px;
    right: 112px;
}
.nano09_img p::before {
    content: '';
    display: block;
    left: -31px;
    top: 50%;
    transform: translateY(-50%);
    background-color: #ffc98f;
    border-radius: 50%;
    width: 14px;
    height: 14px;
    position: absolute;
}
.nano09_img04 p {
    font-size: 20px;
    font-weight: 300;
    color: #ffc98f;
    position: absolute;
    line-height: 28px;
    text-align: left;
    top: 55px;
    right: 89px;
}
.nano09_con {
    position: relative;
    margin-top: 156px;
}
.nano09_con div {
    padding: 24px 25px;
    border-radius: 99px;
    border: 2px solid #cb9d6c;
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 868px;
    width: 100%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -52px;
}
.nano09_con h3 {
    line-height: 55px;
    border-radius: 99px;
    background-color: #fff;
    border: 2px solid #cb9d6c;
    color: #222;
    font-size: 22px;
    font-weight: 500;
    padding: 0px 36px;
}
.nano09_con h3 span {
    color: #cb9d6c;
}

/* nano10 */
.nano10 {
    background-image: url(../img/sub/nano10_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    padding: 119px 0px;
    color: #222;
    text-align: center;
}
.nano10 > div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.nano10 h4 {
    max-width: 710px;
    width: 100%;
    line-height: 80px;
    border-radius: 20px;
    background-color: #fff;
    border: 2px solid #cb9d6c;
    font-size: 28px;
    font-weight: 500;
}
.nano10 h4 span {
    color: #cb9d6c;
}

/* nano11 */
.nano11 {
    background-image: url(../img/sub/nano11_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    padding: 239px 0px 255px;
    color: #222;
}
.nano11 h2 {
    font-size: 46px;
    font-weight: 400;
}
.nano11 h2 span {
    color: #cb9d6c;
    font-weight: 700;
}
.nano11 > div > p {
    font-size: 18px;
    font-weight: 400;
    margin: 12px auto 92px;
    opacity: 0.3;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.nano11_con02 {
    margin: 40px auto;
}
.nano11_con > div {
    display: flex;
    align-items: center;
    padding: 50px;
    border: 1px solid #cb9d6c;
    border-radius: 20px;
    background-color: #fdfaf7;
}
.nano11_img {
    border-radius: 30px;
    overflow: hidden;
    position: relative;
}
.nano11_img span {
    background-color: #cb9d6c;
    line-height: 81px;
    display: inline-block;
    color: #fff;
    width: 81px;
    text-align: center;
    font-size: 40px;
    font-weight: 700;
    border-radius: 0px 0px 30px 0px;
    position: absolute;
    left: 0px;
    top: 0px;
}
.nano11_txt {
    padding-left: 64px;
    text-align: left;
}
.nano11_txt h3 {
    font-size: 30px;
    font-weight: 700;
}
.nano11_txt h3 span {
    color: #cb9d6c;
}
.nano11_txt p {
    font-size: 24px;
    font-weight: 400;
    line-height: 40px;
    margin-top: 54px;
}
.nano11_new {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 263px;
}
.nano11_new > div {
    position: relative;
}
.nano11_new h4 {
    font-size: 24px;
    font-weight: 700;
    color: #222222;
    margin-top: 36px;
    text-align: center;
}
.nano11_new span {
    font-size: 40px;
    font-weight: 700;
    color: #fff;
    position: absolute;
    left: 0px;
    top: 0px;
    background-color: #cb9d6c;
    line-height: 81px;
    width: 81px;
    text-align: center;
    border-radius: 30px 0px 30px 0px;
}

/* nano12 */
.nano12 {
    background-image: url(../img/sub/implant10_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 184px;
    padding-bottom: 212px;
    overflow: hidden;
    color: #fff;
}
.nano12_title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 64px;
}
.nano12_txt h2 {
    font-size: 48px;
    font-weight: 400;
    margin-bottom: 11px;
}
.nano12_txt > span {
    font-weight: 700;
}
.nano12_txt p {
    font-size: 18px;
    font-weight: 400;
    opacity: 0.3;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.nano12_nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 138px;
    width: 100%;
}
.nano12_nav > div {
    transform: rotate(180deg);
    cursor: pointer;
}
.nano12_swiper {
    width: 100%;
}
.nano12_swiper .swiper-slide > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.nano12_swiper .swiper-slide > div > div {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
}
.nano12_swiper .swiper-slide > div > div > span {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    text-align: center;
    width: 240px;
    line-height: 50px;
    font-size: 26px;
    font-weight: 700;
    border-radius: 20px 20px 0px 0px;
    background-color: #444444;
}
.nano12_swiper .swiper-slide .bna_a span {
    background-color: #cb9d6c;
}
.bna_b > img {
    opacity: 0.2;
}
.bna_b > img.login {
    opacity: 1;
}
.bna_b a {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 1;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 15px;
    padding: 20px 19px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 302px;
}
.bna_b a h4 {
    font-size: 20px;
    font-weight: 400;
    color: #222;
    line-height: 40px;
}
.bna_b a span {
    font-size: 30px;
    font-weight: 700;
}
.bna_top {
    margin-bottom: 50px;
}
.bna_date {
    display: flex;
    align-items: center;
    margin-top: 36px;
}
.bna_date p {
    font-size: 22px;
    font-weight: 400;
    width: 50%;
    text-align: center;
}
.nano12 h3 {
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    padding: 49px 0px;
    background-color: rgba(240, 241, 243, 0.2);
    border-radius: 20px;
    margin-top: 68px;
}

/* nano13 */
.nano13 {
    position: relative;
    padding: 224px 0px 249px;
    color: #222;
}

.nano13::before {
    content: '';
    display: block;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 540px;
    position: absolute;
    opacity: 0.2;
    background: linear-gradient(to bottom, #cb9d6c, #fff);
    z-index: -1;
}

.nano13 h3 {
    font-size: 46px;
    font-weight: 400;
    line-height: 66px;
}

.nano13 span {
    color: #cb9d6c;
    font-weight: 700;
}

.nano13 p {
    font-size: 24px;
    font-weight: 400;
    line-height: 44px;
}

.nano13_con01 {
    margin-bottom: 147px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nano13_con02 {
    display: flex;
    align-items: center;
    gap: 64px;
}

.nano13_con01 h3 {
    margin-bottom: 96px;
}

.nano13_txt img {
    margin: 48px 0px 95px;
}

/* nano14 */
.nano14 {
    color: #fff;
    background-image: url(../img/sub/nano14_title.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.nano14_title {
    text-align: center;
    padding: 319px 0px 25px;
}

.nano14_title h2 {
    margin-bottom: 24px;
    font-size: 46px;
    font-weight: 400;
    line-height: 66px;
}

.nano14_title h2 span {
    color: #ffe2c2;
    font-weight: 600;
}

.nano14_title h3 {
    color: #cb9d6c;
    font-size: 46px;
    font-weight: 700;
    line-height: 85px;
    background-color: #fff;
    padding: 0px 18px;
    display: inline-block;
}
.nano14_title p {
    color: #fff;
    opacity: 0.6;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    margin-top: 264px;
}

.nano14_con {
    padding: 122px 0px;
}

.nano14_con > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nano14_con h4 {
    font-size: 46px;
    font-weight: 400;
    line-height: 66px;
}

.nano14_con h4 span {
    color: #cb9d6c;
    font-weight: 700;
}

/* nano15 */
.nano15 {
    padding: 228px 0px 193px;
}

.nano15 > div > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}
.nano15 > div > div > div {
    position: relative;
}
.nano15 > div > div > img {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 1;
}

.nano15 p {
    text-align: center;
    color: #222;
    margin-top: 30px;
    font-size: 20px;
    font-weight: 700;
}
.nano15_con02 {
    margin: 68px auto;
}
.nano15 h3 {
    text-align: center;
    color: #cb9d6c;
    margin-top: 105px;
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
}
.nano15 a {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 1;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 15px;
    padding: 20px 19px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 302px;
}
.nano15 a h4 {
    font-size: 20px;
    font-weight: 400;
    color: #222;
    line-height: 40px;
}
.nano15 a span {
    font-size: 30px;
    font-weight: 700;
}
