/*全体
--------------------------------------------------------------------------*/
body {
	margin: 0;
	padding: 0;
	COLOR: #111;
	FONT-SIZE:17px;
    font-family:'Inter', 'Noto Sans JP', sans-serif;
	LINE-HEIGHT: 180%;
	text-align: center;
	font-weight: 300;
	background: #fff;
}

/*paddingとborderをwidthに含める*/
* {	
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
  }

#con{
    width:100%;
	height:auto;
	margin:0px auto;
	padding:0;
	text-align: center;
}

/*page-top用*/
.clearfix:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
	font-size: 0;
	line-height:0;
}

img{
	border:0;
}
@media only screen and (max-width: 479px) {
img{
	border:0;
	max-width: 100%;
}
}

a:link,a:visited{
	outline:0;
	color:#008e4a;
}

a:hover{
	outline:0;
	color: #111;
}

a:hover img {
  opacity: 0.8;
  filter: alpha(opacity=80);
  -ms-filter: "alpha(opacity=80)";
}

br.kono{
display:inherit;
}

br.sp,br.spt,br.spt2,.nsp{
	display:inherit;
}
br.sm,br.smt,br.smm,br.smm2,br.spm,.nst,.nss,br.smm3{
	display:none;
}
@media only screen and (max-width: 1440px) {
br.kono{
display:none;
}
}
@media only screen and (max-width: 1080px) {
br.sp,br.spm,br.smm,.smm,br.smm2,.nsp,.nss,.nsm,br.smm3{
	display:none;
}
br.spt,br.sm,br.smt,.nst{
	display:inherit;
}
}
@media only screen and (max-width: 640px) {
br.spt,br.smt,br.smm2,.nsp,.nst,.nsm,br.smm3{
	display:none;
}
br.spm,br.smm,.nss{
	display:inherit;
}
}
@media only screen and (max-width: 480px) {
br.spt,br.smt,.nsp,.nst,.nsm,br.spt2,br.smm3{
	display:none;
}
br.spm,br.smm,br.smm2,.nss{
	display:inherit;
}
}
@media only screen and (max-width: 414px) {
br.spt,br.smt,.nsp,.nst,.nsm,br.spt2{
	display:none;
}
br.spm,br.smm,br.smm2,.nss,br.smm3{
	display:inherit;
}
}

/*ヘッダ
--------------------------------------------------------------------------*/
img.back-top{
top:0;
right: 0;
position: fixed;
z-index: 1;
}
@media only screen and (max-width: 1440px) {
img.back-top{
top:0;
right: 0;
position: fixed;
z-index: 1;
max-width: 20%;
}
}
@media only screen and (max-width: 640px) {
img.back-top{
top:0;
right: 0;
position: fixed;
z-index: 1;
max-width: 25%;
}
}

header{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 0;
background: #fff;
}
/*========= スクロール途中でヘッダーが表示＆非表示するためのCSS ===============*/
#header{
    /*fixedで上部固定*/
	position: sticky;
	height: auto;
	width:100%;
    z-index: 1;/*最前面へ*/
	background: #fff;
	top:0;
}
/*　上に上がる動き　*/
#header.UpMove{
	animation: UpAnime 0.5s forwards;
}
@keyframes UpAnime{
  from {
    opacity: 1;
	transform: translateY(0);
  }
  to {
    opacity: 0;
	transform: translateY(-100px);
  }
}
/*　下に下がる動き　*/
#header.DownMove{
	animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
  from {
  	opacity: 0;
	transform: translateY(-100px);
  }
  to {
  	opacity: 1;
	transform: translateY(0);
  }
}

#header-title{
clear: both;
float: left;
width: 50%;
height: auto;
margin: 0;
padding: 25px 3% 0 3%;
text-align: center;
background: #fff;
}
#header-title img{
display: inline;
max-width: 60%;
margin: 0 1% 0 0;
vertical-align:bottom;
}
#header-title p{
text-align: left;
display: inline-block;
font-size: 18px;
line-height: 150%;
margin: 0;
}
@media only screen and (max-width: 1600px) {
#header-title{
clear: both;
float: left;
width: 40%;
height: auto;
margin: 0;
padding: 15px 1% 0 1%;
text-align: center;
}
#header-title img{
display: inline;
max-width: 65%;
margin: 0 1% 0 0;
vertical-align:bottom;
}
#header-title p{
text-align: left;
display: inline-block;
font-size: 16px;
line-height: 150%;
margin: 0;
}
}
@media only screen and (max-width: 1440px) {
#header-title img{
display: inline;
max-width: 70%;
margin: 0;
vertical-align:bottom;
}
}
@media only screen and (max-width: 1280px) {
#header-title img{
display: inline;
max-width: 80%;
margin: 0;
vertical-align:bottom;
}
}
@media only screen and (max-width: 1080px) {
#header-title{
clear: both;
float: left;
width: 35%;
height: auto;
margin: 0;
padding: 15px 1% 0 1%;
text-align: center;
}
#header-title img{
display: inline;
max-width: 100%;
margin: 0;
vertical-align:bottom;
}
#header-title p{
text-align: left;
display: inline-block;
font-size: 13px;
line-height: 150%;
margin: 0;
}
}
@media only screen and (max-width: 835px) {
#header-title{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 2px 1% 5px 3%;
text-align:left;
}
#header-title img{
display: inline;
max-width: 45%;
margin: 0;
vertical-align:bottom;
}
}
@media only screen and (max-width: 640px) {
#header-title img{
display:block;
max-width: 50%;
margin: 0;
vertical-align:bottom;
}
#header-title p{
text-align: left;
display: inline-block;
font-size: 13px;
line-height: 150%;
margin: 0;
text-indent: 4em;
}
}
@media only screen and (max-width: 480px) {
#header-title p{
text-align: left;
display: inline-block;
font-size: 13px;
line-height: 150%;
margin: 0;
text-indent: 3em;
}
}
@media only screen and (max-width: 414px) {
#header-title p{
text-align: left;
display: inline-block;
font-size: 13px;
line-height: 150%;
margin: 0;
text-indent: 0em;
}
}

