@charset "utf-8";
/* base style
-------------------------*/
#pc_area{
  display:block;
}
#phone_area{
  display:none;
}

* {
	font-style: normal;
	margin: 0px;
	padding: 0px;
}
body {
	font-family: "Lucida Grande", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-size: 14px;
	line-height: 1.5em;
	color: #4779bd;
}
li {
	list-style: none;
}
table {
	border-collapse:collapse;
}


p.textblack{
   color: #000000;
}

p.textblackmr{
   color: #000000;
   margin-left: 50px;
}

/* link style
-------------------------------*/
a img {
	border-style: none;
}
a:link {
	color: #000;
	text-decoration: none;
	-moz-transition: color 0.3s ease 0s;
	-webkit-transition: color 0.3s ease 0s;
	-ms-transition: color 0.3s ease 0s;
}
a:visited {
	color: #000;
	text-decoration: none;
}
a:hover {
	color: #37A3DD;
	text-decoration: none;	
}



a img.mouselink{
background:none!important;
}
 
a:hover img.mouselink{
opacity:0.4;
filter:alpha(opacity=40);
-ms-filter: "alpha( opacity=40 )";
background:none!important;
}

/* basic layout
-------------------------------*/

#container {
	width: 100%;
	background-color: #4779bd;
	margin-right: auto;
	margin-left: auto;
}
#header {

}

#header #header-top {
	background-color: #4779bd;
}
#header #header-top .inner {
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
	background-color: #FFF;
}

#header #logo {
	background-color: #FFF;
	height: 37px;
	width: 356px;
	position: relative;
	left: 0px;
	top: 21px;
}


#gNavi {
  list-style: none;

}
#gNavi .inner {
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
	background-color: #FFF;
	
}
#gNavi li  {
	float: left;
    display: inline-block;
		background-color: #FFF;
	
}

#gNavi li a {

}



#gNavi li a:hover,
{
	text-indent: -9999px;
}


/* header styles
-------------------------------*/

#topimg {
	background-color: #FFF;
	width: 1000px;
	margin: 20px auto;
}
#contents {
	background-color: #FFF;
	width: 1000px;
	margin: 20px auto;
}

#map {
	background-color: #FFF;
	width: 970px;
	margin-left: 30px;
}

#sitemap1 {
	background-color: #FFF;
	width: 280px;
	margin-left: 30px;
	float: left;
}
#sitemap2 {
	background-color: #FFF;
	width: 280px;
	margin-left: 30px;
	float: left;
}
#sitemap3 {
	background-color: #FFF;
	width: 280px;
	margin-left: 30px;
	float: left;
}

#mailform {
	background-color: #FFF;
	width: 600px;
	margin-left: 100px;
	float: left;
}


#footer{
	width: 1000px;
	background-color: #4779BD;
	margin-right: auto;
	margin-left: auto;
}
#footer .inner {
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
	background-color: #4779BD;
}

#footer #footer-text {
	font-size: 10px;
	color: #FFF;
	line-height: 1.5;
}


#footer address {
	font-size: 10px;
	color: #FFF;
	position: relative;
	top: 0px;
	left: 0px;
	text-align: right;
}



#boxtext{
	background-color: #fff;
	width: 1000px;
	margin-left: 0px;

	}
	
#boximage{
	background-color: #fff;
	width: 855px;
	margin-left: 145px;
	text-align:left;
	}
	
#boxleft {
	background-color: #fff;
	width: 390px;
	margin-right: 10px;
	text-align:right;
	float: left;
}

#boxright {
	background-color: #fff;
	color: #000000;
	width: 590px;
	margin-left: 10px;
	text-align:left;
	float: left;
}

#boxcenter {
	background-color: #fff;
	width: 240px;
	margin-left: 10px;
	text-align:left;
}

#boxkeireki {
	background-color: #fff;
	width: 800px;
	margin-left: 200px;
	text-align:left;
	float: left;
}

#boxsyacho {
	background-color: #fff;
	width: 850px;
	margin-left: 150px;
	text-align:left;
	float: left;
}

