@charset "utf-8";

/*missha menu common*/
.missha {font-size:14px;font-family:'RobotoL', 'NotoSansL';text-align:left;line-height: 1.64;letter-spacing: -0.03em;}
.missha section {position:relative;background-position:center;background-size:cover;overflow: auto;}
.missha section .inner {width:100%; padding:0 16px; margin:0 auto; position:relative; overflow: auto;}
.missha h2 {font-family:'RobotoB', 'NotoSansB';font-size: 32px;word-break: keep-all;}

/*missha slide common */
.missha .swiper-pagination {width: calc(100% - 32px);margin: 30px 16px 0;height:2px;background:#ddd;position:relative;}
.missha .swiper-pagination-progressbar-fill {position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: scale(0); transform-origin: left top; background:black;}


/*missha nav*/
.missha .missha_nav {font-family: 'RobotoL', 'NotoSansL';letter-spacing:0;width:100%;height:52px;display:block;overflow:hidden;border-bottom:2px solid #000;position:absolute;top:0;z-index:99;transition:all 0.3s;background: #fff;text-transform: capitalize;}
.missha .missha_nav ul {padding:0 16px;}
.missha .missha_nav .now {font-family: 'RobotoR', 'NotoSansR';width:100%;height:52px;text-align:left;padding:16px;background-image:url('../img/brand/misshanav_arrow.png');background-size: auto 100%;background-repeat:no-repeat;background-position:right;text-transform: capitalize;}
.missha .missha_nav li a {line-height:32px;}
.missha .missha_nav li.on a,
.missha .missha_nav li:hover a {font-family: 'RobotoB', 'NotoSansB';}


/* 하단 페이지네이션 */
.missha .pagination {text-align:center; display:flex; justify-content:center;}
.missha .pagination button {width:46px; height:46px; margin:0; display:block;}
.missha .pagination .btn_wrap {width:102px; display:flex; justify-content:space-between;}
.missha .pagination .btn_prev {background-image:url('../img/brand/btn_prev.png');}
.missha .pagination .btn_next {background-image:url('../img/brand/btn_next.png');}
.missha .pagination .btn_first {background-image:url('../img/brand/btn_first.png');}
.missha .pagination .btn_last {background-image:url('../img/brand/btn_last.png');}
.missha .pagination .numbox {display:flex; justify-content:space-between; width:220px; height:24px; margin:10px 40px; }
.missha .pagination a {display:block;font-family: 'NotoSansM';color: #8e8e8e; line-height: 17px;padding: 0 2px;}
.missha .pagination a:hover {color:#000;}
.missha .pagination a.current {border-bottom:3px solid #000;color: #000;}



/* animation fix */
[data-aos^=zoom][data-aos^=zoom] {opacity:1;}
[data-aos=zoom-in] {transform:scale(0.8);}

[data-aos^=up] {transform: translate3d(0,100px,0);}
[data-aos=up] {transform: translate3d(0,100px,0);}
[data-aos=up-slow] {transform: translate3d(0,50px,0);}
[data-aos=up-fast] {transform: translate3d(0,200px,0);}
[data-aos^=up].aos-animate {transform: translateZ(0);}

[data-aos=get-right] {width:0; opacity:0;}
[data-aos=get-right].aos-animate {width:100%; opacity:1;}





/*tech*/
.tech h2 {font-size:25px; text-align:center;}
.tech h3 {font-size: 19px;text-align:center;letter-spacing:-0.04em;line-height:1.4;}
.tech p {font-size: 12px;}
.tech .bold {font-size: inherit; font-family:'NotoSansB';}
.tech .star {display:block;font-size:12px;}
.tech .star::before {content:'*'; display:inline;}
.tech .sub_txt {display:block;font-size:12px;line-height: 18px;margin-top: 3px;color: #acacac;font-family: 'NotoSansR';}

.tech .desc_wrap {border:1px solid #e9e9e9;}


.tech .kv {background: #f9f9f9 url('../img/tech/kv_bg.png');background-position:bottom;background-repeat:no-repeat;background-size:100% auto;}
.tech .kv::after {content:'';width:100%;height:0;padding-top: 69%;display:block;}
.tech .kv h2 {text-align:left; font-size:35px;font-family:'NotoSansB';margin-top: 42px;margin-left: 3px;}
.tech .kv p {margin-top: 7px;margin-left:5px;}


.tech .diagram {height:689px;background-color:#f4f4f4;text-align:center;overflow: hidden;position: relative;background-image: url('../img/tech/diagram_bg.png');background-size: auto 100%;background-repeat: no-repeat;}
.tech .diagram img {position: relative;width:auto;height:100%;left: 0;opacity: 0;}
.tech .diagram ul {width: 360px;position:absolute;top: 70px;left:calc(50% - 180px);text-align:center;}
.tech .diagram li {display:block;width:100%;height: 184px;padding-top: 30px;}
.tech .diagram .title {font-size: 23px;font-family:'RobotoB';line-height: 1.16;margin-bottom: 16px;position:relative;}
.tech .diagram .title::after {content:''; width:4px; height:4px; display:block; background:black; border-radius:100%; position:absolute; left:calc(50% - 2px); top:58px;}

.tech .time h2 {margin-top: 45px;margin-bottom: 4px;}
.tech .time h3 {margin-top: 30px;}
.tech .time .kv_wrap {margin-bottom:8px;}
.tech .time .desc_wrap {margin-top: 8px;}
.tech .time .time_desc_2 h3 {text-align:left;margin-left:30px;margin-top:22px;padding-right: 30px;}
.tech .time .time_desc_2 p {margin-left:30px;margin-top: 11px;font-size: 14px;padding-right: 30px;}
.tech .time .time_desc_2 p .star {margin-top:9px; color:#777;}

.tech .collagen {/* padding-top:5px; */}
.tech .collagen h2 {margin-top:58px;margin-bottom:19px;}
.tech .collagen h3 {margin-top:40px;}
.tech .collagen .desc_list {width:81.6666%;margin: 45px auto 0;}
.tech .collagen .desc_wrap {margin-top:15px;}
.tech .collagen .collagen_desc_1 {margin-top: 14px;}

.tech .vita h2 {margin-top:56px; margin-bottom:20px;}
.tech .vita .desc_wrap {margin-top: 17px;}
.tech .vita .vita_desc h3 {text-align:left;margin-top:24px;margin-left:27px;padding-right: 30px;}
.tech .vita .vita_desc p {margin-left:28px;margin-top: 9px;font-size: 14px;padding-right: 30px;}

.tech .bee h2 {margin-top: 63px;}
.tech .bee .desc_wrap {margin-top: 17px;}
.tech .bee .bee_desc h3 {text-align:left; margin-top:30px; margin-left:27px;}
.tech .bee .bee_desc p {margin-left:29px;margin-top: 7px;font-size:16px;line-height:1.5;padding-right: 30px;}
.tech .bee .bee_desc .star {margin-left:28px;color:#777;font-size: 10px;letter-spacing: 0;}

.tech .cho {padding-bottom:60px;}
.tech .cho h2 {margin-top: 57px;}
.tech .cho .kv_wrap p {text-align:center; font-size:14px; margin-top:2px;margin-bottom:24px;}
.tech .cho .cho_txt {margin-top:25px;overflow: hidden;}
.tech .cho .cho_txt .star {font-size: 8px;color: #a3a3a3;}
.tech .cho .cho_txt .star span {float:left;}
.tech .cho .cho_txt .star .bold {display: block;width: 64px;}
.tech.en .cho .cho_txt .star .bold {display: block;width: 120px;}
.tech .cho .cho_txt .star .bold~span {/* width: calc(100% - 120px); */padding-left: 8px;}
.tech .cho .cho_txt .star::before {content:'';}
.tech .cho .cho_desc_1 {margin-top: 28px;}
.tech .cho .desc_wrap h3 {text-align:left;margin-top: 19px;margin-left: 24px;font-size: 18px;}
.tech .cho .desc_wrap p {margin-left: 25px;margin-top: 3px;margin-bottom: 19px;font-size: 14px;line-height:1.5;padding-right: 25px;}
.tech .cho .desc_wrap .star {margin-top: 10px;color:#777;font-size: 11px;letter-spacing: 0;}
.tech .cho .cho_desc_2 {margin-top: 13px;}