#header-yoyaku{
float: right;
width: 50%;
height: auto;
margin: 0;
padding:20px 3% 15px;
background: #ffdee4;
text-align: left;
}
#header-yoyaku p{
text-align: left;
line-height: 120%;
margin: 10px 0 0;
font-size: 20px;
}
#header-yoyaku p span.bn{
margin: 0 0 0 1em;
}
#header-yoyaku p .f30{
font-size: 30px;
}
@media only screen and (max-width: 1600px) {
#header-yoyaku{
float: right;
width: 60%;
height: auto;
margin: 0;
padding:20px 3% 15px;
background: #ffdee4;
text-align: left;
}
#header-yoyaku p{
text-align: left;
line-height: 120%;
margin: 10px 0 0;
font-size: 18px;
}
#header-yoyaku p .f30{
font-size: 25px;
}
#header-yoyaku img{
max-width: 60%;
}
}
@media only screen and (max-width: 1280px) {
#header-yoyaku{
float: right;
width: 60%;
height: auto;
margin: 0;
padding:10px 3% 15px;
background: #ffdee4;
text-align: left;
}
#header-yoyaku p{
text-align: left;
line-height: 120%;
margin: 10px 0 0;
font-size: 16px;
}
#header-yoyaku img{
max-width: 70%;
}
}
@media only screen and (max-width: 1080px) {
#header-yoyaku{
float: right;
width: 65%;
height: auto;
margin: 0;
padding:10px 3% 15px;
background: #ffdee4;
text-align: left;
}
#header-yoyaku p{
text-align: left;
line-height: 120%;
margin: 10px 0 0;
font-size: 14px;
}
#header-yoyaku p .f30{
font-size: 20px;
}
}
@media only screen and (max-width: 835px) {
#header-yoyaku{
clear: both;
float: right;
width: 100%;
height: auto;
margin: 0;
padding:10px 3% 15px;
background: #ffdee4;
text-align: left;
}
#header-yoyaku img{
max-width: 60%;
}
}
@media only screen and (max-width: 480px) {
#header-yoyaku img{
max-width: 65%;
}
}
@media only screen and (max-width: 414px) {
#header-yoyaku p{
text-align: left;
line-height: 120%;
margin: 10px 0 0;
font-size: 13px;
}
#header-yoyaku p .f30{
font-size: 18px;
}
}

/*メニュー
--------------------------------------------------------------------------*/
menu{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding:30px 10% 30px 3%;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left top/14px 2px,linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#f5eece;
}
@media only screen and (max-width: 1280px) {
menu{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding:20px 0% 20px 3%;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left top/14px 2px,linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#f5eece;
}
}
@media only screen and (max-width: 1080px) {
menu{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding:0;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left top/14px 2px,linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#f5eece;
}
}

menu ul{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 0;
}
menu li{
float: left;
list-style-type: none;
font-size: 20px;
line-height: 100%;
margin: 0 4% 0 0;
padding: 0;
}
menu li a:link,menu li a:visited{
text-decoration: none;
color: #111;
}
menu li a:hover{
text-decoration: underline;
}
@media only screen and (max-width: 1280px) {
menu li{
float: left;
list-style-type: none;
font-size: 18px;
line-height: 100%;
margin: 0 3% 0 0;
padding: 0;
}
}
@media only screen and (max-width: 1080px) {
menu ul{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 0 20% 0 0;
}
menu li{
float: left;
display: block;
width: 25%;
list-style-type: none;
font-size: 16px;
line-height: 100%;
margin: 0;
padding: 0;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
}
menu li.bno{
border-bottom: none;
}
menu li a:link,menu li a:visited{
display: block;
padding: 15px 0;
text-decoration: none;
color: #111;
}
menu li a:hover{
text-decoration: underline;
}
}
@media only screen and (max-width: 835px) {
menu ul{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 0;
}
menu li{
float: left;
display: block;
width: 25%;
list-style-type: none;
font-size: 15px;
line-height: 100%;
margin: 0;
padding: 0;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
}
}
@media only screen and (max-width: 640px) {
menu li{
float: left;
display: block;
width: 25%;
list-style-type: none;
font-size: 14px;
line-height: 100%;
margin: 0;
padding: 0;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
}
}
@media only screen and (max-width: 480px) {
menu li{
float: left;
display: block;
width: 25%;
list-style-type: none;
font-size: 13px;
line-height: 100%;
margin: 0;
padding: 0;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
}
}

/*main
--------------------------------------------------------------------------*/
#photo-top{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 0;
position: relative;
}
#photo-top img{
max-width: 50%;
}
#photo-top img.photo-text{
max-width: 40%;
position: absolute;
top:15%;
left:3%;
}
@media only screen and (max-width: 835px) {
#photo-top img.photo-text{
max-width: 50%;
position: absolute;
top:5%;
left:1%;
}
}
@media only screen and (max-width: 640px) {
#photo-top img.photo-text{
max-width: 58%;
position: absolute;
top:1%;
left:1%;
}
}
@media only screen and (max-width: 480px) {
#photo-top img{
max-width: 100%;
}
#photo-top img.photo-text{
max-width: 90%;
position: absolute;
top:5%;
left:5%;
}
}
@media only screen and (max-width: 414px) {
#photo-top img.photo-text{
max-width: 100%;
position: absolute;
top:5%;
left:0%;
}
}

#photo{
clear: both;
float: left;
width: 100%;
height: auto;
margin: -50px 0 0;
padding: 0;
}
@media only screen and (max-width: 835px) {
#photo{
clear: both;
float: left;
width: 100%;
height: auto;
margin: -20px 0 0;
padding: 0;
}
}
@media only screen and (max-width: 640px) {
#photo{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0px 0 0;
padding: 0;
}
}
@media only screen and (max-width: 480px) {
#photo{
clear: both;
float: left;
width: 100%;
height: auto;
margin: -40px 0 0;
padding: 0;
}
}

#photo ul{
margin: 0;
padding: 0;
}
#photo ul li{
margin: 0 3%;
}
/*スライダーのためのcss*/
#photo .slider2 img {
    width:94%;/*スライダー内の画像を横幅100%に*/
    height:auto;
	border: 10px solid #fff;
	border-radius: 7px;
}
/*slickのJSで書かれるタグ内、スライド左右の余白調整*/
#photo .slider2 .slick-slide {
    margin:0;/*スライド左右の余白調整*/
}
#photo .slider2 img{
max-width: 100%;
}
@media only screen and (max-width: 1080px) {
#photo .slider2 img {
    width:94%;/*スライダー内の画像を横幅100%に*/
    height:auto;
	border: 7px solid #fff;
	border-radius: 7px;
}
}

main{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 0;
}

main h1{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 100px;
padding: 0;
text-align: center;
font-weight: 900;
font-size: 50px;
line-height: 100%;
}
main h1 img{
vertical-align: text-bottom;
margin: 0 1% 0 0;
mix-blend-mode: Multiply;
}
@media only screen and (max-width: 1280px) {
main h1{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 90px;
padding: 0;
text-align: center;
font-weight: 900;
font-size: 45px;
line-height: 100%;
}
main h1 img{
vertical-align: text-bottom;
margin: 0 1% 0 0;
mix-blend-mode: Multiply;
max-width: 10%;
}
}
@media only screen and (max-width: 1080px) {
main h1{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 60px;
padding: 0;
text-align: center;
font-weight: 900;
font-size: 40px;
line-height: 100%;
}
main h1 img{
vertical-align: text-bottom;
margin: 0 2% 0 0;
mix-blend-mode: Multiply;
max-width: 12%;
}
}
@media only screen and (max-width: 835px) {
main h1{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 50px;
padding: 0;
text-align: center;
font-weight: 900;
font-size: 35px;
line-height: 100%;
}
main h1 img{
vertical-align: text-bottom;
margin: 0 2% 0 0;
mix-blend-mode: Multiply;
max-width: 10%;
}
}
@media only screen and (max-width: 640px) {
main h1 img{
vertical-align: text-bottom;
margin: 0 2% 0 0;
mix-blend-mode: Multiply;
max-width: 18%;
}
}
@media only screen and (max-width: 480px) {
main h1{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 40px;
padding: 0;
text-align: center;
font-weight: 900;
font-size: 30px;
line-height: 100%;
}
main h1 img{
vertical-align: text-bottom;
margin: 0 2% 0 0;
mix-blend-mode: Multiply;
max-width: 11%;
}
}

