@charset "utf-8";
/* CSS Document */

@import url(cmn.css);
@import url(base.css);
/* ==========================================================================
	CONTENT
========================================================================== */
#lead{
text-align: left;
}
#lead .float-l{
width: 50%;
}
#lead .float-r{
width: 37%;
margin-right: 5%;
}

.example{
text-align: left;
}
.example h3{
margin-bottom: 20px;
}
.example .float-l{
width: 48%;
}
.example .float-r{
width: 48%;
}

#free ul{
margin-bottom: 50px;
}
#free ul li{
font-size: 1.6rem;
background: url(../images/customize-images/ex-icon.png) 1% 50% no-repeat;
background-size: 50px auto;
border-bottom: 2px dotted #000;
padding: 20px 0 20px 70px;
}
.example .inner{
background-color: #f5f5f5;
padding: 30px 20px;
}
.example .inner h4{
font-size: 1.6rem;
margin-bottom: 15px;
}
.example .inner h5{
font-size: 1.4rem;
color: #5abac9;
background-color: #e5e5e5;
margin-bottom: 10px;
padding: 10px;
}

.next{
background: url(../images/service-images/flow-icon.png) 50% 100% no-repeat;
background-size: 50px auto;
padding-bottom: 60px;
}

#toll dl{
margin-bottom: 40px;
}
#toll dl dt{
font-size: 1.4rem;
text-align: center;
background: url(../images/customize-images/ex-back.jpg) 50% 50% no-repeat;
background-size: 100% auto;
padding: 10px 0;
}
#toll dl dt span{
display: block;
width: 70%;
margin: 0 auto;
}
#toll dl dd{
font-size: 2.2rem;
text-align: center;
color: #f19ab3;
background-color: #fef3f6;
border-radius: 10px;
padding: 10px;
margin-bottom: 20px;
}

/* ------------------------------------------------------------
	 PC   1000px -
   ------------------------------------------------------------ */
@media screen and (min-width: 1040px) {
}

/* ------------------------------------------------------------
	 TABLET   for - 999px
   ------------------------------------------------------------ */

@media screen and (max-width:1039px) {
}

/* ------------------------------------------------------------
	 SP　599pxまで
   ------------------------------------------------------------ */
@media screen and (max-width: 699px) {
#lead .float-l{
float: none;
width: 100%;
}
#lead .float-r{
float: none;
width: 45%;
margin: 0 auto 0 auto;
}

.example .float-l{
float: none;
width: 90%;
margin: 0 auto 20px auto;
}
.example .float-r{
float: none;
width: 100%;
}

#free ul{
margin-bottom: 25px;
}
#free ul li{
font-size: 1.4rem;
background-size: 40px auto;
border-bottom: 2px dotted #000;
padding: 20px 0 20px 60px;
}
.example .inner{
padding: 15px;
}
.example .inner h4{
font-size: 1.4rem;
margin-bottom: 10px;
}
.example .inner h5{
font-size: 1.4rem;
}

#toll dl{
margin-bottom: 20px;
}
#toll dl dt{
font-size: 1.2rem;
}
#toll dl dt span{
display: block;
width: 70%;
margin: 0 auto;
}
#toll dl dd{
font-size: 1.6rem;
border-radius: 10px;
padding: 10px;
margin-bottom: 20px;
}

}