@charset "UTF-8";
:root {
            --bg-color: #000000;
            --text-color: #ffffff;
            --accent-bg: #1a1a1a;
            --section-bg: #333333;
            --border-color: #222;
        }
#wrapper{
	overflow: hidden;
	font-size: 15px;
	line-height: 1.6;
	background-color: transparent;
	font-family: 'Noto Sans JP', sans-serif;

}
html,body{
	height: auto;
}
svg {
    width: 100%;
    height: auto;
}

a img:hover{
	opacity:0.7;
	transition:0.3s;
}
.inView{
	position: relative;
	top: 4vw;
	opacity: 0;
	-webkit-transition: top 1.2s cubic-bezier(0.33, 1, 0.68, 1), opacity 1.0s;
	transition: top 1.2s cubic-bezier(0.33, 1, 0.68, 1), opacity 1.0s;
}
.inView.view{opacity: 1;top: 0;}
.conArea{
	max-width: 1200px;
	margin: 0 auto;
	width: 94%;
	
}
.conAreaMax{
	max-width: 1300px;
	margin: 0 auto;
	width: 100%;
	
}
p.tx{
	font-size: 15px;
	line-height: 2.4;
}
.main{
	background-image: url("/-/media/Project/globeride/daiwa_com_jp/resources/app/mydaiwa/d-connected_afterservice/img/main.jpg");
	background-position: top center;
	background-repeat: no-repeat;
	background-size: 100%;
	max-width: 1500px;
	padding: 30em 0 15em;
}
.main h2 img{
	width: 100%;
	height: auto;
}
.main h2{
	width: 50%;;
	margin: 0 auto;
}
.container {
	max-width: 1200px;
    margin: 0 auto;
	width: 94%;
	padding-bottom: 5em;
}
.contents{
	margin-bottom: 15em;
}
.conBox{
	width: 90%;
	margin: 0 auto;
}
.mainTx {
    text-align: center;
	line-height: 2.2;
	font-size: 18px;
	margin-bottom: 15em;
}
.mainTx span{
	font-size: 84%;
}
.mainTx p{
	display: inline-block;
	text-align: left;
}


.section-divider {
     display: flex;
     align-items: center;
     text-align: center;
	margin-bottom: 8em;
}

        .section-divider::before,
        .section-divider::after {
            content: '';
            flex: 1;
            border-bottom: 1px solid #555;
        }

        .section-divider span {
            padding: 0 20px;
            font-size: 24px;
            letter-spacing: 0.1em;
        }

        .product-grid {
            display: flex;
            gap: 30px;
        }

        .product-card {
            text-align: center;
			
        }

        .product-image {
            width: 100%;
            background-color: var(--accent-bg);
            margin-bottom: 15px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #666;
            border: 1px solid var(--border-color);
        }

        .product-info {
            text-align: left;
            font-size: 16px;
        }
.product-info ul li{
	list-style: disc;
	margin-left: 1.5em;
}
        

        /* Content Sections */
        .service-section {
            margin-bottom: 40px;
        }

        .service-header {
            background-color: var(--section-bg);
            padding: 10px 15px;
            margin-bottom: 1em;
            font-size: 20px;
        }
.service-header br{
	display: none;
}


        .service-note {
            font-size: 14px;
        }

        /* Steps Section */
        .step-item {
            margin-bottom: 10em;
        }

        .step-title-row {
            display: flex;
            align-items: flex-start;
            margin-bottom: 15px;
			align-items: center;
        }

        .step-num {
            background-color: var(--section-bg);
            width: 50px;
            height: 50px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 15px;
			font-size: 24px;
            flex-shrink: 0;
        }

        .step-title-text {
            font-size: 18px;
        }
	.step-title-text span.ss{
		font-size: 80%;
		}

        .step-desc {
            font-size: 14px;
            margin-left: var(--indent-size);
            margin-bottom: 15px;
        }

        .step-note {
			width: 86%;
			margin: 0 auto;
			font-size: 15px;
        }

        .step-placeholder {
            width: 80%;
            margin-left: var(--indent-size);
            aspect-ratio: 21 / 9;
            background-color: #555;
            margin-bottom: 15px;
        }

        .step-flow {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            margin-top: 15px;
        }

        .flow-box {
            aspect-ratio: 3 / 4;
            background-color: #555;
			width: 30%;
        }

        .flow-arrow {
            font-size: 14px;
            color: #888;
        }



ul.coupon{
	row-gap:3em;
	display: flex;
	flex-wrap: wrap;
	width: 90%;
	margin: 0 auto 8em;
	padding-top: 3em;
}
ul.screen{
	display: flex;
	width: 90%;
	margin: 0 auto 5em;
	padding-top: 5em;
	align-items: center;
	justify-content: center;
}
ul.screen li{
	width: 30%;
}
ul.screen li.arrow{
	width: 5%;
	padding: 0 1em;
}
ul.dd{
	width: 80%;
	margin: 0 auto;
	padding-top: 5em;
}
ul.dd li{
	list-style: disc;
	font-size: 18px;
}
/*-----------------------------------------------
	bt
-----------------------------------------------*/

.btArea{
	width:600px;
	margin: 0 auto;
	text-align: left;
	padding-top: 8em;
}
.btArea.bt{
	margin-bottom: 10em;
}
.btArea a:link{
	background-color:#00b0ec;
	color:#fff;
	display:block;
	line-height:1.4;
	position: relative;
	padding:1.5em 2em 1.5em 2em;
	text-decoration:none;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:400;
	letter-spacing: 0.02em;
	font-size:22px;
}


.btArea a:link::before {
  position: absolute;
  top:50%;
  right:1.5em;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  display: block;
  content: "";
  width: 50px;
  height: 1px;
  background: #fff;
  margin-right:0px;
}
.btArea a:link::after {
  position: absolute;
  top:50%;
  right:1.5em;
  margin-top:-5px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  display: block;
  content: "";
  width: 10px;
  height: 10px;
  border-right: 1px solid #fff;
  border-top: 1px solid #fff;
  transform: rotate(45deg);
}
.btArea a:visited{
	background-color:#00b0ec;
	color:#fff;
	text-decoration:none;
}
.btArea a:hover{
	background-color:#00b0ec;
	color:#fff;
	text-decoration:none;
	opacity: .8;
}