@charset "UTF-8";

section#howtob4tBl {
	position: sticky;
	position: -webkit-sticky;
	max-width: 1280px;
	margin: 85px 15px 36px;
	padding: 4px;
	background: #fff;
	border: 2px solid #000;
	border-radius: 36px;
}

#howtob4tBl .inner { padding: 54px 26px 0; }

#howtob4tBl .inner h1 {
	text-align: center;
	margin: 0 0 20px;
}

#howtob4tBl .inner h2 {
	text-align: center;
	margin: 0 0 60px;
}


#howtob4tBl .inner div h3 {
	margin: 0 0 28px;
	padding: 0 0 10px;
	border-bottom: 2px solid #000;
}

#howtob4tBl .inner div {
	max-width: 275px;
	margin: 0 auto;
}

#howtob4tBl .inner div ul li:nth-child(2),
#howtob4tBl .inner div ul li:nth-child(4) {
	text-align: center;
	padding: 40px 0;
}
#howtob4tBl .inner div ul li:nth-child(5) { padding: 0 0 40px; }
#howtob4tBl .inner div ul li .arrowBImg { display: inline; }
#howtob4tBl .inner div ul li .arrowBImg2 { display: none; }

#howtob4tBl .inner div ul li .sttl {
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 32px;
	margin: 0 0 20px;
}

#howtob4tBl .inner div ul li .hw2img {
	margin: 0 0 24px;
}

#howtob4tBl .inner div ul li .txt {
	font-size: 1.4rem;
	line-height: 26px;
}

#howtob4tBl .inner div ul li .bubble {
	position: relative;
	color: #fff;
	font-size: 1.2rem;
	line-height: 22px;
	margin: 30px 0 0;
	padding: 32px 22px;
	background: #333;
	border-radius: 20px;
}
#howtob4tBl .inner div ul li .bubble::after {
	position: absolute;
	content: '';
	width: 0;
	height: 0;
	left: calc(50% - 3.5px);
	bottom: 100%;
	border: 7px solid transparent;
	border-bottom: 14px solid #333;
}

#howtob4tBl .inner div ul li .bubble .ssttl {
	font-size: 1.5rem;
	font-weight: bold;
	text-align: center;
	line-height: 26px;
	margin: 0 0 24px;
}

#howtob4tBl .inner div ul li .sssttl {
	text-align: center;
	margin: 24px 0 8px;
}
#howtob4tBl .inner div ul li .sssttl img { width: 184px; }
#howtob4tBl .inner div ul li .bubbleBlue {
	position: relative;
	font-size: 1.2rem;
	line-height: 21px;
	margin: 0;
	padding: 16px;
	background: #E6F5FF;
	border-radius: 20px;
}

#howtob4tBl .inner div ul li .bubbleBlue strong {
	display: block;
	font-weight: 700;
	line-height: 21px;
	margin: 0 0 12px;
}

#howtob4tBl .inner img.arrowDnb {
	display: block;
	margin: 30px auto 58px;
}






/*media Queries Tablet
----------------------------------------------------*/
@media print, screen and (min-width:481px) {

#howtob4tBl .inner div {
	max-width: 330px;
	margin: 0 auto;
}


}/* /media Queries ------------*/






/*media Queries PC
----------------------------------------------------*/
@media print, screen and (min-width:768px) {

section#howtob4tBl {
	margin: 85px 13px 36px;
	padding: 6px;
	border-radius: 57px;
}

#howtob4tBl .inner { padding: 60px 7.8%; }

}/* media Queries 769 */






/*media Queries PC
----------------------------------------------------*/
@media print, screen and (min-width:1024px) {

section#howtob4tBl {
	max-width: 1280px;
	top: 95px;
	margin: 0 13px 305px;
}

#howtob4tBl .inner { padding: 70px 4% 10px; }

#howtob4tBl .inner div {
	max-width: unset;
	margin: 0;
}

#howtob4tBl .inner div ul {
	display: table;
	width: 100%;
	max-width: 1060px;
	margin: 0 auto 42px;
}

#howtob4tBl .inner div ul li {
	display: table-cell;
	max-width: 276px;
	vertical-align: top;
}

#howtob4tBl .inner div ul li:nth-child(1),
#howtob4tBl .inner div ul li:nth-child(3),
#howtob4tBl .inner div ul li:nth-child(5) {
	width: 26.04%;
}

#howtob4tBl .inner div ul li:nth-child(2),
#howtob4tBl .inner div ul li:nth-child(4) {
	padding: 16.4% 0 0;
}

#howtob4tBl .inner div ul li .arrowBImg { display: none; }
#howtob4tBl .inner div ul li .arrowBImg2 { display: inline; }

#howtob4tBl .inner div ul li .txt { min-height: 80px; }


}/* media Queries 1024 */








/*media Queries PC
----------------------------------------------------*/
@media print, screen and (min-width:1280px) {

section#howtob4tBl { margin: 0 auto 305px; }

#howtob4tBl .inner { padding: 100px 5% 40px; }


}/* media Queries 1110 */