.main-box{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 100px;
padding: 0 8%;
}
@media only screen and (max-width: 1280px) {
.main-box{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 90px;
padding: 0 5%;
}
}
@media only screen and (max-width: 1080px) {
.main-box{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 70px;
padding: 0 5%;
}
}
@media only screen and (max-width: 640px) {
.main-box{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 50px;
padding: 0 5%;
}
}

.main-box h3,.main-box h3.hari-t,.main-box h3.jihi-t{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0 0 30px;
text-align: center;
font-weight: 900;
font-size: 40px;
line-height: 100%;
background: url(image/h3-hoken.png) no-repeat center bottom;
}
.main-box h3.jihi-t{
background: url(image/h3-jihi.png) no-repeat center bottom;
}
@media only screen and (max-width: 1280px) {
.main-box h3,.main-box h3.hari-t,.main-box h3.jihi-t{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0 0 30px;
text-align: center;
font-weight: 900;
font-size: 35px;
line-height: 100%;
background: url(image/h3-hoken.png) no-repeat center bottom;
}
.main-box h3.jihi-t{
background: url(image/h3-jihi.png) no-repeat center bottom;
}
}
@media only screen and (max-width: 640px) {
.main-box h3,.main-box h3.hari-t,.main-box h3.jihi-t{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0 0 30px;
text-align: center;
font-weight: 900;
font-size: 30px;
line-height: 100%;
background: url(image/h3-hoken.png) no-repeat center bottom;
}
.main-box h3.jihi-t{
background: url(image/h3-jihi.png) no-repeat center bottom;
}
}

.main-left{
clear: both;
float: left;
width: 40%;
height: auto;
margin: 0;
padding: 0 3% 0 0;
}
.main-left img{
max-width: 100%;
border: 10px solid  #fff;
border-radius: 20px;
}
.main-left img.p2{
max-width: 48%;
margin: 15px 1% 0;
border: 10px solid  #fff;
border-radius: 20px;
}
@media only screen and (max-width: 1280px) {
.main-left img.p2{
max-width: 48%;
margin: 15px 1% 0;
border: 7px solid  #fff;
border-radius: 20px;
}
}
@media only screen and (max-width: 835px) {
.main-left{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0;
}
.main-left img{
float: left;
max-width:59%;
border: 7px solid  #fff;
border-radius: 20px;
margin: 0 1% 0 0;
}
.main-left img.p2{
max-width: 35%;
margin: 0 0 15px 1%;
border: 7px solid  #fff;
border-radius: 20px;
}
}
@media only screen and (max-width: 480px) {
.main-left img{
float: left;
max-width:59%;
border: 7px solid  #fff;
border-radius: 20px;
margin: 0 1% 0 0;
}
.main-left img.p2{
max-width: 35%;
margin: 0 0 7px 1%;
border: 7px solid  #fff;
border-radius: 20px;
}
}

.main-right{
float: right;
width: 60%;
height: auto;
margin: 0;
padding: 0 0 0 3%;
}
.main-right h2{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0;
text-align: left;
font-weight:700;
font-size: 35px;
line-height: 150%;
}
.main-right h2 strong{
color: #a32a2a;
font-size: 50px;
padding: 0 5px;
font-weight:700;
}
.main-right p{
font-size: 20px;
line-height: 180%;
margin: 0 0 30px;
text-align: left;
}
.main-right img{
max-width: 100%;
}
.main-right img.kou2sm{
display: none;
}
.main-right img.kou2pc{
display: inherit;
}
@media only screen and (max-width: 1280px) {
.main-right h2{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0;
text-align: left;
font-weight:700;
font-size: 30px;
line-height: 150%;
}
.main-right h2 strong{
color: #a32a2a;
font-size: 40px;
padding: 0 5px;
font-weight:700;
}
.main-right p{
font-size: 18px;
line-height: 180%;
margin: 0 0 30px;
text-align: left;
}
}
@media only screen and (max-width: 835px) {
.main-right{
clear: both;
float: right;
width: 100%;
height: auto;
margin: 0;
padding: 0;
}
}
@media only screen and (max-width: 640px) {
.main-right h2{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0;
text-align: left;
font-weight:700;
font-size: 25px;
line-height: 150%;
}
.main-right h2 strong{
color: #a32a2a;
font-size: 35px;
padding: 0 5px;
font-weight:700;
}
.main-right p{
font-size: 15px;
line-height: 180%;
margin: 0 0 30px;
text-align: left;
}
}
@media only screen and (max-width: 480px) {
.main-right img.kou2sm{
display: inherit;
}
.main-right img.kou2pc{
display: none;
}
}

.main-right p.main-midashi{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0;
text-align: left;
font-weight:700;
font-size: 30px;
line-height: 150%;
}
@media only screen and (max-width: 640px) {
.main-right p.main-midashi{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0;
text-align: left;
font-weight:700;
font-size: 25px;
line-height: 150%;
}
}

.main-right ul{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0;
}
.main-right ul.u2{
margin: 0;
}
.main-right ul li{
float: left;
list-style-type: none;
font-size: 20px;
line-height: 100%;
background: #fff;
border: 3px solid #a32a2a;
border-radius: 30px;
margin: 0 2% 20px 0;
padding: 5px 20px 4px;
font-weight: 400;
}
.main-right ul li.nado{
background: none;
border:none;
padding: 7px 0 0;
margin: 0;
}
@media only screen and (max-width: 1280px) {
.main-right ul li{
float: left;
list-style-type: none;
font-size: 17px;
line-height: 100%;
background: #fff;
border: 3px solid #a32a2a;
border-radius: 30px;
margin: 0 2% 15px 0;
padding: 5px 20px 4px;
font-weight: 400;
}
}
@media only screen and (max-width: 640px) {
.main-right ul li{
float: left;
list-style-type: none;
font-size: 15px;
line-height: 100%;
background: #fff;
border: 3px solid #a32a2a;
border-radius: 30px;
margin: 0 2% 15px 0;
padding: 5px 20px 4px;
font-weight: 400;
}
}

