@charset "utf-8";
/*company*/
.pageTtl{
	background-image: url(../images/pagettl_bg.jpg);
}

/**/
#online01{
	position:relative;
	margin:0 auto 10px;
	display:inline-block;
	padding:0 0 80px;
	width:auto;
}
#online01::before{
	content:"";
	display:block;
	background-image: url(../images/icon01.png);
	background-size:100% 100%;
	width:80px;
	height:80px;
	position:absolute;
	bottom:0;
	left:calc(50% - 80px);
}
#online01::after{
	content:"";
	display:block;
	background-image: url(../images/icon02.png);
	background-size:100% 100%;
	width:80px;
	height:80px;
	position:absolute;
	bottom:0;
	right:calc(50% - 80px);
}
#online01 h3{
	font-size:2.4rem;
	letter-spacing:0.1em;
}
#online01 p{
	font-size:1.6rem;
	font-weight: bold;
	letter-spacing:0.05em;
}

@media screen and (min-width:768px) {
	#online01{
		padding:0 120px;
		margin:0 auto 20px;
	}
	#online01::before{
		top:calc(50% - 40px);
		left:0;
	}
	#online01::after{
		top:calc(50% - 40px);
		right:0;
	}
	#online01 h3{
		font-size:3rem;
	}
}
/**/

/**/
#online02{
	margin:30px auto 0;
}
#online02 .unit{
	margin:0 auto 20px;
	width:100%;
	max-width:300px;
	position: relative;
	background-color:#fff;
	border-radius:50%;
}
#online02 .unit:last-child{
	margin-bottom:0;
}
#online02 .unit::before {
	content: "";
	display: block;
	padding-top: 100%;
}
#online02 .unitInner{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	display:flex;
	flex-direction: column;
	justify-content: center;
	align-items:center;
}
#online02 .unit figure{
	width:140px;
	margin:0 auto 10px;
}
#online02 .unit p{
	width:100%;
	font-size:1.6rem;
	font-weight:bold;
}
@media screen and (min-width:768px) {
	#online02{
		display:flex;
		justify-content:space-between;
	}
	#online02 .unit{
		margin:0;
	}
}
/**/

/**/
#onlineFlow{
	margin:30px auto 0;
}
#onlineFlow .unit{
	margin:0 auto 40px;
	width:100%;
	background-color:#faf8f6;
	padding:20px;
	text-align:center;
	position:relative;
}
#onlineFlow .unit::before{
	content:"";
	position:absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 15px 15px 0 15px;
	border-color: #ac956d transparent transparent transparent;
	bottom:-28px;
	left:calc(50% - 15px);
}
#onlineFlow .unit:last-child{
	margin-bottom:0;
}
#onlineFlow .unit:last-child::before{
	content:none;
}
#onlineFlow .unit h4{
	color:#ac956d;
	font-size:2rem;
}
#onlineFlow .unit figure{
	width:70px;
	margin:5px auto 10px;
}
#onlineFlow .unit p{
	font-size:1.4rem;
	text-align:left;
}
@media screen and (min-width:768px) {
	#onlineFlow{
		display:flex;
		justify-content:space-between;
	}
	#onlineFlow .unit{
		margin:0;
		width:30%;
		padding:20px 10px;
	}
	#onlineFlow .unit p{
		text-align:center;
	}
	#onlineFlow .unit::before{
		content:"";
		position:absolute;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 15px 0 15px 15px;
		border-color: transparent transparent transparent #ac956d;
		bottom:auto;
		left:auto;
		top:calc(50% - 15px);
		right:-12%;
	}
}


/**/
.onlineList{
	text-align:left;
	font-size:1.4rem;
	margin:0 auto 60px;
}
.onlineList dt{
	padding:10px 15px;
	border-top:1px solid #ccc;
	background-color:#faf8f6;
	font-weight: bold;
}
.onlineList dd{
	padding:15px;
	border-top:1px solid #ccc;
}
.onlineList .caption{
	font-size:85%;
}
.onlineList .appbnr{
	width:100%;
	max-width:200px;
	margin:10px auto;
}
.onlineList .appbnr li:nth-of-type(1){
	margin-bottom:10px;
}
@media print, screen and (min-width:768px) {
	.onlineList{
		display:flex;
		flex-wrap: wrap;
		justify-content: left;
		font-size:1.6rem;
		border-bottom:1px solid #ccc;
	}
	.onlineList dt{
		width:25%;
		padding:20px;
	}
	.onlineList dd{
		width:75%;
		padding:20px;
		border-top:1px solid #ccc;
	}
	.onlineList .appbnr{
		max-width:420px;
		font-size:85%;
		display:flex;
		justify-content: space-between;
		margin:10px 0;
	}
	.onlineList .appbnr li{
		width:48%;
		max-width:200px;
		text-align:center;
	}
	.onlineList .appbnr li:nth-of-type(1){
		margin-bottom:0;
	}
}
/**/

/**/
.onlineConBtn{
	display:block;
	width:100%;
	max-width:600px;
	margin:0 auto 20px;
	background-color:#ac956d;
	padding:15px;
	color:#fff;
	text-decoration: none;
	font-size:1.6rem;
	font-weight: bold;
	line-height:1.5;
    background-image: url(../../common02/images/ico_mail01.png);
    background-size: 24px 24px;
    background-position: left 10px center;
    background-repeat: no-repeat;
}
.onlineConBtn small{
	font-size:75%;
}
@media print, screen and (min-width:768px) {
	.onlineConBtn{
		font-size:2rem;
		padding:20px;
	    background-size: 30px 30px;
	    background-position: left 20px center;
	}
}