/* BASIC css start */
.visiualWrap {position: relative; margin-bottom: 32px;}
.visiualWrap img {width: 100%;}
.visiualWrap dl {position: absolute; width: 100%; bottom: 22%; left: 50%; transform: translateX(-50%); text-align:center;} 
.visiualWrap dl dt {color: #fff; font-size: 24px; margin-bottom:15px;}
.visiualWrap dl dd {color: #fff; font-size: 18px;}
.videoWrap {}
.videoWrap .video-cont {margin: 0 20px;}
.videoWrap .video-box {text-align: center; position: relative; padding-top: 177.78%;}
.videoWrap .video-box iframe {position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit:cover;}
.videoWrap p {font-size: 16px; margin: 48px 0; text-align: center; max-width: 94%; margin:32px 20px; line-height:1.4; word-break: keep-all;}
.productWrap {background: url(/design/waterman01/mb/opc-back-bg.jpg)no-repeat center; background-size: 120% auto;}
.productWrap .swiper-button-prev {left:3% !important; top:38% !important;}
.productWrap .swiper-button-next {right:3% !important; top:38% !important;}
.productWrap .swiper-button-next:after, 
.productWrap .swiper-button-prev:after {font-size: 2rem; color:#fff;}
.productWrap .swiper-button-prev svg {color:#fff;}
.productWrap .swiper-button-next svg {color:#fff;}
.productWrap .swiper {}
.productWrap .swiper-wrapper {}
.productWrap .swiper-slide .title {position: absolute; left: 50%; top: 7%; font-size: 22px; transform: translateX(-50%); border-bottom: 1px solid #000; width: 70%; text-align: center; padding-bottom: 10px; font-weight: 500;}
.productWrap .swiper-slide .banner {text-align:center; padding-top:15%;}
.productWrap .swiper-slide .banner img {width: 100%;}
.productWrap .swiper-slide .txt-box {display: flex; gap:10px; align-items: center; justify-content: center; max-width: 92%; margin:0 auto; padding-bottom:10%;}
.productWrap .swiper-slide .txt-box li {flex: 1;}
.productWrap .swiper-slide .txt-box li p {background: #fff; line-height:1.3; min-height: 68px; display: flex; align-items: center; justify-content: center; font-size:12px; text-align:center;}
.productWrap .swiper-slide .txt-box li img {width: 100%;}
.groupWrap {margin:50px 20px 30px;}
.groupWrap .group-cont {display: flex; flex-wrap: wrap; background:#F2F2F2;}
.groupWrap .group-cont:nth-child(even) {flex-direction: row-reverse;}
.groupWrap .group-cont .cont-txt {text-align: center; line-height: 1.5; padding: 2.5rem;}
.groupWrap .group-cont .cont-txt p {font-size: 24px; margin: 1.5rem 0 1rem; letter-spacing:2px;}
.groupWrap .group-cont .cont-txt span {font-size: 16px; line-height:1.6; margin-bottom: 1.5rem; display:block; word-break: keep-all;}
.groupWrap .group-cont .cont-banner {flex: 1; text-align: center;}
.groupWrap .group-cont .cont-banner img {object-fit: cover; width:100%;}
.collectionWrap {margin: 0 auto 32px; text-align:center;}
.collectionWrap h3 {text-align:center; font-size:20px; margin: 24px 0;}
.collectionWrap ul {display:flex; gap:10px; width:95%; margin: 0 auto;}
.collectionWrap ul li {flex:1; position:relative;}
.collectionWrap ul li a {display:block;}
.collectionWrap ul li img {width:100%;}
.collectionWrap ul li:hover a:after {content:''; display:block; position:absolute; left:0; top:0; width:100%; height:78%; -webkit-box-shadow: 0 0 0.3125rem 0.0625rem #233976; box-shadow: 0 0 0.3125rem 0.0625rem #233976; border: solid 0.125rem #233976; border-radius: 0.25rem;}
.collectionWrap ul li a span {text-align:center; display:block; margin-top:10px; line-height:1.5;}
.collectionWrap ul li:hover a span {text-decoration: underline;}
.collectionWrap .more {background-color: #051b3f; color: #d5c6ab; border-color: #051b3f; width:95%; line-height:48px; font-size:16px; display:inline-block; margin: 24px 0;}
.collectionWrap > p {font-size:16px; line-height:1.6; width:92%; margin:0 auto; word-break: keep-all;}
.collectionWrap > p b {display:block; font-size:20px; font-weight:400; margin:6% 0 3%;}
.multiWrap {}
.multiWrap ul li img {width: 100%;}
.multiWrap .link {position: absolute; bottom: 16%; left: 50%; margin-left: -60px; font-size: 14px; font-weight: 400; color: #e9d9bd;width: 120px; height: 28px; line-height: 28px; border: 1px solid #e9d9bd; text-align: center; letter-spacing: 0.05em; transition: all 0.3s  ease;}
.multiWrap .link:hover {background: rgba(233, 217, 189, .2);}
.control {position: absolute; right: 5%; bottom: 5%; z-index: 10; }
.control .btn-prev {width: 35px; height: 35px; background: rgba(233,217,189,.2) url(/design/waterman01/pc/main_arr_left.png); background-position: center !important; background-size: 6px auto !important; background-repeat: no-repeat !important; cursor: pointer; display: inline-block; border: 1px solid #e9d9bd; box-sizing: border-box; -webkit-box-sizing: border-box; margin-left: 8px; font-size: 0;}
.control .btn-next {width: 35px; height: 35px; background: rgba(233,217,189,.2) url(/design/waterman01/pc/main_arr_right.png); background-position: center !important; background-size: 6px auto !important; background-repeat: no-repeat !important; cursor: pointer; display: inline-block; border: 1px solid #e9d9bd; box-sizing: border-box; -webkit-box-sizing: border-box; margin-left: 8px; font-size: 0;}


    
    
/* BASIC css end */