@charset "utf-8";

#sub {overflow: hidden;}
.sub-visual {margin-top: 110px; padding-top: 93px;}
.sub-visual .path {display: flex; align-items: center; margin: 0 -10px 43px;}
.sub-visual .path li {position: relative; font-size: 20px; font-weight: 500; line-height: 1.3em; color: #000; padding: 0 10px;}
.sub-visual .path li:after {position: absolute; top: 50%; margin-top: -1px; right: -1px; content: ''; width: 2px; height: 2px; background: #000;}
.sub-visual .path li:last-child:after {display: none;}
.sub-visual .path li .home {width: 18px; height: 16px; background: url('../img/sub/path_icon_home.png') no-repeat center center;}
.sub-visual03 .path li:nth-child(3),
.sub-visual04 .path li:nth-child(3) {display: none;}
.sub-visual03 .path li:nth-child(2):after,
.sub-visual04 .path li:nth-child(2):after {display: none;}
.sub-visual .cate-title {margin-bottom: 53px;}
.sub-visual .cate-title h2 {font-size: 65px; font-weight: 600; line-height: 1em; color: #000;}
#lnb {margin-bottom: 80px;}
#lnb ul {display: flex; width: 100%; border-bottom: 1px solid #000;}
#lnb ul li {height: 75px; margin-right: 80px;}
#lnb ul li a {position: relative; height: 100%; align-content: center; font-size: 20px; line-height: 1.5em; color: #969696; transition: all 0.4s;}
#lnb ul li.active a {font-weight: 600; color: #0d5ec9;}
#lnb ul li a:hover {color: #0d5ec9;}
#lnb ul li a:after {position: absolute; bottom: -4px; left: 50%; transform: translateX(-50%); content: ''; width: 0; height: 7px; background: #0d5ec9; transition: all 0.4s;}
#lnb ul li.active a:after {width: calc(100% + 8px);}
#lnb ul li a:hover:after {width: calc(100% + 8px);}

.sub-visual-img {height: 300px; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.sub-visual-img01 {height: 450px; background-image: url('../img/sub/sub_visual01.jpg');}
.sub-visual-img02 {background-image: url('../img/sub/sub_visual02.jpg');}
.sub-visual-img .text-box {height: 100%; align-content: center; text-align: center;}
.sub-visual-img .text-box h3 {font-size: 40px; font-weight: 700; line-height: 1.4em; color: #fff; margin-bottom: 20px; padding-top: 10px;}
.sub-visual-img .text-box p {font-size: 25px; line-height: 1.5em; color: #fff;}

.real-cont {padding: 0 0 280px;}
.real-cont.pt-0 {padding-top: 0;}
.real-cont.pt-155 {padding-top: 155px;}

/* s1-1 */
.about .text-box {padding-top: 127px;}
.about .text-box h3 {font-size: 32px; font-weight: 600; line-height: 1.5em; color: #000; margin-bottom: 55px;}
.about .text-box p {font-size: 22px; line-height: 1.8em; color: #000;}
.about .text-box b {font-weight: 700;}
.about .process {margin-top: 150px; padding: 75px 0 90px; background: url('../img/sub/aboutus_process_bg.jpg') no-repeat center center/cover; border-radius: 50px 50px 0 0; overflow: hidden; text-align: center;}
.about .process h4 {position: relative; display: inline-block; font-size: 40px; font-weight: 500; line-height: 1.3em; color: #fff; text-align: center; margin-bottom: 85px;}
.about .process h4:after {position: absolute; bottom: 2px; left: 0; content: ''; width: 100%; height: 3px; background: #fff;}
.about .process ol {display: flex; justify-content: center;}
.about .process ol li {position: relative; max-width: 244px; width: 100%;}
.about .process ol li:after {position: absolute; top: 42px; right: -11px; content: ''; width: 22px; height: 22px; background: url('../img/sub/aboutus_process_arrow.png') no-repeat center center;}
.about .process ol li:last-child:after {display: none;}
.about .process ol li .icon {width: 114px; height: 114px; background-repeat: no-repeat; background-position: center center; margin: 0 auto 15px;}
.about .process ol li:nth-child(1) .icon {background-image: url('../img/sub/aboutus_process_icon01.png');}
.about .process ol li:nth-child(2) .icon {background-image: url('../img/sub/aboutus_process_icon02.png');}
.about .process ol li:nth-child(3) .icon {background-image: url('../img/sub/aboutus_process_icon03.png');}
.about .process ol li:nth-child(4) .icon {background-image: url('../img/sub/aboutus_process_icon04.png');}
.about .process ol li:nth-child(5) .icon {background-image: url('../img/sub/aboutus_process_icon05.png');}
.about .process ol li p {font-size: 17px; font-weight: 500; line-height: 1.3em; color: #fff;}

/* s1-2 */
.patent .gallery-list ul {display:flex; flex-wrap:wrap; margin-left:-48px; margin-bottom: -50px;}
.patent .gallery-list ul li {width:calc(25% - 48px); margin-left:48px; margin-bottom:50px;}
.patent .gallery-list ul li.none {width:100%; padding:70px 0; margin:0; text-align:center; color:#767676;}
.patent .gallery-list ul li .inner {position: relative; display:block; border:1px solid #ddd; padding:30px 25px; height:100%; transition:all 0.4s;}
.patent .gallery-list ul li .inner:after {opacity: 0; position: absolute; top: 0; left: 0; content: ''; width: 100%; height: 100%; border: 2px solid #2371c2; transition: all 0.6s;}
.patent .gallery-list ul li .thumb {overflow:hidden; margin-bottom:26px; position:relative;}
.patent .gallery-list ul li .thumb .notice_icon {position:absolute; top:20px; left:20px; z-index:1; width:84px; text-align:center; line-height:34px; border:1px solid #000; color:#000; font-size:14px; font-weight:600; background:#fff;}
.patent .gallery-list ul li .thumb .pic {position:relative; padding-bottom:147.91%; overflow:hidden; transition:all 0.4s;}
.patent .gallery-list ul li .thumb .pic img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.patent .gallery-list ul li .tit {font-size:18px; color:#666; line-height:1.6em; height:calc(1.6em * 1 * 2); overflow:hidden; text-overflow:ellipsis; word-break:break-all; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; transition:all 0.4s;}
.patent .gallery-list ul li .date {font-size:14px; line-height:1.6em; color:#666; transition:all 0.4s;}
.patent .gallery-list ul li .inner:hover {box-shadow:5px 5px 13px 3px rgba(165,165,165,0.45); cursor: pointer;}
.patent .gallery-list ul li .inner:hover:after {opacity: 1;}
.patent .gallery-list ul li .inner:hover .tit  {color:#000; font-weight:600;}
.patent .popup-imgWrap {display:none; position: fixed; top:50%; left:50%; transform:translate(-50%, -50%); z-index: 9999; width: 550px; height: 660px; overflow: hidden; border:1px solid #ddd; background-color: #fff; box-shadow:10px 10px 15px rgba(0,0,0,0.1); padding: 65px 0;}
.patent .popup-imgWrap .popup-imgInner {position: relative; width: 100%; height: 100%;}
.patent .popup-imgWrap .popup-imgInner .close-btn {position: absolute; top:-35px; right:25px; z-index: 99; width: 40px; height: 40px; background: url('../img/fancy_close.png') center center no-repeat; background-size: 50% 50%; color: #fff; cursor: pointer;}
.patent .popup-imgWrap .popup-imgInner img{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); width: auto; height: 100%; max-width:100%; max-height: 100%;;}
.popup-backdrop {display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.4); z-index: 100;}

/* s2 */
.product .item {display: flex; padding: 90px 0 123px; border-bottom: 1px solid #a6a6a6; }
.product .item:nth-child(1) {padding-top: 0;}
.product .item:last-child {padding-bottom: 0; border-bottom: 0;}
.product .item .img-box {max-width: 530px; width: 100%; margin-right: 80px;}
.product .item .notice {font-size: 16px; line-height: 1.5em; color: #000; padding: 0 2px; margin-top: 50px;}
/* .product .item .notice ul li {position: relative; padding-left: 18px;}
.product .item .notice ul li:before {position: absolute; top: 0; left: 2px; content: '※'; font-size: 19px; color: #000;} */
.product.immun .item10 .notice p {margin-top: 34px;}
.product .item .swiper-thumb {max-width: 412px; width: 100%; padding: 0 46px;}
.product .item .swiper-thumb.slide-col02 {max-width: 302px;}
.product .item .swiper-thumb.slide-col04 {max-width: 523px;}
.product .item .swiper-thumb.slide-col05 {max-width: 632px;}
.product .item .swiper-thumb .swiper-button-prev,
.product .item .swiper-thumb .swiper-button-next {width: 35px; height: 100%; background-color: #000; background-repeat: no-repeat; background-position: center center; margin: 0;}
.product .item .swiper-thumb .swiper-button-prev {left: 0; top: 0; background-image: url('../img/sub/product_btn_prev.png');}
.product .item .swiper-thumb .swiper-button-next {right: 0; top: 0; background-image: url('../img/sub/product_btn_next.png');}
.product .item .swiper-thumb .swiper-button-prev:after,
.product .item .swiper-thumb .swiper-button-next:after {display: none;}
.product .item .swiper-button-lock {display: block;}

.product .item .swiper-thumb .swiper-slide {position: relative; }
.product .item .swiper-thumb .swiper-slide:after {opacity: 0; position: absolute; top: 0; left: 0; content: ''; width: 100%; height: 100%; border: 3px solid #0d5ec9; transition: all 0.4s;}
.product .item .swiper-thumb .swiper-slide-thumb-active:after {opacity: 1;}

.product .item .swiper-main {margin-bottom: 30px;}

.product .item .info-box {width: 1%; flex: 1 1 auto;}
.product .item .info-box > h4 {font-size: 28px; font-weight: 600; line-height: 1.4em; color: #000; margin-bottom: 5px;}
.product .item .info-box > p {font-size: 18px; line-height: 1.3em; color: #979797;}
.product .item .info-box table {width: 100%; margin-top: 30px; border-left: 1px solid #d6d6d6; }
.product .item .info-box table caption {font-size: 20px; font-weight: 700; line-height: 1.4em; color: #fff; background: #171717; padding: 12px 25px; text-align: left;}
.product .item .info-box table tr {border-bottom: 1px solid #d6d6d6; border-right: 1px solid #d6d6d6;}
.product .item .info-box table th {width: 210px; font-size: 16px; font-weight: 500; line-height: 1.5em; color: #000; padding: 12px 20px; text-align: left; border-right: 1px solid #d6d6d6;}
.product .item .info-box table td {font-size: 16px; line-height: 1.5em; color: #757575; padding: 12px 20px;}
.product .item .info-box table td .italic {font-style: italic;}
.product .item .info-box table td li {position: relative; padding-left: 10px;}
.product .item .info-box table td li:not(:last-child) {margin-bottom: 10px;}
.product .item .info-box table td li:before {position: absolute; top: 10px; left: 0; content: ''; width: 2px; height: 2px; background: #757575;}