@charset "UTF-8";

/* -----------------------------------------------------------------------------------------
                                          初期設定
----------------------------------------------------------------------------------------- */

html,body {
	height: 100%;
}

img {
	margin: 0px;
	border: none;
}

body {
	margin: 0px;
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
    font-size: 10px; /*62.5%*/
    line-height: 1.5;
    letter-spacing: 0;    
    -webkit-text-size-adjust: 100%;  /* スマホを横向きにすると文字が余計に拡大されるのを防ぐ */
}

html { font-size: 62.5%; } 
body { font-size: 1.0rem; } /* =10px */

p {
	font-size: 1.4rem;
	text-align:justify; /*  両端揃え設定 */
	text-justify:distribute; /*  両端揃え設定 */
	margin-bottom: 1em;
}


section {
	width: 100%;
	margin-bottom: 40px;
}

section.bg-stripe {
	background-image: url(../images/top/bg-stripe.png);
	background-position: left top;
	background-repeat: repeat;
	padding: 40px 0;
}

section.bg-stripe2 {
	background-image: url(../images/common/bg-stripe2.png);
	background-position: left top;
	background-repeat: repeat;
	padding: 40px 0;
}


article {
	width: 96%;
	max-width: 1024px;
	margin: 0 auto 40px;
}

	article:last-of-type {
		margin-bottom: 0;
	}

/* -----------------------------------------------------------------------------------------
                                          基本タイトル
----------------------------------------------------------------------------------------- */

#wrapper h2 {
	/* font-size: 4.6rem; */
	font-size: 3.0rem;
	font-weight: bold;
	color: #4d4d4d;
	/* margin-bottom: 40px; */
	margin-bottom: 30px;
}


#wrapper h2.border {
	/* font-size: 3.6rem; */
	font-size: 3.2rem;
	font-weight: bold;
	color: #4d4d4d;
	background-image: url(../images/common/bg-title-h2.png);
	background-repeat: repeat-x;
	background-position: left bottom;
	margin-bottom: 30px;
}

#content-area h2.border span {
	font-size: 1.8rem;
	margin-left: 2em;
}

/***  h2->h1 ***/
#wrapper h1.border {
	/* font-size: 3.6rem; */
	font-size: 3.2rem;
	font-weight: bold;
	color: #4d4d4d;
	background-image: url(../images/common/bg-title-h2.png);
	background-repeat: repeat-x;
	background-position: left bottom;
	margin-bottom: 30px;
}

#content-area h1.border span {
	font-size: 1.8rem;
	margin-left: 2em;
}



#wrapper h2.circle-orange {
	font-size: 3.0rem;
}	
	#wrapper h2.circle-orange:first-letter {
		display: inline-block;
		background-color: #F7931E;
		color: #fff;
		font-size: 4.6rem;
		padding: 10px;
		border-radius: 50px;
		margin-bottom: 40px;
	}
	
#wrapper h2.circle-green {
	font-size: 3.0rem;
}	
	#wrapper h2.circle-green:first-letter {
		display: inline-block;
		background-color: #009872;
		color: #fff;
		/* font-size: 4.6rem; */
		font-size: 3.4rem;/**/
		padding: 7px;/**/
		border-radius: 40px;/**/
		margin-bottom: 30px;/**/
	}

#wrapper h3 {
	font-size: 2.4rem;
	font-weight: bold;
	padding: 5px;
	border-top: solid 1px #4d4d4d;
	border-bottom: solid 1px #4d4d4d;
}

#wrapper h4 {
	font-size: 1.7rem;
	font-weight: bold;
}




/* -----------------------------------------------------------------------------------------
                                          img要素のディセンダー削除
----------------------------------------------------------------------------------------- */
img {
	vertical-align: middle;
}


/* -----------------------------------------------------------------------------------------
                                          リンクテキストのアウトラインを消去
----------------------------------------------------------------------------------------- */

a {
	outline: none;
}

:focus {
  	outline: 0;
}

/* -----------------------------------------------------------------------------------------
                                          フォームのボタンのクリック時の点線を消去
----------------------------------------------------------------------------------------- */
/* Firefox */

