@charset "utf-8";

/* リセット */  
html, body, div, h1, h2, h3, h4, h5, h6, p, a, img, ul, ol, dl, dt, dd, table, tr, th, td, caption
{margin: 0;padding: 0;border: 0;
font-size: normal; font-size: 100%; font-weight: normal;}
a { text-decoration : none}
ul, ol { list-style : none}
img { vertical-align : middle}

/* 余白 */
*.mb16{margin-bottom: 16px}
*.mb20{margin-bottom: 20px}
*.mb30{margin-bottom: 30px}
*.mb40{margin-bottom: 40px}
*.mb50{margin-bottom: 50px}
*.mb60{margin-bottom: 60px}
*.mb80{margin-bottom: 80px}
*.mt32{margin-top: 32px}

/* タイポグラフィー */
body{
	color: #666666;
	font-size:16px;
	line-height:1.5;
	font-family: sans-serif;}
a {	color: #2e3192;}
a:hover{ color: #29abe2;}

/* フルードイメージ（Fluid Image） */
img{ max-width : 100%}

/* センター合わせ */
.center {text-align: center;}

.cts {
	width:90%;
	margin:0 auto 16px auto;}

/* header */
header {
	margin: 20px auto 20px auto;
	text-align: center;}
.title {
	font-size: 12px;
	margin-bottom: 8px}
.tel a {
	font-weight: bold;
	font-size: 32px;}
.eigyou {
	font-size: 12px;
	line-height: 6px;
	margin-bottom: 16px;
	color: #2e3192;}
.hd-r img {
	vertical-align: bottom;}
.hd-r a:hover img
	{filter:alpha(opacity=80);opacity:0.8;}

/* topImage */
.top {
	background: #fbf8f8;
	border-top: 4px solid #8cc83c;
	border-bottom: 4px solid #8cc83c;
}
.top div {
	width: 90%;
	margin: 0 auto;}
.nayami {
	padding: 32px 0 50px 0;
	background: url(img/bg-koushi-white.png);
	text-align:center;}
.plan {	
	position: relative;
	background: url(img/bg-koushi-green.png);
	padding: 0 5% 18px 5%;
	margin-bottom: 60px}
.top-40 {
	position: relative;
	top:-40px;}
.midashi-LL {
	font-size: 32px;
	color: #000;
	font-weight: bold;
	position: relative}
.midashi-LL .txt-LL {
	font-size: 32px;
	vertical-align: baseline;
	line-height: 32px}
.midashi-LL .txt-red {
	color: red}
.midashi-LL img{
	display: inline-block;
	position: relative;
	top:-8px;}

.menu {
	margin: 20px 0 0 0;
	background: #fff;
	padding: 2em 1em 12px 1em;
	font-size: 14px;
	border: 8px solid #e6e6e6;
	position: relative;
	-moz-box-shadow: 1px 1px 2px rgba(0,0,0,.3);
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.3);
    box-shadow: 1px 1px 2px rgba(0,0,0,.3);}
.menu h3 {
	font-size: 18px;
	font-weight: bold;
	color: #009650;
	padding: .3em 0;
	border-top: 4px solid #8cc83c;}
.menu img, .menu p {
	margin-bottom: 24px;}

.point {
	background: #fbb03b;
	position: relative;
	padding: 16px 5%;
	margin-bottom: 16px;}
.pt-1 {
	background: url(img/point.png) no-repeat 0 4px;
	background-size:280px auto;
	position: absolute;
	top: -33px;
	height: 60px;
	width: 90%;}
.pt-2 {
	background: url(img/point.png) no-repeat 0 -78px;
	background-size:280px auto;
	position: absolute;
	top: -33px;
	height: 60px;
	width: 90%;}
.pt-3 {
	background: url(img/point.png) no-repeat 0 -160px;
	background-size:280px auto;
	position: absolute;
	top: -33px;
	height: 60px;
	width: 90%;}
.point p {
	font-size:32px;
	color: #fff;
	font-weight: bold;}
.txt-pt-LL {
	color: #2e3192;
	font-size: 40px;}

.lisk {
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 8px;}

.kouka {
	background: url(img/bg-koushi.png);
	padding: 16px 5% 24px 5%;}
.kouka h3 {
	font-size: 32px;
	font-weight: bold;
	line-height: 1.2em;
	color: #f7931e;
	margin-bottom: 16px;}
.care {
	padding: 8px 0 ;
	text-align: center;
	font-size: 36px;
	color: #2e3192;
	font-weight: bold;}
.care-line {
		border-bottom: 6px dotted #fcee21;}
.txt-care {
	font-size:46px;
	color: #f7931e;}

.saports {
	position: relative;
	background: url(img/bg-koushi-green.png);
	padding: 0 5% 18px 5%;
	margin-bottom: 60px;
	overflow: hidden;}
.saport {
	font-size: 34px;
	letter-spacing: .2em;
	color: #fff;
	font-weight: bold;
	margin: 8px 0;
	padding-top: 32px;}
.saport-box {
	padding: 16px;
	background: #fff;
	margin-bottom: 28px;
	box-shadow: 2px 2px 4px #398567;
	-moz-box-shadow: 2px 2px 4px #398567;　/* Firefox用 */  
	-webkit-box-shadow: 2px 2px 4px #398567;　/* Safari,Google Chrome用 */}
.saport-box dl {
	margin-bottom: 16px;}
.saport-box dt {
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 8px;}
.saport-box dd {
	font-size: 14px;
	border-left: 4px solid #999999;
	padding-left: 12px;}
.saport-box img {
	margin-bottom: 16px;
	border: solid 1px #999999;
}
.saport-box p {
	font-size: 14px;}

.midashi-X {
	background: #003ca0;
	padding: 24px 5%;
	font-size: 28px;
	color: #fff;
	font-weight: bold;
	vertical-align: bottom;
	margin-bottom: 42px;}

.nagare {
	margin-bottom: 54px;
}
.nagarebox-1 {
	background: #8cc83c;
	padding: .5em 1em 1em 1em;
	margin-bottom: 20px;
	border-radius: 10px;			/* CSS3草案 */  
    -webkit-border-radius: 10px;	/* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;		/* Firefox用 */ 
	position: relative;
	display: block;
	color: #F6F6F6;}

.nagarebox {
	background: #8cc83c;
	padding: .5em 1em 1em 1em;
	margin-bottom: 20px;
	border-radius: 10px;			/* CSS3草案 */  
    -webkit-border-radius: 10px;	/* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;		/* Firefox用 */ 
	position: relative;
	display: block;
	color: #F6F6F6;
	z-index: 0;}
.nagarebox:before {
	content: "";
	position: absolute;
	top: -20px; left: 50%;
	margin-left: -100px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 30px 100px 0 100px;
	border-color: #fbb03b transparent transparent transparent;
	z-index: 10;}

.nagarebox-0 {
	padding-top: 8px;
	margin-bottom: 12px;
	border-radius: 10px;			/* CSS3草案 */  
    -webkit-border-radius: 10px;	/* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;		/* Firefox用 */ 
	position: relative;
	display: block;
	text-align: center;
	color: #8cc83c;
	font-size: 24px;
	font-weight: bold;
	z-index: 0;}
.nagarebox-0:before {
	content: "";
	position: absolute;
	top: -20px; left: 50%;
	margin-left: -100px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 30px 100px 0 100px;
	border-color: #fbb03b transparent transparent transparent;
	z-index: 10;}

.step {
	color: #fff;
	font-size: 16px;}
.step b {
	font-size: 24px;}
.steptitle {
	font-size: 32px;
	font-weight: bold;
	color: #2e3192;}
.stepkikan {
	text-align: center;
	color: #2e3192;
	font-weight: bold;
	width: 10em;
	background: #fff;
	border-radius: 1em;			/* CSS3草案 */
    -webkit-border-radius: 1em;	/* Safari,Google Chrome用 */  
    -moz-border-radius: 1em;		/* Firefox用 */  }
.steptext {
	color: #fff;
	border-top: 1px solid ;
	margin-top: 18px;
	padding-top: 14px;}

.gyousyu {
	width: 90%;
	margin: 0 auto 32px auto;}

.gyousyu li {
	display: inline-block;
	color:#ffffff;
	font-size: 18px;
	padding: .3em .8em ;
	margin: 6px;
	border: 1px solid #cccccc;
	background: #29abe2; /* Old browsers */
background: -moz-linear-gradient(top,  #29abe2 0%, #0071bc 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#29abe2), color-stop(100%,#0071bc)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #29abe2 0%,#0071bc 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #29abe2 0%,#0071bc 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #29abe2 0%,#0071bc 100%); /* IE10+ */
background: linear-gradient(to bottom,  #29abe2 0%,#0071bc 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29abe2', endColorstr='#0071bc',GradientType=0 ); /* IE6-9 */
border-radius: 6px;        /* 角R CSS3草案 */  
    -webkit-border-radius: 6px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 6px;   /* Firefox用 */  }

.QandA {
	width: 90%;
	margin: 0 auto 60px auto;}
.QandA dt {
	color:#2e3192;
	font-weight: bold;
	margin-bottom: 12px;
	background: url(img/Q.png) no-repeat 0 70%;
	min-height: 32px;
	padding: 16px 0 0 32px;
	border-top: 1px dotted #2e3192;}
.QandA dd {
	margin-bottom: 32px;
	padding-left: 32px;
	background: url(img/A.png) no-repeat 8px 2px;}

.formBox {
	width: 90%;
	margin: 0 auto 100px auto;
	font-size: 16px;}
.formBox input {
	width: 70%;
	min-height: 2em;
	margin: 0 8px 0 0}
.formBox textarea {
	width: 100%;} 
.formBox dd {
	margin-bottom: 10px;}
.formBox .hissu {
	color: red;
	font-size: 8px;}
.formBox button {
	margin-right: 16px;}


footer {
	border-top: 14px solid #8cc83c;
	background: #009650;
	padding: 24px 5% 32px 5%;
	color: #fff;
	font-size: 12px;
	text-align: left;}
footer a:hover img {filter:alpha(opacity=80);opacity:0.8;}
footer table {
	margin-bottom: 24px;}
footer caption {
	text-align: left;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 8px;}
footer tr {
	vertical-align: top;}
footer th {
	font-weight: bold;
	width: 7em;}
.c {font-size: 10px;}



@media screen and (min-width : 768px){
/* 768px〜979のCSSを記述*/ 

.saport-box {
	min-height: 320px;}
.float-l {
	float: left;
	margin: 0 1em 1em 0;}
.top div img {
	position: relative;
	left:0;
	max-width: 100%}
.formBox {
	width: 700px;}
.formBox dt, .formBox dd {
	display: inline-block;}
.formBox dt {
	width: 20%;}
.formBox dd {
	width: 78%;
	vertical-align: top;}


.menu {
	overflow:hidden;
	padding: 2em 32px 12px 32px;
	text-align: center;}
.menu img {
	width: 94%;
	height: auto;}
.menutext {
	text-align: left;
	width: 44%;
	float: left;
	margin: 0 3%;}

.step{
	float: left;
	margin-right: 18px;
	margin-top: 10px;}
.steptitle{
	float: left;}
.stepkikan{
	float: right;
	margin-top: 14px;}
.steptext{
	clear: both;}

}



@media screen and (min-width : 980px){
/* 980px〜のCSSを記述*/ 

.wrapper {
	width: 900px;
	margin: 0 auto;}
.plan {
	padding: 0;}
.plan h2 {
	width: 980px;
	margin: 0 auto 40px auto ;}
.menu {
	margin: 0 auto 80px auto; 
	padding: 30px 15px;
	width: 934px}
header {
	overflow: hidden;
	margin: 20px auto;}
.hd-l { 
	text-align: left;
	float: left;}
.hd-r {
	float: right;}
.tel-box {
	display: inline-block;
	text-align: left;}

.saport {
	text-align: center;}
.saport-box {
	width: 25%;
	margin-left: 3%;
	float: left;}
.saport-box p {
	clear: both;}
.midashi-X {
	text-align: center;}




}