@charset "UTF-8";

/*news*/
@media screen and (min-width:751px) {
	
	header .innerbox .slidenav nav a.solution{
		position:relative;
	}
	
	header .innerbox .slidenav nav a.solution::before{
		content: "";
		width:100%;
		border-bottom:1px solid #000;
		position: absolute;
		bottom:-5px;
		left:0;
	}
	
	.mainvisual.page.index{
		padding:0 0 0 max(5vw,calc((100% - 1200px) / 2 ));
		margin-bottom:130px;
		width:100%;
		max-width: 100%;
	}
	
	.mainvisual.page{
		padding:0 0;
		width:90%;
		max-width: 1200px;
		margin:0 auto 130px;
	}
	
	.mainvisual.page.index .innerbox{
		width:100%;
		position: relative;
	}
	
	.mainvisual.page.index .tlcont{
		position: absolute;
		bottom:0;
		left:0;
		background:#fff;
		padding:5vw 5vw 0;
		min-width: calc(50% - 2.5vw) !important;
		width: auto;
	}
	
	.mainvisual.page .tlcont{
		position:relative;
		bottom:0;
		left:0;
		background:#fff;
		padding:20px 0 70px;
		max-width:1065px;
		margin:0 auto;
		width:100%;
	}
	
	.mainvisual.page .tlcont h1{
		font-weight: 600;
		font-size: 5.6rem;
		letter-spacing: 0.025em;
		margin:10px 0 5px 0;
	}
	
	.mainvisual.page .tlcont .sub{
		font-size: 1.6rem;
		letter-spacing: 0.1em;
		color:#666;
	}
	
	/*cont_box*/
	.cont_box{
		width:90%;
		margin:0 auto 100px;
		max-width: 1065px;
	}
	
	.cont_box.w100{
		width:1000%;
		margin:0 auto 100px;
		max-width: 100%;
	}
	
	.cont_box:last-child{
		margin:0 auto 130px;
	}
	
	.cont_box h2{
		font-size: 2.3rem;
		line-height: 1.6em;
		color:#333333;
		letter-spacing: 0.025em;
		font-weight: 600;
		margin:0 0 20px 0;
	}
	
	.cont_box h2.icon01::before{
		content: "";
		width:3rem;
		height: 3rem;
		background:url("/images/solution/icon01.png") no-repeat;
		background-size: contain;
		display: inline-block;
		margin:0 5px 0 0 ;
		vertical-align: middle;
	}
	
	.cont_box h2.icon02::before{
		content: "";
		width:3rem;
		height: 3rem;
		background:url("/images/solution/icon02.png") no-repeat;
		background-size: contain;
		display: inline-block;
		margin:0 5px 0 0 ;
		vertical-align: middle;
	}
	
	.cont_box.w100 h2{
		width:90%;
		margin:0 auto 25px;
		max-width: 1065px;
	}
	
	.cont_box p.mtx{
		font-size: 1.5rem;
		line-height: 2.4em;
		color:#333333;
		letter-spacing: 0.025em;
	}
	
	.cont_box .anklist{
		display: flex;
		justify-content: space-between;
	}
	
	.cont_box .anklist a{
		width:calc((100% - min(10vw,100px)) / 3);
		padding:20px 0;
		font-size: 1.8rem;
		font-weight: 600;
		color:#333;
		letter-spacing: 0.1em;
	}
	
	.cont_box .anklist a fs{
		font-size: 1.4rem;
		padding:0 0 0 20px;
		margin:0 0 0 20px;
		border-left: 1px solid #e8f0f6;
		font-weight: 400;
	}
	
	.cont_box .anklist a.arrow_link span.linkarrow::before{
		content: "";
		width: 7px;
  		height: 7px;
  		background: none;
		transform: rotate(45deg) skew(7deg, 7deg);
		border-right:1px solid #000;
		border-bottom:1px solid #000;
		transition: all 0.3s;
		position: relative;
		z-index: 2;
		left:0;
	}
	
	.cont_box .anklist a.arrow_link  span.linkarrow::after{
		content: "";
		position: absolute;
		top:0;
		right:0;
		background:#000;
		width:35px;
		height:calc(100% + 1px);
		transition: all 0.3s;
		transform: scaleY(0);
		transform: auto;
		transform-origin: top;
		z-index: 1;
	}
	
	.cont_box .anklist a.arrow_link:hover span.linkarrow::before{
		border-right:1px solid #fff;
		border-bottom:1px solid #fff;
	}
	
	.cont_box .anklist a.arrow_link:hover span.linkarrow::after{
		transform: scaleY(1);
	}
	
	.solution_flexbox{
		display: flex;
		justify-content: space-between;
		margin:0 0 70px 0;
	}
	
	.solution_flexbox .txcont{
		width:50%;
		font-size: 1.5rem;
		line-height: 1.9em;
	}
	
	.solution_flexbox.box2 .txcont{
		order: 1;
	}
	
	.solution_flexbox .txcont p{
	}
	
	.solution_flexbox .txcont p.tl{
		font-size: 1.8rem;
		font-weight: 600;
	}
	
	.solution_flexbox .txcont ul{
		margin:0 0 20px 0;
	}
	
	.solution_flexbox .txcont ul li{
		text-indent: -1em;
		padding-left: 1em;
	}
	
	.solution_flexbox .txcont ul li::before{
		content: "・";
	}
	
	.solution_flexbox .txcont a{
		font-size: 1.5rem;
		color:#333;
		padding-bottom:10px;
		border-bottom:1px solid #333;
		transition: all 0.3s;
		margin:30px 0 0 0;
		display: inline-block;
	}
	
	.solution_flexbox .txcont a:hover{
		opacity: 0.7;
	}
	
	.solution_flexbox .txcont a::after{
		content: "";
		width: 13px;
  		height: 13px;
  		background:url("/images/common/blank_b.svg") no-repeat;
		background-size: contain;
		display: inline-block;
		margin:0 0 0 5px;
		position: relative;
	}
	
	.solution_flexbox figure{
		width:calc(50% - min(5vw,70px));
	}
	
	.cont_box h3{
		border-left:4px solid #000;
		font-size: 2rem;
		font-weight: 600;
		letter-spacing: 0.025em;
		padding:0 0 0 15px;
		line-height: 1.8em;
		margin:0 0 30px 0;
	}
	
	.cont_box h3 strong{
		font-size: 2.4rem;
		display: block;
	}
	
	.solution_bgbox{
		padding:20px;
		background:#eaedf3;
	}
	
	.solution_bgbox .innerbox{
		padding:40px;
		border-radius: 10px;
		background:#fff;
		display: flex;
	}
	
	.solution_bgbox .innerbox .txcont{
		width:60%;
		line-height: 1.9em;
		letter-spacing: 0.025em;
	}
	
	.solution_bgbox .innerbox .txcont .sub{
		font-size: 1.8rem;
		font-weight: 500;
		margin:0 0 10px 0;
	}
	
	.solution_bgbox .innerbox .txcont .tl{
		font-size: 2rem;
		font-weight: 600;
		color:#460d43;
		margin:0 0 20px 0;
	}
	.solution_bgbox .innerbox .txcont .tl strong{
		font-size: 3rem;
		display: block;
		margin:5px 0 0 0;
		line-height: 1.4em;
	}
	
	.solution_bgbox .innerbox .txcont .tx{
		font-size: 1.5rem;
		line-height:2em;
	}
	
	.solution_bgbox .innerbox figure{
		width:40%;
		padding:0 40px;
	}
	
	.solution_cont .ph_flexbox{
		margin:30px 0 0 0;
		display: flex;
		justify-content: space-between;
	}
	
	.solution_cont .ph_flexbox .box{
		width:calc((100% - min(10vw,100px)) / 3);
	}
	
	.solution_cont .ph_flexbox .box .cap{
		font-size: 1.5rem;
		text-align: center;
		line-height: 2em;
		margin:8px 0 0 0;
	}
	
	.solution_cont.pt{
		margin-top:70px;
		padding-top:70px;
		border-top:1px solid #666;
	}
	
	.solution_cont .flex_txbox{
		display: flex;
		justify-content: space-between;
		width:100%;
		margin:70px 0 0 0;
		counter-reset:number;
	}
	
	.solution_cont .flex_txbox .box{
		width:calc((100% - min(5vw,50px)) / 3);
		position: relative;
		border:1px solid #ccc;
		border-top:none;
	}
	
	.solution_cont .flex_txbox .box::before{
		content: "";
		position: absolute;
		top:0;
		left:0;
		width:100%;
		border-top:1px solid #ccc;
		display: block;
		z-index: 1;
	}
	
	.solution_cont .flex_txbox .box{
		width:calc((100% - min(5vw,50px)) / 3);
		position: relative;
		padding:50px 40px 40px;
	}
	
	.solution_cont .flex_txbox .box ul{
		margin:0 0 0 0;
		line-height: 2em;
	}
	
	.solution_cont .flex_txbox .box ul li{
		text-indent: -1em;
		padding-left: 1em;
		margin:0 0 10px 0;
	}
	
	.solution_cont .flex_txbox .box ul li::before{
		content: "・";
	}
	
	.solution_cont .flex_txbox .box p{
		line-height:2em;
	}
	
	.solution_cont .flex_txbox .box .tlbox{
		position: absolute;
		z-index: 2;
		display: flex;
		justify-content: center;
		top:-3.8em;
		left:0;
		width:100%;
	}
	
	.solution_cont .flex_txbox .box .tlbox .inbox{
		padding:0 20px;
		background:#fff;
	}
	
	.solution_cont .flex_txbox .box .tlbox span{
		background:#fff;
		font-size: 1.8rem;
		border-bottom:1px solid #460d43;
		font-weight: 500;
		color:#460d43;
		padding:10px 0;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}
	
	.solution_cont .flex_txbox .box .tlbox span::before{
		counter-increment: number;
  		content: counter(number);
  		background: none;
  		color: #460d43;
		border:1px solid #460d43;
  		font-size: 1rem;
		line-height: 2;
  		border-radius: 50%;
		top:0;
  		left: 0;
  		width: 1.6rem;
		margin:0 0 10px 0;
  		height: 1.6rem;
  		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
	.solution_imgbox{
		width:600px;
		margin:20px auto 0;
	}
}

@media screen and (max-width:750px) {
	.mainvisual.page.index{
		padding:0 0 0 0;
		margin-bottom:50px;
		width:100%;
		max-width: 100%;
	}
	
	.mainvisual.page{
		padding:0 0;
		width:90%;
		max-width: 1200px;
		margin:0 auto 50px;
	}
	
	.mainvisual.page.index .innerbox{
		width:100%;
		position: relative;
	}
	
	.mainvisual.page.index .tlcont{
		position: absolute;
		bottom:0;
		left:0;
		background:#fff;
		padding:3vw 5vw 0;
		min-width: calc(50% - 2.5vw) !important;
		width: auto;
	}
	
	.mainvisual.page .tlcont{
		position:relative;
		bottom:0;
		left:0;
		background:#fff;
		padding:0 0 50px;
		max-width:1065px;
		margin:0 auto;
		width:100%;
	}
	
	.mainvisual.page .tlcont h1{
		font-weight: 600;
		font-size: 3rem;
		letter-spacing: 0.025em;
		margin:0 0 0 0;
	}
	
	.mainvisual.page .tlcont .sub{
		font-size: 1.3rem;
		letter-spacing: 0.1em;
		color:#666;
	}
	
	/*cont_box*/
	.cont_box{
		width:90%;
		margin:0 auto 50px;
		max-width: 1065px;
	}
	
	.cont_box.w100{
		width:1000%;
		margin:0 auto 130px;
		max-width: 100%;
	}
	
	.cont_box h2{
		font-size: 2rem;
		line-height: 1.6em;
		color:#333333;
		letter-spacing: 0.025em;
		font-weight: 600;
		margin:0 0 10px 0;
	}
	
	.cont_box h2.icon01::before{
		content: "";
		width:2.7rem;
		height: 2.7rem;
		background:url("/images/solution/icon01.png") no-repeat;
		background-size: contain;
		display: inline-block;
		margin:0 5px 0 0 ;
		vertical-align: middle;
	}
	
	.cont_box h2.icon02::before{
		content: "";
		width:2.7rem;
		height: 2.7rem;
		background:url("/images/solution/icon02.png") no-repeat;
		background-size: contain;
		display: inline-block;
		margin:0 5px 0 0 ;
		vertical-align: middle;
	}
	
	.cont_box.w100 h2{
		width:90%;
		margin:0 auto 25px;
		max-width: 1065px;
	}
	
	.cont_box p.mtx{
		font-size: 1.4rem;
		line-height: 1.8em;
		color:#333333;
		letter-spacing: 0.025em;
	}
	
	.cont_box .anklist{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		margin:0 0 -30px 0;
	}
	
	.cont_box .anklist a fs{
		font-size: 1rem;
		padding:0 0 0 0;
		font-weight: 400;
		display: block;
	}
	
	.cont_box .anklist a{
		width:calc((100% - min(5vw,25px)) / 2);
		padding:10px 0;
		font-size: 1.2rem;
		font-weight: 600;
		color:#333;
		letter-spacing: 0.1em;
		margin:0 0 30px 0;
	}
	
	.cont_box .anklist a.arrow_link span.linkarrow{
		width:25px;
	}
	
	.cont_box .anklist a.arrow_link span.linkarrow::before{
		content: "";
		width: 7px;
  		height: 7px;
  		background: none;
		transform: rotate(45deg) skew(7deg, 7deg);
		border-right:1px solid #000;
		border-bottom:1px solid #000;
		transition: all 0.3s;
		position: relative;
		z-index: 2;
		left:0;
	}
	
	.cont_box .anklist a.arrow_link  span.linkarrow::after{
		content: "";
		position: absolute;
		top:0;
		right:0;
		background:#000;
		width:25px;
		height:calc(100% + 1px);
		transition: all 0.3s;
		transform: scaleY(0);
		transform: auto;
		transform-origin: top;
		z-index: 1;
	}
	
	.cont_box .anklist a.arrow_link:hover span.linkarrow::before{
		border-right:1px solid #fff;
		border-bottom:1px solid #fff;
	}
	
	.cont_box .anklist a.arrow_link:hover span.linkarrow::after{
		transform: scaleY(1);
	}
	
	.solution_flexbox{
		display: flex;
		justify-content: space-between;
		flex-direction: column;
		margin:0 0 40px 0;
	}
	
	.solution_flexbox .txcont{
		width:100%;
		font-size: 1.4rem;
		line-height: 1.9em;
	}
	
	.solution_flexbox .txcont p{
	}
	
	.solution_flexbox .txcont p.tl{
		font-size: 1.5rem;
		font-weight: 600;
	}
	
	.solution_flexbox .txcont ul{
		margin:0 0 20px 0;
	}
	
	.solution_flexbox .txcont ul:last-child{
		margin:0 0 0 0;
	}
	
	.solution_flexbox .txcont ul li{
		text-indent: -1em;
		padding-left: 1em;
	}
	
	.solution_flexbox .txcont ul li::before{
		content: "・";
	}
	
	.solution_flexbox .txcont a{
		font-size: 1.5rem;
		color:#333;
		padding-bottom:10px;
		border-bottom:1px solid #333;
		transition: all 0.3s;
		margin:15px 0 0 0;
		display: inline-block;
	}
	
	.solution_flexbox .txcont a:hover{
		opacity: 0.7;
	}
	
	.solution_flexbox .txcont a::after{
		content: "";
		width: 13px;
  		height: 13px;
  		background:url("/images/common/blank_b.svg") no-repeat;
		background-size: contain;
		display: inline-block;
		margin:0 0 0 5px;
		position: relative;
	}
	
	.solution_flexbox figure{
		width:100%;
		margin:30px 0 0 0;
	}
	
	.cont_box h3{
		border-left:3px solid #000;
		font-size: 1.8rem;
		font-weight: 600;
		letter-spacing: 0.025em;
		padding:0 0 0 10px;
		line-height: 1.8em;
		margin:0 0 15px 0;
	}
	
	.cont_box h3 strong{
		font-size: 2rem;
		display: block;
	}
	
	.solution_bgbox{
		padding:10px;
		background:#eaedf3;
	}
	
	.solution_bgbox .innerbox{
		padding:20px 15px;
		border-radius: 5px;
		background:#fff;
		display: flex;
		flex-direction: column;
	}
	
	.solution_bgbox .innerbox .txcont{
		width:100%;
		line-height: 1.9em;
		letter-spacing: 0.025em;
	}
	
	.solution_bgbox .innerbox .txcont .sub{
		font-size: 1.4rem;
		font-weight: 500;
		margin:0 0 5px 0;
	}
	
	.solution_bgbox .innerbox .txcont .tl{
		font-size: 1.2rem;
		font-weight: 600;
		color:#460d43;
		margin:0 0 10px 0;
	}
	.solution_bgbox .innerbox .txcont .tl strong{
		font-size: 1.8rem;
		display: block;
		margin:0 0 0 0;
		line-height: 1.4em;
	}
	
	.solution_bgbox .innerbox .txcont .tx{
		font-size: 1.4rem;
		line-height:2em;
	}
	
	.solution_bgbox .innerbox figure{
		width:100%;
		padding:20px 0 0 0;
	}
	
	.solution_cont .ph_flexbox{
		margin:30px 0 -20px 0;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	
	.solution_cont .ph_flexbox .box{
		width:calc((100% - min(5vw,20px)) / 2);
		margin: 0 0 20px 0;
	}
	
	.solution_cont .ph_flexbox .box .cap{
		font-size: 1.2rem;
		text-align: center;
		line-height: 2em;
		margin:8px 0 0 0;
	}
	
	.solution_cont.pt{
		margin-top:40px;
		padding-top:40px;
		border-top:1px solid #666;
	}
	
	.solution_cont .flex_txbox{
		display: flex;
		justify-content: space-between;
		flex-direction: column;
		width:100%;
		margin:50px 0 -50px 0;
		counter-reset:number;
	}
	
	.solution_cont .flex_txbox .box{
		width:100%;
		position: relative;
		border:1px solid #ccc;
		border-top:none;
	}
	
	.solution_cont .flex_txbox .box::before{
		content: "";
		position: absolute;
		top:0;
		left:0;
		width:100%;
		border-top:1px solid #ccc;
		display: block;
		z-index: 1;
	}
	
	.solution_cont .flex_txbox .box{
		width:100%;
		position: relative;
		padding:40px 30px 30px;
		margin:0 0 50px 0;
	}
	
	.solution_cont .flex_txbox .box ul{
		margin:0 0 0 0;
		line-height: 2em;
	}
	
	.solution_cont .flex_txbox .box ul li{
		text-indent: -1em;
		padding-left: 1em;
		margin:0 0 10px 0;
	}
	
	.solution_cont .flex_txbox .box ul li::before{
		content: "・";
	}
	
	.solution_cont .flex_txbox .box p{
		line-height:2em;
	}
	
	.solution_cont .flex_txbox .box .tlbox{
		position: absolute;
		z-index: 2;
		display: flex;
		justify-content: center;
		top:-2.5em;
		left:0;
		width:100%;
	}
	
	.solution_cont .flex_txbox .box .tlbox .inbox{
		padding:0 20px;
		background:#fff;
	}
	
	.solution_cont .flex_txbox .box .tlbox span{
		background:#fff;
		font-size: 1.6rem;
		border-bottom:1px solid #460d43;
		font-weight: 500;
		color:#460d43;
		padding:5px 0;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}
	
	.solution_cont .flex_txbox .box .tlbox span::before{
		counter-increment: number;
  		content: counter(number);
  		background: none;
  		color: #460d43;
		border:1px solid #460d43;
  		font-size: 1rem;
		line-height: 2;
  		border-radius: 50%;
		top:0;
  		left: 0;
  		width: 1.6rem;
		margin:0 0 0 0;
  		height: 1.6rem;
  		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
	.solution_imgbox{
		width:100%;
		margin:20px auto 0;
	}
}