input[type="submit"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner{   
        border : 0px;
}

/* IE8で内側の点線を消す */
input{
    outline:none; 
}


/* -----------------------------------------------------------------------------------------
                                          								clearFix
----------------------------------------------------------------------------------------- */
.cf:after {
    content:"";
    display:table;
    clear:both;
}


/* -----------------------------------------------------------------------------------------
                                          								初期レイアウト
----------------------------------------------------------------------------------------- */
/* コンテナ 高さ100% */
div#container {
	min-height: 100%;
}

/* IE6 */
*html div#container {
	height: 100%;
}

#container {
	width: 100%;
}


#header-wrapper {
/*	width: 100;*/
	width: 100%;
	padding: 40px 0;
	background-image: url(../images/common/bg-header.png);
	background-position: left top;
	background-repeat: repeat-x;
}

header {
	width: 96%;
	max-width: 1024px;
	margin: 0 auto;
	padding: 0;
}

header h1 a {
	display: block;
	float: left;
	width: 271px;
	height: 59px;
	text-indent: -9999px;
	overflow: hidden;
	background-image: url(../images/common/logo.png);
	background-size: cover;
}

header #h-right {
	float: right;
}

	header #h-right  ul {
		font-size: 1.3rem;
		margin-bottom: 10px;
	}
		header #h-right  ul li {
			display: inline;
			margin-right: 1em;
		}
		header #h-right  ul li:last-child {
			margin-right: 0;
		}
		
		header #h-right  ul li a {
			color: #4d4d4d;
			text-decoration: none;
		}
		header #h-right  ul li a:hover {
			text-decoration: underline;
		}
		
		header #h-right  ul li.qa i {
			color: #F7931E;
		}
		
		header #h-right  ul li.mail i {
			color: #3FA9F5;
		}
		
		header #h-right  ul li.doc i {
			color: #7AC943;
		}
		
	
/* 検索フォーム
----------------------------------------------------------- */  
#searchform {  
    position: relative;
    float: right; 
}  
#keywords  {  
    width: 230px;  
    height: 22px;  
    background: #fff;  
    border: none;  
    padding: 4px 34px 4px 4px;  
    color: #4d4d4d;  
}  
#searchBtn {  
    position: absolute;  
    top: 0;  
    _top: 1px;  
    left: 238px; 
    
}  
*:first-child + html #searchBtn    {  
    top: 1px;  
}  


nav {
	width: 96%;
	max-width: 1024px;
	margin: 0 auto;
	padding: 20px;
}






/* フリーダイヤル */

.bg-stripe2 h2 {
	display: block;
	width: 75%;
	font-size: 2.2rem;
	font-weight: bold;
	color: #fff;
	text-align: center;
	background-color: #F7931E;
	margin: 0 auto 20px;
	border-radius: 25px;
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
}

.bg-stripe2 ul.free-dial {
	font-size: 0;
	text-align: center;
}
	.bg-stripe2 ul.free-dial li {
		display: inline-block;
		margin-right: 20px;
		border-right: solid 2px #009872;
		padding-right: 20px;
	}
	
	.bg-stripe2 ul.free-dial li:last-child {
		border-right: none;
		padding-right: 0;
		margin-right: 0;
	}
	
	.bg-stripe2 ul.free-dial li h3 {
		text-align: left;
		font-size: 1.4rem;
		font-weight: bold;
		margin-bottom: 0;
	}
	
	.bg-stripe2 ul.free-dial li p {
		font-size: 3.6rem;
		font-weight: bold;
		color: #009872;
		margin-bottom: 0;
	}
	.bg-stripe2 ul.free-dial li p:before {
		content: url(../images/common/icon-free-dial.png);
		margin-right: 10px;
	}