.main-right ol{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0;
}
.main-right ol li{
float: left;
list-style-type: none;
font-size: 25px;
line-height: 100%;
margin: 0 0 15px;
padding: 8px 0 2px 45px;
font-weight: 400;
background: url(image/ol-li.png) no-repeat left center/40px;
text-align: left;
}
.main-right ol li span{
background: url(image/kou-line1.png) no-repeat center bottom/100%;
padding: 0 5px 15px;
}
.main-right ol li span.kl2{
background: url(image/kou-line2.png) no-repeat center bottom/100%;
padding: 0 1px 15px 0;
}
@media only screen and (max-width: 1440px) {
.main-right ol li{
float: left;
list-style-type: none;
font-size: 25px;
line-height: 100%;
margin: 0 0 25px;
padding: 8px 0 2px 45px;
font-weight: 400;
background: url(image/ol-li.png) no-repeat left center/40px;
text-align: left;
}
}
@media only screen and (max-width: 1280px) {
.main-right ol li{
float: left;
list-style-type: none;
font-size: 22px;
line-height: 100%;
margin: 0 0 25px;
padding: 8px 0 2px 45px;
font-weight: 400;
background: url(image/ol-li.png) no-repeat left center/35px;
text-align: left;
}
}
@media only screen and (max-width: 640px) {
.main-right ol li{
float: left;
list-style-type: none;
font-size: 18px;
line-height: 100%;
margin: 0 0 25px;
padding: 8px 0 2px 40px;
font-weight: 400;
background: url(image/ol-li.png) no-repeat left center/30px;
text-align: left;
}
}
@media only screen and (max-width: 414px) {
.main-right ol li{
float: left;
list-style-type: none;
font-size: 16px;
line-height: 100%;
margin: 0 0 20px;
padding: 8px 0 2px 35px;
font-weight: 400;
background: url(image/ol-li.png) no-repeat left center/25px;
text-align: left;
}
}

.main-right-pict{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 50px;
padding: 0;
text-align: left;
}
.main-right-pict img{
max-width: 35%;
margin: 0 7% 0 0;
}

.main-right-photo{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 50px;
padding: 0;
text-align: left;
}
.main-right-photo img{
max-width: 30%;
margin: 0 3% 0 0;
border: 10px solid  #fff;
border-radius: 20px;
}
@media only screen and (max-width: 1080px) {
.main-right-photo img{
max-width: 30%;
margin: 0 3% 0 0;
border: 7px solid  #fff;
border-radius: 20px;
}
}

#news{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 50px 0 0;
padding: 50px 30% 150px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,url(image/news4.png) no-repeat right top,url(image/news3.png) no-repeat right 80%,url(image/news2.png) no-repeat left 80%,url(image/news1.png) no-repeat left top;
}
@media only screen and (max-width: 1280px) {
#news{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 50px 0 0;
padding: 50px 20% 120px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,url(image/news4.png) no-repeat right top/8%,url(image/news3.png) no-repeat right 80%/11%,url(image/news2.png) no-repeat left 80%/7%,url(image/news1.png) no-repeat left top/11%;
}
}
@media only screen and (max-width: 835px) {
#news{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 50px 0 0;
padding: 50px 20% 80px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,url(image/news4.png) no-repeat right top/8%,url(image/news3.png) no-repeat right 80%/11%,url(image/news2.png) no-repeat left 80%/7%,url(image/news1.png) no-repeat left top/11%;
}
}
@media only screen and (max-width: 640px) {
#news{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 40px 0 0;
padding: 20px 10% 60px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,url(image/news4.png) no-repeat right top/10%,url(image/news3.png) no-repeat right 90%/14%,url(image/news2.png) no-repeat left 90%/10%,url(image/news1.png) no-repeat left top/14%;
}
}
@media only screen and (max-width: 480px) {
#news{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 40px 0 0;
padding: 20px 10% 60px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,url(image/news4.png) no-repeat right top/12%,url(image/news3.png) no-repeat right 95%/16%,url(image/news2.png) no-repeat left 95%/12%,url(image/news1.png) no-repeat left top/16%;
}
}

#news ul{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 0;
}

#news li{
list-style-type: none;
font-size: 20px;
line-height: 150%;
border-bottom: 3px solid #aa2d34;
margin: 0 0 20px;
padding: 0 0 20px;
text-align: left;
}
@media only screen and (max-width: 1280px) {
#news li{
list-style-type: none;
font-size: 18px;
line-height: 150%;
border-bottom: 3px solid #aa2d34;
margin: 0 0 20px;
padding: 0 0 20px;
text-align: left;
}
}
@media only screen and (max-width: 640px) {
#news li{
list-style-type: none;
font-size: 16px;
line-height: 150%;
border-bottom: 3px solid #aa2d34;
margin: 0 0 15px;
padding: 0 0 15px;
text-align: left;
}
}
@media only screen and (max-width: 480px) {
#news li{
list-style-type: none;
font-size: 14px;
line-height: 150%;
border-bottom: 3px solid #aa2d34;
margin: 0 0 15px;
padding: 0 0 15px;
text-align: left;
}
}

.up_ymd{
display: none;
}
#news .title{
clear: both;
width: 100%;
margin: 0 0 15px;
}
.comment{
clear: both;
}

#news li a{
text-decoration: none;
color: #111;
}

table {
	clear:both;
	width:90%;
	height: auto;
	margin:0 5% 30px;
    border:4px solid #c9b86d;
border-collapse: separate;
    border-spacing:5px;
    empty-cells:hide;
    table-layout:auto;
    text-align:left;
	background:#fff;
}
table.hari-ta{
border:4px solid #f49fae;
}
table.jihi-ta{
border:4px solid #53be91;
}
@media only screen and (max-width: 1600px) {
table {
	clear:both;
	width:90%;
	height: auto;
	margin:0 5% 30px;
    border:4px solid #c9b86d;
border-collapse: separate;
    border-spacing:5px;
    empty-cells:hide;
    table-layout:auto;
    text-align:left;
	background:#fff;
}
table.hari-ta{
border:4px solid #f49fae;
}
table.jihi-ta{
border:4px solid #53be91;
}
}
@media only screen and (max-width: 1440px) {
table {
	clear:both;
	width:94%;
	height: auto;
	margin:0 3% 30px;
    border:4px solid #c9b86d;
border-collapse: separate;
    border-spacing:5px;
    empty-cells:hide;
    table-layout:auto;
    text-align:left;
	background:#fff;
}
}
@media only screen and (max-width: 1280px) {
table {
	clear:both;
	width:96%;
	height: auto;
	margin:0 2% 30px;
    border:4px solid #c9b86d;
border-collapse: separate;
    border-spacing:5px;
    empty-cells:hide;
    table-layout:auto;
    text-align:left;
	background:#fff;
}
table.hari-ta{
border:4px solid #f49fae;
}
table.jihi-ta{
border:4px solid #53be91;
}
}
@media only screen and (max-width: 1080px) {
table {
	clear:both;
	width:90%;
	height: auto;
	margin:0 5% 30px;
    border:4px solid #c9b86d;
border-collapse: separate;
    border-spacing:5px;
    empty-cells:hide;
    table-layout:auto;
    text-align:left;
	background:#fff;
}
table.hari-ta{
border:4px solid #f49fae;
}
table.jihi-ta{
border:4px solid #53be91;
}
}
@media only screen and (max-width: 835px) {
table {
	clear:both;
	width:80%;
	height: auto;
	margin:0 10% 30px;
    border:4px solid #c9b86d;
border-collapse: separate;
    border-spacing:5px;
    empty-cells:hide;
    table-layout:auto;
    text-align:left;
	background:#fff;
}
table.hari-ta{
border:4px solid #f49fae;
}
table.jihi-ta{
border:4px solid #53be91;
}
}
@media only screen and (max-width: 480px) {
table {
	clear:both;
	width:90%;
	height: auto;
	margin:0 5% 30px;
    border:4px solid #c9b86d;
border-collapse: separate;
    border-spacing:5px;
    empty-cells:hide;
    table-layout:auto;
    text-align:left;
	background:#fff;
}
table.hari-ta{
border:4px solid #f49fae;
}
table.jihi-ta{
border:4px solid #53be91;
}
}

