@charset "UTF-8";

/**********************************
【移植】common_2024.css
***********************************/
/* WER FONT */
@import url('https://fonts.googleapis.com/css?family=Abel');

img { width:auto; max-width:100%; height:auto; }

/* TOOLS */
.mb10 { margin-bottom:10px; }
.mb20 { margin-bottom:20px; }
.mb40 { margin-bottom:40px; }
.mb60 { margin-bottom:60px; }
.mb80 { margin-bottom:80px; }
.mb100 { margin-bottom:100px; }
.pl1em { padding-left:1em; }
.pl2em { padding-left:2em;}
.pl3em { padding-left:3em;}
.relative { position:relative; }
.absolute { position:absolute; }
.lineThrough { text-decoration:line-through; }
.lh150 { line-height: 1.5;}
.none { display: none; pointer-events: none;}

/* ALIGN */
.alignCenter { text-align:center; }
.alignLeft { text-align:left; }
.alignRight { text-align:right; }

/* ARROW */
.triangleBottom { background: linear-gradient(to top right, rgba(255,255,255,0) 50%, #f8ebe7 50.5%) no-repeat top left/50% 100%, linear-gradient(to top left, rgba(255,255,255,0) 50%, #f8ebe7 50.5%) no-repeat top right/50% 100%; }

/*COMMON  */
.content { box-sizing:border-box; padding:0 20px; width:100%; max-width:1240px; margin:0 auto; }

/* BASIC STYLE */
.basicSubTitle { font-size:26px; font-weight:bold; margin:0 0 1em 0; padding:0 0 0 1em; line-height:1.5em; position:relative; }
.basicSubTitle::before { content:''; display:block; width:4px; height:1em; top:0.25em; left:0; background:#bb3614; position:absolute; }
.basicMiddleTitle { font-size:20px; line-height:1.5em; font-weight:bold; padding:0 0 0.5em 0; margin:0 0 1.5em 0; border-bottom:#e5e5e5 solid 1px; }
.basicMiddleTitle2 { background:#bb3614; color:#fff; margin:0 0 1em 0; font-size:20px; padding:0.5em 1em; text-align:center; font-weight:bold; }
.basicLargeText { font-size:18px; line-height:2em; margin:0 0 1.5em 0; }
.basicText { font-size:16px; line-height:2em; margin:0 0 1.5em 0; }
.basicCaption { font-size:12px; line-height:1.5em; }
.basicMiddleStrong { font-size:120%; font-weight:bold; vertical-align:baseline; color:#bb3614; }
.basicColorStrong { font-weight:bold; color:#bb3614; }

.basicSub { font-size:75%; }

.basicTable table { width:100%; font-size:14px; }
.basicTable table thead tr th { box-sizing:border-box; padding:1em; border:#999 solid 1px; background:#d7e0e6; font-weight:bold; }
.basicTable table thead tr td { box-sizing:border-box; padding:1em; border:#999 solid 1px; }
.basicTable table tbody tr th { box-sizing:border-box; padding:1em; border:#999 solid 1px; background:#f4f4f4; font-weight:bold; }
.basicTable table tbody tr td { box-sizing:border-box; padding:1em; border:#999 solid 1px; }

.basicFigure { display:block; padding:4em; background:#f7f9fa; font-size:12px; }
.basicFigure figcaption { display:block; padding:0.5em 0; }



.basicStyleList { background:#f7f9fa; border-radius:5px; font-size:16px; padding:1.5em; margin:0 0 1.5em 0; }
.basicStyleList ul { counter-reset:number; }
.basicStyleList ul li { display:block; position:relative; padding:0 0 0 1.5em; margin:0 0 0.5em 0; counter-increment: number; }
.basicStyleList ul li::before { content: counter(number); display:block; position:absolute; left:0; top:0; font-size:70%; width:1.8em; height:1.8em; box-sizing:border-box; color:#fff; line-height:1; background:#bb3614; padding:0.4em 0 0 0; text-align:center; border-radius:50%; font-weight:bold }
.basicStyleList ul li:last-of-type { margin:0 0 0 0 ; }
.basicStyleList ol li { display:block; position:relative; padding:0 0 0 1.5em; margin:0 0 0.5em 0; }
.basicStyleList ol li::before { content:''; display:block; position:absolute; left:0 ; top:0; width:1em; height:1em; line-height:1;  box-sizing:border-box; background:#bb3614; border-radius:3px; }
.basicStyleList ol li:last-of-type { margin:0 0 0 0; }
.basicStyleList dl dt { display:block; position:relative; padding:0 0 0 1.5em; margin:0 0 0.5em 0; font-weight:bold; }
.basicStyleList dl dt::before { content:''; display:block; position:absolute; left:0 ; top:0; width:1em; height:1em; line-height:1;  box-sizing:border-box; background:#bb3614; border-radius:3px; }
.basicStyleList dl dd { display:block; position:relative; padding:0 0 0 1.5em; margin:0 0 1em 0; line-height:1.5em; }
.basicStyleList dl dd:last-of-type { margin:0 0 0 0; }
.basicStyleList dl .sub { font-size: 75%;}

.basicSubNavi {font-size:20px;}
.basicSubNavi ul { margin:0 0 2em 0; display:flex; flex-wrap:wrap; justify-content:flex-start; }
.basicSubNavi ul li {  margin:0 2em 0 0; }
.basicSubNavi ul li a { font-weight:bold; display:block; padding:1em 0; text-decoration:none; color:#000; position:relative; line-height:1em; }
.basicSubNavi ul li a::before { position:absolute; left:50%; bottom:0; width:0px; content:''; display:block; background:#000; height:2px; }
.basicSubNavi ul li a.active::before { left:0; width:100%; }
.basicSubNavi ul li a.active { color:#bb3614; text-decoration:none; }


@media screen and (min-width:768px) {
.basicSubNavi ul li a:hover,
.basicSubNavi ul li a.active { color:#bb3614; text-decoration:none; }
.basicSubNavi ul li a:hover::before,
.basicSubNavi ul li a.activebefore { width:100%; left:0; transition: left 0.5s linear 0s, width 0.5s linear 0s;  }
}



@media screen and (min-width:767px) {
	.spOnly { display: none; }
	.spCallBtn { cursor: default; pointer-events: none;}
}
@media screen and (max-width:767px) {
/*  */
.pcOnly { display:none ; }

/* BASIC STYLE */
.basicSubNavi {font-size:3vw;}
.basicSubNavi ul { margin:0 0 2em 0; display:flex; flex-wrap:wrap; justify-content:flex-start; }
.basicSubNavi ul li {  margin:0 2em 0 0; }
.basicSubNavi ul li a { font-weight:bold; display:block; padding:1em 0; text-decoration:none; color:#000; position:relative; line-height:1em; }
.basicSubNavi ul li a::before { position:absolute; left:50%; bottom:0; width:0px; content:''; display:block; background:#000; height:2px; }
.basicSubNavi ul li a.active::before { left:0; width:100%; }
	
.basicMainTitle { font-size:24px; }
.basicSubTitle { font-size:18px; }
.basicMiddleTitle { font-size:16px; }
.basicMiddleTitle2 { font-size: 16px }
.basicLargeText { font-size:15px;}
.basicText { font-size:14px; }
.basicCaption { font-size:10px; }

.basicFigure { padding: 10px; }
	
}


/**********************************
【移植】default.css
***********************************/
/* FLEX BOX */
.flexBox { display:flex; flex-wrap:wrap; justify-content:space-between; }
.flexBox.center { justify-content:center; }
.flexBox.noWrap { flex-wrap:no-wrap; }
.flexBox.noSpace { justify-content:flex-start; }
.flexBox > * { flex-grow:0; flex-shrink:1; }


/**********************************
【移植】style_2024.css
***********************************/
/* INFORMATION */
.basicSubNavi ul { margin: 0 0 2em 0; display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-start;}

.basicSubNavi ul::after{ content: ""; display: block; width: 20%; height: 0; }
.basicSubNavi ul li{ flex-basis:calc(( 100% - 50px)/5); text-align: center;  margin-right:0;}
.basicSubNavi ul li a{ border: 1px solid #000;}
.basicSubNavi ul li a::before{ display: none;}
.basicSubNavi ul li a:hover,.basicSubNavi ul li a.active{ background: #ca4714; color: #fff; font-weight: bold; border:#ca4714;}
.basicSubTitle{ text-align: center; font-size:clamp( 28px, 6.25vw ,48px); padding-left: 0;}
.basicSubTitle::before { display: none; }


#guarantee #guaranteePrice .photoBox { flex-basis:calc( ( 100% - 20px ) / 3 ); }
#guarantee .flexBox .photoBox { flex-basis:calc(30% - 20px); }
#guarantee .flexBox .textBox { flex-basis:calc(70% - 20px); }
#jio .flexBox .photoBox { flex-basis:calc(50% - 20px); }
#jio .flexBox .textBox { flex-basis:calc(50% - 20px); }
#facility .flexBox .photoBox { flex-basis:calc(50% - 20px); }
#facility .flexBox .textBox { flex-basis:calc(50% - 20px); }


@media screen and (min-width:768px) {
	a:hover img { transition:filter 0.5s linear 0s;  filter:contrast(150%)}
	a:hover .mainVisualBox img { transition: none; filter: contrast(100%);}
}
@media screen and (max-width:767px) {
#guarantee .flexBox .photoBox,
#guarantee .flexBox .textBox { flex-basis:100%; margin: 0 0 20px 0; }
#guarantee #guaranteePrice .photoBox { flex-basis:100%; margin: 0 0 20px 0;}
#guarantee #guaranteePrice .photoBox figcaption { text-align: center; }
#jio .flexBox .photoBox,
#jio .flexBox .textBox { flex-basis:100%; margin: 0 0 20px 0; }
#facility .flexBox .photoBox,
#facility .flexBox .textBox { flex-basis:100%; margin: 0 0 20px 0; }
#facility .textBox .flexBox .photoBox { flex-basis:calc( ( 100% - 10px ) / 2 );}
#afterservice .basicTable {overflow: auto; height: 50vh;}
#afterservice .basicTable table { width: 300%;font-size:12px;  }

	/* INFORMATION */

	.basicSubNavi ul { gap: inherit; justify-content: space-between;}
	.basicSubNavi ul li{ flex-basis:calc(( 100% - 10px)/2); text-align: center;  margin-bottom:10px;}
	.infoListBox .thumbnailBox { flex-basis:100%; margin: 0 0 10px 0;}
	.infoListBox .textBox { flex-basis:100%; }
	.infoListBox .textBox .initialBox { display:inline-block; margin:0 0.5em 0 0; font-size:150%; color:#bb3614; font-weight:bold; }
	.infoListBox .textBox .titleBox { font-size:150%; margin:0 0 0 0; }
	#infoList li  {  flex-basis:calc(50% - 10px ); }

}



/**********************************
【受領】afterservice.css
***********************************/
.content:not(:first-of-type){ margin-top: 110px;}
.box *{ box-sizing: border-box;}
.warranty{ margin-top: 50px;}

.box_01 .supportBox{ container-type: inline-size;}
.box_01 .supportList{ max-width: 1010px; margin: 0 auto; gap: 2.6%;}
.box_01 .supportList li{ align-items: center; width: calc( 100% / 3 ); max-width: 319px; border: 1px solid #594c47; padding: 22px 36px;}

@container (max-width: 1009px) {
    .box_01 .supportList{ justify-content: center;}
    .box_01 .supportList li { width: 100%;}
}

.box_01 .supportList li i{ display: block; max-width: 84px;}
.box_01 .warranty_01 .caseList{ container-type: inline-size;}
.box_01 .warranty_01 .caseList li{ position: relative; background: #f7f9fa;}
.box_01 .warranty_01 .caseList li:not(:first-of-type){ margin-top: 20px;}
.box_01 .warranty_01 .caseList .caseNum{ position: absolute; top: 0; left: 0; display: block; background: #594c47; color: #fff; padding:0 0.5em; font-weight: bold;}
.box_01 .warranty_01 .caseList .caseDetail{ position: relative; align-items: center; max-width: 1000px; margin: 0 0 0 auto; padding: 20px 4% 20px 0;}
.box_01 .warranty_01 .caseList .caseDetail .caseTitBox{ flex-basis: 42%;}
.box_01 .warranty_01 .caseList .caseTit{ font-size: clamp(  18px , 3.68vw , 25px); border-bottom: 2px solid #594c47; padding-bottom: 15px; margin-bottom: 5px; font-weight: bold;}
.box_01 .warranty_01 .caseList .priceBox{ position:relative; display: block; flex-basis: 30.5%;}
.box_01 .warranty_01 .caseList .arrow{ font-size: 30px;}
.box_01 .warranty_01 .caseList .operation{ align-items: center; margin-bottom: 10px;}
.box_01 .warranty_01 .caseList .itemName{ border: 2px solid #000; padding: 1em;}
.box_01 .warranty_01 .caseList .price{ font-size: clamp(  25px , 4.1vw , 28px); font-weight: bold;}
.box_01 .warranty_01 .caseList .price>span{ font-size: 64%;}
.box_01 .warranty_01 .caseList .priceBox .basicText,.box_01 .warranty_01 .caseList .caseTitBox .basicLargeText{ line-height: 1.5; margin: 5px 0 0 0 ;}
.box_01 .warranty_01 .caseList .circle{ flex-basis: 11.6%; aspect-ratio: 1 / 1;  border-radius:50%; background:#bb3614; display:flex; align-items:center; justify-content:center; text-align: center; color: #fff; font-size: clamp(  16px , 3.5vw , 24px);  font-weight: bold;}
.box_01 .warranty_01 .case .capRight{ text-align: right; margin-top: 10px;}

@container (max-width: 1049px) {
    .box_01 .warranty_01 .caseList .caseDetail{ justify-content: left; padding: 20px 4%; gap: 10px;}
    .box_01 .warranty_01 .caseList .caseDetail .caseTitBox{ flex-basis: 100%; margin-top: 2em;}
    .box_01 .warranty_01 .caseList .operation{ justify-content: left; margin-top: 20px; gap: 10px;}
    .box_01 .warranty_01 .caseList .priceBox{ flex-basis: 30%; }
    .box_01 .warranty_01 .caseList .circle{ margin-left: 2vw;}
    
}
@container (max-width: 627px) {
    .box_01 .warranty_01 .caseList .caseDetail{ gap: 0;}
    .box_01 .warranty_01 .caseList .priceBox{ flex-basis: 100%; max-width: 210px;}
    .box_01 .warranty_01 .caseList .circle{ flex-basis: 60px; }
}

.box_01 .warranty_02 { container-type: inline-size; }
.box_01 .warranty_02 .subjectList{ gap: 30px 1.6%; margin-bottom: 30px;}
.box_01 .warranty_02 .item{ flex-basis: 18.4%;}
.box_01 .warranty_02 .item .itemTit{ padding: 0.5em; margin: 20px 0; text-align: center; border: 1px solid #000; font-weight: bold;}
.box_01 .warranty_02 .item .detail{ font-size: 14px;}
@container (max-width: 1049px) {
    .box_01 .warranty_02 .item{ flex-basis: 48.4%;}
}

.box_02 .warranty_01 { container-type: inline-size; }
.box_02 .warranty_01 .left{ flex-basis: 59%;}
.box_02 .warranty_01 .bgText{ background: #f7f9fa; padding: 25px 30px;}

@container (max-width: 867px) {
.box_02 .warranty_01 .left{ flex-basis: 100%;}
.box_02 .warranty_01 figure{ margin: 0 auto;}
.box_02 .warranty_01 .bgText{ background: #f7f9fa; padding: 15px 10px;}
}

.box_03{ container-type: inline-size; }
.box_03 .imgBox{ text-align: center; margin-top: 50px; overflow: scroll;}
.box_03 figure { width: 798px; margin: 0 auto;}
.box_03 .scrollCap{ display: none;}
@container (max-width: 797px) {
    .box_03 .scrollCap{ display: block; margin-top: 10px;}
}


.box_04 .warranty_01 { container-type: inline-size;}
.box_04 .deal { max-width: 673px; gap: 10px 3.46%; margin: 0 auto; margin-bottom: 50px;}
.box_04 .deal li{ flex-basis: 29.8%; border: 1px solid #000; text-align: center; padding: 1em; font-size: clamp( 16px,2.6vw,20px); font-weight: bold;}
.box_04 figure{ text-align: center; margin-top: 50px; text-align: center;}

@container (max-width: 867px) {
    .box_04 .deal{ margin-bottom: 30px;}
    .box_04 figure{ margin-top: 30px; }
    .box_04 .deal li{ flex-basis: 100%;}
}



/**********************************
【ネオス】afterfollow 共通
***********************************/

.afterfollowPage {
    padding-bottom: 50px;
}

.afterfollowPage figure {
    box-sizing: border-box;
}

/* mvBox */
.afterfollowPage .mvBox {
	background: url(/share/img/page/afterfollow/mvBox_bg.jpg) no-repeat center top;
}

.afterfollowPage .mvBox__inner {
	width: min(100%, 1010px);
    margin: 0 auto;
}

.afterfollowPage .mvBox__mainTtl {
	color: #fff;
	font-size: 40px;
	font-feature-settings: 'palt';
	font-weight: bold;
	letter-spacing: 0.1em;
	filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.5));
	margin-bottom: 30px;
}

.afterfollowPage .mvBox__en {
	font-size: 18px;
	color: #fff;
	filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.5));
}

@media screen and (max-width: 1009px) {
	.afterfollowPage .mvBox {
		margin: 0;
		padding: 150px 4% 150px;
	}
}

@media screen and (min-width: 1010px) {
	.afterfollowPage .mvBox {
		margin: 0 -500%;
		padding: 150px 500% 150px;
	}
}

@media screen and (max-width:767px) {
    
    .afterfollowPage .mvBox {
        background: url(/share/img/page/afterfollow/mvBox_bg.jpg) no-repeat right 37% bottom / auto 110%;
        padding: 50px 4%;
	}

	.afterfollowPage .mvBox__mainTtl {
		font-size: 25px;
		margin-bottom: 0;
	}

	.afterfollowPage .mvBox__en {
		font-size: 13px;
	}
}


.content {
    padding: 0;
}

.basicSubNavi {
    margin-bottom: 30px;
}

.followPageArticle {
    margin-top: -80px;
    padding-top: 160px;
}

.followPageArticle#guarantee {
    padding-top: 100px;
}

.followPageArticle__inner {
    width: min(90%, 1200px);
    margin: 0 auto;
}

.followPageArticle__ttl {
    text-align: center;
    font-size:clamp( 28px, 6.25vw ,48px);
    background-color: #ca4714;
    color: #fff;
    margin-bottom: 30px;
    padding: 20px;
    font-weight: bold;
    line-height: 1.5;
}

.followPageArticle__ttl .sub {
    font-size: 0.8em;
    display: block;
}

.basicSubNavi ul { 
    justify-content: center;
    margin: 2em auto;
    width: min(1200px, 90%);
}

.basicSubNavi ul::after{ 
    content: none; 
}


.basicSubNavi ul li a:hover,
.basicSubNavi ul li a.active{ 
    opacity: 1; 
}

@media screen and (min-width:768px) {

    .basicSubNavi ul {
        gap: 15px;
    }

    .basicSubNavi ul li {
        flex-basis: calc(( 100% - 45px ) / 4);
    }

    .box_03 .imgBox {
        overflow: auto;
    }
}


@media screen and (max-width:767px) {
    .followPageArticle {
        margin-top: 80px;
        padding: 0;
    }
    
    .followPageArticle#guarantee {
        margin: 0;
        padding: 0;
    }
        
    .basicSubNavi {
        font-size: 13px;
        margin-bottom: 10px;
    }

    .basicSubNavi ul {
        gap: 0 10px;
    }
}