.bg-stripe2 ul.liner {
	text-align: center;
	font-size: 1.4rem;
}
 .bg-stripe2 ul.liner li {
	 display: inline;
	 margin-right: 1em;
 }
 
 .bg-stripe2 ul.liner li:before {
	 content: "● ";
 }
 .bg-stripe2 ul.liner li:last-child:before {
	 content: none;
 }

 .bg-stripe2 ul.liner li span {
	 font-size: 1.3rem;
 }
 	.bg-stripe2 ul.liner li span a {
	 	display: inline-block;
	 	padding: 4px 1em;
	 	text-decoration: none;
	 	color: #4d4d4d;
	 	background-color: #fff;
	 border: solid 1px #b3b3b3;
	-webkit-transition: all 0.5s ease 0s;
	-o-transition: all 0.5s ease 0s;
	transition: all 0.5s ease 0s;
 	}
 	
 	.bg-stripe2 ul.liner li span a:hover {
	 	background-color: #f8f8f8;
 	}
 	
 	.bg-stripe2 ul.liner li span a i {
	 	color: #BDCCD4;
 	}


section.bg-stripe2 article {
	position: relative;
}

div.icon-free {
	position: absolute;
	top: 0;
	left: -1%;
}

div.icon-char {
	position: absolute;
	top: -10px;
	right: 0px;
	text-align: right;
}
div.icon-char img {
	width: 90%;
	height: auto;
}

/* 対応エリア */

div.left-area-box {
	width: 32%;
	max-width: 328px;
	float: left;
}
	div.left-area-box img {
		width: 100%;
		height: auto;
		margin-bottom: 10px;
	}

		div.left-area-box ul {
			font-size: x-small;
		}

div.right-area-box {
	width: 64%;
	max-width: 655px;
	float: right;
}

	div.right-area-box dl {
		font-size: 1.4rem;
		margin-bottom: 20px;
	}
		div.right-area-box dl dt {
			font-weight: bold;
			padding: 4px 0;
			border-top: solid 1px #4d4d4d;
			border-bottom: solid 1px #4d4d4d;
			margin-bottom: 1em;
		}
		
		div.right-area-box dl dd {
			margin-bottom: 2em;
		}
		
			div.right-area-box dl dd:last-of-type {
				margin-bottom: 0;
			}
			
			div.right-area-box p.toiawase {
				font-size: 2.4rem;
				font-weight: bold;
				color: #F7931E;
			}
			
			div.right-area-box p.toiawase span {
				font-size: 1.6rem;
				font-weight: normal;
				}
			
			div.right-area-box p.toiawase span a {
				display: inline-block;
				padding: .5em 1em;
				text-decoration: none;
				color: #4d4d4d;
				background-color: #fff;
				border: solid 1px #b3b3b3;
				-webkit-transition: all 0.5s ease 0s;
				-o-transition: all 0.5s ease 0s;
				transition: all 0.5s ease 0s;
				}
			
				div.right-area-box p.toiawase span a i {
					color: #BDCCD4;
				}
				
				div.right-area-box p.toiawase span a:hover {
					background-color: #f8f8f8;
				}


div#footer-area {
	width: 100%;
		background-image: url(../images/common/bg-footer.png);
		background-position: left 54px;
		background-repeat: repeat-x;
}

	footer {
		width: 96%;
		max-width: 1024px;
		margin: 0 auto;
		padding-top: 94px;
		background-image: url(../images/common/bg-footer-illust.png);
		background-position: right top;
		background-repeat: no-repeat
	}

div.f-wrap {
	border-bottom: solid 2px #fff;
	margin-bottom: 20px;
	padding-bottom: 20px;
}
	div.f-left {
		float: left;
	}
		div.f-left h2 {
			display: block;
			width: 270px;
			height: 28px;
			text-indent: -9999px;
			overflow: hidden;
			background-image: url(../images/common/logo-footer.png);
			background-repeat: no-repeat;
			background-size: contain;
			margin-bottom: 10px;
		}
		
		div.f-left h2 a {
			display: block;
			width: 270px;
			height: 28px;
		}
		
		div.f-left p {
			color: #fff;
			font-size: 1.2rem;
			margin-bottom: 0;
		}
		
div.f-wrap ul {
	float: right;
	font-size: 0;
}
	
	div.f-wrap ul li {
		display: inline-block;
		margin-right: 10px;
	}	
		div.f-wrap ul li:last-child {
			margin-right: 0;
		}

