@charset "UTF-8";
/* ------------------------------------------------
                    ティアラの強み
--------------------------------------------------- */
.sec-lead{
	text-align: center;
	margin-bottom: 40px;
	line-height: 2
}
.sec-lead .top-txt{
	font-size:1.4em;
	font-weight: 700;
	color:#dd1312;
	line-height: 1.4;
}


.advantage-wrap-under .advantage-item{
	display: flex;
	flex-wrap: wrap;
	width:90%
}
.advantage-wrap-under .advantage-item:nth-child(even){
	margin: 0 0 0 auto
}
.advantage-wrap-under .advantage-item:not(:first-child){
	margin-top: 40px
}
.advantage-wrap-under .advantage-item .item-img{
	width:18%;	
}
.advantage-wrap-under .advantage-item .item-img .img{
	padding: 15%;
	border-radius: 50%;
	background: linear-gradient(to bottom right, #b10100, #dd1312 50%, #b10100);
	background: -moz-linear-gradient(left top, #b10100, #dd1312 50%, #b10100);
	background: -webkit-linear-gradient(left top, #b10100, #dd1312 50%, #b10100);
	position: relative;
}
.advantage-wrap-under .advantage-item .item-img .img::before,
.advantage-wrap-under .advantage-item .item-img .img::after{
	position: absolute;
	content:'';
	width:102%;
	height:102%;
	top:-5px;
	left:-5px;
	background-image: url("../../img/advantage/advantage_ring.svg");
	background-repeat: no-repeat;
	background-size: contain
}
.advantage-wrap-under .advantage-item .item-img .img::after{
	top:3px;
	left:3px;
}


.advantage-wrap-under .advantage-item .item-txt{
	width:82%;
	padding:0 40px;
	font-size:1.5rem
}
.advantage-wrap-under .advantage-item .item-txt .ttl{
	display: flex;
	align-items: flex-end;
	margin: 20px auto 20px -20px;
}
.advantage-wrap-under .advantage-item:nth-child(even) .item-txt .ttl{
	justify-content: flex-end;
	margin: 20px -20px 20px auto;
}
.advantage-wrap-under .ttl-txt{
	font-family: "Noto Serif JP", serif;
	font-size:2.4rem;
	font-weight: 700;
	line-height: 1;
	padding: 0.2em 0;
	margin-right:0.5em;
	text-align: center;
	-webkit-transform: skew(-30deg);
	transform: skew(-30deg);
	background: linear-gradient(to right, #e9be44, #f4eeb0 50%, #e9be44);
	background: -moz-linear-gradient(left, #e9be44, #f4eeb0 50%, #e9be44);
	background: -webkit-linear-gradient(left, #e9be44, #f4eeb0 50%, #e9be44);
}
.advantage-wrap-under .ttl-txt span{
	display: block;
	-webkit-transform: skew(30deg);
	transform: skew(30deg);	
}
.advantage-wrap-under .note-txt{
	font-size:1.3rem
}



@media (max-width: 768px) {
	.advantage-wrap-under .advantage-item{
		width:100%
	}
	.advantage-wrap-under .advantage-item:not(:first-child){
		margin-top:6vw
	}	
	.advantage-wrap-under .advantage-item .item-img{
		width:24%;	
	}
	.advantage-wrap-under .advantage-item .item-img .img::before,
	.advantage-wrap-under .advantage-item .item-img .img::after{
			top:-0.5vw;
			left:-0.5vw;
	}
	.advantage-wrap-under .advantage-item .item-img .img::after{
			top:0.3vw;
			left:0.3vw;
	}

	.advantage-wrap-under .advantage-item .item-txt{
		width:76%;
		padding:0 2vw;
		font-size:3.2vw
	}
	.advantage-wrap-under .advantage-item .item-txt .ttl{
		display: flex;
		align-items: flex-end;
		margin: 2vw 0 ;
	}
	.advantage-wrap-under .advantage-item:nth-child(even) .item-txt .ttl{
		justify-content: flex-end;
		margin: 2vw -3vw 2vw auto;
	}
	.advantage-wrap-under .ttl-txt{
		font-size:4.2vw;
	}
	.advantage-wrap-under .note-txt{
		font-size:2.4vw
	}

	

}

/*--プラン内容--*/

.plan-item{
	display: flex;
	margin-bottom: 20px
}

.plan-item .item-img{
	width:32%;
	background: linear-gradient(to right, #e9be44, #f4eeb0 50%, #e9be44);
	background: -moz-linear-gradient(left, #e9be44, #f4eeb0 50%, #e9be44);
	background: -webkit-linear-gradient(left, #e9be44, #f4eeb0 50%, #e9be44);
	display: flex;
	align-items: center
}
.plan-item .item-txt{
	width:68%;
	background: #fff;
	font-size:1.5rem;
}

.plan-item .item-txt .ttl{
	padding: 20px 40px;
	color:#fff;
	background: linear-gradient(to right, #dd1312, #b10100);
	background: -moz-linear-gradient(left, #dd1312, #b10100);
	background: -webkit-linear-gradient(left, #dd1312, #b10100);
}
.plan-item .item-txt .ttl span{
	font-family: "Noto Serif JP", serif;
	font-weight: 600;
	line-height: 1.2;
	font-size:2.4rem;
	padding-left: 1.5em;
	background-image: url("../../img/common/icon_check.svg");
	background-repeat: no-repeat;
	background-size:1.2em;
	background-position: left bottom 3px;
}
.plan-item .item-txt .txt{
	padding: 20px 40px;
}

@media (max-width: 1080px) {
	.plan-item .item-txt{
		line-height: 1.55
	}
	.plan-item .item-txt .ttl,
	.plan-item .item-txt .txt{
		padding: 0.8vw 2vw;
	}
}

@media (max-width: 768px) {
	.plan-item{
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 6vw
	}

	.plan-item .item-img{
		width:65%;
		margin: 0 auto 2vw;
		display: block
	}
	
	.plan-item .item-txt{
		width:100%;
		background: #fff;
		font-size:3.2vw;
	}

	.plan-item .item-txt .ttl{
		padding:2vw 4vw;
	}
	.plan-item .item-txt .ttl span{
		font-size:4.2vw;
		background-position: left bottom 0.2vw;
	}
	.plan-item .item-txt .txt{
		padding: 2vw 4vw;
	}

}

/*--トータルサポート--*/
.total-support{
	margin-top: 80px;
	text-align: center
}
.total-support .top-txt span{
	font-size:2.4rem;
	font-family: "Noto Serif JP", serif;
	font-weight: 700;
	line-height: 1.2;
	position: relative
}
.total-support .top-txt span::before,
.total-support .top-txt span::after{
	position: absolute;
	content:'';
	width:4px;
	height:100%;
	background: #dd1312;
	bottom:0;
	top:0;
	margin: auto
}
.total-support .top-txt span::before{
	left:-2em;
	transform: rotate(-15deg)
}
.total-support .top-txt span::after{
	right:-2em;
	transform: rotate(15deg)
}


.total-support a.total-support-box{
	display: block;
	border-radius: 20px;
	margin-top: 20px;
	background: linear-gradient(to right, #e9be44, #f4eeb0 50%, #e9be44);
	background: -moz-linear-gradient(left, #e9be44, #f4eeb0 50%, #e9be44);
	background: -webkit-linear-gradient(left, #e9be44, #f4eeb0 50%, #e9be44);
	overflow: hidden
}

.total-support .txt{
	margin: 20px auto 0;
	font-size:2.4rem;
	font-weight: 700;
	color:#dd1312
}
.total-support .ttl{
	font-size:6.0rem;
	font-weight: 700;
	line-height: 1;
	text-align: center;
	font-family: "Noto Serif JP", serif;
	paint-order: stroke;
	stroke-linejoin: round;
	-webkit-text-stroke:10px #fff;
	text-stroke: 10px #fff;
	text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
	position: relative;
	z-index: 2
	
}

.total-support .support-box{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 40px
}

.total-support .support-box .support-item{
	width:calc((100% - 50px) / 6);
	padding-top:calc((100% - 50px) / 6);
	border-radius: 50%;
	background-color: #fff;
	background-size: contain;
	position: relative;
}
.total-support .support-box .support-item:nth-child(1){	background-image: url("../../img/advantage/total_01.svg");}
.total-support .support-box .support-item:nth-child(2){	background-image: url("../../img/advantage/total_02.svg");}
.total-support .support-box .support-item:nth-child(3){	background-image: url("../../img/advantage/total_03.svg");}
.total-support .support-box .support-item:nth-child(4){	background-image: url("../../img/advantage/total_04.svg");}
.total-support .support-box .support-item:nth-child(5){
	background-color:#d9b44e;
	background-image: url("../../img/advantage/total_05.svg");
	color:#fff
}
.total-support .support-box .support-item:nth-child(5)::after{
	position: absolute;
	content:'';
	width:32%;
	height:32%;
	background-image: url("../../img/advantage/total_deco.svg");
	top:-10%;
	right:-10%
}
.total-support .support-box .support-item:nth-child(6){	background-image: url("../../img/advantage/total_06.svg");}

.total-support .support-box .support-item p{
	position: absolute;
	width: 100%;
	height:100%;
	top:0;
	left:0;
	display: flex;
	align-content: center;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	font-size:3.0rem;
	line-height: 1.2;
	font-weight: 700;

}
.total-support .support-box .support-item span{
	display: inline-block;
}

.total-support .link{
	background: linear-gradient(to right, #dd1312, #b10100);
	background: -moz-linear-gradient(left, #dd1312, #b10100);
	background: -webkit-linear-gradient(left, #dd1312, #b10100);
}
.total-support .link span{
	position: relative;
	padding: 0 2em;
	font-size:2.4rem;
	font-weight: 700;
	line-height: 2;
	color:#fff;
}
.total-support .link span::after{
	position: absolute;
	content:'';
	width:0.5em;
	height:0.5em;
	border-right:2px #fff solid;
	border-bottom:2px #fff solid;
	transform: rotate(-45deg);
	top:0;
	bottom:0;
	right:0;
	margin: auto
}




@media (max-width: 768px) {
	.total-support{
		margin-top: 12vw
	}
	.total-support .top-txt span{
		font-size:3.8vw;
	}
	.total-support .top-txt span::before,
	.total-support .top-txt span::after{
		width:1vw;
	}
	.total-support .top-txt span::before{
		left:-1.5em;
	}
	.total-support .top-txt span::after{
		right:-1.5em;
	}


	.total-support a.total-support-box{
		border-radius: 4vw;
		margin-top: 4vw;
	}

	.total-support .txt{
		margin: 4vw auto 0;
		font-size:3.8vw;
	}
	.total-support .ttl{
		font-size:6.8vw;
		font-weight: 700;
		paint-order: stroke;
		stroke-linejoin: round;
		-webkit-text-stroke:2vw #fff;
		text-stroke: 2vw #fff;
		text-shadow: 0.5vw 0.5vw 0.5vw rgba(0, 0, 0, 0.4);
	}

	.total-support .support-box{
		display: flex;
		align-items: center;
		justify-content: space-between;
		flex-wrap: wrap;
		padding: 4vw
	}

	.total-support .support-box .support-item{
		width:calc((100% - 4vw) / 3);
		padding-top:calc((100% - 4vw) / 3);
	}
	.total-support .support-box .support-item:nth-child(n+4){
		margin-top: 2vw
	}
	.total-support .support-box .support-item p{
		font-size:5vw;
	}

	.total-support .link{
		background: linear-gradient(to right, #dd1312, #b10100);
		background: -moz-linear-gradient(left, #dd1312, #b10100);
		background: -webkit-linear-gradient(left, #dd1312, #b10100);
		padding: 0.5em
	}
	.total-support .link span{
		position: relative;
		padding: 0 1em 0 0;
		font-size:3.8vw;
	}
	.total-support .link span::after{
		position: absolute;
		content:'';
		width:0.5em;
		height:0.5em;
		border-right:2px #fff solid;
		border-bottom:2px #fff solid;
		transform: rotate(-45deg);
		top:0;
		bottom:0;
		right:0;
		margin: auto
	}
}








/* ------------------------------------------------
        こんなシーンにおすすめ           
--------------------------------------------------- */
.scene-wrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding-bottom: 50px
}

.scene-wrap .scene-item{
	width:calc((100% - (25px * 3) )/ 4);
	margin-bottom: 30px;
	position: relative
}
.scene-wrap .scene-item:not(:first-child){
	margin-left: 25px;
}
.scene-wrap .scene-item:first-child{
	display: flex;
	align-items: center;
	justify-content: center
}
.scene-wrap .scene-item:first-child::after{
	position: absolute;
	content:'';
	width:100%;
	height:110%;
	top:-5%;
	left:0;
	background-image: url("../../img/advantage/scene_ttl_bg.png");
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat
}

.scene-wrap .scene-ttl{
	font-size:3.2rem;
	line-height: 1.2;
	text-align: center;
	font-family: "Noto Serif JP", serif;
	paint-order: stroke;
	stroke-linejoin: round;
	-webkit-text-stroke: 5px #fff;
	text-stroke: 5px #fff;
	 text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
	position: relative;
	z-index: 2
}

.scene-wrap .scene-item p.item-img{
	border-radius: 5px;
	overflow: hidden;
}

.scene-wrap .scene-item p.item-name{
	font-family: "Noto Serif JP", serif;
	font-size:1.8rem;
	font-weight: 600;
	padding: 0.2em 0.5em;
	text-align: right;
	position: absolute;
	background: rgba(0, 0, 0, 0.8);
	bottom:2em;
	right:-0.5em;
	width:100%;
	color:#fff;
	border-top:1px solid #cfac53;
	border-bottom:1px solid #cfac53
}

@media (max-width: 1080px) {
	.scene-wrap .scene-ttl{
		font-size:2.8vw;
	}
	.scene-wrap .scene-item p.item-name{
		font-size:1.6vw;
	}
}

@media (max-width: 768px) {
	 .scene-wrap{
		 padding-top: 2vw;
		padding-bottom: 6vw
	}

	.scene-wrap .scene-item{
		width:calc((100% - (3vw * 2) )/ 3);
		margin-bottom: 3vw;
		position: relative
	}
	.scene-wrap .scene-item:not(:first-child){
		margin-left: 3vw
	}
	.scene-wrap .scene-item:nth-child(6){
		margin-left: 25vw
	}

	.scene-wrap .scene-ttl{
		font-size:3.8vw;
		line-height: 1.2;
		paint-order: stroke;
		stroke-linejoin: round;
		-webkit-text-stroke: 1.2vw #fff;
		text-stroke: 1.2vw #fff;
	}

	.scene-wrap .scene-item p.item-img{
		border-radius: 5px;
		overflow: hidden;
	}

	.scene-wrap .scene-item p.item-name{
		font-size:3.4vw;
		line-height: 1;
		font-weight: 600;
		padding: 0.2em ;
		text-align: right;
		position: absolute;
		background: rgba(0, 0, 0, 0.8);
		bottom:5vw;
		right:-0.5em;
		width:100%;
		color:#fff;
		border-top:1px solid #cfac53;
		border-bottom:1px solid #cfac53
	}
	.scene-wrap .scene-item.long p.item-name{
		letter-spacing: -0.2em
	}
  
}

/*--こんなシーンにおすすめ--*/

.section.scene{
	background-image: 
		url("../../img/common/bg01_deco_tl.png"),
		url("../../img/common/bg01_deco_br.png"),
		linear-gradient(to right, #b10100, #dd1312 50%, #b10100);
	background-repeat: no-repeat;
	background-size: 25%,25%,100%;
	background-position: 
		top left,
		bottom right,
		top left;
	padding-top: 80px;
	border-bottom: 8px solid;
	border-image: linear-gradient(to right, #e9be44, #f4eeb0 50%, #e9be44) 1;
}
.section.scene .scene-wrap{padding-bottom: 0}
@media (max-width: 768px) {
	.section.scene{
		background-size: 35%,35%,100%;
		padding-top:10vw;
		border-bottom: 1.5vw solid;
	}
}