
@font-face {
	font-family: "impfont";
	src: url('kf.woff') format('woff');
}


body {
	margin:0px;
	padding: 0px;
	text-align:left;
	font-size:16px;
	color: #000;
	height:100%;
	background-color: #ffffff;
	line-height:27px;
	font-family:"Meiryo", "CI", sans-serif;
}

/*effect*/
body { display:none;}

.fadein {
    opacity : 0.1;
    transform : translate(0, 50px);
    transition : all 500ms;
 } 
.fadein.scrollin {
    opacity : 1;
    transform : translate(0, 0);
}


/*default*/
ul, ol, dl, dt, dd{margin:0px;padding:0px;list-style:none;} 
li {margin:0px;	padding:0px;} 
img { vertical-align:bottom; border: none; padding:0px;}
br {padding:0px; letter-spacing: normal;}
address , em{font-style:normal;}
object {margin:0px;padding:0px;} 
a {	font-size: 16px;}
p {	margin:0px;padding: 0px;}

/*htag*/
h1, h2, h3, h4, h5, h6{
	font-size: 18px;
	font-weight:normal;
	margin: 0px;
	padding: 0px;
}


/*link*/
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: none;}

/*kakikae-sys*/
.fsize-mini{font-size:11px;}
.fsize-large{font-size:25px;}
.fsize-big{font-size:30px;}
.bold{font-weight: bold;margin:10px 0px 10px 0px;}
.delete{text-decoration: line-through;}
.red{color: #F33;}
.blue{color: #06F;}
.green{color: #090;}
.navy{color: #036;}
.pink{color: #F9F;}
.gray{color: #999;}
.orange{color: #F90;}
.purple{color: #C6C;}
.lightblue{color: #6FB7FF;}
.lightgreen{color: #69F574;}
.lightpink{color: #FCF;}

.fs {font-size:14px;}

/*-----------------------------------------------------*/

/*all*/

header {
	background-color:#297CCE;
	color:#fff;
}

/*navi*/
nav {display:none;}

#navi {
	background-image:url(../img/navbg.jpg);
	background-repeat:repeat-x;
	background-color:#297CCE;
	width:100%;
	z-index:100;
}
#navi li{
	display: block;
	float: left;
	width:12%;
}

#navi li a:hover {
	background-image:url(../img/hover.png);
	background-repeat:no-repeat;
	background-position:center top;
	color:#FFC;
}

#navi li a{
	display: block;
	font-family:"impfont",serif;
	font-size:16px;
	margin-top:5px;
	padding-top:15px;
	height:40px;
	line-height:20px;
	text-align:center;
	color:#fff;
}
#navi:after {
	content:"";
	display:block;
	clear:both;
}

.headline{
	background-color:#297CCE;
}
.headline span{
	display:block;
	margin:0px auto;
	max-width:940px;
	padding:20px;
}
.box {
	margin:30px auto;
	max-width:940px;
	padding:0px 20px;
}
.tel a{
	font-size:60px;
	padding-left:30px;
	color:#09F;
}


/*contact entry ---------------------*/

.contact .head img{
	width:100%;
	max-width:360px;

}
.entry .head img{
	width:100%;
	max-width:270px;

}

.contact p, .entry p{
	padding:30px 0px;
	font-size:28px;
	font-family:"impfont",serif;
	line-height:30px;
}

.contact dt, .entry dt {
	float:left;
	padding:10px 0px;
}
.contact dd, .entry dd{
	margin-left:100px;
	padding:10px 0px;
}

/*form*/
form input, form select, form textarea {
	margin:0px auto;
	padding:10px 5px;
	font-size:16px;
	width:90%;
	vertical-align:middle;
}
input[type="text"]:focus, textarea:focus,select:focus {
    border: solid 1px #1CA8DD;
    background-color: #DDF2FA;
}
/*iPhone button clear*/
input[type="button"],input[type="submit"] {
    -webkit-appearance: none;
}
.back{
	display:block;
	width:220px;
	height:35px;
	margin:50px auto;
	padding-top:1em;
	text-align:center;
	font-size:16px;
	background-color:#297CCE;
	border:solid 1px #297CCE;
	color:#fff;
	font-family:"impfont",serif;
	transition-duration:0.2s;
}
.back:hover{
	background-color:#fff;
	color:#297CCE;
}
.btn{
	display:block;
	width:220px;
	margin:50px auto;
	padding-top:15px;
	text-align:center;
	font-size:16px;
	border:solid 1px #ccc;
	font-family:"impfont",serif;
}



/*sending*/
.mailform {
	padding-top:60px;
}
.mailform div{
	max-width:500px;
	margin:30px auto;
	padding:20px;
	border:solid 1px #ccc;
}

.check{ clear:both;text-align: center;padding:20px 0px}




/*pagetop---------------------*/
#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index:100;
}

@media only screen and (max-width: 768px) {

#navi li a{
	font-size:14px;
}
.tel a{
	font-size:35px;
}

}



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


#navi{display: none;}

nav {
    width:100%;
	display:block;
	position:fixed;
	z-index:100;
}

#menu {
	padding-top:49px;
	display:none;
}

#menu li{
    width:100%;
	background-color:#297CCE;
	text-align:center;
	padding:10px 0px;
    border-bottom: 1px solid #eee;
}
#menu li a{
    width:100%;
	display: block;
	color:#fff;
}


#toggle{
    display: block;
    position: relative;
    width:100%;
    background: #297CCE;
	z-index:100;
	position:fixed;
  }
  #toggle a{
    display: block;
    position: relative;
    padding: 15px 0 15px;
    color: #fff;
    text-align: center;
    text-decoration: none;
  }
  #toggle:before{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    background: #fff;
  }
  #toggle a:before, #toggle a:after{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 4px;
    background: #297CCE;
  }
  #toggle a:before{
    margin-top: -6px;
  }
  #toggle a:after{
    margin-top: 2px;
}


.contact p, .entry p {
	padding:10px;
	font-size:20px;
	text-align:center;
}

.headline img{
	width:95%;
}

.entry .headline img{
	width:50%;
}
.link .headline img{
	width:40%;
}
.sitemap .headline img{
	width:60%;
}

.tel a::before {
	content: "\A" ;
	white-space: pre ;
}

}