td{
	padding: 10px 2%;
	font-size: 17px;
	text-align: center;
	line-height: 120%;
	}
th{
	padding: 10px 2%;
	background:#eee;
	text-align:center;
	font-weight: 400;
	font-size:17px;
	line-height: 120%;
}
th.t25{
width: 25%;
}
th.t30{
width: 30%;
}
table .f15{
font-size: 15px;
}
th.t-title{
width: 100%;
background: #f5eece;
text-align: center;
font-size: 25px;
font-weight: 700;
}
table.hari-ta th.t-title{
background: #ffdee4;
}
table.jihi-ta th.t-title{
background: #c7e6d9;
}
table p{
text-align: left;
margin: 0;
line-height: 120%;
font-size: 15px;
}
table p.pright{
text-align: right;
font-size: 18px;
}
@media only screen and (max-width: 1600px) {
table .ff15{
font-size: 13px;
}
table .f15{
font-size: 13px;
}
}
@media only screen and (max-width: 1440px) {
td{
	padding: 10px 2%;
	font-size: 16px;
	text-align: center;
	line-height: 120%;
	}
th{
	padding: 10px 2%;
	background:#eee;
	text-align:center;
	font-weight: 400;
	font-size:16px;
	line-height: 120%;
}
table .f15{
font-size: 13px;
}
table p.pright{
text-align: right;
font-size: 17px;
}
}
@media only screen and (max-width: 1280px) {
td{
	padding: 10px 2%;
	font-size: 16px;
	text-align: center;
	line-height: 120%;
	}
th{
	padding: 10px 2%;
	background:#eee;
	text-align:center;
	font-weight: 400;
	font-size:16px;
	line-height: 120%;
}
table p.pright{
text-align: right;
font-size: 16px;
}
}
@media only screen and (max-width: 1080px) {
th.t-title{
width: 100%;
background: #f5eece;
text-align: center;
font-size: 20px;
font-weight: 700;
}
table.hari-ta th.t-title{
background: #ffdee4;
}
table.jihi-ta th.t-title{
background: #c7e6d9;
}
td{
	padding: 10px 2%;
	font-size: 14px;
	text-align: center;
	line-height: 120%;
	}
th{
	padding: 10px 2%;
	background:#eee;
	text-align:center;
	font-weight: 400;
	font-size:14px;
	line-height: 120%;
}
table p.pright{
text-align: right;
font-size: 14px;
}
}
@media only screen and (max-width: 835px) {
table .f15{
font-size: 12px;
}
td{
	padding: 5px 2%;
	font-size: 13px;
	text-align: center;
	line-height: 120%;
	}
th{
	padding: 5px 2%;
	background:#eee;
	text-align:center;
	font-weight: 400;
	font-size:13px;
	line-height: 120%;
}
table p{
text-align: left;
margin: 0;
line-height: 120%;
font-size: 15px;
}
table p.pright{
text-align: right;
font-size: 16px;
}
table.t835 th,table.t835 td{
clear: both;
float: left;
width: 100%;
font-size: 16px;
}
table .ff15{
font-size: 16px;
}
table .f15{
font-size: 13px;
}
}
@media only screen and (max-width: 640px) {
tr{
clear: both;
float: left;
width: 100%;
margin: 0;
padding: 0;
}
td{
float: left;
width: 50%;
	padding: 5px 0%;
	font-size: 15px;
	text-align: center;
	line-height: 120%;
	border-bottom: 2px solid #eee;
	}
td.t100{
width: 100%;
border-bottom: none;
}
th{
clear: both;
float: left;
width: 50%;
	padding: 5px 0%;
	background:#eee;
	text-align:center;
	font-weight: 400;
	font-size:15px;
	line-height: 120%;
	border-bottom: 2px solid #fff;
}
th.tno,td.tno{
display: none;
}
th.t-title{
width: 100%;
background: #f5eece;
text-align: center;
font-size: 17px;
font-weight: 700;
border-bottom:none;
border-bottom: 2px solid #fff;
}
table.hari-ta th.t-title{
background: #ffdee4;
}
table.jihi-ta th.t-title{
background: #c7e6d9;
}
table .ff15{
font-size: 12px;
}
table p.pright{
text-align: right;
font-size: 15px;
}
}
@media only screen and (max-width: 480px) {
td{
float: left;
width: 50%;
	padding: 5px 0%;
	font-size: 13px;
	text-align: center;
	line-height: 120%;
	border-bottom: 2px solid #eee;
	}
th{
clear: both;
float: left;
width: 50%;
	padding: 5px 0%;
	background:#eee;
	text-align:center;
	font-weight: 400;
	font-size:13px;
	line-height: 120%;
	border-bottom: 2px solid #fff;
}
table.t835 th,table.t835 td,table.t375 th,table.t375 td{
clear: both;
float: left;
width: 100%;
font-size: 13px;
}
table .ff15{
font-size: 13px;
}
table .f15{
font-size: 11px;
}
table p{
text-align: left;
margin: 0;
line-height: 120%;
font-size: 13px;
}
table p.pright{
text-align: right;
font-size: 13px;
}
}

#hoken{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 120px 0 50px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#f5eece;
}
#hari{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 120px 0 50px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#ffdee4;
}
#jihi{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 120px 0 50px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#c7e6d9;
}
#kou{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 120px 0 50px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#ffdee4;
}
@media only screen and (max-width: 1080px) {
#hoken{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 80px 0 30px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#f5eece;
}
#hari{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 80px 0 30px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#ffdee4;
}
#jihi{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 80px 0 30px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#c7e6d9;
}
#kou{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 80px 0 30px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#ffdee4;
}
}
@media only screen and (max-width: 835px) {
#hoken{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 50px 0 0;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#f5eece;
}
#hari{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 50px 0 0;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#ffdee4;
}
#jihi{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 50px 0 0;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#c7e6d9;
}
#kou{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 50px 0 0;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#ffdee4;
}
}