div.footer-nav-area {
	padding-bottom: 20px;
}

		
div.f-nav-box {
	float: left;
	margin-right: 5%;
}	
	div.f-nav-box:last-of-type {
	margin-right: 0;
	}	
		div.f-nav-box h3 {
			color: #fff;
			font-size: 1.4rem;
			font-weight: bold;
			/*background-image: url(../images/common/bg-title-f-nav.png);*/
			background-position: left bottom;
			background-repeat: no-repeat;
			margin-bottom: 20px;
		}
		div.f-nav-box h3.bg-title-f-nav4 {
			background-image: url(../images/common/bg-title-f-nav4.png);
		}
		div.f-nav-box h3.bg-title-f-nav5 {
			background-image: url(../images/common/bg-title-f-nav5.png);
		}
		div.f-nav-box h3.bg-title-f-nav6 {
			background-image: url(../images/common/bg-title-f-nav6.png);
		}

			div.f-nav-box ul {
			font-size: 1.3rem;
			color: #fff;
		}
			div.f-nav-box ul li {
				margin-bottom: .5em;
			}
			div.f-nav-box ul li:last-child {
				margin-bottom: 0;
			}
			div.f-nav-box ul li a {
				text-decoration: none;
				color: #fff;
			}
				div.f-nav-box ul li a:hover {
					text-decoration: underline;
				}
				
				
div#copyright {
	background-color: #064936;
	padding: 1em 0;
}				
				
	div#copy-wrap {
		width: 96%;
		max-width: 1024px;
		margin: 0 auto;
	}			
		div#copy-wrap p {
			color: #fff;
			font-size: 1.3rem;
			margin-bottom: 0;
			float:left;
		}		
			div#copy-wrap ul {
				float: right;
			}	
				div#copy-wrap ul li {
					font-size: 1.3rem;
					display: inline;
					padding: 0 1em;
					border-right: solid 1px #fff;
				}
				
					div#copy-wrap ul li:last-child {
						padding-right: 0;
						border-right: none;
					}
						div#copy-wrap ul li a {
							color: #fff;
							text-decoration: none;
						}
						
						div#copy-wrap ul li a:hover {
							text-decoration: underline;
						}
						
/* コンテンツレイアウト */

#wrapper {
	width: 96%;
	max-width: 1024px;
	margin: 0 auto 40px;
}

#wrapper #content-area {
	width: 71%;
	float:right;
}

#wrapper #side-area {
	width: 24%;
	max-width: 241px;
	float:left;
}
				
				
/* -----------------------------------------------------------------------------------------
                                         ページトップ
----------------------------------------------------------------------------------------- */
#page-top {
	position: fixed;
	bottom: 10%;
	right: 5%;
	z-index: 999;
}
	#page-top a {
		background-color: #F0EBBA;
		width: 60px;
		height: 55px;
		text-align: center;
		display: block;
		border-radius: 50%;
		-moz-border-radius: 50%;
		-webkit-border-radius: 50%;
		color: #fff;
		font-size: 3.0rem;
		padding-top: 5px;
		border: solid 2px #FFF;
		-webkit-transition: all 0.5s ease 0s;
		-o-transition: all 0.5s ease 0s;
		transition: all 0.5s ease 0s;
	}
		#page-top a:hover {
		background-color: #8DC221;
		opacity: 1;
		}


/* -----------------------------------------------------------------------------------------
                                         パンくず
----------------------------------------------------------------------------------------- */

#pankuzu {
	width: 100%;
	background-color: #6C5321;
	margin-bottom: 80px;
	padding: 20px 0;
}

#pankuzu ul {
	width: 96%;
	max-width: 1024px;
	margin: 0 auto;
}

#pankuzu ul li {
        /* liを横並び＆ブレットを消す */
        display: inline;
        list-style-type: none;
		font-size: 1.2rem;
		line-height: 2;
		color: #fff;
}

#pankuzu ul li:before {
        /* liの前に記号追加 */
        content: " / ";
		padding-left: 0.5em;
		padding-right: 0.5em;
}

#pankuzu ul li:first-child:before {
        /* 最初のliだけcontentを消す */
        content:"";
		padding-left: 0;
		padding-right: 0;
}


#pankuzu ul li a {
	color: #fff;
	-webkit-transition: all 0.5s ease 0s;
	-o-transition: all 0.5s ease 0s;
	transition: all 0.5s ease 0s;
}
#pankuzu ul li a:hover {
	color: #8DC221;
}

