@charset "utf-8";
@import "common.css";
/* workflow css */

#workflow_visual {
	width:100%;
	height:103px;
	padding-top:77px;
	margin:0 auto 55px;
	background-image:url(../images/workflow_visual.png);
	background-repeat:no-repeat;
	background-position:center top;
	text-align:center;
	clear:both;
	text-shadow:2px 2px 3px #848484;
}

#workflow_visual p {
	font-size:25px;
	font-weight:500;
	color:#FFF;
}


/*-- workflow text --*/


.wf_detail {
	width:100%;
	text-align:left;
	font-weight:500;
	margin:40px 0 60px 0;
}

.wf_detail_img {
	margin-bottom:45px;
}


.wf_h1 {
	font-size:25px;
	font-weight:bold;
	text-align:center;
	margin:0 auto 30px;
}

.wf_top {
	width:880px;
	margin:0 auto 50px;
	letter-spacing:normal;
	font-size:18px;
	text-align:left;
	display:block;
}

.wf_under {
	width:880px;
	margin:0 auto 50px;
	font-size:25px;
	line-height:45px;
}

.wf_under a {
	display:inline-block;
	color:#1f68d0;
	transition: .3s;
	-webkit-transform: scale(1);
	transform: scale(1);
	text-decoration:none;
}

.wf_under a:hover {
	-webkit-transform: scale(1.03);
	transform: scale(1.03);
}

@keyframes zoom {
	50% {
		transform: scale(1.05);
	}
}

/*-- step area --*/

#step1,
#step2,
#step3,
#step4,
#step5,
#step6 {
	width:880px;
	margin:0 auto 50px;
}
#step1 img,
#step2 img,
#step3 img,
#step4 img,
#step5 img,
#step6 img {
	display:block;
	float:left;
	margin-right:20px;
}

#step1 p,
#step2 p,
#step3 p,
#step4 p,
#step5 p,
#step6 p {
	font-size:18px;
	font-weight:500;
	overflow:hidden;
}

#step1 p strong { font-weight:bold; }
#step1 p span { font-size:15px; }




/*-- step1 h2 --*/
h2.step1 {
	margin:0 auto 30px;
	width:755px;
    position: relative;
    display:block;
    height: 57px;
    line-height: 60px;
    padding: 3px 40px 0 80px;
    background:#d50010 url(../images/step1_icon.png) no-repeat 30px;
    color: #fff;
    font-size: 30px;
    text-align:left;
	font-weight:normal;
	font-family:"メイリオ","ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}

h2.step1 span { color:#fff; font-size:25px; margin:0 0 0 28px; }

h2.step1::before,
h2.step1::after {
    position: absolute;
    top: 0;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 30px 0px 30px 20px;
    content: '';
}

h2.step1::before {
    left: 0px;
    border-color: transparent #fff;
}

h2.step1::after {
    right: -20px;
    border-color: transparent #d50010;
}

/*-- step2 h2 --*/
h2.step2 {
	margin:0 auto 30px;
	width:755px;
    position: relative;
    display:block;
    height: 57px;
    line-height: 60px;
    padding: 3px 40px 0 80px;
    background:#f3e603 url(../images/step2_icon.png) no-repeat 30px;
    color: #000;
    font-size: 30px;
    text-align:left;
	font-weight:normal;
	font-family:"メイリオ","ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}

h2.step2 span { color:#000; font-size:25px; margin:0 0 0 28px; }

h2.step2::before,
h2.step2::after {
    position: absolute;
    top: 0;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 30px 0px 30px 20px;
    content: '';
}

h2.step2::before {
    left: 0px;
    border-color: transparent #fff;
}

h2.step2::after {
    right: -20px;
    border-color: transparent #f3e603;
}


/*-- step3 h2 --*/
h2.step3 {
	margin:0 auto 30px;
	width:755px;
    position: relative;
    display:block;
    height: 57px;
    line-height: 60px;
    padding: 3px 40px 0 80px;
    background:#8ec21f url(../images/step3_icon.png) no-repeat 30px;
    color: #fff;
    font-size: 30px;
    text-align:left;
	font-weight:normal;
	font-family:"メイリオ","ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}

h2.step3 span { color:#fff; font-size:25px; margin:0 0 0 28px; }

h2.step3::before,
h2.step3::after {
    position: absolute;
    top: 0;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 30px 0px 30px 20px;
    content: '';
}

h2.step3::before {
    left: 0px;
    border-color: transparent #fff;
}

h2.step3::after {
    right: -20px;
    border-color: transparent #8ec21f;
}


/*-- step4 h2 --*/
h2.step4 {
	margin:0 auto 30px;
	width:755px;
    position: relative;
    display:block;
    height: 57px;
    line-height: 60px;
    padding: 3px 40px 0 80px;
    background:#019fe8 url(../images/step4_icon.png) no-repeat 30px;
    color: #fff;
    font-size: 30px;
    text-align:left;
	font-weight:normal;
	font-family:"メイリオ","ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}

h2.step4 span { color:#fff; font-size:25px; margin:0 0 0 28px; }

h2.step4::before,
h2.step4::after {
    position: absolute;
    top: 0;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 30px 0px 30px 20px;
    content: '';
}

h2.step4::before {
    left: 0px;
    border-color: transparent #fff;
}

h2.step4::after {
    right: -20px;
    border-color: transparent #019fe8;
}


/*-- step5 h2 --*/
h2.step5 {
	margin:0 auto 30px;
	width:755px;
    position: relative;
    display:block;
    height: 57px;
    line-height: 60px;
    padding: 3px 40px 0 80px;
    background:#0169b6 url(../images/step5_icon.png) no-repeat 30px;
    color: #fff;
    font-size: 30px;
    text-align:left;
	font-weight:normal;
	font-family:"メイリオ","ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}

h2.step5 span { color:#fff; font-size:25px; margin:0 0 0 28px; }

h2.step5::before,
h2.step5::after {
    position: absolute;
    top: 0;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 30px 0px 30px 20px;
    content: '';
}

h2.step5::before {
    left: 0px;
    border-color: transparent #fff;
}

h2.step5::after {
    right: -20px;
    border-color: transparent #0169b6;
}


/*-- step6 h2 --*/
h2.step6 {
	margin:0 auto 30px;
	width:755px;
    position: relative;
    display:block;
    height: 57px;
    line-height: 60px;
    padding: 3px 40px 0 80px;
    background:#7f1283 url(../images/step6_icon.png) no-repeat 30px;
    color: #fff;
    font-size: 30px;
    text-align:left;
	font-weight:normal;
	font-family:"メイリオ","ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
}

h2.step6 span { color:#fff; font-size:25px; margin:0 0 0 28px; }

h2.step6::before,
h2.step6::after {
    position: absolute;
    top: 0;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 30px 0px 30px 20px;
    content: '';
}

h2.step6::before {
    left: 0px;
    border-color: transparent #fff;
}

h2.step6::after {
    right: -20px;
    border-color: transparent #7f1283;
}


/* clear fix */
#step1:after,
#step2:after,
#step3:after,
#step4:after,
#step5:after,
#step6:after {
    content: ".";
    clear: both;
    height: 0;
    display: block;
    visibility: hidden;
}