.kou-box{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 100px;
padding: 0 20%;
}
@media only screen and (max-width: 1600px) {
.kou-box{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 90px;
padding: 0 10%;
}
}
@media only screen and (max-width: 1440px) {
.kou-box{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 80px;
padding: 0 5%;
}
}
@media only screen and (max-width: 640px) {
.kou-box{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 50px;
padding: 0 5%;
}
}
@media only screen and (max-width: 480px) {
.kou-box{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0 5%;
}
}

.kou-box h4{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0 0 10px;
line-height: 100%;
text-align: center;
font-weight: 700;
font-size: 30px;
border-bottom: 2px solid #111;
}
@media only screen and (max-width: 1080px) {
.kou-box h4{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0 0 10px;
line-height: 100%;
text-align: center;
font-weight: 700;
font-size: 25px;
border-bottom: 2px solid #111;
}
}

#kou-flow{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 15px;
padding: 0;
display: flex;
}
@media only screen and (max-width: 640px) {
#kou-flow{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 15px;
padding: 0;
display:inherit;
}
}

.kou-f,.kou-f2{
margin: 0 1% 0 0;
padding: 0 30px 0 0;
background: url(image/kou-f-ar.png) no-repeat right center;
}
.kou-f2{
margin: 0;
padding: 0;
background: none;
}
@media only screen and (max-width: 640px) {
.kou-f,.kou-f2{
clear: both;
float: left;
width: 100%;
margin: 0 0 10px;
padding: 0 0 30px;
background: url(image/kou-f-ar2.png) no-repeat center bottom;
}
.kou-f2{
margin: 0;
padding: 0;
background: none;
}
}

#kou-flow h5{
clear: both;
float: left;
width: 100%;
height: auto;
min-height: 3.5em;
margin: 0 0 15px;
padding: 15px 0 0 45px;
background: url(image/kou-f1.png) no-repeat -17px center,#f49fae;
color: #fff;
text-align: left;
line-height: 120%;
font-weight: 500;
font-size: 25px;
}
#kou-flow h5.kf2{
background: url(image/kou-f2.png) no-repeat -17px center,#f49fae;
}
#kou-flow h5.kf3{
background: url(image/kou-f3.png) no-repeat -17px center,#f49fae;
}
#kou-flow h5.kf4{
background: url(image/kou-f4.png) no-repeat -17px center,#f49fae;
}
@media only screen and (max-width: 1280px) {
#kou-flow h5{
clear: both;
float: left;
width: 100%;
height: auto;
min-height: 3.5em;
margin: 0 0 15px;
padding: 15px 0 0 45px;
background: url(image/kou-f1.png) no-repeat -17px center,#f49fae;
color: #fff;
text-align: left;
line-height: 120%;
font-weight: 500;
font-size: 20px;
}
}
@media only screen and (max-width: 835px) {
#kou-flow h5{
clear: both;
float: left;
width: 100%;
height: auto;
min-height: 3.5em;
margin: 0 0 15px;
padding: 10px 0 0 25px;
background: url(image/kou-f1.png) no-repeat -17px center/40px,#f49fae;
color: #fff;
text-align: left;
line-height: 120%;
font-weight: 500;
font-size: 17px;
}
#kou-flow h5.kf2{
background: url(image/kou-f2.png) no-repeat -17px center/40px,#f49fae;
}
#kou-flow h5.kf3{
background: url(image/kou-f3.png) no-repeat -17px center/40px,#f49fae;
}
#kou-flow h5.kf4{
background: url(image/kou-f4.png) no-repeat -17px center/40px,#f49fae;
}
}
@media only screen and (max-width: 640px) {
#kou-flow h5{
clear: both;
float: left;
width: 100%;
height: auto;
min-height: auto;
margin: 0 0 15px;
padding: 15px 0 15px 35px;
background: url(image/kou-f1.png) no-repeat -17px center/40px,#f49fae;
color: #fff;
text-align: left;
line-height: 120%;
font-weight: 500;
font-size: 20px;
}
#kou-flow h5.kf2{
background: url(image/kou-f2.png) no-repeat -17px center/40px,#f49fae;
}
#kou-flow h5.kf3{
background: url(image/kou-f3.png) no-repeat -17px center/40px,#f49fae;
}
#kou-flow h5.kf4{
background: url(image/kou-f4.png) no-repeat -17px center/40px,#f49fae;
}
}
@media only screen and (max-width: 480px) {
#kou-flow h5{
clear: both;
float: left;
width: 100%;
height: auto;
min-height: auto;
margin: 0 0 15px;
padding: 15px 0 15px 35px;
background: url(image/kou-f1.png) no-repeat -17px center/40px,#f49fae;
color: #fff;
text-align: left;
line-height: 120%;
font-weight: 500;
font-size: 18px;
}
#kou-flow h5.kf2{
background: url(image/kou-f2.png) no-repeat -17px center/40px,#f49fae;
}
#kou-flow h5.kf3{
background: url(image/kou-f3.png) no-repeat -17px center/40px,#f49fae;
}
#kou-flow h5.kf4{
background: url(image/kou-f4.png) no-repeat -17px center/40px,#f49fae;
}
}

.kou-box p{
text-align: right;
margin: 0;
font-size: 15px;
line-height: 150%;
}
.kou-f p,.kou-f2 p{
margin:0;
padding: 0 5% 15px;
text-align: justify;
text-justify: inter-ideograph;
line-height: 120%;
font-size: 15px;
background: #fff;
}
@media only screen and (max-width: 1280px) {
.kou-box p{
text-align: right;
margin: 0;
font-size: 14px;
line-height: 150%;
}
.kou-f p,.kou-f2 p{
margin:0;
padding: 0 5% 15px;
text-align: justify;
text-justify: inter-ideograph;
line-height: 120%;
font-size: 14px;
background: #fff;
}
}
@media only screen and (max-width: 835px) {
.kou-box p{
text-align: right;
margin: 0;
font-size: 13px;
line-height: 150%;
}
.kou-f p,.kou-f2 p{
margin:0;
padding: 0 5% 15px;
text-align: justify;
text-justify: inter-ideograph;
line-height: 120%;
font-size: 13px;
background: #fff;
min-height: 13em;
}
}
@media only screen and (max-width: 640px) {
.kou-box p{
text-align: right;
margin: 0;
font-size: 14px;
line-height: 150%;
}
.kou-f p,.kou-f2 p{
margin:0;
padding: 0 5% 15px;
text-align: justify;
text-justify: inter-ideograph;
line-height: 120%;
font-size: 14px;
background: #fff;
min-height: auto;
}
}
@media only screen and (max-width: 414px) {
.kou-box p{
text-align: right;
margin: 0;
font-size: 13px;
line-height: 150%;
}
.kou-f p,.kou-f2 p{
margin:0;
padding: 0 5% 15px;
text-align: justify;
text-justify: inter-ideograph;
line-height: 120%;
font-size: 13px;
background: #fff;
min-height: auto;
}
}

.kou-box dl{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 0;
}

