@charset "utf-8";
/* CSS Document */
@font-face {
  font-family: "YuGothic M";
  src: local("Yu Gothic Medium"),
       local("Yu Gothic");
  font-weight: 500;
       /*
         Chrome 58.0.3029.110 (64-bit) では
         "Yu Gothic Medium" を認識しないバグあるため
         "Yu Gothic" と font-weight も併せて指定。
       */
}
* {
	margin: 0px;
	padding: 0px;font-family: "游ゴシック体", YuGothic, "YuGothic M", sans-serif;
}

.clearfix:after{
	content: "";
	clear: both;
	display: block;
}

container {
  padding: 0% 1%;
}

.header {
  display: flex;
  align-items: left;
  justify-content: left;
	text-align: left;
	height: 70px

}



.footer {
  display: flex;
  align-items: center;
  justify-content: center;

}

.content {
  display: flex;
  padding: 0px 0;
}

.main {
  flex: 1 0 auto;

  align-items: top;
  justify-content: center;
	
  margin-right: 0px;
  background: #FFFFFF;

 
}

.side {
  display: none;
  align-items:top;
  justify-content: center;
  position: -webkit-sticky;
  position: sticky;
  top: 10px;
  width: 300px!important;
	height: 800px;
  color: #fff;
  background: #FFFFFF;

}

.drawer-menu{font-size: 17px!important;border-collapse: collapse;}
.drawer-menu li{text-align: left;padding: 0px;border-bottom: 1px dotted #CCCCCC;}



p.resizeimage img { width: auto; }
dt.resizeimage img { width: auto; }
dd.resizeimage img { width: auto; }

/***************** ��{���C�A�E�g *****************/
body{
text-align: center;
margin-top: 0;
margin-bottom: 0;

 }

.wrapper {
margin-right: auto;
margin-left: auto;
width: 1024px;padding:0px 0px;
}

.wrapper0 {
margin-right: auto;
margin-left: auto;
width: 1024px;padding:40px 0px;
}
.wrapper1 {
margin-right: auto;
margin-left:auto;
padding:0px auto;  align-items: center;
  justify-content: center;
text-align: center;
	max-width:1050px;
}

.w_main0{ text-align: left; padding-top: 0px; padding-right: 0px; padding-left: 0px; clear: both; }
.w_main{ text-align: left; padding-top: 15px; padding-right: 0px; padding-left: 0px; clear: both;  }
.parts{margin:0px 5px 0px 5px;padding: 30px 40px;}

/*******************************************************/


/************************* �w�b�_�[ *********************/


#head{display:inline;}

#header {
    height: 30px; display:none;}




.mainmenu{display: block; text-align:left;font-size: 13px;line-height: 20px}
.mainmenu a{text-decoration:none;color:#0087C8;padding: 10px 4px;width: 100%;}
.mainmenu a:hover{color:#000000;}


.sample {text-align: center;padding: 10px;
    background-color: #FFFFFF;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
    }
.sample:hover {
    background-color: #ffc9d7;
    }

.mainmenu2{display: block; text-align:center;font-size: 14px;}
.mainmenu2 a{text-decoration:none;color:#0087C8;}
.mainmenu2 a:hover{color:#000000;}

.sub-menu{}
.sub-menu li{list-style-type: none;}
.sub-menu-item{float: left;width: 127px;padding: 20px 0px;display: block}
.sub-menu-item a:hover{background: #1398A8;display: block}

#menu01{
display: block; text-align:center;font-size: 11px;width: 220px;float:left;margin-top: 10px
}
#menu01 a{ text-decoration:none;color:#000000;}

#menu01 img{ width: 100%;
}
#menu02{
display: inline; text-align:right;font-size: 11px; float: right;margin-top: 20px;
}
#menu02 a{ text-decoration:none;}
#menu02 span{margin:0px 0px;color: #E7E1E1}
#menu02 img{ float:left;
}

#menu03{
display: block; text-align:center;font-size: 11px;float:left;margin-top: 1px
}
#menu03 a{ text-decoration:none;color:#000000;}

#menu03 img{ 
}
#menu04{display: block;  text-align:right;font-size: 11px; float: right;margin-top: 1px;
}
#menu04 img{}

a:hover img
{
opacity:0.5;
filter: alpha(opacity=50);
-ms-filter: "alpha( opacity=50 )";
background: #FFFFFF;
}
#title_smart{ display:none;}
/*********************************************************/


/************************* �t�b�^�[ *********************/
.footer{ font-size: 12px; color: #000000; line-height: 22px; text-align: left; padding-top: 25px; clear: left;background-color: #CBEAFA!important; }
.sub_head_under1_smart{ }
.sub_head_under2_smart{ display:none;}
.sub_head_under1{line-height: 22px;padding:5px; display:block; width: 55%;float: left }
.sub_head_under2{line-height: 26px;padding:5px;display:block; float:right;width: 40%;}

/*********************************************************


/***************** �^�C�g�� *****************************/

/*******************************************************/



/***************** �t�b�g���j���[ ****************************/
.footer_menu{ clear: both; }
.footer_menu2{ text-align: right; height: 300px; width: 100%; padding-top:30px; }


/*******************************************************/


/***************** �g�b�v�y�[�W ****************************/
.top_areahead{ padding:10px 10px 10px 10px; background-color: #FFFFFF;overflow: auto;}
.top_areahead2{ padding:0px 0px 0px 0px; background-color: #D4EEF9;overflow: auto;}

.top_area0{ padding:0px 0px 0px 0px; background-color: #88D6F5;background-image: url("../img/main.png");height: 450px;background-position: center;background-repeat: no-repeat;display: block;width: 100%;background-size:cover;}
.top_area0 img{vertical-align: bottom;}

.top_area3{ padding:0px 0px 0px 0px; background-color: #88D6F5;background-image: url("../img/main02.png");height: 60px;background-position: center;background-repeat: no-repeat;display: block;width: 100%;}

.top_area1{ padding:25px 0px; background-color: #FFFFFF; overflow: auto;max-width: 1050px;margin-left: auto;margin-right: auto}




.top_area2{ padding:15px 10px 30px 10px; background-color: #FBFAE8;}
#tp1{ font-size:16px; padding:0px 3px;}
#tp2{ font-size:12px;padding:1px 3px;}


/*******************************************************/



#headermb {
    height: 30px; display:none;}