@charset "utf-8";

#touser p {
	margin-bottom:6px;
}
#touser p:last-child {
    margin-bottom: 0;
}

#main #contents_pc {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row-reverse;
    justify-content: space-between;
}
/* 左側 */
.box_l{
    width: 440px;
    height:1297px;
    background: url(../img/img_step1.png) no-repeat 0 0;
    position: relative;
}
a.tooltip {
	position:absolute;
	text-decoration:none;
	width:32px;
	height:32px;
	display:block;
	overflow:hidden;
}
a.tooltip div {
	width:360px;
	height:auto;
	padding:10px;
	background-color:#FFFFEC;
	border:#999999 solid 1px;
	visibility:hidden;
}
a.tooltip .point {
	cursor:pointer;
}
a.tooltip div img {
	display:block;
	padding: 5px;
}
a:hover.tooltip {
	width:auto;
	height:auto;
	overflow:inherit;
	z-index:1000;
	cursor:inherit;
}
a:hover.tooltip div {
	width:420px;
	height:auto;
	padding:10px;
	background-color:#FFFFEC;
	border:#999999 solid 1px;
	visibility:visible;
	z-index:1000;
  position: absolute;
}
a.tooltip div p {
	margin-bottom:5px;
	line-height:1.4em;
	color:#333333;
}
a.tooltip div span {
	text-decoration:underline;
	color:#0044CC;
	cursor:pointer;
}
.point1 {
  top: 349px;
  left: 70px;
}
.point2 {
  top: 512px;
  left: 149px;
}
.point3 {
  bottom: 40px;
  left: 70px;
}
/* 右側 */
.tbox {
    width: 440px;
    position: relative;
}
.tbox p {
    position: absolute;
    background-color:#EEE;
    padding:15px;
    line-height:1.4em;
}
.tbox p::before {
    content: "";
    background-color: #EEE;
    width: 16px;
    height: 20px;
    clip-path: polygon(100% 0, 100% 100%, 0 50%);
    position: absolute;
    top: 4px;
    left: -14px;
}
.tbox p.tbox1 {
	top:340px;
	left:0;
}
.tbox p.tbox2 {
	top:490px;
	left:0;
}
.tbox p.tbox3 {
	left:0;
  bottom: 0;
}
@media screen and (max-width: 750px) {
    .-pc_block {
        display: none !important;
    }
    .contents_sp img {
        border: 4px solid #CCC;
    }
    .contents_sp p {
        font-size: calc(30*100vw/750);
        padding: calc(20*100vw/750) calc(20*100vw/750) calc(20*100vw/750) 2.5em;
        background-color:#EEE;
        margin-bottom: calc(40*100vw/750);
        text-indent: -1.5em;
        position: relative;
    }
    .contents_sp img.img_step1 {
        margin-bottom: calc(100*100vw/750);
        position: relative;
    }
    .contents_sp .tbox3::before {
        content: "";
        background-color: #FC0000;
        width: calc(120*100vw/750);
        height: calc(40*100vw/750);
        clip-path: polygon(50% 100%, 0 0, 100% 0);
        position: absolute;
        top: calc(-66*100vw/750);
        left: calc(50% - calc(60*100vw/750) );
    }
}