#pankuzu ul li:hover:before {
	color: #fff;
}


/* -----------------------------------------------------------------------------------------
                                          ページャー設定
----------------------------------------------------------------------------------------- */

.pagination {
clear:both;
padding:20px 0;
position:relative;
font-size:11px;
line-height:13px;
}
 
.pagination span, .pagination a {
display:block;
float:left;
margin: 2px 2px 2px 0;
padding:6px 9px 5px 9px;
text-decoration:none;
width:auto;
color:#8DC221;
background: #F0EBBA;
}
 
.pagination a:hover{
	color: #fff;
	background-color: #8DC221;
}
 
.pagination .current{
padding:6px 9px 5px 9px;
background: #8DC221;
color:#fff;
}











/* -- jubilo bannerの記述 */
div.jubilo-banner {
	padding: 10px;
}

div.jubilo-banner ul {
	float: none;
	text-align: center;
	background-color: rgb(139, 172, 217);
}
	
div.jubilo-banner ul li {
	display: inline-block;
	margin-right: 10px;
	margin-top: 10px;
}	
div.jubilo-banner ul li:last-child {
	margin-right: 0;
}

	
			

@media screen and (max-width: 768px){		/* -------------------------------------------------  768px以下用（iPad）の記述 */

#header-wrapper {
	position: relative;
	/*z-index: 999:*/
	z-index: 999;
}

footer {
		max-width: inherit;
		background-position: center top;
	}

div.f-wrap {
	border-bottom: none;
	margin-bottom: 0;
}
	div.f-left {
		float: none;
		width: 100%;
		text-align: center;
		margin-bottom: 20px;
	}
		div.f-left h2 {
			margin: 0 auto 10px;
		}
				
		div.f-left p {
			text-align: center;
		}
		
div.f-wrap ul {
	float: none;
	text-align: center;
}
	
	div.f-wrap ul li {
		display: inline-block;
		margin-right: 10px;
	}	
		div.f-wrap ul li:last-child {
			margin-right: 0;
		}
		
/*
div.footer-nav-area {
	display: none;
}		
*/

/* footer mobile*/
/*
div.footer-nav-area>div.f-nav-box>ul {
	display: none;
}

div.f-nav-box {
	clear: both;
}
div.footer-nav-area {
	display: inline;
}
*/
div.footer-nav-area>div.f-nav-box>ul {
	display: none;
}

div.footer-nav-area {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	height: 200px;
	padding: 10%;
}
div.f-nav-box {
	clear: both;
	width: 38%;
}
div.f-nav-box-mobile {
	margin-left: 11%;
	margin-right: 0 !important;
}

/* フリーダイヤル */

.bg-stripe2 h2 {
	width: 100%;
}

.bg-stripe2 ul.free-dial {
	font-size: 0;
	text-align: center;
	width: 50%;
	margin: 0 auto;
}


	.bg-stripe2 ul.free-dial li {
		display: list-item;
		margin-bottom: 10px;
		border-right: none;
		padding-right: 0;
	}
	

	
	.bg-stripe2 ul.free-dial li p {
		font-size: 3.0rem;
	}
	
	.bg-stripe2 ul.free-dial li p:before {
		content: "";
		display: inline-block;
		background: url(../images/common/icon-free-dial.png) no-repeat;
		background-size: contain;
		width: 33px;
		height: 18px;
	}


.bg-stripe2 ul.liner {
	font-size: 1.3rem;
}

div.icon-free {
	position: absolute;
	top: 60px;
	left: 20px;
}

div.icon-char {
	position: absolute;
	top: 60px;
	right: 20px;
	text-align: right;
}


/* 対応エリア */

div.left-area-box {
	width: 100%;
	max-width: inherit;
	float: none;
	margin-bottom: 20px;
}

div.left-area-box:after {
    content:"";
    display:table;
    clear:both;
}

	div.left-area-box img {
		float: left;
		width: 45%;
		margin-right: 2%;
		margin-bottom: 0;
	}

		div.left-area-box ul {
			font-size: small;
		}