.kou-box dt{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 15px 3% 15px 0;
background: #f49fae;
color: #fff;
font-size: 25px;
font-weight: 500;
line-height: 120%;
text-align: left;
}
.kou-box dt span{
color: #f49fae;
background: #fff;
border-radius: 0 30px 30px 0;
margin: 0 10px 0 0;
padding: 5px 15px 5px 5px;
}
@media only screen and (max-width: 1280px) {
.kou-box dt{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 15px 3% 15px 0;
background: #f49fae;
color: #fff;
font-size: 20px;
font-weight: 500;
line-height: 120%;
text-align: left;
}
}
@media only screen and (max-width: 835px) {
.kou-box dt{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 15px 3% 15px 0;
background: #f49fae;
color: #fff;
font-size: 18px;
font-weight: 500;
line-height: 120%;
text-align: left;
}
}
@media only screen and (max-width: 480px) {
.kou-box dt{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 15px 3% 15px 3em;
text-indent: -3em;
background: #f49fae;
color: #fff;
font-size: 17px;
font-weight: 500;
line-height: 120%;
text-align: left;
}
}

.kou-box dd{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 40px;
padding: 20px 3% 20px 6.5%;
background: #fff;
text-align: left;
line-height: 120%;
font-size:17px;
}
@media only screen and (max-width: 1280px) {
.kou-box dd{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 20px 3% 20px 6.5%;
background: #fff;
text-align: left;
line-height: 120%;
font-size:15px;
}
}
@media only screen and (max-width: 835px) {
.kou-box dd{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 20px 3% 20px 6.5%;
background: #fff;
text-align: left;
line-height: 120%;
font-size:14px;
}
}
@media only screen and (max-width: 640px) {
.kou-box dd{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 15px 3% 15px 3%;
background: #fff;
text-align: left;
line-height: 120%;
font-size:14px;
}
}
@media only screen and (max-width: 414px) {
.kou-box dd{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 15px 3% 15px 3%;
background: #fff;
text-align: left;
line-height: 120%;
font-size:13px;
}
}

#flow{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 50px 0 0;
padding: 50px 10% 150px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,url(image/news4.png) no-repeat right top,url(image/news3.png) no-repeat right 90%,url(image/news2.png) no-repeat left 90%,url(image/news1.png) no-repeat left top;
}
@media only screen and (max-width: 1280px) {
#flow{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 50px 0 0;
padding: 50px 5% 120px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,url(image/news4.png) no-repeat right top/8%,url(image/news3.png) no-repeat right 80%/11%,url(image/news2.png) no-repeat left 80%/7%,url(image/news1.png) no-repeat left top/11%;
}
}
@media only screen and (max-width: 835px) {
#flow{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 50px 0 0;
padding: 30px 5% 80px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,url(image/news4.png) no-repeat right top/8%,url(image/news3.png) no-repeat right 98%/11%,url(image/news2.png) no-repeat left 98%/7%,url(image/news1.png) no-repeat left top/11%;
}
}
@media only screen and (max-width: 640px) {
#flow{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 40px 0 0;
padding: 20px 5% 60px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,url(image/news4.png) no-repeat right top/10%,url(image/news3.png) no-repeat right 98%/14%,url(image/news2.png) no-repeat left 98%/10%,url(image/news1.png) no-repeat left top/14%;
}
}
@media only screen and (max-width: 480px) {
#flow{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 40px 0 0;
padding: 20px 5% 60px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,url(image/news4.png) no-repeat right top/12%,url(image/news3.png) no-repeat right 98%/16%,url(image/news2.png) no-repeat left 98%/12%,url(image/news1.png) no-repeat left top/16%;
}
}

#flow-waku{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 0;
}

.flow-box{
float: left;
width: 20%;
height: auto;
margin: 0;
padding: 40px 1.5% 0;
background: #ffdee4;
border-right:10px solid #fff;
position: relative;
}
.flow-box2{
background: #f5eece;
}
.flow-box3{
background: #c7e6d9;
}
.flow-box4{
background: #ffdee4;
border-right:10px solid #fff;
}
.flow-box img.fb{
position:absolute;
top:20px;
left:100%;
z-index: 4;
}
@media only screen and (max-width: 835px) {
.flow-box{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding:30px 3% 30px;
background: #ffdee4;
border-bottom:10px solid #fff;
position: relative;
}
.flow-box2{
background: #f5eece;
}
.flow-box3{
background: #c7e6d9;
}
.flow-box4{
background: #ffdee4;
border-right:10px solid #fff;
}
.flow-box img.fb{
position:absolute;
top:96%;
left:80%;
z-index: 4;
transform: rotate( 90deg );
}
}
@media only screen and (max-width: 768px) {
.flow-box img.fb{
position:absolute;
top:95.5%;
left:80%;
z-index: 4;
transform: rotate( 90deg );
}
}
@media only screen and (max-width: 710px) {
.flow-box img.fb{
position:absolute;
top:95%;
left:80%;
z-index: 4;
transform: rotate( 90deg );
}
}
@media only screen and (max-width: 640px) {
.flow-box img.fb{
position:absolute;
top:95%;
left:80%;
z-index: 4;
transform: rotate( 90deg );
}
}
@media only screen and (max-width: 549px) {
.flow-box img.fb{
position:absolute;
top:94.5%;
left:80%;
z-index: 4;
transform: rotate( 90deg );
}
}
@media only screen and (max-width: 480px) {
.flow-box img.fb{
position:absolute;
top:94.2%;
left:80%;
z-index: 4;
transform: rotate( 90deg );
}
}

#flow h2{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0;
text-align: left;
font-weight: 500;
font-size: 30px;
line-height: 100%;
text-indent: 1em;
}
@media only screen and (max-width: 1280px) {
#flow h2{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0;
text-align: left;
font-weight: 500;
font-size: 25px;
line-height: 100%;
text-indent: 1em;
}
}
@media only screen and (max-width: 1080px) {
#flow h2{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 30px;
padding: 0;
text-align: left;
font-weight: 500;
font-size: 20px;
line-height: 100%;
text-indent: 1.5em;
}
}
@media only screen and (max-width: 835px) {
#flow h2{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 20px;
padding: 0;
text-align: left;
font-weight: 500;
font-size: 25px;
line-height: 100%;
text-indent: 0em;
}
}

#flow p{
display: block;
clear: both;
float: left;
width: 100%;
min-height:5em;
margin: 0;
text-align: justify;
text-justify: inter-ideograph;
line-height: 120%;
font-size: 15px;
}
@media only screen and (max-width: 1280px) {
#flow p{
display: block;
clear: both;
float: left;
width: 100%;
min-height:5em;
margin: 0;
text-align: justify;
text-justify: inter-ideograph;
line-height: 120%;
font-size: 14px;
}
}
@media only screen and (max-width: 1080px) {
#flow p{
display: block;
clear: both;
float: left;
width: 100%;
min-height:6em;
margin: 0;
text-align: justify;
text-justify: inter-ideograph;
line-height: 120%;
font-size: 13px;
}
}
@media only screen and (max-width: 835px) {
#flow p{
display: block;
clear: both;
float: left;
width: 100%;
min-height:auto;
margin: 0 0 15px;
text-align: justify;
text-justify: inter-ideograph;
line-height: 120%;
font-size: 14px;
}
}

