html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd,
q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt,
dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot,
thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby, section, summary, time,
mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline;
}
img{ vertical-align:bottom;}

html {
    line-height: 1
}

ol, ul li {
    list-style: none;
}
.clearfix:after{
	content:"";
	clear:both;
	display:block;
	height:0;
}
.allclear	{ clear:both; height:0; font-size:0; line-height:0;}

table {
    border-collapse: collapse;
    border-spacing: 0
}

caption, th, td {
    text-align: left;
    font-weight: normal;
    vertical-align: middle
}

q, blockquote {
    quotes: none
}

q:before, q:after, blockquote:before, blockquote:after {
    content: "";
    content: none
}

a img {
    border: none
}

article, aside, details, figcaption, figure, footer, header, hgroup,
menu, nav, section, summary {
    display: block
}

a{ text-decoration: none; color: #333333;}
body {font-family: 'Noto Sans JP', sans-serif;color: #333;background-color: #ffffff;height: 100%;width: 100%;position:relative;}
#toplist{}
#photo{background: url(../img/color.png) repeat center; display: block; width: 100%; height: 100%;}

#header{padding: 0 0 0 15px; position: fixed; width: 100%;background: #ffffff;z-index: 3;}
#header h1{ float: left; padding: 0 0 0 0;}
#header h1 img{ width: 85px;}
#header nav{ overflow: hidden;}
#header nav ul{ float: right;}
#header nav li{ border-left: 1px solid #dadfe1; float: left;}
#header nav li a{ display: block; font-size: 13px; text-align: center; width: 92px; padding: 25px 0; font-weight: bold; color: #244456; line-height: 18px;}
#header nav li a:hover{ background: #ffffff; opacity: 0.7; color: #244456;}
#header nav li a span{ font-size: 10px;}
#header nav li.form a{ width: 164px; background: #f35500; padding: 35px 0; color: #ffffff;}
#header nav li.form a:hover{ background: #f35500; opacity: 0.7; color: #ffffff;}
#header .toggle{ display:none;}

.main{color: #ffffff; max-width: 992px; margin: 0 auto; clear: both; height: 85%;}
.main .txt{ position: absolute; top: 28%;}
.main .txt h2{ font-size: 30px; font-weight: bold; line-height: 48px; letter-spacing: 3px; margin: 0 0 10px 0;}
.main .txt p{ font-size: 14px; line-height: 24px; margin: 0 0 50px 0; width: 500px;}
.main .txt .link a{  border: 2px solid #ffffff; background: url(../img/arrow2.png) no-repeat right 10px top 18px; background-size: 17px 23px; padding: 20px 40px 20px 20px; color: #ffffff; font-weight: bold;}
.main .txt .link a:hover{opacity: 0.7;}
.main .bnr{ position:absolute;bottom: 30px; text-align: right; width: 992px;}
.main .bnr img{ width: 280px; height: 145px;}
.main .bnr a:hover{opacity: 0.8}
.main .bnr_sp{ position:absolute;bottom: 30px; text-align: center; width: 992px;display: none;}

.pagetop a{ background-image: url('img/line.jpg'); opacity: 0.9; position: fixed; bottom: 30px; right: 30px; padding:15px 10px; border-radius: 4px; z-index: 100; display: block;}
.pagetop .sp{display: none;}
.pagetop:hover{opacity: 0.7;}

#footer{position: relative;}
#footer .contact{background: #f7f9f9; padding: 30px 0;}
/* #footer .sptel{display: none;} */
#footer .contact img{ width: 690px; float: left; margin: 10px 0 0 0;}
#footer .contact a{ background: #f35500; color: #ffffff; display: block;float: right; width: 250px; text-align: left; padding: 12px 15px;}
#footer .contact a:hover{opacity: 0.7;}
#footer .contact dl dt{ font-size: 22px; background: url(../img/icon_mail.png) left 0 top 2px no-repeat; background-size: 30px 20px; padding: 0 0 0 40px ; font-weight: bold; margin: 0 0 8px 0;}
#footer .contact dl dd{ font-size: 12px;}
#footer .copy{background: #ffffff; overflow: hidden; padding: 20px 0;}
#footer .copy a{ float: left; display: block; font-size: 14px; background: url(../img/arrow4.png) no-repeat left 0 top 5px; background-size: 8px 6px; padding: 0 0 0 12px; margin: 0 20px 0 0;}
#footer .copy a:hover{ opacity: 0.7;}
#footer .copy p{ float: right; text-align: right; font-size: 14px;}

#news{}
#news{position: relative;}
#news .title{height: 50px;}
#news li a{text-decoration: underline;}
#news a.link{display: block;  border: 2px solid #244456; background: url(../img/arrow5.png) no-repeat right 10px top 15px; background-size: 17px 23px; padding: 15px 40px 15px 20px; color: #244456; font-weight: bold; position: absolute; right: 0; top: 0;}
#news a.link:hover{opacity: 0.7;}
#news .pc{display: none;}

.clearfix:after { content:"."; display:block; clear:both; height:0; visibility:hidden; }
.clearfix { display:inline-block; }

/* for macIE \*/
* html .clearfix { height:1%; }
.clearfix { display:block; }

ul#newsList{
	margin:0 0 15px;
	padding:0;
}
ul#newsList li{
	color:#666;
	font-size:14px;
	margin:0 ;
	padding:10px 0;
	margin-bottom:3px;
	line-height:150%;
	list-style-type:none;
}

.catName{
	display:inline-block;
	padding:3px 8px;
	border:1px solid #ccc;
	border-radius:2px;
	font-size:11px;
	line-height:100%;
	margin:0 2px;
}
.cat-1 .catName{
	display:inline-block;
	padding:3px 8px;
	border:1px solid #E20000;
  background: #E20000;
  color: #fff;
	border-radius:2px;
	font-size:11px;
	line-height:100%;
	margin:0 2px;
}
.newMark{
	display:inline-block;
	background: #f35500;
	padding:2px 8px;
	font-size:12px;
	line-height:100%;
	background:#F00;
	color:#fff;
	border-radius:2px;
  margin-left: 5px;  
}
.comment{
	display:block;
	padding:3px 0;
	float:left;
	overflow:hidden;
	width:500px;/* æœ¬æ–‡éƒ¨åˆ†ã®å¹…ã€‚ã“ã“ã¯ç‰¹ã«è¨­ç½®ãƒšãƒ¼ã‚¸åˆã‚ã›ã¦å¤‰æ›´ä¸‹ã•ã„ */
}
.thumbNailWrap{
	display:block;
	width:110px;
	float:left;
	height:80px;
	overflow:hidden;
}
.pager{
	text-align:right;
	padding:10px;
	clear:both;
}
/*ãƒšãƒ¼ã‚¸ãƒ£ãƒ¼ãƒœã‚¿ãƒ³*/
.pager a{
    border: 1px solid #999;
    border-radius: 5px 5px 5px 5px;
    color: #333;
    font-size: 12px;
    padding: 3px 7px 2px;
    text-decoration: none;
	margin:0 1px;
}

/*ç¾åœ¨ã®ãƒšãƒ¼ã‚¸ã®ãƒœã‚¿ãƒ³*/
.pager a.current{
    background: #999;
    border: 1px solid #999;
    border-radius: 5px 5px 5px 5px;
    color: #fff;
    font-size: 12px;
    padding: 3px 7px 2px;
	margin:0 1px;
    text-decoration: none;
}

.pager a:hover{
    background:#999;
    color: #fff;
}

.overPagerPattern{
	padding:0 2px ;	
}


#s02{text-align: center; color: #244456;}
.wapper{ max-width:  992px; margin: 0 auto; overflow: hidden; position: relative;}
.area1{background: #ebeef0; padding:50px 0;}
.area2{background: #f7f9f9; padding:50px 0;}
.area3{background: #ebeef0; padding:50px 0;}
.area4{background: #f7f9f9; padding:20px 0;}
.area5{background: #ffffff; padding:20px 0;}

.title{ text-align: left; position: relative; height: 100px;}
.title h2{ font-size: 30px; font-weight: bold; margin: 0 0 20px 0;}
.title h2 span{ color: #a2aeb4; font-size: 14px; margin: 0 0 0 20px;}
.title p{ font-size: 14px;}

.pracrices{position: relative;}
.pracrices a.link{display: block;  border: 2px solid #244456; background: url(../img/arrow5.png) no-repeat right 10px top 15px; background-size: 17px 23px; padding: 15px 40px 15px 20px; color: #244456; font-weight: bold; position: absolute; right: 0; top: 0;}
.pracrices a.link:hover{opacity: 0.7;}
.pracrices ul{ width: 100%; overflow: hidden;}
.pracrices li{ float: left; width: 24.5%; margin: 0 0 0.5% 0.5%}
.pracrices li a{ display: block; text-align: center; background: #ffffff; color: #244456; padding: 30px 0;}
.pracrices li a:hover{ opacity: 0.7;}
.pracrices li a img{ width: 120px; height:120px ; margin: 0 0 10px 0;}
.pracrices li dl{ line-height: 24px;}
.pracrices li dt{ font-weight: bold;}
.pracrices li dd{ font-size: 14px;}

.profile{position: relative;}
.profile a.link{display: block;  border: 2px solid #244456; background: url(../img/arrow5.png) no-repeat right 10px top 15px; background-size: 17px 23px; padding: 15px 40px 15px 20px; color: #244456; font-weight: bold; position: absolute; right: 0; top: 0;}
.profile a.link:hover{opacity: 0.7;}
.profile ul{ width: 100%; overflow: hidden;}
.profile li{ float: left; width: 16.666%; text-align: left;}
.profile li a{ color: #244456; display: block;}
.profile li img{ width: 90%; margin: 0 0 5px 0;}
.profile li dl{}
.profile li dt{}
.profile li dd{ font-size: 14px; margin: 0 0 5px 0; line-height: 24px;}
.profile li dd.name{ font-size: 20px; font-weight: bold; background: url(../img/arrow3.png) no-repeat right 60px top 8px; background-size: 8px 13px;}
.profile li dd span{ font-size: 12px; color: #acb4b8;}
.profile li a:hover{ opacity: 0.7;}

.box{ width: 476px; text-align: left; position: relative;}
.left{ float: left;}
.right{ float: right}
.box img{ width: 100%}
.box .title2{ text-align: left; position: relative; height: 50px;}
.box .title2 h2{ font-size: 30px; font-weight: bold; margin: 0 0 20px 0;}
.box .title2 h2 span{ color: #a2aeb4; font-size: 14px; margin: 0 0 0 20px;}
.box p{ font-size: 14px; padding: 10px 0; line-height: 24px;}
.box a{  border: 2px solid #244456; background: url(../img/arrow5.png) no-repeat right 10px top 10px; background-size: 17px 23px; padding: 15px 35px 15px 18px; color: #244456; font-weight: bold; position: absolute; right: 0; bottom: 5px; font-size: 14px;}
.box a:hover{ opacity: 0.7;}
.sp{display: none}

@media all and (max-width: 768px) {
	#header{ width:100%; margin:0 auto; border:none; padding: 0; z-index: 100;height: 78px;}
	#header h1{padding:0px 0 20px 20px;}
	#header h1 img{ width: 80px;}
	#header .child {display: none;}
	#header nav{ background:none; width: 100%;}
	#header .toggle{ position:absolute; right:20px; top:20px; display:block; z-index: 100}
	#header #menu{ position:absolute; top:75px; background:#ffffff; z-index: 100}
	#header nav ul{width:100%; float: none;}
	#header nav ul li{ width : 100%; font-weight:bold; float:none; background:url(../img/arrow5.png) right 20px top 20px no-repeat; background-size:17px 25px; -webkit-background-size:17px 25px; border-bottom:1px solid #cccccc; border-left: none;}
	#header nav ul li a{ display:block; color:#333333; border-bottom:none; font-size:16px; text-align: center; width: 100%; padding: 25px 0 ;}
	#header nav li a span{ display: none;}
	#header nav li a br{ display: none;}
	#header nav li.form a{ width: 100%; background: #ffffff; padding: 25px 0 ; background:url(../img/arrow5.png) right 20px top 20px no-repeat; background-size:17px 25px; -webkit-background-size:17px 25px; color:#333333}
	
	.main{color: #ffffff; max-width: 100%; margin: 0 auto; clear: both; height: 85%; text-align: center;}
	.main .txt{ width: 100%;top: 36%;}
	.main .txt h2{ text-align: center; font-size: 20px; line-height: 32px; letter-spacing: 1px; margin: 0 0 30px 0; width: 100%;padding-bottom: 40px;}
	.main .txt p{ display:none; width: 100%;}
	.main .txt p.link{display: block; margin: 0 auto; text-align: center;}
	.main .bnr{ display: none;}
	.main .bnr img{ width: 90%;}
	.main .bnr_sp{ width: 100%; display: block;}
	.main .bnr_sp img{ width: 90%;}
	.wapper{ width:100%; margin: 0 auto; overflow: hidden;}
	
	.pagetop a{ background-image: url('img/line.jpg'); opacity: 1; position: absolute; top: 0px; left: 0; width: 100% ;padding:30px 0 10px 0 ; height: 30px; border-radius: 0px;text-align: center;}
	.pagetop .pc{ display: none;}
	.pagetop .sp{ display: block; width: 100px; margin: 0 auto;}
	#footer{}
	#footer .contact .wapper{display: none;}
	#footer .sptel{display: block; padding:50px 0 0 0;width: 100%;}
	#footer .sptel img{width: 100%;}
	#footer .sptel a{ background:none; color: #ffffff; display: block;float: none; width: 90%; text-align: cenetr; padding:0; margin: 0 5% 0 5%;}
	#footer .copy{background: #ffffff; overflow: hidden; padding: 20px 0; text-align: left; width: 90%; margin: 0 auto; padding: 20px 0 0 0;}
	#footer .copy a{ float: left; display: block; font-size: 14px; background: url(../img/arrow4.png) no-repeat left 0 top 15px; background-size: 8px 6px; padding: 10px 0 10px 12px; margin: 0 20px 0 0;}
	#footer .copy p{ clear: both; float: none; text-align: left; font-size: 14px; padding: 25px 0;}
	
	.title{ text-align: left; position: relative; height: auto; width: 90%; margin: 0 auto 20px auto;}
	.title h2{ font-size: 30px; font-weight: bold; margin: 0 0 20px 0;}
	.title h2 span{ color: #a2aeb4; font-size: 14px; margin: 0 0 0 20px;}
	.title p{ font-size: 14px; line-height: 20px;}
  
  #news{}
  #news{position: relative;}
  #news .title{ text-align: left; position: relative; height: auto; width: 90%; margin: 0 auto 20px auto;}
  #news li {line-height: 1.5}
  #news li a{text-decoration: underline;}
  #news a.link{border: 2px solid #244456; background: url(../img/arrow5.png) no-repeat right 10px top 15px; background-size: 17px 23px; padding: 15px 40px 15px 20px; color: #244456; font-weight: bold; position: static; right: 0; bottom: 0; margin: 0 5%; clear: both;}
  #news #newsList li .pc{display: block;}
  #news #newsList{width: 90%;margin: 0 auto 30px;}
  #news #newsList li .up_ymd{display: block;margin-bottom: 5px;}
  #news #newsList li .title{font-size: 16px;}
  
	
	.pracrices{position: relative}
	.pracrices a.link{  border: 2px solid #244456; background: url(../img/arrow5.png) no-repeat right 10px top 15px; background-size: 17px 23px; padding: 15px 40px 15px 20px; color: #244456; font-weight: bold; position: static; right: 0; bottom: 0; margin: 0 5%; clear: both;}
	.pracrices ul{ width: 100%; overflow: hidden; margin:0 0 20px 0;}
	.pracrices li{ float: left; width: 49.5%; margin: 0 0 0.5% 0.5%;}
	.pracrices li a{ display: block; text-align: center;color: #244456; padding: 20px 5% 20px 5%;overflow: hidden; background: url(../img/arrow3.png) no-repeat right 10px top 50% #ffffff; background-size: 10px 18px;}
	.pracrices li a img{ width: 60px; height:60px; margin: 0 5% 0 0; float: left}
	.pracrices li dl{ line-height: 24px; float: left; padding: 15px 0;}
	.pracrices li dd{display: none;}

	.profile{position: relative;}
	.profile a.link{  border: 2px solid #244456; background: url(../img/arrow5.png) no-repeat right 10px top 15px; background-size: 17px 23px; padding: 15px 40px 15px 20px; color: #244456; font-weight: bold; position: static; right: 0; bottom: 0; margin: 0 5%; clear: both;}
	.profile ul{ width: 90%; overflow: hidden; margin: 0 auto 20px auto;}
	.profile li{ float: left; width: 33.3333%; text-align: left;}
	.profile li a{ color: #244456; display: block;}
	.profile li img{ width: 100%; margin: 0 0 5px 0;}
	.profile li dl{}
	.profile li dt{}
	.profile li dd{ font-size: 14px; margin: 0 0 5px 0; line-height: 24px;}
	.profile li dd.name{ font-size: 18px; font-w＃eight: bold; background: url(../img/arrow3.png) no-repeat right 10px top 6px; background-size: 8px 13px;}
	.profile li dd span{ display: none;}
	
	.box{ width: 90%; text-align: left; position:static; margin: 0 5% 30px 5%}
	.left{ float: none;}
	.right{ float: none; margin: 0 5% 0 5%}
	.box img{ width: 100%}
	.box .title2{ text-align: left; position: static; height:auto;}
	.box .title2 h2{ font-size: 30px; font-weight: bold; margin: 0 0 20px 0;}
	.box .title2 h2 span{ color: #a2aeb4; font-size: 14px; margin: 0 0 0 20px;}
	.box p{ font-size: 14px; padding: 10px 0; line-height: 24px;}
	.box a{display: block; border: 2px solid #244456; background: url(../img/arrow5.png) no-repeat right 10px top 15px; background-size: 17px 23px; padding: 15px 40px 15px 20px; color: #244456; font-weight: bold; position: static; right: 0; bottom: 0; margin: 0; clear: both; text-align: center;}
	.sp{display: block}
	
	.pracrices li a.spread{ display: block; text-align: center;color: #244456; padding: 11px 5% 11px 5%;overflow: hidden; background: url(../img/arrow3.png) no-repeat right 10px top 50% #ffffff; background-size: 10px 18px;}
