@charset "utf-8";
/* CSS Document */
.h_icon_box{
max-width:200px;
max-height:125px;
}
.h_title_box a{ color:#fff;}

@media only screen and (min-width: 1030px) {
.bg1 {	background: url('./svg/icon_01.svg') 0 0 no-repeat; background-size: 100px;}
.bg2 {	background: url('./svg/icon_02.svg') 0 0 no-repeat; background-size: 100px; }
.bg3 {	background: url('./svg/icon_03.svg') 0 0 no-repeat; background-size: 100px; }
.bg4 {	background: url('./svg/icon_04.svg') 0 0 no-repeat; background-size: 100px; }
.bg5 {	background: url('./svg/icon_05.svg') 0 0 no-repeat; background-size: 100px; }
.bg6 {	background: url('./svg/icon_06.svg') 0 0 no-repeat; background-size: 100px; }
.bg7 {	background: url('./svg/icon_07.svg') 0 0 no-repeat; background-size: 100px; }
.bg8 {	background: url('./svg/icon_08.svg') 0 0 no-repeat; background-size: 100px; }
.bg9 {	background: url('./svg/icon_09.svg') 0 0 no-repeat; background-size: 80px; }
.bg10 {	background: url('./svg/icon_10.svg') 0 0 no-repeat; background-size: 100px; }
.bg11 {	background: url('./img/logo_1.png') 0 0 no-repeat; background-size: 100px; }
h1{	width:800px;	height:60px; margin-left:10px;	padding:40px 0 35px 80px}	
h1 a{color:#fff; font-size:36px}
#top #top_inner{height:80px;}	
}
@media only screen and (max-width: 1029px) {
.bg1 {	background: url('./svg/icon_01.svg') 0 0 no-repeat; background-size: 60px; }
.bg2 {	background: url('./svg/icon_02.svg') 0 0 no-repeat; background-size: 60px; }
.bg3 {	background: url('./svg/icon_03.svg') 0 0 no-repeat; background-size: 60px; }
.bg4 {	background: url('./svg/icon_04.svg') 0 0 no-repeat; background-size: 60px; }
.bg5 {	background: url('./svg/icon_05.svg') 0 0 no-repeat; background-size: 60px; }
.bg6 {	background: url('./svg/icon_06.svg') 0 0 no-repeat; background-size: 60px; }
.bg7 {	background: url('./svg/icon_07.svg') 0 0 no-repeat; background-size: 60px; }
.bg8 {	background: url('./svg/icon_08.svg') 0 0 no-repeat; background-size: 60px; }
.bg9 {	background: url('./svg/icon_09.svg') 0 0 no-repeat; background-size: 60px; }
.bg10 {	background: url('./svg/icon_10.svg') 0 0 no-repeat; background-size: 60px; }
.bg101 {	background: url('./svg/icon_101.svg') 0 0 no-repeat; background-size: 60px; }
h1{	width:800px;	height:60px; margin-left:10px;	padding:10px 0 5px 40px}	
h1 a{color:#fff; font-size:24px}	
#top #top_inner{height:60px;}
}
@media only screen and (max-width: 769px) {
.bg1 {	background: url('./svg/icon_01.svg') 0 0 no-repeat; background-size: 50px; }
.bg2 {	background: url('./svg/icon_02.svg') 0 0 no-repeat; background-size: 50px; }
.bg3 {	background: url('./svg/icon_03.svg') 0 0 no-repeat; background-size: 50px; }
.bg4 {	background: url('./svg/icon_04.svg') 0 0 no-repeat; background-size: 50px; }
.bg5 {	background: url('./svg/icon_05.svg') 0 0 no-repeat; background-size: 50px; }
.bg6 {	background: url('./svg/icon_06.svg') 0 0 no-repeat; background-size: 50px; }
.bg7 {	background: url('./svg/icon_07.svg') 0 0 no-repeat; background-size: 50px; }
.bg8 {	background: url('./svg/icon_08.svg') 0 0 no-repeat; background-size: 50px; }
.bg9 {	background: url('./svg/icon_09.svg') 0 0 no-repeat; background-size: 50px; }
.bg10 {	background: url('./svg/icon_10.svg') 0 0 no-repeat; background-size: 50px; }
.bg101 {	background: url('./svg/icon_101.svg') 0 0 no-repeat; background-size: 50px; }
h1{	width:600px;	height:50px; margin-left:10px;	padding:10px 0 5px 30px}	
h1 a{color:#fff; font-size:20px}	
#top #top_inner{height:50px;}
}
@media only screen and (max-width: 480px) {
.bg1 {	background: url('./svg/icon_01.svg') 0 0 no-repeat; background-size: 40px; }
.bg2 {	background: url('./svg/icon_02.svg') 0 0 no-repeat; background-size: 40px; }
.bg3 {	background: url('./svg/icon_03.svg') 0 0 no-repeat; background-size: 40px; }
.bg4 {	background: url('./svg/icon_04.svg') 0 0 no-repeat; background-size: 40px; }
.bg5 {	background: url('./svg/icon_05.svg') 0 0 no-repeat; background-size: 40px; }
.bg6 {	background: url('./svg/icon_06.svg') 0 0 no-repeat; background-size: 40px; }
.bg7 {	background: url('./svg/icon_07.svg') 0 0 no-repeat; background-size: 40px; }
.bg8 {	background: url('./svg/icon_08.svg') 0 0 no-repeat; background-size: 40px; }
.bg9 {	background: url('./svg/icon_09.svg') 0 0 no-repeat; background-size: 40px; }
.bg10 {	background: url('./svg/icon_10.svg') 0 0 no-repeat; background-size: 40px; }
.bg101 {	background: url('./svg/icon_101.svg') 0 0 no-repeat; background-size: 40px; }
h1{	width:400px;	height:auto; margin-left:10px;	padding:10px 0 6px 20px}	
h1 a{color:#fff; font-size:20px}	
#top #top_inner{height:auto;}
}
@media only screen and (max-width: 376px) {
.bg1 {	background: url('./svg/icon_01.svg') 0 0 no-repeat; background-size: 35px; }
.bg2 {	background: url('./svg/icon_02.svg') 0 0 no-repeat; background-size: 35px; }
.bg3 {	background: url('./svg/icon_03.svg') 0 0 no-repeat; background-size: 35px; }
.bg4 {	background: url('./svg/icon_04.svg') 0 0 no-repeat; background-size: 35px; }
.bg5 {	background: url('./svg/icon_05.svg') 0 0 no-repeat; background-size: 35px; }
.bg6 {	background: url('./svg/icon_06.svg') 0 0 no-repeat; background-size: 35px; }
.bg7 {	background: url('./svg/icon_07.svg') 0 0 no-repeat; background-size: 35px; }
.bg8 {	background: url('./svg/icon_08.svg') 0 0 no-repeat; background-size: 35px; }
.bg9 {	background: url('./svg/icon_09.svg') 0 0 no-repeat; background-size: 35px; }
.bg10 {	background: url('./svg/icon_10.svg') 0 0 no-repeat; background-size: 35px; }
.bg101 {	background: url('./svg/icon_101.svg') 0 0 no-repeat; background-size: 35px; }
h1{	width:320px;	height:auto; margin-left:10px;	padding:6px 0 5px 20px}	
h1 a{color:#fff; font-size:18px}	
#top #top_inner{height:auto;}
}
@media only screen and (max-width: 321px) {
bg1 {		background: url('./svg/icon_01.svg') 0 0 no-repeat; background-size: 35px; }
.bg2 {	background: url('./svg/icon_02.svg') 0 0 no-repeat; background-size: 35px; }
.bg3 {	background: url('./svg/icon_03.svg') 0 0 no-repeat; background-size: 35px; }
.bg4 {	background: url('./svg/icon_04.svg') 0 0 no-repeat; background-size: 35px; }
.bg5 {	background: url('./svg/icon_05.svg') 0 0 no-repeat; background-size: 35px; }
.bg6 {	background: url('./svg/icon_06.svg') 0 0 no-repeat; background-size: 35px; }
.bg7 {	background: url('./svg/icon_07.svg') 0 0 no-repeat; background-size: 35px; }
.bg8 {	background: url('./svg/icon_08.svg') 0 0 no-repeat; background-size: 35px; }
.bg9 {	background: url('./svg/icon_09.svg') 0 0 no-repeat; background-size: 35px; }
.bg10 {	background: url('./svg/icon_10.svg') 0 0 no-repeat; background-size: 35px; }
.bg101 {	background: url('./svg/icon_101.svg') 0 0 no-repeat; background-size: 35px; }
h1{	width:300px;	height:70px; margin-left:10px;	padding:5px 0 5px 30px}	
h1 a{color:#fff; font-size:16px}
#top #top_inner{height:30px;}
}
.head_title{
    position: relative;
	width:90%;
	height:80px;
	float:left;
	text-align:left;
    color: #fff;
	font-size:20px;
    font-weight: bold;
    margin: 0 0 0 0;
    padding: 0.5em 0.5em 0.5em 1.7em;
}
 
.head_title:before{
    content: "";
    position: absolute;
    background: #FC0;
    top:6px;
    left: 0.4em;
    height: 18px;
    width: 18px;
    transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
    -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
    -o-box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
    -ms-box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
}
 
.head_title:after{
    content: "";
    position: absolute;
    background: #F00;
    top: 24px;
    left: 0;
    height: 10px;
    width: 10px;
    transform: rotate(15deg);
    -moz-transform: rotate(15deg);
    -webkit-transform: rotate(15deg);
    -o-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    -moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
    -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
    -o-box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
    -ms-box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
}