@charset "utf-8";

.doc-tit {position:relative; padding-left:30px; margin-bottom:25px; font-size:22px; font-weight:600; color:#242424; letter-spacing:-.02em;}
.doc-tit::before {content:''; position:absolute; width:20px; height:20px; top:3px; left:0;background-image:url('../images/sub/doc-before.png'); background-repeat:no-repeat; background-size:contain;}
.doc-txt span {font-weight:700; color:#242424;}
ol li span {font-weight:700; color:#242424;}

.intro-sec.sec01 {margin-top:35px;}
.intro-sec .doc-txt {letter-spacing:-.02em;}
.intro-sec.sec02 {margin:75px 0;}

.intro-sec .tbl {margin-top:25px;}
.tbl table {border-collapse:collapse; border-spacing:0; width:100%;}
.intro-sec .tbl tbody tr {border-bottom:1px solid #ddd;}
.intro-sec .tbl tbody tr:first-child {border-top:2px solid #242424;}
.intro-sec .tbl tbody th {padding:20px 10px; background-color:#f4f4f4; font-weight:600; color:#242424; letter-spacing:-.02em;}
.intro-sec .tbl tbody td {padding:20px 30px; letter-spacing:-.02em;}

.cert-wrap ul {display:flex; flex-wrap:wrap; margin:0 -15px;}
.cert-wrap ul li {width:25%; padding:0 15px;}
.cert-wrap ul li:nth-child(n+5) {margin-top:25px;}
.cert-wrap img {border:1px solid #ddd;}
.cert-wrap p {margin-top:12px; text-align:center; font-weight:500;}

.top-img {display:flex; width:100%;}
.top-img img {border-radius:20px 0 0 20px;}
.top-img .t-box {display:flex; flex-direction:column; justify-content:center; padding-left:75px; width:100%; border-radius:0 20px 20px 0 ; background-color:#f4f4f4;}
.top-img .t-box .tt {margin-bottom:25px; font-size:34px; font-weight:700; color:#242424;}

.img-border {padding: 20px; height: 450px; display: flex; width: 100%; align-items: center; justify-content: center; border:1px solid #ddd; border-radius:10px;}
.img-border2 {padding: 20px; height: 450px; display: flex; width: 100%; align-items: center; justify-content: center; border:1px solid #ddd; border-radius:10px;}

.children-sec:not(:first-child) {margin-top:75px;}
.children-sec .indent {margin-left:15px; text-indent:-15px;}
.children-sec > img {border:1px solid #ddd;}
.children-sec .doc-txt2 {margin:35px 0;}

.tab-list {margin-bottom:80px;}
.tab-list .items {display:flex; justify-content:center; margin:0 -10px;}
.tab-list .item {margin:0 10px; width: 200px;}
.tab-list a {display:inline-flex; align-items:center; justify-content:center; width:200px; height:42px; border-radius:21px; border:1px solid #ddd; font-size:18px; font-weight:500;}
.tab-list .item.active a {background-color:#004ea2; color:#fff;}

.prod-tbl table {border-collapse:collapse; border-spacing:0; width:100%;}
.prod-tbl thead {border-top:2px solid #242424;}
.prod-tbl thead tr {border-bottom:1px solid #ddd; background-color:#f4f4f4;}
.prod-tbl thead th {padding:20px 10px;}
.prod-tbl tbody {text-align:center;}
.prod-tbl tbody {}
.prod-tbl tbody tr {border-bottom:1px solid #ddd;}
.prod-tbl tbody td {padding:20px 10px;}

.product-list ul li .thumb .text-box {display: none; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:auto; color:#fff; z-index: 2;}
.product-list ul li .thumb:hover .text-box {display: block; }
.product-list ul li .thumb:hover .text-box .p-tit {font-size: 25px; font-weight: 600; line-height: 1.2em; margin-bottom: 20px;}
.product-list ul li .thumb:hover .text-box .p-txt {font-size: 15px; line-height: 1.47em;}

.summary-top {position: relative; padding:75px 0 35px; margin-bottom: 35px; border-bottom: 1px solid #ddd;}
.summary-title {text-align: center;}
.summary-title p {margin-bottom: 5px; font-size: 14px; color: #686868; line-height: 1.2em;}
.summary-title h1 {font-size: 40px; color: #242424; line-height: 1.2em; }

.product-summary .buttons {position: absolute; right: 0; bottom: 40px; display: flex; align-items: center; justify-content: flex-end; margin: 0;}
.product-summary .buttons a {display: block; background-repeat: no-repeat; background-size: contain; font-size: 0;}
.product-summary .buttons .back-list { background-image: url(../images/sub/list-icon.png); width: 20px; height: 11px;}
.product-summary .buttons .prev-list {margin:0 12px; background-image: url(../images/sub/list-icon2.png); width: 7px; height: 12px;}
.product-summary .buttons .next-list {background-image: url(../images/sub/list-icon2.png); width: 8px; height: 12px; transform: scale(-1, 1);}

.slider-for .slick-arrow {position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; width: 32px; height: 58px; border: none; background-color:transparent; font-size: 0; opacity: .5; background-repeat: no-repeat; background-size: contain;}
.slider-for .slick-prev {left: 30px; background-image: url('../images/sub/slider-for-prev.png');}
.slider-for .slick-next {right: 30px; background-image: url('../images/sub/slider-for-next.png');}

.slider-nav .slick-list {margin: 0 -7.5px;}
.slider-nav .slick-track {display: flex;}
.slider-nav .slick-slide {padding: 0 7.5px;width: 100% !important;}
.slider-nav .slick-slide.slick-current li {border: 4px solid #f39800;}
.prod-image-wrap .slick-slide.slick-current li::after {background: transparent;}

.satus.cmpt {display: block; margin: 0 auto; width: 72px; height: 30px; color: #fff; font-size: 14px; line-height: 30px; background: #e74291; border-radius: 5px;}
.satus.wait {display: block; margin: 0 auto; width: 72px; height: 30px; color: #fff; font-size: 14px; line-height: 30px; background: #9f9f9f; border-radius: 5px;}
.m-cmpt {color: #e74291;}