.flow-pict{
}
.flow-pict img{
max-width: 100%;
margin: 0 0 15px;
}
@media only screen and (max-width: 835px) {
.flow-pict img{
max-width:48%;
margin: 0 2% 0 0;
}
}

#staff{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 50px 0 0;
padding: 50px 10% 150px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px;
}
@media only screen and (max-width: 1600px) {
#staff{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 50px 0 0;
padding: 50px 5% 120px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px;
}
}
@media only screen and (max-width: 1080px) {
#staff{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 50px 0 0;
padding: 30px 5% 90px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px;
}
}
@media only screen and (max-width: 835px) {
#staff{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 40px 0 0;
padding: 30px 5% 70px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px;
}
}
@media only screen and (max-width: 640px) {
#staff{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 30px 0 0;
padding: 30px 5% 50px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px;
}
}

#staff-waku{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 0;
display: flex;
}
.staff-box{
margin: 0 1%;
flex: 1;
}
@media only screen and (max-width: 640px) {
#staff-waku{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 0;
display: inherit;
}
.staff-box{
clear: both;
width: 100%;
height: auto;
margin: 0 0 30px;
}
}

#staff-waku img{
max-width: 100%;
margin: 0 0 20px;
}

#staff h3{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 20px;
padding: 0;
text-align: center;
font-weight: 700;
font-size: 30px;
line-height: 100%;
}
#staff h3 span{
color: #fff;
background: #aa2d34;
font-size: 15px;
border-radius: 15px;
padding: 3px 15px 2px;
margin: 0 2% 0 0;
font-weight: 400;
}
@media only screen and (max-width: 1080px) {
#staff h3{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0 0 20px;
padding: 0;
text-align: center;
font-weight: 700;
font-size: 25px;
line-height: 100%;
}
#staff h3 span{
color: #fff;
background: #aa2d34;
font-size: 13px;
border-radius: 15px;
padding: 3px 15px 2px;
margin: 0 2% 0 0;
font-weight: 400;
}
}

#staff p{
text-align: center;
margin: 0;
font-size: 15px;
line-height: 150%;
}
@media only screen and (max-width: 835px) {
#staff p{
text-align: center;
margin: 0;
font-size: 13px;
line-height: 150%;
}
}

#access{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 120px 0 150px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#ffdee4;
}
@media only screen and (max-width: 1280px) {
#access{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 90px 0 120px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#ffdee4;
}
}
@media only screen and (max-width: 835px) {
#access{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 50px 0 90px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#ffdee4;
}
}
@media only screen and (max-width: 640px) {
#access{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 30px 0 60px;
background: linear-gradient(to right, #000, #000 11px, transparent 11px, transparent 3px) repeat-x left bottom/14px 2px,#ffdee4;
}
}

#access p{
font-size: 20px;
margin: 0 0 50px;
text-align: center;
font-weight: 500;
}
#access iframe{
clear: both;
float: left;
width: 100%;
height: 400px;
}
@media only screen and (max-width: 640px) {
#access p{
font-size: 17px;
margin: 0 0 50px;
text-align: center;
font-weight: 500;
}
#access iframe{
clear: both;
float: left;
width: 100%;
height: 350px;
}
}
@media only screen and (max-width: 480px) {
#access p{
font-size: 15px;
margin: 0 0 40px;
text-align: center;
font-weight: 500;
}
}
@media only screen and (max-width: 414px) {
#access p{
font-size: 14px;
margin: 0 0 40px;
text-align: center;
font-weight: 500;
}
#access iframe{
clear: both;
float: left;
width: 100%;
height: 300px;
}
}

/*フッタ
--------------------------------------------------------------------------*/
#page-top{
	width:40px;
	height:40px;
	display:none;
	position:fixed;
	right:16px;
	bottom:16px;
	color:#fff;
	line-height: 0;
} 
#page-top p{
	margin:0;
	padding:0;
	text-align:center;
	background:#aa2d34;
	-webkit-transition:all 0.3s;
	-moz-transition:all 0.3s;
	transition:all 0.3s;
	color:#fff;
} 
#page-top p:hover{
	background:#61a13a;
	color:#fff;
} 
#move-page-top{
	color:#fff;
	line-height:40px;
	text-decoration:none;
	display:block;
	cursor:pointer;
}

footer{
clear: both;
float: left;
width: 100%;
height: auto;
margin: 0;
padding: 30px 0 10px;
background: #fff;
}

#footer-logo{
clear: both;
float: left;
width: 30%;
height: auto;
margin: 0;
padding: 0 3%;
text-align: left;
}
#footer-logo img{
max-width: 100%;
margin: 0 0 15px;
}
#footer-logo p{
text-align: center;
line-height: 100%;
margin: 0 0 15px;
font-size: 18px;
}
#footer-logo p.fo-box{
background: #aa2d34;
color: #fff;
font-size: 20px;
padding: 10px 0;
}
@media only screen and (max-width: 1600px) {
#footer-logo p{
text-align: center;
line-height: 100%;
margin: 0 0 15px;
font-size: 16px;
}
#footer-logo p.fo-box{
background: #aa2d34;
color: #fff;
font-size: 18px;
padding: 10px 0;
}
}
@media only screen and (max-width: 1280px) {
#footer-logo{
clear: both;
float: left;
width: 35%;
height: auto;
margin: 0;
padding: 0 0 0 3%;
text-align: left;
}
}
@media only screen and (max-width: 1080px) {
#footer-logo{
display: none;
clear: both;
float: left;
width: 35%;
height: auto;
margin: 0;
padding: 0 0 0 3%;
text-align: left;
}
#footer-logo p{
text-align: center;
line-height: 100%;
margin: 0 0 10px;
font-size: 14px;
}
#footer-logo p.fo-box{
background: #aa2d34;
color: #fff;
font-size: 14px;
padding: 10px 0;
}
}

#banner{
float: right;
width: 70%;
height: auto;
margin: 0;
padding: 0 3%;
}
#banner img{
margin: 0 0 0 2%;
}
@media only screen and (max-width: 1600px) {
#banner img{
margin: 0 0 0 2%;
max-width: 23%;
}
}
@media only screen and (max-width: 1280px) {
#banner{
float: right;
width: 65%;
height: auto;
margin: 0;
padding: 0 3% 0 0;
}
#banner img{
margin: 0 0 0 2%;
max-width: 22%;
}
}
@media only screen and (max-width: 1080px) {
#banner{
float: right;
width: 100%;
height: auto;
margin: 0;
padding: 0 3% 0 0;
}
}
@media only screen and (max-width: 480px) {
#banner img{
margin: 0 1% 10px 1%;
max-width: 33%;
}
}
@media only screen and (max-width: 414px) {
#banner img{
margin: 0 1% 10px 1%;
max-width: 40%;
}
}