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


/* Tablet */
@media only screen and (max-width : 768px ){
#header .inner,
#container{
    width: 100%;
    margin: 0;
    padding: 0;
}
img{
    width /***/: auto;
    max-width: 100%;
    height: auto;
}
/*#pankuzu{
    width: 100%;
}
#pankuzu li:last-child{
    clear: both;
    margin-top: 10px;
}*/
.wrapper{
    width: 90%;
}
.box{
    padding-top: 3em;
}

/*-------------------- Main visual */
#block{
    padding: 50px 0 100px;
}
#block::before{
    border-width: 30px 0 0 100vw;
}
#block h2{
    font-size: 2.6rem;
}

/*-------------------- Intro */
#intro{
    padding: 1em 0 5em;
}
#intro h2.title{
    margin-bottom: 2em;
}
.ask{
    top: -80px;
    width: 130px;
}

/*-------------------- Example */
#example{
    padding: 5em 0;
}
h3.secTtl{
    font-size: 2.4rem;
}
h3.secTtl span{
    font-size: 3rem;
}
.point{
    font-size: 2.4rem;
}

/*-------------------- Flow */
#flow{
    padding: 5em 0;
}
#flow h3.secTtl span{
    font-size: 3rem;
}
.flowBox{
    width: 100%;
    padding: 50px;
}
.flowBox h4{
    font-size: 1.8rem;
}
.flowBox ul.phone dt{
    font-size: 1.4rem;
    line-height: 1.4;
}
.flowBox ul.phone dd:nth-child(2){
    font-size: 2.6rem;
}

/*-------------------- button */
.btn{
    font-size: 2.2rem;
}

/*-------------------- Contact */
#contact .ttl{
    float: left;
    margin: 0 1em 0 0;
}
#contact h4 span{
    display: block;
}
#contact ul{
    flex-direction: column;
}
#contact li{
    width: 100%;
    margin-bottom: 1.5em;
}
#contact li:last-child{
    margin-bottom: 0;
}
#page-top img,
#page-top a{
    width: 80%;
    padding: 7% 0;
    border-radius: 2px;
}

}


/* Smart */
@media only screen and (max-width : 480px ){

#block{
    padding: 20px 0 80px;
}
#block h2{
    font-size: 2rem;
    line-height: 1.5;
    letter-spacing: 0;
}
#intro{
    padding: 2em 0 4em;
}
#intro h2.title{
    overflow: hidden;
    width: 100%;
    height: 0;
    margin-bottom: 1em;
    padding-top: 17.62%;
    white-space: nowrap;
    text-indent: 100%;
    background: url(../img/logo_02.png)no-repeat;
    background-size: cover;
}
#intro p{
    font-size: 1.6rem;
}
.ask{
    top: -80px;
    width: 100px;
}
#example{
    padding: 4em 0;
}
h3.secTtl{
    font-size: 1.8rem;
}
h3.secTtl span{
    font-size: 2.4rem;
}
#example .pc{
	display: none;
}
#example .sp{
	display: block;
}
.point{
	margin-top: 1em;
}
.note{
    font-size: 1.4rem;
    text-align: left;
}
#flow{
    padding: 4em 0;
}
#flow h3.secTtl span{
    font-size: 2.4rem;
}
.flowBox{
    padding: 20px;
}
.flowBox ul.phone dt{
    font-size: 1.4rem;
    line-height: 1.4;
}
.flowBox ul.phone dd:nth-child(2){
    font-size: 2.6rem;
}
.flowBox ul.phone{
    display: inherit;
    /*margin-bottom: 3em;
    flex-wrap: wrap;
    justify-content: space-between;*/
}
.flowBox ul.phone li{
    position: relative;
    width: 100%;
    margin-bottom: 2em;
}
.flowBox ul.phone dt{
    font-size: 1.8rem;
    font-weight: bold;
    line-height: 1.4;
}
.flowBox ul.phone dd:nth-child(2){
    font-size: 3rem;
    font-weight: bold;
    line-height: 1.4;
}
.btn{
    font-size: 2rem;
}
#contact .ttl{
    float: inherit;
	margin: 0 0 3em 0;
}

}