#m_box{
	background-color: #fff;
	width: 80%;
	float: left;
	margin-left: 10px;
}





/* 優先CSS
-------------------------------*/
.no-linkarea {
	background-color: #fff !important;
}




/*/////////////////////　スマホで表示　/////////////////////*/


@media only screen and (min-width:1px) and (max-width: 568px) {

img {
max-width: 100%;
height: auto;
}

/*--------------------------------------------------------------
# Tables
--------------------------------------------------------------*/
table {
	width: 100%;
        margin-bottom:20px;
	border: 0px;
}
th {
	background-color: #f5f5f5;
}
table > thead > tr > th,
table > tbody > tr > th,
table > tfoot > tr > th,
table > thead > tr > td,
table > tbody > tr > td,
table > tfoot > tr > td {
	padding: 10px;
	line-height: 1.42857143;
	vertical-align: top;
}
table > thead > tr > th,
table > tbody > tr > th,
table > tfoot > tr > th,
table > thead > tr > td,
table > tbody > tr > td,
table > tfoot > tr > td {
	border: 1px solid #dddddd;
}


p.mtitle{
	color: #4779bd;
    margin-left: 30px;
	font-weight:600;
}

p.mtext{
   color: #000000;
   margin-left: 45px;
}

p.mtext2{
   color: #000000;
   margin-left: 30px;
      margin-right: 5px;
   	font-size: 11px;
}


p.mtext3{
   color: #000000;
   margin-left: 10px;
   margin-right: 5px;
}

p.mname{
	color: #4779bd;
    margin-right: 20px;
	text-align:right;
	font-weight:600;
}


#pc_area{
    display:none;
  }
#phone_area{
    display:block;
  }

#phone_bg {
	width: 100%;
	background-color: #4779bd;
	margin-right: auto;
	margin-left: auto;
	text-align: center;

}
#phone_base {
	width:320px;
	background-color: #fff;
	margin-right: auto;
	margin-left: auto;
	text-align: center;

}
#phone_contents {
	width:320px;
	background-color: #fff;
	margin-right: auto;
	margin-left: auto;
	text-align: left;

}

#mform {
	width: 100%;

}

.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px;
  background: #fff;
}



#footer{
	width: 100%;
	background-color: #4779BD;
	margin-right: auto;
	margin-left: auto;

}
#footer .inner {
	width: 100%;;
	margin-right: auto;
	margin-left: auto;
	background-color: #4779BD;

}

#footer #footer-text {
	font-size: 10px;
	color: #FFF;
	line-height: 1.5;
}



/* チェックボックスは非表示に */
.drawer-hidden {
  display: none;
}

/* ハンバーガーアイコンの設置スペース */
.drawer-open {
  display: flex;
  height: 60px;
  width: 60px;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 100;/* 重なり順を一番上に */
  cursor: pointer;
}

/* ハンバーガーメニューのアイコン */
.drawer-open span,
.drawer-open span:before,
.drawer-open span:after {
  content: '';
  display: block;
  height: 3px;
  width: 25px;
  border-radius: 3px;
  background: #333;
  transition: 0.5s;
  position: absolute;
}

/* 三本線のうち一番上の棒の位置調整 */
.drawer-open span:before {
  bottom: 8px;
}

/* 三本線のうち一番下の棒の位置調整 */
.drawer-open span:after {
  top: 8px;
}

/* アイコンがクリックされたら真ん中の線を透明にする */
#drawer-check:checked ~ .drawer-open span {
  background: rgba(255, 255, 255, 0);
}

/* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
#drawer-check:checked ~ .drawer-open span::before {
  bottom: 0;
  transform: rotate(45deg);
}

#drawer-check:checked ~ .drawer-open span::after {
  top: 0;
  transform: rotate(-45deg);
}
  
/* メニューのデザイン*/
.drawer-content {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 100%;/* メニューを画面の外に飛ばす */
  z-index: 99;
  background: #fff;
  transition: .5s;
  opacity: 0.9;


}

/* アイコンがクリックされたらメニューを表示 */
#drawer-check:checked ~ .drawer-content {
  left: 0;/* メニューを画面に入れる */
}