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

body{ }
header#header_type01 { background:#000000; height:65px;}
header#header_type01 h2{ width:31.6%; float:left; padding-top:25px; padding-left:15%;}
header#header_type01 h2 img{ width:100%;}

#wrp{ padding-top:0px;}
#wrp #box_01{ background:url(img/img01.png) no-repeat center top; background-size:cover; height:445px; box-sizing:border-box; padding:20px 0;}
#wrp #box_01 h2{ text-align:center; padding-top:150px;}
#wrp #box_01 p{ display:block; text-align:center; padding-top:120px;}

#wrp #box_02{ background:url(img/img02.png) no-repeat center top; background-size:cover; height:445px; box-sizing:border-box; padding:20px 0; text-align:center;}
#wrp #box_02 h2{ text-align:center; padding:20px 0;}
#wrp #box_02 p{ display:block; text-align:center; color:#fff; font-size:14px;}

#wrp #box_02 p.en{ font-size:10px;}

#wrp #box_03{ background:url(img/img03.png) no-repeat center top; background-size:cover; height:445px; box-sizing:border-box; padding:20px 0;}
#wrp #box_03 h2{ text-align:center; padding:170px 0;}


/* = == == == == == == == == = */
@media screen and (max-width: 920px) {

header#header_type01 h2{ width:35%; float:left; padding-top:10px; padding-left:0%;}

#wrp #box_01{ background-size:200%; height:200px;}
#wrp #box_02{ background-size:400%; height:500px;}
#wrp #box_03{ background-size:200%; height:200px;}


#wrp #box_01 h2{ padding-top:50px;}
#wrp #box_01 h2 img{  width: 60%}
#wrp #box_01 p{ padding-top:20px;}
#wrp #box_01 p img{ width: 12px;}

#wrp #box_02 h2{ text-align:center; padding:20px 0; font-size:20px; color:#fff;font-weight:normal; letter-spacing:0em;}
#wrp #box_02 h2 img{ width: 20%; padding:0px 0;}
#wrp #box_02 p{ display:block; text-align:center; color:#fff; font-size:12px;}

#wrp #box_03 h2{ text-align:center; padding:40px 0; font-size:20px; color:#fff; font-weight:normal;letter-spacing:0em;}
#wrp #box_03 h2 img{  width: 40%;}

}

/* = == == == == == == == == = */
@media screen and (max-width: 680px) {

header#header_type01 { height:53px;}

}