/************************************************************************************
more than 800
*************************************************************************************/
@media screen and (min-width: 640px) {
    #pagewrap {
        margin: 0 auto;
        max-width: 800px;
    }
    .header{
        height:80px;
    }
	
	.header-l img{ float:left; margin:5% 2% 0 5%; width:120px; height:37px; }
	.header-l span{ border-left:1px solid #b5b5b5; padding-left:2%; float:left; margin-top:5%;}
	.header-l span h3{ font-size:1.2em; line-height:1.2em; color:#04447c;}
	.header-l span h4{ font-size:1em; line-height:1.6em; color:#898989; font-weight:normal;}
	
	.header-r{ width:30%; float:right;}
	.header-r h5{ margin-top:6%; font-size:1.2em; line-height:1.8em; padding-left:12%;}
	.header-r span{ font-size:1.6em; line-height:0.2em; color:#e61574; font-weight:normal; }
	
	.header-r h5{ background:url("../images/top_tel.png") no-repeat left center;}
	.nav{ height:44px;}
    .nav ul li{
        height:44px;
		line-height:44px;
        font-size:1.2em;
		padding:0 1.25%;
    }
	.tit.t1 h1{
		background:url("../images/title-bg.png") no-repeat 40% top;
	}
	.tit.t2 h1{
		background:url("../images/title-bg.png") no-repeat 38.2% top;
	}
	.tit.t3 h1{
		background:url("../images/title-bg.png") no-repeat 36.6% top;
	}

    .bottom-btn{
        height:80px;
    }
    .bottom-btn1{
        height:80px;
        background:url("../images/bottom-btn1.png") no-repeat center center;
        background-size:58px 58px;
    }
    .bottom-btn2{
        height:80px;
        background:url("../images/bottom-btn2.png") no-repeat center center;
        background-size:58px 58px;
    }
    #footer{
        padding:20px 0;
        padding-bottom:80px;
    }
    #footer p{
        font-size:1em;
        line-height:28px;
    }
}






/************************************************************************************
smaller than 640
*************************************************************************************/
@media screen and (max-width: 640px) {
    #pagewrap {
        margin: 0 auto;
        max-width: 100%;
    }
    .header{
        height:64px;
		width:70%;
    }
	
	.header-l img{ float:left; margin:4% 1.6% 0 4%; width:96px; height:29.6px; }
	
	.header-l span{ border-left:1px solid #b5b5b5; padding-left:1.6%; float:left; margin-top:4%;}
	
	.header-l span h3{ font-size:1em; line-height:1em; color:#04447c;}
	
	.header-l span h4{ font-size:0.8em; line-height:1.2em; color:#898989; font-weight:normal;}
	
	.header-r h5{ margin-top:4%; font-size:1em; line-height:1.2em; padding-left:10%;}
	.header-r span{ font-size:1.0em; line-height:0.2em; color:#e61574; font-weight:normal; }
	
	.header-r h5{ background:url("../images/top_tel.png") no-repeat left center;}

	.nav{ height:36px;}
    .nav ul li{
        height:36px;
        line-height:36px;
        font-size:1em;
		padding:0 1%;
    }
	
	.tit.t1 h1{
		background:url("../images/title-bg.png") no-repeat 37.6% top;
	}
	.tit.t2 h1{
		background:url("../images/title-bg.png") no-repeat 35.6% top;
	}
	.tit.t3 h1{
		background:url("../images/title-bg.png") no-repeat 33% top;
	}
	
    .bottom-btn{
        height:64px;
    }
    .bottom-btn1{
        height:64px;
        background:url("../images/bottom-btn1.png") no-repeat center center;
        background-size:43px 43px;
    }
    .bottom-btn2{
        height:64px;
        background:url("../images/bottom-btn2.png") no-repeat center center;
        background-size:46.4px 46.4px;
    }
    #footer{
        padding:15px 0;
        padding-bottom:64px;
    }
    #footer p{
        font-size:0.8em;
        line-height:20px;
    }
}





/************************************************************************************
smaller than 480
*************************************************************************************/
@media screen and (max-width: 480px) {
    #pagewrap {
        margin: 0 auto;
        width: 100%;
    }
    .header{
        height:48px;
		width:70%;
    }
	
	.header-l img{ float:left; margin:4% 1.2% 0 2%; width:70px; height:24px; }
	
	.header-l span{ border-left:1px solid #b5b5b5; padding-left:1%; float:left; margin-top:4%;}
	
	.header-l span h3{ font-size:0.8em; line-height:1em; color:#04447c;}
	
	.header-l span h4{ font-size:0.6em; line-height:1.8em; color:#898989; font-weight:normal;}
	
	.header-r h5{ margin-top:6%; font-size:0.8em; line-height:1.4em; padding-left:18%;}
	
	.header-r span{ font-size:0.8em; line-height:0.6em; color:#e61574; font-weight:normal; }
	
	.header-r h5{ background:url("../images/top_tel.png") no-repeat left center; background-size:16px 16px;}

	.nav{ height:36px;}
    .nav ul li{
        height:36px;
        line-height:36px;
        font-size:1em;
		padding:0 1.0%;
    }
	
	.tit.t1 h1{
		background:url("../images/title-bg.png") no-repeat 30% top;
	}
	.tit.t2 h1{
		background:url("../images/title-bg.png") no-repeat 28% top;
	}
	.tit.t3 h1{
		background:url("../images/title-bg.png") no-repeat 24% top;
	}
	

    .back{
        width:31px;
        height:31px;
        background:url("../images/back.png") no-repeat center center;
        background-size:31px 31px;
    }
    .bottom-btn{
        height:48px;
    }
    .bottom-btn1{
        height:48px;
        background:url("../images/bottom-btn1.png") no-repeat center center;
        background-size:34.8px 34.8px;
    }
    .bottom-btn2{
        height:48px;
        background:url("../images/bottom-btn2.png") no-repeat center center;
        background-size:34.8px 34.8px;
    }
    #footer{
        padding:10px 0;
        padding-bottom:48px;
    }
    #footer p{
        font-size:0.6em;
        line-height:16px;
    }
}



/************************************************************************************
smaller than 320
*************************************************************************************/
@media screen and (max-width: 320px) {
    #pagewrap {
        margin: 0 auto;
        width: 100%;
        min-width:320px;
    }
    .header{
        height:48px;
		width:70%;
    }
	
	.header-l img{ float:left; margin:4% 1.2% 0 2%; width:70px; height:24px; }
	
	.header-l span{ border-left:1px solid #b5b5b5; padding-left:1%; float:left; margin-top:4%;}
	
	.header-l span h3{ font-size:0.8em; line-height:1em; color:#04447c;}
	
	.header-l span h4{ font-size:0.6em; line-height:1.8em; color:#898989; font-weight:normal;}
	
	.header-r h5{ margin-top:6%; font-size:0.8em; line-height:1.4em; padding-left:18%;}
	
	.header-r span{ font-size:0.8em; line-height:0.6em; color:#e61574; font-weight:normal; }
	
	.header-r h5{ background:url("../images/top_tel.png") no-repeat left center; background-size:16px 16px;}

	.nav{ height:36px;}
    .nav ul li{
        height:36px;
        line-height:36px;
        font-size:1em;
		padding:0 1.0%;
    }
	
	.tit.t1 h1{
		background:url("../images/title-bg.png") no-repeat 30% top;
	}
	.tit.t2 h1{
		background:url("../images/title-bg.png") no-repeat 28% top;
	}
	.tit.t3 h1{
		background:url("../images/title-bg.png") no-repeat 24% top;
	}
	
	
    .back{
        width:31px;
        height:31px;
        background:url("../images/back.png") no-repeat center center;
        background-size:31px 31px;
    }
    .bottom-btn{
        height:48px;
    }
    .bottom-btn1{
        height:48px;
        background:url("../images/bottom-btn1.png") no-repeat center center;
        background-size:34.8px 34.8px;
    }
    .bottom-btn2{
        height:48px;
        background:url("../images/bottom-btn2.png") no-repeat center center;
        background-size:34.8px 34.8px;
    }
    #footer{
        padding:10px 0;
        padding-bottom:48px;
    }
    #footer p{
        font-size:0.6em;
        line-height:16px;
    }
}