div.right-area-box {
	width: 100%;
	max-width: inherit;
	float: none;
}

	div.right-area-box dl {
		font-size: 1.4rem;
		margin-bottom: 20px;
	}
		div.right-area-box dl dt {
			font-weight: bold;
			padding: 4px 0;
			border-top: solid 1px #4d4d4d;
			border-bottom: solid 1px #4d4d4d;
			margin-bottom: 1em;
		}
		
		div.right-area-box dl dd {
			margin-bottom: 2em;
		}
		
			div.right-area-box dl dd:last-of-type {
				margin-bottom: 0;
			}
			
			div.right-area-box p.toiawase {
				font-size: 2.4rem;
				font-weight: bold;
				color: #F7931E;
			}
			
			div.right-area-box p.toiawase span {
				font-size: 1.6rem;
				font-weight: normal;
				}
			
			div.right-area-box p.toiawase span a {
				display: inline-block;
				padding: .5em 1em;
				text-decoration: none;
				color: #4d4d4d;
				background-color: #fff;
				border: solid 1px #b3b3b3;
				-webkit-transition: all 0.5s ease 0s;
				-o-transition: all 0.5s ease 0s;
				transition: all 0.5s ease 0s;
				}
			
				div.right-area-box p.toiawase span a i {
					color: #BDCCD4;
				}
				
				div.right-area-box p.toiawase span a:hover {
					background-color: #f8f8f8;
				}

/* コンテンツレイアウト */

#wrapper {
	width: 96%;
	max-width: inherit;
}

#wrapper #content-area {
	width: 100%;
	float: none;
}

#wrapper #side-area {
	width: 100%;
	max-width: inherit;
	float: none;
}




	
		

}




@media screen and (max-width: 480px){		/* -------------------------------------------------  480px以下用（iPhone）の記述 */

section.bg-stripe {
	padding: 20px 0;
}

header h1 a {
	float: none;
	width: 271px;
	height: 59px;
	margin: 0 auto;
}

header #h-right {
	display: none;
}

/* フリーダイヤル */

.bg-stripe2 h2 {
	font-size: 1.4rem;
}

.bg-stripe2 ul.free-dial {
	font-size: 0;
	text-align: center;
	width: 78%;
	float: right;
}
	.bg-stripe2 ul.free-dial li {
		display: inline;
		margin-right: 0;
		padding-right: 0;
		border-right: none;
	}
			
		
	.bg-stripe2 ul.free-dial li p {
		font-size: 2.4rem;
		font-weight: bold;
		margin-bottom: 10px;
	}
	.bg-stripe2 ul.free-dial li p:before {
			width: 27px;
			height: 15px;
		}

.bg-stripe2 ul.liner {
	clear: both;
	text-align: center;
	font-size: 1.4rem;
}
 .bg-stripe2 ul.liner li {
	 display: list-item;
	 margin-right: 0;
	 margin-bottom: .5em;
 }
 
 .bg-stripe2 ul.liner li:last-child {
	 margin-bottom: 0;
 }
 
 
 .bg-stripe2 ul.liner li span {
	 font-size: 1.6rem;
 }
 	.bg-stripe2 ul.liner li span a {
	 	padding: 10px 1em;
 	}

section.bg-stripe2 article {
	position: inherit;
}

div.icon-free {
	width: 20%;
	float: left;
	position: inherit;
	top: inherit;
	left: inherit;
}

	div.icon-free img {
		width: 100%;
	}
	
div.icon-char {
	display: none;
}


/* 対応エリア */

div.left-area-box {
	width: 100%;
	max-width: inherit;
	float: none;
	margin-bottom: 20px;
}

div.left-area-box:after {
    content:"";
    display:table;
    clear:both;
}

	div.left-area-box img {
		display: block;
		float: none;
		width: 100%;
		margin: 0 auto 10px;;
	}
			div.right-area-box p.toiawase {
				font-size: 2.2rem;
				text-align: center;
				line-height: 2;
			}

/* footer バナー */
	div.f-wrap ul li {
		display: block;
		margin: 0 auto 10px;
	}	
		div.f-wrap ul li:last-child {
			margin: 0 auto;
		}

div#copy-wrap p {
	float:none;
	text-align: center;
	margin-bottom: .25em;
}
div#copy-wrap ul {
	float: none;
	text-align: center;
}


}