@charset "utf-8";
/* CSS Document */

@import url(//fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,700,700italic);
@import url(//fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700);

/* ==========================================================================
Reset & Base Setting
========================================================================== */
/* default style reset
-------------------------------------*/
html{background:#fff;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:separate;border-spacing:0;}
fieldset,img{border:0;}
img{vertical-align:top;}
address,caption,em,strong,th{font-style:normal;font-weight:normal;}
ol,ul{list-style:none;}
caption,th,td{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
sup{vertical-align:text-top;}
sub{vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}
input,textarea,select{*font-size:100%;}
a{text-decoration:none;color:#f85a1d;}
a:hover{text-decoration:underline;cursor:pointer!important;}
a:active{text-decoration:none;}
header, footer, nav, section, article, figure, aside {display:block;}
*{box-sizing:border-box;}

/* body setting
-------------------------------------*/
html{
  width:100%;
  font-size:62.5%;
}

body{
  font-size:1.2rem;
  text-align:left;
  line-height:1.6;
  color:#333;
  width:100%;
  font-family:Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}

ul li img{
  vertical-align:bottom;
  line-height:0;
}

.imgover:hover{
  opacity:0.6;
}

.color01{color:#2d91a5;}
.color02{color:#5c6a86;}
.color03{color:#7d9e44;}
.color04{color:#827451;}
.color05{color:#474747;}
.color06{color:#f29003;}
.color07{color:#827451;}

/* clearfix
-------------------------------------*/
.clear:before,
.clear:after{
  display:table;
  content:"";
}

.clear:after{
  clear:both;
}

.clear{
  zoom:1;
}
.inner{
  width: 1170px;
  margin:0 auto;
}

.heading01{
  padding:55px 0 40px;
  text-align: center;
  font-size: 3.3rem;
}

.heading01 span{
  font-size:60%;
}

/* parts
---------------------------------------------------- */
.moreBtn{
  width: 360px;
  margin:0 auto;
}
.moreBtn a{
  display: block;
  width: 360px;
  color:#FFF;
  text-align: center;
  background: #25a2d2;
  line-height: 1;
  padding:15px 0;
  font-size:1.8rem;
}

.img100{
  width: 100%;
  height: auto;
}
.img100 img{
  width: 100%;
  height: auto;
}

/* index
---------------------------------------------------- */
.contents01 ul.icons01{
  padding:0 5px;
  text-align: center;
  padding-bottom: 30px;
}
.contents01 ul.icons01 li{
  width: 266px;
  height: 340px;
  display: inline-block;
  text-align: center;
  margin-right: 24px;
  vertical-align: top;
}
.contents01 ul.icons01 li:nth-child(4){
  margin-right: 0;
}
.contents01 ul li h3{
  font-size:2.3rem;
  margin-bottom: 15px;
}
.contents01 ul li .img{
  width: 165px;
  margin:0 auto 20px;
}
.contents01 ul li .desc{
  font-size:1.4rem;
}
.contents01 ul.icons01 li.garasu{
  position: relative;
}
.contents01 ul.icons01 li.garasu h3{
  width: 370px;
  position: absolute;
  top:185px;
  left:-50px;
}
.contents01 ul.icons01 li.garasu .img{
  margin-bottom: 57px;
}
.contents01 .moreBtn{
  margin-bottom: 50px;
}
.contents01 .bg01{
  width: 100%;
  height: 470px;
  background: url(../images/index/index_bg_01.jpg) top center no-repeat #cfeef9;
}

.fee{
  width: 98%;
  font-size:1.5rem;
  margin: 0 1% 40px;
  border-top:1px solid #333;
  border-left:1px solid #333;
}
.fee .first th,
.fee .first td{
  background: #686565;
  color: #FFF;
  text-align: center;
}
.fee th{
  width: 30%;
  padding:10px;
  border-right:1px solid #333;
  border-bottom:1px solid #333;
}
.fee td{
  padding:10px;
  border-right:1px solid #333;
  border-bottom:1px solid #333;
}
.fee .td01{
  width: 6%;
  text-align: center;
}
.fee .td02{
  width: 10%;
  text-align: right;
}
.fee .td03{
  width: 54%;
}

.route li{
  width: 33%;
  padding:10px 1%;
  float:left;
  text-align: center;
  margin-bottom: 30px;
}
.route li h3{
  padding:14px 0 10px;
  font-size:1.8rem!important;
  background: #25A2D2;
  color:#FFF;
  border-radius: 2px;
  margin-bottom: 20px!important;
}
.route li p{
  font-size:1.4rem;
}
.imgLblock,
.imgRblock{
  padding:0 2%;
}
.imgLblock .img{
  width: 30%;
  float:left;
}
.imgLblock .img img{
  width: 100%;
  height: auto;
}
.imgLblock .read{
  width: 70%;
  float:right;
  padding:0 2%;
  font-size:1.8rem;
}
.imgRblock .img{
  width: 30%;
  float:right;
}
.imgRblock .img img{
  width: 100%;
  height: auto;
}
.imgRblock .read{
  width: 70%;
  float:left;
  padding:0 2%;
  font-size:1.8rem;
}
.message{
  font-size:1.8rem;
  padding:0 2%;
}
.name{
  margin: 20px 0 50px;
  text-align: right;
  font-size:2.2rem;
  padding:0 2%;
}
.information{
  margin-bottom: 50px;
}
.information .block{
  font-size: 1.4rem;
  width: 50%;
  float:left;
  padding:0 1%;
}
.information .block table{
  font-size: 1.6rem;
  width: 100%;
  border-top:1px solid #333;
  border-left:1px solid #333;
}
.information .block table th{
  width: 30%;
  padding:10px;
  border-right:1px solid #333;
  border-bottom:1px solid #333;
}
.information .block table td{
  width: 70%;
  border-right:1px solid #333;
  border-bottom:1px solid #333;
  padding:10px;
}
.information .block table td a{
  color:#25a2d2;
  text-decoration: underline;
}
.information .block h3{
  background: #333;
  color:#FFF;
  padding:10px;
  font-size:1.5rem;
  margin-bottom: 10px;
}
.information .img img{
  width: 100%;
  height: auto;
}
.information .block .txt{
  font-size: 1.5rem;
}
.information .block ul{
  margin-bottom: 20px;
}
.information .block ul li{
  display: inline-block;
  width: 30%;
  text-align: center;
  padding:5px 0;
}
.information .block .txt span{
  font-size:1.8rem;
  display: block;
  font-weight: bold;
  margin-bottom: 20px;
}




#loader {
    width: 64px;
    height: 64px;
    display: none;
    position: fixed;
    _position: absolute; /* IE6対策 */
    top: 50%;
    left: 50%;
    margin-top: -32px; /* heightの半分のマイナス値 */
    margin-left: -32px; /* widthの半分のマイナス値 */
    z-index: 100;
}
 
#fade {
    width: 100%;
    height: 100%;
    display: none;
    background-color: #FFFFFF;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 50;
}


/* 汎用
---------------------------------------------------- */
.color01{color:#2d91a5;}
.color02{color:#5c6a86;}
.color03{color:#7d9e44;}
.color04{color:#827451;}
.color05{color:#474747;}
.color06{color:#f29003;}
.color07{color:#827451;}
.spBlock{display: none;}
.pc-S-Block{display: none;}
.fwB{font-weight: bold;}
.fwN{font-weight: normal;}
.taR{text-align: right!important;}
.taL{text-align: left!important;}
.taC{text-align: center!important;}
.mt100{margin-top: 100px!important;}
.mb50{margin-bottom: 50px!important;}