@charset "UTF-8";
/* ==================================================
共通
================================================== */
* {
  margin: 0; 
	padding: 0;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  -ms-box-sizing:border-box;
  -o-box-sizing:border-box;
}

body {
	margin:0; /* 変更しない */
	padding:0; /* 変更しない */
	font-size:87.5%; /* 14pxのとき */
	line-height:1.6; /* 変更しない */
	font-family: 'YuGothic','Yu Gothic','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#000000;
-webkit-text-size-adjust: 100%;
  width: 100%;
	height: 100%;
}

ul, dl { margin: 0; padding: 0; list-style:none; }

.sp { display: none; }
.navi_area p { display: none; }

.red { color: #ab3636; }

a { color: #000000; text-decoration:none; }

.tolink {
	background: url(../img/tri_green.jpg) 5% center no-repeat;
	padding-left: 1.8em;
}

.small_txt { font-size: 78%; }

/* ==================================================
構造
================================================== */
#whole {
}


.inner { width: 1054px; margin: 0 auto; }

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

.skip {
  text-align: center;
  padding: .3em 0;
  top: auto;
  width : 1px;
  font-size: .1%;
  line-height: .1;
  position: absolute;
  left: -100%;
  z-index: 9999;
  background-color: #f1f9e4;
}

.skip:focus {
  display: block;
  width: 100%;
  font-size: 100%;
  line-height: 1.5em;
  top: 0;
  left: 0;
}

/*noscript指定*/
.noscript {
  margin: 0 auto .3em;
  padding: .3em 1em;
  background-color: #eee;
  font-size: 80%;
}
/*noscript指定ここまで*/

/*
ヘッダー
 ________________________________________________*/
#header .logo { float: left; margin-top: 20px; }

#header .navi_area { float: right; }

#header .assist {
	display: -ms-flexbox;
	display: flex;
	float: right;
	margin-bottom: 18px;
}
#header .assist .policy {
	padding: 10px;
}
#header .assist .text a {
	display: block;
	padding: 10px 10px 10px 40px;
	background: url(../img/icon_text.png)no-repeat 10px 50% #eaeaea;
	border-radius: 0 0 0 6px;
	border-right: 1px solid #cccccc;
	margin-left: 16px;
}
#header .assist .lang a {
	display: block;
	padding: 10px 10px 10px 40px;
	background: url(../img/icon_lang.png)no-repeat 10px 50% #eaeaea;
	border-radius: 0 0 6px 0;
}

#header #navi {
	display: -ms-flexbox;
	display: flex;
	clear: both;
	margin: 20px 0 0 0;
}
#header #navi li {
	text-align: center;
	width: 124px;
}

#header #navi li:last-child {
	width: 148px;
}
#header #navi li a { display: block; padding: 20px 0; border-bottom: 4px solid #ffffff;}
#header #navi li a span { display: block; border-right: 1px solid #cccccc; }
#header #navi li:first-child a span { border-left: 1px solid #cccccc; }
#header #navi li a:hover,
#header #navi li.current a { border-bottom: 4px solid #138935; }

.drawr {
    display: block;
    /*position: relative;*/
}

/*
フッター 
________________________________________________*/

#footer {
	border-top: 1px solid #B4B4B4;
	padding: 68px 0 50px 0;
}

#footer .info_area {
	float: left;
	margin-right: 24px;
	padding-bottom: 30px;
}

#footer .info_area img {
	display: block;
	margin-bottom: 24px;
}

#footer_link { display: flex; float: right; width: 820px; }
#footer_link a { 
	margin-left: 20px;
	text-align: center;
	text-decoration: underline;
	position: relative;
}
#footer_link .imgbox { 
	position: relative;
}

#footer_link .imgbox span {
  position: absolute;
  background:#F0F8E6;
  display: block;
  right: 4%;
  bottom: 8%;
  width: 4em;
  height: 4em;
  border-radius: 50%;
  color:#000000;
  text-align: center;
  padding-top: 0.9em;
  line-height: 1.2;
}

#footer_link img { 
	display: block;
	width: 100%;
	margin-bottom: 0.4em;
}

#footer .footer_copy {
	clear: both;
	margin-top: 30px;
	padding: 30px 0;
	border-top: 1px solid #D7D7D7;
}

#footer .footer_copy .tolink {
	float: left;
}
#footer .footer_copy .copyright {
	float: right;
}

/*__ other _____________________________*/
#gopageTop {
  position: fixed;
  bottom: 20px;
  right: 20px;
}

#gopageTop a {
  display: block;
  z-index: 999;
  padding: 8px 0 0 8px;
  text-decoration: none;
  text-align: center;
}
#gopageTop a:hover {
  text-decoration: none;
  opacity: 0.7;
}
