@charset "utf-8";

/* *****************************************************************************
   タブレット用のスタイル記述
***************************************************************************** */
@media screen and (min-width: 481px) {
	/* -----------------------------------------------------------------------------
	 財団カスタマイズ
	----------------------------------------------------------------------------- */
	/* 2分割・3分割・4分割 */
	
	/* 2分割・3分割・4分割 */
.half,.half2,.half3{
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 3vw;
	margin: 20px auto;
}
.half .left,
.half .right,
.half2 .left,
.half2 .right,
.half3 .left,
.half3 .right{
	width: 100%;
	box-sizing: border-box;
	line-height: var(--col-line-height);
}
.half .left img,
.half .right img{
	width: 100%;
}

	
	/* flow 横 */
	.flow-area1 ul.flow-box{align-items: stretch;}
	.flow-area1 ul.flow-box li.flow-list{
		width: calc(50% - 40px);
		box-sizing: border-box;
		margin: 1.5em 40px 2.0em 0;
		
	}
	.flow-area1 ul.flow-box li.flow-list:before{
		left: 100%;
		right: auto;
		top: 0;
		bottom: 0;
		margin: auto 10px auto 10px;
		width: 20px;
		height: 30px;
		clip-path: polygon(0 0, 100% 50%, 0 100%);
		
	}
	.flow-area1 ul.flow-box li.flow-list:last-child{
		margin-right: 0;
	}
	
	/* お問合せ */
	.contact{
		flex-direction: column;
	}
	.contact .left,
	.contact .right{
		width: 100%;
	}
	
	

	/* -----------------------------------------------------------------------------
	 個別設定
	----------------------------------------------------------------------------- */
		header > .inner > .logo {
		padding: 0 5px 0px 0px;
	    }
	
	
	/* parts-h1 */
	.parts-h1 {
		font-size: 1.0em;
	}
	
	
	.cv_btn_area .btn a.sp-tel{display: none;}
	.cpn_tbl table th{
		font-size: 1rem;}
	
	/* con1 強み */
	.con1 .half2 h3::after{margin-right: 0;}
	

	/* con2 流れ */
	.flow-area1 ul.flow-box{margin-right: -10px;}
	.flow-area1 ul.flow-box li.flow-list img{
		width: 40%;
	}
	.footer-info .logo{
		width: 280px;
	}
	/* con3 プラン */
	
	/* con4 移行 */
	main .con4 .half {margin-bottom: 4em;}
	
}

@media screen and (min-width: 641px) {
	/* -----------------------------------------------------------------------------
	 contents
	----------------------------------------------------------------------------- */
	
	.w1024 {
		margin: 60px 20px;
		max-width: 1024px;
	}
	.parts-table th,
	.parts-table td{
		font-size: 1rem;
	}
		
	 /*2分割・3分割・4分割 */
	.half,.half2{
		flex-direction: row;
		flex-wrap: wrap;
	}
	.half3{flex-direction: row-reverse;}
	
	.half .left,
	.half .right,
	.half2 .left,
	.half2 .right,
	.half3 .left,
	.half3 .right{
		width: calc(50% - 2vw);
	}
	
	
		/* parts-h1 */
	.parts-h1 {
		font-size: 1.25em;
	}
	
	main .contents .contact-sec {
		padding: 80px calc(50vw - 512px);
	}
	
	#top-contents .layer2 p{
		font-size: .9em;}
	
	
	/* con1 強み */
	.con1 h3,.con3 h3{
		font-size: 1.75rem;
	}
	
	.con1 h3::after{
		width:calc(100% + 3vw);
		position: absolute;
		bottom:-0.5em ;
	}
	.con1 .half2 h3::after{
		left:0
	}
	.con1 .half3 h3::after{
		right:0
	}
	.con1 h3, .con3 h3 {
		margin-bottom: 1.5em;}
		
	.half2 .left img,
	.half2 .right img,
	.half3 .left img,
	.half3 .right img{
		height:auto;width:130px;
	}
	.con1 .half2 .right p{
		border-left: solid var(--main-color) 2px;
		margin-top: 3.5em;
	}
	
	.con1 .half3 .left p{
		border-right: solid var(--main-color) 2px;
		margin-top: 3.5em;
	}
	
	.con1 h3::before{
		position: absolute;
		content: none;
	}
	.con1 .parts-table2 tr th:nth-child(1) {
		width: 10em;}
	/* con2 流れ */
	
	/* con3 プラン */
	
		
	.con3 li{
		margin: 0 15px;
		border-width: 5px;
		font-size:1.3em;
		width: 12em;
		height: 12em;
	
	}

	/* con4移行 */
	.con4 .align-center {
		font-size: 1.75em;}
	
	.con4 .parts-table thead th:first-child{width: auto!important}
	.parts-table, .parts-table2 {font-size: 1rem}
	
		/* con6会社概要 */
	.license{margin-right: -3vw;flex-direction: row;}
	.license li{
		width: 300px;margin-right: 3vw;
		max-width: calc(50% - 1.5vw );
	}
	.con6 .w1024{padding: 20px}
	
	.contact .tel a {
		margin-bottom: 0;}

	}

