@charset "utf-8";
/*各cssの読み込み
------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*日本地図用css（list_chintai.html用）*/
@import url(map.css);
/*一覧ページ用css*/
@import url(list.css?1sdd);
/*トップページのメイン画像用css*/
@import url(mainimg.css);
/*全端末（PC・タブレット・スマホ）共通設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*全体の設定
---------------------------------------------------------------------------*/
body {
  margin: 0px;
  padding: 0px;
  color: #333; /*全体の文字色*/
  font-family: 丸フォーク R, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  font-size: 16px; /*文字サイズ*/
  line-height: 2; /*行間*/
  background: #fdf5e5; /*背景色*/
  -webkit-text-size-adjust: none;
}
h1, h2, h3, h4, h5, p, ul, ol, li, dl, dt, dd, form, figure, form, select, input, textarea {
  margin: 0px;
  padding: 0px;
  font-size: 100%;
  font-weight: normal;
}
ul {
  list-style-type: none;
}
img {
  border: none;
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}
table {
  border-collapse: collapse;
  font-size: 100%;
  border-spacing: 0;
}
iframe {
  width: 100%;
}
video, audio {
  max-width: 100%;
}
/*リンク（全般）設定
---------------------------------------------------------------------------*/
a {
  color: #333; /*リンクテキストの色*/
  transition: 0.5s; /*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
}
a:hover {
  color: #6fbfd1; /*マウスオン時の文字色*/
  text-decoration: none; /*マウスオン時に下線を消す設定。残したいならこの１行削除。*/
}
/*マウスオン時の画像*/
a:hover img {
  opacity: 0.8; /*80%色がついた状態*/
}
/*inner共通
---------------------------------------------------------------------------*/
.inner {
  max-width: 1300px; /*サイトの最大幅*/
  margin: 0 auto;
}
/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
  position: relative;
  
  height: auto; /*高さ*/
  color: #301206; /*文字色*/
}
/*ロゴ画像*/
header #logo {
  width: 400px; /*ロゴ画像の幅*/
  float: left; /*左に回り込み*/
  margin-top: 20px; /*ロゴの上にあける余白。ヘッダー内の上下の配置バランスをここで調整して下さい。*/
  margin-left: 5%; /*ロゴの左側にあける余白。*/
	 margin-bottom: 10px;
	
}

 
/*ログイン（ヘッダー右側のログイン）
---------------------------------------------------------------------------*/
header .login a {
  display: inline-block;
  text-decoration: none;
  float: right; /*右に回り込み*/
  margin-right: 3%; /*右に空けるスペース*/
  margin-top: 10px; /*上に空けるスペース。ヘッダー内の上下の配置バランスをここで調整して下さい。*/
  border: 1px solid #7a6159; /*枠線の幅、線種、色*/
 
  color: #7a6159; /*文字色*/
  padding: 5px 30px 5px 30px; /*上、右、下、左へのボタン内の余白*/
  border-radius: 4px; /*角丸のサイズ*/
  font-size: 14px; /*文字サイズ*/
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); /*ボックスの影。右へ、下へ、ぼかし幅*/
  letter-spacing: 0.2em; /*文字間隔を少し広くとる指定*/
}
/*マウスオン時*/
header .login a:hover {
  background-color: #eb7573; /*背景色だけ変更する*/
  color: #fff; /*も地色*/
}
/*TELブロック*/
header address {
	 display: inline-block;
  text-decoration: none;
   position: absolute;
  right: 10%; /*ヘッダーブロックの右からの配置指定*/
  top: 50px; /*ヘッダーブロックの上からの配置指定*/
  margin-right: 10%; /*右に空けるスペース*/
  margin-top: 0px; /*上に空けるスペース。ヘッダー内の上下の配置バランスをここで調整して下さい。*/
  font-style: normal;
	width:300px;
 
  text-align: center; /*内容をセンタリング*/
  font-size: 100%; /*文字サイズ*/
  line-height: 2; /*行間を少し狭く*/
  text-shadow: 1px 1px 3px #fff, -1px -1px 3px #fff;
	color: #4b366e; /*文字色*/
}
/*TELブロックの電話番号部分*/
header address .tel {
  color: #333; /*文字色*/
  font-size: 140%; /*文字サイズ*/
  background: url("../images/mail.png") no-repeat left center / 60px; /*電話アイコンの読み込み。左(left)に、上下中央(center)に配置。画像幅26px。*/
  padding-left: 80px; /*電話アイコン部分の余白をここで作る*/
}
/*メインメニューのブロック
---------------------------------------------------------------------------*/
/*メニューブロック*/
#menubar {
  clear: both;
  height: 65px; /*メニューの高さ。下の「#menubar ul li a」の「height」と「padding-top」の数字を合計した数字に合わせる。*/
  text-align: center; /*文字を中央に*/
  background: -moz-linear-gradient(to bottom,#7a6159,#2b1b1b 30%,#7a6159); 
background: -webkit-linear-gradient(to bottom,#7a6159,#2b1b1b 30%,#7a6159); 
background: linear-gradient(to bottom,#7a6159,#2b1b1b 30%,#7a6159);  /*背景色*/
  border-bottom: 1px solid #fff; /*下線の幅、線種、色*/
}
/*メニュー１個あたりの設定*/
#menubar li {
  float: left; /*左に回り込み*/
  width: 25%; /*メニュー幅（100÷6個=16.66%）　もし４個にするなら100÷4=25%になる。*/
}
#menubar li a {
  text-decoration: none;
  display: block;
  line-height: 1.6; /*行間を少し狭く*/
  color: #fff; /*文字色*/
  height: 50px; /*高さ*/
  padding-top: 15px; /*上に追加する余白*/
  border-right: 1px solid #222222; /*メニューの右側の線の幅、線種、色（古いブラウザ用）*/
  border-right: 1px solid rgba(34, 34, 34, 0.5); /*右の線の幅、線種、255,255,255は白の事で0.5は50%色がついた状態の事。*/
}
/*１つ目のメニューへの追加設定*/
#menubar li:first-child a {
  border-left: 1px solid #222222; /*メニューの線の幅、線種、色（古いブラウザ用）*/
  border-left: 1px solid rgba(34, 34, 34, 0.5); /*左の線の幅、線種、255,255,255は白の事で0.5は50%色がついた状態の事。*/
}
/*飾り文字*/
#menubar li span {
  display: block;
  font-size: 9px; /*文字サイズ*/
  font-weight: normal; /*文字を太字でなく標準に戻す設定*/
  letter-spacing: 0.2em; /*文字間隔を少しあける設定*/
  opacity: 0.5; /*透明度50％*/
}
/*マウスオン時と、現在表示中(current)のメニューの設定*/
#menubar li a:hover, #menubar li.current a {
  //    border-bottom: 5px double #cf1502;	/*背景色*/
}
/*スマホ用メニューを表示させない*/
#menubar-s {
  display: none;
}
/*３本バーアイコンを表示させない*/
#menubar_hdr {
  display: none;
}
/*ドロップダウンメニュー用
----------------------------------------------------------------------------------------------------------------------------------*/
/*メニューブロック*/
#menubar ul.ddmenu {
  position: absolute;
  visibility: hidden;
  z-index: 10;
  padding-top: 1px;
  width: 20%; /*幅。上の「#menubar li」と合わせる。*/
  font-size: 12px; /*文字サイズ*/
}
/*メニュー１個あたりの設定*/
#menubar ul.ddmenu li {
  float: none;
  width: 100%;
}
#menubar ul.ddmenu li a {
  width: 100%;
  height: auto;
  font-weight: normal;
  border: none; /*線を一旦リセット*/
  border-bottom: 1px solid #fff; /*下の線の幅、線種、色*/
  background: #000; /*背景色（古いブラウザ用）*/
  background: rgba(254, 213, 211, 0.7); /*背景色。0,0,0は黒の事で0.7は70%色がついた状態の事。*/
  color: #000; /*文字色*/
  padding: 10px 0; /*上下、左右への余白*/
}
/*ドロップダウンメニュー内の見出し*/
#menubar ul.ddmenu li.title a {
  background: #6fbfd1; /*背景色*/
  cursor: default; /*カーソルをリンク用でなくデフォルトの矢印にしておく*/
  padding: 3px 0; /*上下、左右への余白*/
}
/*マウスオン時*/
#menubar ul.ddmenu li a:hover {
  background: #eb7573; /*背景色*/
}
/*見出しのマウスオン時*/
#menubar ul.ddmenu li.title a:hover {
  background: #6fbfd1;
}
/*fixmenu設定（メニューが画面上部に到達した際のスタイル）
---------------------------------------------------------------------------*/
/*上部固定メニュー用fixmenu設定*/
body.is-fixed-menu .nav-fix-pos {
  width: 100%;
  z-index: 100;
  position: fixed;
  top: 0;
  left: 0;
}
body.is-fixed-menu header {
  margin-bottom: 75px; /*メニューの高さを指定。menubarのborderが1px分ありますが大差ないので75でOKです。*/
}
/*上の設定の「is-fixed-menu」を「is-fixed」に変更したものをそのまま記入します。fixmenuスクリプトを２つ使う為に必要な設定になります。*/
body.is-fixed .nav-fix-pos {
  width: 100%;
  z-index: 100;
  position: fixed;
  top: 0;
  left: 0;
}
body.is-fixed header {
  margin-bottom: 75px;
}
/*contents（３カラムを囲むブロック）
---------------------------------------------------------------------------*/
#contents {
  clear: both;
  overflow: hidden;
  padding-top: 40px; /*上に空けるボックス内の余白*/
  padding-bottom: 40px; /*下に空けるボックス内の余白*/
}
#content2 {
  clear: both;
  overflow: hidden;
  padding-top: 40px; /*上に空けるボックス内の余白*/
  padding-bottom: 40px; /*下に空けるボックス内の余白*/
	background:url("../images/modernback.png") repeat;
}
#content3 {
  clear: both;
  overflow: hidden;
  padding-top: 40px; /*上に空けるボックス内の余白*/
  padding-bottom: 40px; /*下に空けるボックス内の余白*/
	background-color:#fff4fe;}

/* ハート枠 */
.flametext_heart{
    margin:20px;
    padding:10px;
    border: 4px double #bbb;
}
.flametext_heart::before {
    content:'\f004';
	font-family:'Font Awesome 5 Free';
	font-weight:900;
      display: inline-block;
      position: relative;
      top: -30px;
    left:48%;
      padding: 0 10px;
      background: #fff4fe;
      color: #fe0652;
      font-size: 26px;
}
.flametext_heart li{
    list-style:none;
  
	padding-left: 20px;
	
}
.flametext_heart li a{
    font-family:'HiraMaruPro-W4','ヒラギノ丸ゴ Pro W4','Lucida Grande',Verdana, Arial, Meiryo,'メイリオ',Osaka,sans-serif;
    text-decoration:none;
    color:#914f41; 
	font-size: medium;
	 line-height:2em;
}
.flametext_heart li a::before{
   content:'\f069';
	font-family:'Font Awesome 5 Free';
	font-weight:900;
      display: inline-block;
      position: relative;
    padding-right:8px;
}
.flametext_heart li a:hover{
    color:#bbb; 
}


/*contents-in（mainとsubを囲むブロック）
---------------------------------------------------------------------------*/
#contents-in {
  float: left; /*左に回り込み*/
  width: 80%; /*ブロックの幅*/
}
/*２カラム時*/
.c2 #contents-in {
  float: none;
  width: auto;
}
.w-title {
  height: 200px;
  border-bottom: 1px solid #eee;
 
  position: relative;
	
	 background:#2b1b1b url("../images/w-titlebg-5.png") no-repeat right center;
}
.w-title h2 {
  clear: both;
  padding: 10px 40px; /*上下、左右への余白*/
  font-size: 120%; /*文字サイズ*/
  color: #fff; /*文字色*/
  text-align: left;
  display: inline-block;
  position: absolute;
  top: 70px;
  left: 20px;
}
.w-title h2 span {
  display: block;
  font-size: 64%;
}
/*h2タグの１文字目への追加設定*/
section h2 {
  border-bottom: solid 1px #f4cb5f;
font-size: 16px;
  padding: 5px;
  -pie-background: linear-gradient(top, #fff, #eee);
 text-align: center;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", Helvetica, Sans-Serif;
	margin-bottom: 20px;
}
section h2::first-letter {
  
}
/* ページタイトル */
#contents h3 {
  clear: both;
  margin-bottom: 40px;
  padding: 4px 20px; /*上下、左右への余白*/
  font-size: 170%; /*文字サイズ*/
  border-bottom: 3px solid #4f3b38; /*枠線の幅、線種、色*/
  font-weight: normal;
}
/*mainコンテンツ（中央のブロック）
---------------------------------------------------------------------------*/
#main {
  float: right; /*右に回り込み*/
  width: 75%; /*ブロックの幅*/
}
/*mainコンテンツのh2タグ設定*/
/*mainコンテンツのh3タグ設定*/
#main h3 {
  clear: both;
  margin: 20px;
  padding: 0 15px; /*上下、左右への余白*/
  font-size: 160%; /*文字サイズ*/
  border: none;
  border-left: 3px solid #cf1502; /*左の線の幅、線種、色*/
}
#main h3 span {
  font-size: .6em;
  color: #999;
  display: block;
  line-height: 1;
  padding-bottom: .8em;
}
#main h3 span.size-m {
  font-size: .9em;
}
#main h3 span.size-m2 {
  font-size: .9em;
  color: #999;
  display: inline;
  line-height: 1;
  padding-bottom: .8em;
}
/*mainコンテンツのh4タグ設定*/
#main h4 {
  clear: both;
  margin: 20px;
  padding: 4px 4px 4px 8px; /*上下、左右への余白*/
  font-size: 110%; /*文字サイズ*/
  font-weight: bold;
  background-color: #fff0f0;
}
#main h4.maru:before {
  font-family: "Font Awesome 5 Free";
  font-weight: 400;
  content: "\f111";
  margin: 0 8px 0 0;
  color: #d73c2d;
}
#main p.maru:before {
  font-family: "Font Awesome 5 Free";
  font-weight: 400;
  content: "\f111";
  margin: 0 5px 0 0;
  color: #d73c2d;
}
#main h5 {
  clear: both;
  margin: 0 20px 20px;
  padding: 5px 0; /*上下、左右への余白*/
  font-size: 100%; /*文字サイズ*/
  font-weight: bold;
  border-bottom: 1px solid #333;
}
/*mainコンテンツの段落タグ設定*/
#main p {
  margin: 1em 20px;
}
/*他。微調整。*/
#main p + p {
  margin-top: -5px;
}
#main h2 + p, #main h3 + p {
  margin-top: -10px;
}
ol > p {
  margin-top: -40px;
}
#main section + section {
  margin-top: 30px;
}
/*各ボックスの設定（※compactタイプへの追加設定）*/
.list.compact {
  box-shadow: none;
  width: 28%; /*幅*/
  float: left; /*左に回り込み*/
  margin-left: 0%; /*左側に空けるスペース*/
  border: none; /*行間を狭くする*/
}
/*ボックス内の写真設定*/
.list figure img {
  float: left; /*画像を左へ回り込み*/
  /*写真の右側に空ける余白*/
}
/*ボックス内の写真設定（※compactタイプへの追加設定）*/
.list.compact figure img {
  float: none;
  margin: 0;
  margin-bottom: 5px;
  border: none;
  width: auto;
  padding: 0;
}
/*top menu*/
.menuBox {
  margin-top: 45px;
  margin-bottom: 50px;
	
}
.menuBox article {
  position: relative;
  width: 45%;
  padding: 25px 25px 70px;
  background-color: white;
  border: 2px solid #4f3b38;
margin-bottom: 20px;

}

.menuBox h3 {
  margin-bottom: 20px;
}
.menuBox h4 {
  font-size: 1.6rem;
}
.menuBox ul {
  justify-content: center;
  margin-bottom: 20px;
}
.menuBox ul li {
  padding: 0.5em;
  margin-bottom: 1em;
  border-radius: 5px;
  color: white;
}
.menuBox ul li:nth-of-type(-n+2) {
  margin-right: 10px;
}
.faor {
  background-color: #eabd00;
}
.oppi {
  background-color: #bf545e;
}
.bobl {
  background-color: #ABA363;
}
.menuBox h3 {
  position: relative;
  z-index: 1;
}
.menuBox h3::before {
  content: "";
  position: absolute;
  bottom: -3px;
  left: 50%;
  transform: translateX(-50%);
  width: 208px;
  height: 10px;
  background-color: #fac69d;
  z-index: -1;
}
.menuBox h3 img {
  display: block;
  margin: 0 auto 25px;
}
.menuBox article .more {
  position: absolute;
  bottom: 25px;
  left: 45%;
}
.flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.txt_menuti {
  color: #4B346C;
  font-size: 12px;
  line-height: 1.2em;
  text-align: center;
  font-family: "Folk Medium", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
}
.c_lead {
  padding: 0 45px 0px;
  margin: 10px 0;
  font-size: 1.2rem;
  text-align: left;
  line-height: 1.4em;
}
.txt_type {
  text-align: center;
  color: #CF935C;
line-height: 1.2em;
	
}
.sm-img-right {
  float: right;
  margin: 0 0 20px 20px;
  width: 25%;
  overflow: hidden;
}

.md-img-right {
  float: right;
  margin: 0 0 20px 20px;
  width: 30%;
  overflow: hidden;
}

/*flow*/
ul.flow {
  width: 100%;
  list-style: none;
  padding: 0 10px 15px 10px;
  margin: 15px 0;
	
}
ul.flow:before {
  content: attr(data-title)"";
  display: block;
  padding: 10px;
  margin: 0 -10px 15px -10px;
  text-align: center;
  font-weight: bold;
}
ul.flow li {
  display: table;
  margin: 0 auto;
  display: table;
  position: relative;
  box-sizing: border-box;
  padding: 5px 0;
  border: 2px solid #e8e8e8; /* ブロックボーダー 好みに合わせて */
  background-color: #FFF;
  border-radius: 5px;
  text-align: center;
  width: 90%;
  max-width:360px;
}
ul.flow li:not(:last-child) {
  margin-bottom: 30px;
}
ul.flow li:not(:last-child):after {
  content: "\f103";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  left: 50%;
  bottom: -30px;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  display: block;
  text-align: center;
  color: #37AB9D; /* 矢印の色 好みに合わせて */
}
.flowtitle {
  border-bottom: 3px solid  #65B3AA;
}
.flowtitle span {
  color: #ffffff;
  font-size: 16px;
  line-height: 20px;
  position: relative;
  background: #65B3AA;
  display: inline-block;
  padding: 10px;
}
.flowtitle span:after {
  content: " ";
  position: absolute;
  top: 0;
  left: 100%;
  width: 0;
  height: 0;
  border-width: 0 10px 40px 0;
  border-style: solid;
  border-color: transparent;
  border-bottom-color: #65B3AA;
}
/*box2（３カラムボックス）
---------------------------------------------------------------------------*/
/*ボックス１個あたりの設定*/
.box2 {
	position: relative;
	width: 40%;		/*ボックスの幅*/
	float: left;		/*左に回り込み*/
	text-align: center;	/*内容をセンタリング*/
	padding: 3%;		/*ボックス内の余白*/
	padding-bottom: 75px;	/*下の余白だけ上書き*/
	background: #fff;		/*背景色*/
	border: 1px solid #eeeae2;	/*枠線の幅、線種、色*/
	margin: 0 0 20px 2%;		/*上、右、下、左へのボックスの外に空けるスペース*/
	line-height: 1.5;	/*行間*/
	color: #666;		/*文字色*/
}

/*box2内のp(段落)タグ*/
.box2 p {
	padding: 0 !important;
	
	overflow: hidden;	/*オーバーした分は非表示に。*/
	font-size: 14px;	/*文字サイズ*/
	text-align: center;	/*文字を左よせ*/
}
/*段落タグにリンクが設定された場合の文字色*/
.box2 p a {
	color: #666;
}
/*box2内のh4(見出し)タグ*/
.box2 h4 {
	color: #221B1B;	/*文字色*/
	height: 1.5em;	/*高さ*/
	overflow: hidden;	/*オーバーした分は非表示に。*/
	font-size: large;
	font-weight: bold;
	
}
/*box2内のfigure(画像)タグ*/
.box2 figure {
	
	width:80%;
	margin:0 auto;
	margin-bottom: 10px;	
}
/*box2内のbtn1。本体の設定はこの下のブロックにあります。*/
.box2 p.btn1 {
	height: auto;
	position: absolute;
	text-align: center;
	bottom: 30px;	/*box2の下から30pxの場所に配置*/
	left: 10%;
	width: 80%;		/*ボタンの幅*/
}
.box2 p.btn1 a {
	display: block;
	padding: 5px 0;	/*上下、左右へのボタン内の余白*/
}

/*box1、box2のfigure写真共通設定
---------------------------------------------------------------------------*/
.box2 figure a:hover {
	opacity: 0.8;	/*マウスオン時に80%透明度にする*/
}
/*btn1
---------------------------------------------------------------------------*/
p.btn1 a {
	text-decoration: none;display: inline-block;
	border: 1px solid transparent;	/*枠線の幅、線種、色。transparentは透明の事。*/
	background: #f4cb5f;	/*背景色*/
	color: #fff !important;	/*文字色*/
	border-radius: 3px;		/*角丸のサイズ*/
	padding: 5px 30px;		/*上下、左右へのボタン内の余白*/
	text-align: center;		/*文字をセンタリング*/
}
/*マウスオン時*/
p.btn1 a:hover {
	border: 1px solid #f4cb5f;	/*枠線の幅、線種、色。*/
	background: #fff;			/*背景色*/
	color: #f4cb5f !important;	/*文字色*/
}

/*フッター設定
---------------------------------------------------------------------------*/
footer {
  position: relative;
  clear: both;
	background-image: url("../images/footerback.png");
  
  font-size: 85%; /*文字サイズ*/
  color: #333; /*文字色*/
  border-top: 1px solid #666666;
}
footer a, footer a:hover {
  color: #000; /*リンクテキスト、マウスオン時の文字色*/
}
footer .pr {
  display: block;
  font-size: 80%;
}
/*フッターロゴ
---------------------------------------------------------------------------*/
#footerlogo {
  box-sizing: border-box;
  vertical-align: top;
  display: inline-block;
  width: 30%;
  padding: 20px 0 0 20px;
}
#footerlogo h3 {
  margin: 0;
  padding: 0;
  border: none;
  font-size: 120%;
  line-height: 2em;
}
#footerlogo h3 a {
  color: #000000;
  text-decoration: none;
}
#footerlogo p {
  line-height: 1.4;
  padding: 0;
  color: #000000;
}
#footerlogo .login a {
  display: inline-block;
  text-decoration: none;
  border: 1px solid #ffffff; /*枠線の幅、線種、色*/
  background: #ffffff; /*背景色（古いブラウザ用）*/
  background: #ffffff; /*背景色、アイコンの読み込み。左から25px、上から11pxの場所に配置。画像幅は12px。*/
  color: #222; /*文字色*/
  margin-top: 20px;
  padding: 5px 30px; /*上、右、下、左へのボタン内の余白*/
  border-radius: 4px; /*角丸のサイズ*/
  font-size: 14px; /*文字サイズ*/
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); /*ボックスの影。右へ、下へ、ぼかし幅*/
}
/*マウスオン時*/
#footerlogo .login a:hover {
  background-color: #DCFDFF; /*背景色だけ変更する*/
  color: #111; /*も地色*/
}
#footerlogo .login a:before {
  font-family: "Font Awesome 5 Free";
  content: "\f3c5";
  font-weight: 900;
  margin: 0 10px 0 0;
  color: #d25b30;
}
/*フッターメニュー
---------------------------------------------------------------------------*/
/*ボックス全体*/
#footermenu {
  box-sizing: border-box;
  vertical-align: bottom;
  display: inline-block;
  width: 70%;
  overflow: hidden;
  padding: 20px 0 0; /*上下、左右へのボックス内の余白*/
  font-size: 13px; /*文字サイズを少し小さく*/
  text-align: right;
}
#footermenu ul {
  margin: 0 0 20px;
}
#footermenu ul li {
  display: inline-block;
  margin-right: 1em;
}
#footermenu ul li:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0da";
  font-weight: 900;
  margin: 0 5px 0 0;
  color: #d25b30;
}
/*リンクテキスト*/
#footermenu li a {
  text-decoration: none;
  opacity: 0.7; /*透明度。70%色がでた状態の事。*/
}
/*マウスオン時*/
#footermenu li a:hover {
  opacity: 1; /*透明度。100%色がでた状態の事。*/
}
#footermenu dl {
  display: inline-block;
  padding: 10px 5px;
  margin-right: 10px;
}
#footermenu dd {
  display: inline-block;
  width: 240px;
  margin: 10px;
}
/*コピーライト
---------------------------------------------------------------------------*/
#copyright {
  clear: both;
  color: #fff;
  text-align: center;
  background: #333; /*背景色*/
  margin-top: 40px
}
#copyright a {
  text-decoration: none;
}
/*トップページ内「更新情報・お知らせ」ブロック
---------------------------------------------------------------------------*/
/*ブロック全体の設定*/
#new dl {
  padding: 0px 20px; /*上下、左右へのブロック内の余白*/
  margin-bottom: 20px; /*ブロックの下(外側)に空ける余白*/
}
/*日付設定*/
#new dt {
  float: left;
  width: 9em;
  letter-spacing: 0.1em;
}
/*記事設定*/
#new dd {
  padding-left: 9em;
  border-bottom: 1px solid #ccc; /*下線の幅、線種、色*/
}

.underline {
  border-bottom: 1px solid;
	padding-bottom: 2px;
	
}
#contents .lead {
  font-size: large;
  font-family: "Folk Medium", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
  text-align: center;
}
.pink {
  color: #4b366e;
  font-size: xx-large;
}
#contents .lead2 {
  text-align: center;
  font-family: "Folk Medium", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
  font-size: 120%;
  line-height: 1.6em;
  margin-top: 20px;
  margin-bottom: 30px;
  background-image: url(../images/lead2bg.png);
  background-repeat: no-repeat;
  background-position: 40% 0%;
  background-size: auto auto;
}
#contents .lead3 {
  font-size: 120%;
  font-family: "Folk Medium", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
}
.attl span {
  font-size: medium;
  padding-left: 20px;
  color: #4b366e;
}
.attl {
  font-family: "MS Serif", "New York", serif;
  font-size: large;
}
.explain {
    float: left;
    width: 66%;
    margin-bottom: 20px;
    overflow: hidden;
}
.cost {
  background-color: #E7E4E4;
  padding-top: 25px;
  padding-right: 25px;
  padding-bottom: 25px;
  padding-left: 25px;
  color: #292626;
  font-size: large;
  text-align: right;
  margin: 15px 0;
}

.cost2 {
  background-color: #feecfa;
  padding-top: 25px;
  padding-right: 5px;
  padding-bottom: 25px;
  padding-left: 5px;
  color: #292626;
  font-size: large;
  text-align: right;
  line-height: 2em;
  margin: 15px 0;
}
.cost2 span {
  background-color: #FFFFFF;
  padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
}
.cost2 br{
	display: none;
}
.sp_br{
	display: none;
}
.explain .txt_menuti {
  font-size: 1.6rem;
  text-align: left;
}
.chushaku {
  border: 5px double #F1BBBC;
  padding-top: 20px;
  padding-right: 20px;
  padding-bottom: 20px;
  padding-left: 20px;
  margin-bottom: 20px;
	overflow: hidden;
}
.cost span {
  background-color: #FFFFFF;
  padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
}
#contents p {padding: 0 5%;
}
table.standar {
width: 100%; /* テーブルの横幅を指定する */
	margin: 10px auto;
}
table.standar th, table td {
padding: 10px; /* セルの余白を指定する(上下左右) */
border: 1px solid #E7E4E4; /* セルの境界線を実線で指定する */
	color:#F6060A;
}
table.standar th {
background-color: #E7E4E4; /* ボックスの背景色を指定する */
width: 60%; /* テーブルの見出しの横幅を指定する */
text-align: center; /* セル内のテキストの位置を指定（真ん中）する */
}
#contents .menulead {
    font-size: large;
    margin-bottom: 10px;
}
#contents .lead3 h4 {
    font-weight: 800;
    border-left: 5px solid #ACA2A3;
    padding-left: 10px;
    font-size: large;
	margin:5px auto;
}
tr th .hoso {
    font-weight: lighter!important;
    line-height: 1.2em;
    font-size: small;
}
.fonts {
    color: #FFFFFF;
    font-size: small;
    padding-top: 5px;
    padding-right: 10px;
    padding-bottom: 5px;
    padding-left: 10px;
  }
@media only screen and (max-width:480px){
table.standar {
margin: 10px 5px; /* テーブルの余白を指定する */
}
table.standar th, table td {
width: 90%; /* テーブルの見出しの横幅を指定する */
display: block; /* ブロックレベル要素化する */
border-top: 1px solid #E7E4E4; /* セルの境界線を実線で指定する */
}
	table.standar td{text-align: right;}
}
table.speci {
width: 100%; /* テーブルの横幅を指定する */
	margin: 20px auto;
}
table.speci th, table td {
padding: 10px; /* セルの余白を指定する(上下左右) */
border: 1px solid #ddd7d3; /* セルの境界線を実線で指定する */
}
table.speci th {
background-color: #e2c9b0; /* ボックスの背景色を指定する */
width: 60%; /* テーブルの見出しの横幅を指定する */
text-align: center; /* セル内のテキストの位置を指定（真ん中）する */
}
@media only screen and (max-width:480px){
table.speci {
margin: 10px 5px; /* テーブルの余白を指定する */
}
table.speci th, table td {
width: 90%; /* テーブルの見出しの横幅を指定する */
display: block; /* ブロックレベル要素化する */
border-top: 1px solid #feecfa; /* セルの境界線を実線で指定する */
}
	table.speci td{text-align: right;}	
}



@media screen and (min-width:768px) {
  
  tbody tr .acces {
    border-bottom: 1px dotted #BCB7B7;
    font-weight: normal;
    padding: 20px;
    text-align: left;
	  color: #000000;
  }

  tbody tr td {
    border-bottom: 1px dotted #BCB7B7;
    font-weight: normal;
    padding-left: 10px;
  }


  
  .acc {
    width: 90%;
    margin-bottom: 30px;
  }
}

/*よく頂く質問ページ
---------------------------------------------------------------------------*/
/*質問と答えのボックス全体を囲むブロック*/
.faq {
  padding: 0 20px 10px; /*上、左右、下へのボックス内余白*/
}
/*質問*/
.faq dt {
  font-weight: bold; /*太字にする設定*/
  color: #6fbfd1; /*文字色*/
}
/*回答*/
.faq dd {
  padding-bottom: 10px; /*下に空けるスペース*/
}
/* リスト
---------------------------------------------------------------------------*/
.main-ul {
  margin: 0 0 0 1em;
}
.main-ul li {
  padding-left: 1em;
  text-indent: -1em;
}
.main-ul li:before {
  content: "・";
}
/*テーブル
---------------------------------------------------------------------------*/
caption {
  text-align: left; /*文字を左寄せ*/
}
/*テーブル１行目に入った見出し部分（※caption）*/
.ta1 caption {
  border: 1px solid #ccc; /*テーブルの枠線の幅、線種、色*/
  border-bottom: none; /*下線だけ消す*/
  text-align: left; /*文字を左寄せ*/
  background: #eee; /*背景色*/
  color: #666; /*文字色*/
  font-weight: bold; /*太字に*/
  padding: 10px; /*ボックス内の余白*/
}
/*ta1設定*/
.ta1 {
  table-layout: fixed;
  width: 100%;
  margin: 0 auto 20px;
  background: #fff; /*背景色*/
  color: #666; /*文字色*/
}
.ta1, .ta1 td, .ta1 th {
  word-break: break-all;
  border: 1px solid #ccc; /*テーブルの枠線の幅、線種、色*/
  padding: 10px; /*ボックス内の余白*/
}
/*ta1の左側ボックス*/
.ta1 th {
  width: 140px; /*幅*/
  text-align: center; /*センタリング*/
}
/*labelタグ*/
.ta1 label {
  display: inline-block;
}
/*こだわりアイコンのフロート指定(CMS用)*/
.ta1 td .specialbox {
  float: left;
  width: 80px; /*アイコン幅。*/
  height: 40px; /*アイコンの高さ。*/
}
/*btn（inputタグ用）
---------------------------------------------------------------------------*/
#main input[type="submit"].btn, #main input[type="button"].btn, #main input[type="reset"].btn {
  padding: 5px 10px; /*上下、左右へのボタン内の余白*/
  border: 1px solid #ccc; /*枠線の幅、線種、色*/
  border-radius: 3px; /*角丸のサイズ*/
  background: #eee; /*背景色*/
}
/*マウスオン時の設定*/
#main input[type="submit"].btn:hover, #main input[type="button"].btn:hover, #main input[type="reset"].btn:hover {
  border: 1px solid #999; /*枠線の幅、線種、色*/
  background: #fff; /*背景色*/
}
/*btn（赤い色の大きなボタン）
---------------------------------------------------------------------------*/
a.btn {
  display: block;
  text-decoration: none;
  background: #d90000; /*背景色（古いブラウザ用）*/
  background: linear-gradient(#d90000, #a70000); /*グラデーション*/
  color: #fff; /*文字色*/
  font-size: 20px; /*文字サイズ*/
  text-align: center; /*文字をセンタリング*/
  padding: 10px; /*ボタン内の余白*/
  border-radius: 4px; /*角丸のサイズ*/
  letter-spacing: 0.2em; /*文字間隔を広くとる設定*/
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); /*ボックスの影。右に、下に、ぼかし幅、0,0,0は黒の事で0.3は色が30%ついた状態。*/
  border: 1px solid #a70000; /*枠線の幅、線種、色*/
}
/*マウスオン時*/
a:hover.btn {
  box-shadow: none;
  background: #fff; /*背景色*/
  color: #a70000; /*文字色*/
}
/*btn2（青い色のボタン）
---------------------------------------------------------------------------*/
a.btn2 {
  display: inline-block;
  text-decoration: none;
  background: #2e8bdb; /*背景色（古いブラウザ用）*/
  background: linear-gradient(#51a9f3, #2e8bdb); /*グラデーション*/
  color: #fff; /*文字色*/
  text-align: center; /*文字をセンタリング*/
  padding: 2px 10px; /*上下、左右へのボタン内の余白*/
  border-radius: 2px; /*角丸のサイズ*/
  font-size: 12px; /*文字サイズ*/
}
/*マウスオン時*/
a.btn2:hover {
  opacity: 0.7; /*色が70%ついた状態*/
}
/*PAGE TOP（↑）設定
---------------------------------------------------------------------------*/
/*アニメーションのキーフレーム設定（変更不要）*/
@keyframes scroll {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*デフォルトでは非表示に*/
body .nav-fix-pos-pagetop a {
  display: none;
}
/*ボタンの設定*/
body.is-fixed-pagetop .nav-fix-pos-pagetop a {
  display: block;
  text-decoration: none;
  text-align: center;
  z-index: 100;
  position: fixed;
  width: 50px; /*幅*/
  line-height: 50px; /*高さ*/
  bottom: 50px; /*下から50pxの場所に配置*/
  right: 3%; /*右から3%の場所に配置*/
  background: #000; /*背景色（古いブラウザ用）*/
  background: rgba(0, 0, 0, 0.6); /*背景色。0,0,0は黒の事で0.6は透明度60%の事。*/
  color: #fff; /*文字色*/
  border: 1px solid #fff; /*枠線の幅、線種、色*/
  animation-name: scroll; /*上のアニメーションで指定しているkeyframesの名前（scroll）*/
  animation-duration: 1S; /*アニメーションの実行時間*/
  animation-fill-mode: forwards; /*アニメーションの完了後、最後のキーフレームを維持する*/
}
/*マウスオン時*/
body.is-fixed-pagetop .nav-fix-pos-pagetop a:hover {
  background: #999; /*背景色*/
}
/*トップページのNEWアイコン
---------------------------------------------------------------------------*/
.newicon {
  background: #F00; /*背景色*/
  color: #FFF; /*文字色*/
  font-size: 70%;
  line-height: 1.5;
  padding: 2px 5px;
  border-radius: 2px;
  margin: 0px 5px;
  vertical-align: text-top;
}
/*checkブロック。赤い注意書きブロックです。
---------------------------------------------------------------------------*/
p.check {
  background: #ff0000;
  color: #fff;
  padding: 10px 25px !important;
  margin-bottom: 20px;
}
p.check a {
  color: #fff;
}
/*ul.disc,olタグ
---------------------------------------------------------------------------*/
ul.disc {
  list-style: disc;
  padding: 0 20px 20px 45px;
}
ol {
  padding: 0 20px 20px 47px;
}
#main > ul > li, #main > ol > li {
  margin-left: 1.5em;
}
/*その他
---------------------------------------------------------------------------*/
.look {
  background: #eee;
  border: 1px solid #ccc;
  padding: 5px 10px;
  border-radius: 4px;
}
.mb15, .mb1em {
  margin-bottom: 15px !important;
}
.mb10 {
  margin-bottom: 10px !important;
}
.mb30 {
  margin-bottom: 30px !important;
}
.clear {
  clear: both;
}
.color1, .color1 a {
  color: #6fbfd1 !important;
}
.color2, .color2 a {
  color: #999 !important;
}
.color3, .color3 a {
  color: #ED6191;
}
.red, .red a {
  color: #ff0000 !important;
}
.pr {
  font-size: 10px;
}
.wl {
  width: 96%;
}
.ws {
  width: 50%;
}
.c {
  text-align: center;
}
.r {
  text-align: right;
}
.l {
  text-align: left;
}
img.fr {
  float: right;
  margin-left: 10px;
  margin-bottom: 10px;
}
img.fl {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
}
.big1 {
  font-size: 24px;
  letter-spacing: 0.2em;
}
.mini1 {
  font-size: 11px;
}
.sh {
  display: none;
}
.subt {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: normal;
  font-size: 80%;
}
.add {
  background-color: #EFEFEF;
  border: 1px solid #CCC;
  padding: 1em 2em;
  width: 80%;
  margin-right: auto;
  margin-left: 0;
  margin-bottom: 20px;
}
.col-3 {
  font-size: 0;
  margin: 20px;
}
.col-3 li {
  display: inline-block;
  font-size: 1rem;
  width: 31%;
  margin: 1%;
}
/*画面幅1301px以上の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width:1301px) {
  /*inner共通
---------------------------------------------------------------------------*/
  .inner {
    width: 1301px; /*サイトの幅。この指定がないと上部メニューが一瞬段落ちする場合があります。*/
  }
  /*メインメニューとドロップダウンメニューの設定変更。
メニュー数が6個なので、1301÷6=216pxになります。
---------------------------------------------------------------------------*/
  #menubar li, #menubar ul.ddmenu {
    width: 259px;
  }
}
/*画面幅1300px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1300px) {
  /*contents（３カラムを囲むブロック）
---------------------------------------------------------------------------*/
  #contents {
    margin: 0 1%; /*上下、左右へのコンテンツの外側へ空けるスペース*/
  }
  #menubar li, #menubar ul.ddmenu {
    width: 20%;
  }
  /*TELブロック*/
  header address {
    font-style: normal;
    position: absolute;
    right: 0%; /*ヘッダーブロックの右からの配置指定*/
    top: 80px; /*ヘッダーブロックの上からの配置指定*/
    text-align: center; /*内容をセンタリング*/
    font-size: 100%; /*文字サイズ*/
    line-height: 1.5; /*行間を少し狭く*/
    text-shadow: 1px 1px 3px #fff, -1px -1px 3px #fff;
  }
}
/*画面幅900px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:900px) {
  /*ログイン（ヘッダー右側のログイン）
---------------------------------------------------------------------------*/
	header{
		position: relative;
		height: 130px;
	}
	
	 header #logo {
	text-align: left;
   position: absolute;
    left: 3%; /*ヘッダーブロックの右からの配置指定*/
    top: 10px; /*ヘッダーブロックの上からの配置指定*/
    padding: 8px 0;
    width: 30%;
  }
  /*TELブロック*/
  header address {
    font-style: normal;
    position: absolute;
    right: 5%; /*ヘッダーブロックの右からの配置指定*/
    top: 20px; /*ヘッダーブロックの上からの配置指定*/
    text-align: center; /*内容をセンタリング*/
    font-size: 90%; /*文字サイズ*/
    line-height: 1.5; /*行間を少し狭く*/
    text-shadow: 1px 1px 3px #fff, -1px -1px 3px #fff;
  }
  .menuBox article {
    position: relative;
    width: 90%;
    padding: 20px 10px 60px;
    background-color: white;
    border: 2px solid #4b366e;
    margin-bottom: 20px;
  }
	
	.menuBox .more {
  position: absolute;
  bottom: 25px;
  left: 50%;
}
  /*fixmenu設定（メニューが画面上部に到達した際のスタイル）
---------------------------------------------------------------------------*/
  /*fixmenuから折りたたみメニューになるのでリセット。*/
  body.is-fixed-menu header, body.is-fixed header {
    margin-bottom: 0px;
  }
  /*メインメニュー
---------------------------------------------------------------------------*/
  /*アニメーションのフレーム設定。全100コマアニメーションだと思って下さい。透明(0%)から色を100%出すアニメーション指定。*/
  @keyframes menu1 {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  /*スマホ用メニューブロック*/
  #menubar-s {
    display: block;
    overflow: hidden;
    z-index: 10;
    position: absolute;
    top: 100px; /*上から100pxの場所に配置*/
    width: 100%;
    animation-name: menu1; /*上のkeyframesの名前*/
    animation-duration: 0.5S; /*アニメーションの実行時間。0.5秒。*/
    animation-fill-mode: both; /*アニメーションの待機中は最初のキーフレームを維持、終了後は最後のキーフレームを維持。*/
  }
  /*メニュー１個あたりの設定*/
  #menubar-s li a {
    display: block;
    text-decoration: none;
    padding: 15px 10px 15px 20px; /*上、右、下、左へのメニュー内の余白*/
    border-bottom: 1px solid #fff; /*下の線の幅、線種、色*/
    background: #6fbfd1; /*背景色*/
    font-size: 20px; /*文字サイズ*/
    color: #fff; /*文字色*/
  }
  /*英語表記（飾り文字）*/
  #menubar-s li a span {
    display: block;
    font-size: 12px; /*文字サイズ*/
  }
  /*PC用メニューを非表示にする*/
  #menubar {
    display: none;
  }
  /*３本バーアイコン設定
---------------------------------------------------------------------------*/
  /*３本バーブロック*/
  #menubar_hdr {
    display: block;
    position: absolute;
    top: 26px; /*上から24pxの場所に配置*/
    right: 3%; /*右から3%の場所に配置*/
    border: 1px solid #fff; /*枠線の幅、線種、色*/
  }
  /*アイコン共通設定*/
  #menubar_hdr.close, #menubar_hdr.open {
    width: 50px; /*幅*/
    height: 50px; /*高さ*/
    border-radius: 50%; /*円形にする。この行削除すれば正方形になります。*/
  }
  /*三本バーアイコン*/
  #menubar_hdr.close {
    background: #6fbfd1 url(../images/icon_menu.png) no-repeat center top/50px; /*背景色、アイコンの読み込み、上半分(top)を表示、幅50px*/
  }
  /*閉じるアイコン*/
  #menubar_hdr.open {
    background: #6fbfd1 url(../images/icon_menu.png) no-repeat center bottom/50px; /*背景色、アイコンの読み込み、上半分(bottom)を表示、幅50px*/
  }
  /*contents（３カラムを囲むブロック）
---------------------------------------------------------------------------*/
  #contents {
    padding: 20px 2% 20px; /*上下、左右へのボックス内の余白*/
  }
  /*main,sub,side,contents-in
---------------------------------------------------------------------------*/
  #main, #sub, #side, #contents-in {
    float: none;
    width: auto;
    overflow: hidden;
  }
  /*その他
---------------------------------------------------------------------------*/
  body.s-n #sub, body.s-n #side {
    display: none;
  }
  .sh {
    display: block;
  }
  .pc {
    display: none;
  }
  .adam .b1 {
    position: absolute;
    top: 65%; /*画像の左上に配置*/
    left: 20%;
    margin: 0; /*余計な隙間を除く*/
    color: #222; /*文字を白に*/
    font-size: 2em;
    line-height: 1; /*行高は1に*/
    padding: 5px 10px;
    display: inline-block;
  }
  .adam .b2 {
    position: absolute;
    top: 65%; /*画像の左上に配置*/
    left: 60%;
    margin: 0; /*余計な隙間を除く*/
    color: #222; /*文字を白に*/
    font-size: 2em;
    line-height: 1; /*行高は1に*/
    padding: 5px 10px;
    display: inline-block;
  }
  #footerlogo, #footermenu {
    display: block;
    width: 100%;
    text-align: center;
    padding: 40px 20px 0;
  }
  #footerlogo h3 {
    margin: 0 auto;
  }
}
/*画面幅900px以上の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media (min-width : 900px) {
  .pc-none {
    display: none;
  }
}
/*画面幅900px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media (max-width : 900px) {
  .sm-none {
    display: none;
  }
  /*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
  /*ヘッダーブロック*/
  header {
    text-align: left;
  }
  /*ロゴ画像*/
 
  /*ログイン（ヘッダー右側のログイン）
---------------------------------------------------------------------------*/
  header .login a {
    float: none;
    margin: 0;
  }
  #footermenu dl {
    margin: 0;
  }
	.inner section p {padding-left: 10px;
}
}
/*画面幅768px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media (max-width : 768px) {
  .sm-center {
    text-align: center;
  }
			.cost2 br{
	display: inline;
line-height: 2em;
}

  .md-img-right {
    float: none;
    margin: 10px auto;
    width: 60%;
  }
  .explain {
    float: none;
    width: 90%;
    margin: 0 auto 20px;
    border-bottom: 1px #F3E2C9 solid;
    overflow: hidden;
  }


}

/*画面幅600px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:600px) {
  /*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
  /*ヘッダーブロック*/
  header {
    text-align: center;
  }
  /*ロゴ画像*/
  header #logo {
    float: none;
    margin: 0 auto;
    padding: 8px 0 10px;
    width: 60%;
	  
  }

  /*ログイン（ヘッダー右側のログイン）
---------------------------------------------------------------------------*/
  header .login a {
    float: none;
    margin: 20px auto 10px;
  }
  #footermenu dl {
    margin: 0;
  }
  /*各ボックスの設定*/
  .list.compact {
    float: none;
    margin: 0 auto;
    width: 100%;
    padding-top: 3%;
  }
  /*ボックス内の写真設定*/
  .list.compact img {
    width: 90%;
  }
  /*最後のボックスへの追加設定*/
  .list.compact:last-of-type {
    margin-bottom: 15px;
    border-bottom: 1px solid #dcdcdc;
  }
  .w-title {
    height: 100px;
    background: #b3d4ea url("../images/w-titlebg-5.png") no-repeat center center;
    background-size: cover;
  }
  .w-title h2 {
    position: absolute;
    top: 40px;
    left: 0;
  }
  .col-3 li {
    width: 100%;
    margin: 10px 0 !important;
  }
}
/*画面幅480px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:480px) {
  /*全体の設定
---------------------------------------------------------------------------*/
  body {
    font-size: 12px; /*文字サイズ*/
  }
  #contents .lead {
    font-size: 14px;
    font-family: "Folk Medium", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
    text-align: center;
    line-height: 2em;
	margin: 10px 20px 10px;
  }
  #contents .lead2 {
    text-align: center;
    font-family: "Folk Medium", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
    font-size: 120%;
    line-height: 1.6em;
    margin: 20px 10px 30px;
  }
	#contents .lead2:before {
     content: url("../images/lead2bgs.png");
  display: block;/*前後に改行を入れる*/
  }
  .lead3 {
    text-align: center;
    margin: 20px 10px 30px;
  }
			.sp_br{
	display: inline;

}

	/* スライダー */
#slider {
  width: 100%;
	height: 180px;
}
	#slider li {
  margin: 0;
  padding: 0;
  height: auto;
}
#slider li img {
  width: 100%;
  height: 180px;
}
  /*contents（３カラムを囲むブロック）
---------------------------------------------------------------------------*/
  #contents {
    line-height: 1.5; /*行間*/
  }
  /*mainコンテンツ
---------------------------------------------------------------------------*/
  #main h2, #main h3 {
    //	
    //	padding-left: 10px;
    //	padding-right: 10px;
    //	margin-bottom: 10px;
  }
  /*段落タグ設定*/
  #main p {
    padding: 0px 10px 10px;
  }
	header{
		position:static;
		height: 200px;
		text-align: center;
		
	}
 

	header #logo {
	
    float: none;
    margin: 0 auto;
    padding: 8px 0 10px;
    width: 200px;
		
	  
  }
  /*TELブロック*/
  header address {
    font-style: normal;
    position: absolute;
   
    top: 100px; /*ヘッダーブロックの上からの配置指定*/
    text-align: center; /*内容をセンタリング*/
    font-size: 90%; /*文字サイズ*/
    line-height: 1.5; /*行間を少し狭く*/
    text-shadow: 1px 1px 3px #fff, -1px -1px 3px #fff;
  }

/*box2（３カラムボックス）
---------------------------------------------------------------------------*/
/*ボックス１個あたりの設定*/
.box2 {
	width: auto;		/*ボックスの幅*/
	float: none;		/*左に回り込み*/
	padding: 3%;		/*余白の上書き*/
	margin: 0 0 20px 0;		/*上、右、下、左へのボックスの外に空けるスペース*/
	line-height: 2;	/*行間*/
}
/*box2内のp(段落)タグ*/
.box2 p {
	height: auto;	/*高さ。*/
	font-size: 100%;		/*文字サイズ*/
	margin-bottom: 5px;
}
/*box2内のh4(見出し)タグ*/
.box2 h4 {
	height: auto;	/*高さ*/
}
/*box2内のbtn1*/


  /*submenu（sub,sideのメニュー）
---------------------------------------------------------------------------*/
  /*メニュー１個ごとの設定*/
  #sub .submenu li a, #side .submenu li a {
    padding: 10px; /*ボックス内の余白*/
  }
  /*フッターメニュー
ウィンドウ幅が狭くなって見づらくなるので、１列にレイアウト変更。
---------------------------------------------------------------------------*/
  #footermenu ul {
    float: none;
    width: auto;
  }
  /*こだわりアイコン
---------------------------------------------------------------------------*/
  /*アイコン共通*/
  .icon {
    font-size: 9px; /*文字サイズ*/
  }
  /*一覧ページのボックス内の右上のマーク
（CMSの場合は管理ページだと「オプション1」～のプルダウン、setup.phpだと「オプション選択肢」に関連します）
---------------------------------------------------------------------------*/
  /*option1〜option2、と、newアイコン共通*/
  .option1, .option2, .new {
    font-size: 9px; /*文字サイズ*/
    padding: 0 10px; /*上下、左右へのアイコン内の余白*/
    line-height: 14px; /*高さ*/
    right: 15px; /*右から15pxの場所に配置*/
  }
  /*トップページ内「更新情報・お知らせ」ブロック
---------------------------------------------------------------------------*/
  /*ブロック全体の設定*/
  #new dl {
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 10px; /*ブロックの下(外側)に空ける余白*/
  }
  /*よく頂く質問ページ
---------------------------------------------------------------------------*/
  /*質問と答えのボックス全体を囲むブロック*/
  .faq {
    padding: 0 10px 10px; /*上、左右、下へのボックス内余白*/
  }
  /*btn（赤い色の大きなボタン）
---------------------------------------------------------------------------*/
  a.btn {
    font-size: 16px; /*文字サイズ*/
    letter-spacing: normal; /*文字間隔を標準に戻す*/
  }
  /*テーブル(ta1)
---------------------------------------------------------------------------*/
  /*余白の上書き*/
  .ta1 caption, .ta1 th, .ta1 td {
    padding: 5px;
  }
  /*テーブル内の左側*/
  .ta1 th {
    width: 100px;
  }
  /*ul.disc,olタグ
---------------------------------------------------------------------------*/
  ul.disc {
    list-style: disc;
    padding: 0 20px 20px 30px;
  }
  ol {
    padding: 0 20px 20px 30px;
  }
  /*その他
---------------------------------------------------------------------------*/
  .ws, .wl {
    width: 94%;
  }
  .big1 {
    font-size: 18px;
    letter-spacing: normal;
  }
  img.fr, img.fl {
    float: none;
    margin: 0;
    width: 100%;
  }
  .sh {
    display: block;
  }
  .pc {
    display: none;
  }
  .sm-img-right {
    float: none;
    margin: 10px auto;
    width: 80%;
	
  }

}
/* pkobo_news
---------------------------------------------------------------------------*/
/* clearfix */
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}
.clearfix {
  display: inline-block;
}
/* for macIE \*/
* html .clearfix {
  height: 1%;
}
.clearfix {
  display: block;
}
ul#newsList {
  margin: 0 0 15px;
  padding: 0;
  font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
ul#newsList li {
  color: #666;
  font-size: 16px;
  margin: 0;
  padding: 1em;
  margin-bottom: 3px;
  border-bottom: 1px dotted #ccc;
  line-height: 120%;
  list-style-type: none;
}
ul#newsList li a {
  color: #333;
  text-decoration: none;
}
ul#newsList li a:hover {
  color: #333;
  text-decoration: underline;
}
.catName {
  display: inline-block;
  padding: 3px 8px;
  border: 1px solid #ccc;
  border-radius: 6px;
  font-size: 11px;
  line-height: 100%;
  margin: 0 2px;
}
.newMark {
  display: inline-block;
  border: 1px solid #F00;
  padding: 1px 4px;
  font-size: 11px;
  line-height: 100%;
  background: #F00;
  color: #fff;
  box-shadow: 1px 1px 1px #999;
  border-radius: 8px;
  font-style: italic;
}
.comment {
  display: block;
  padding: 3px 0;
  float: left;
  overflow: hidden;
  width: 500px; /* 本文部分の幅。ここは特に設置ページ合わせて変更下さい */
}
.thumbNailWrap {
  display: block;
  width: 148px;
  float: left;
  height: 100px;
  overflow: hidden;
}
/* Pager style（外部化可） */
.pager {
  text-align: right;
  padding: 10px;
  clear: both;
}
/*ページャーボタン*/
.pager a {
  border: 1px solid #999;
  border-radius: 5px 5px 5px 5px;
  color: #333;
  font-size: 12px;
  padding: 3px 7px 2px;
  text-decoration: none;
  margin: 0 1px;
}
/*現在のページのボタン*/
.pager a.current {
  background: #999;
  border: 1px solid #999;
  border-radius: 5px 5px 5px 5px;
  color: #fff;
  font-size: 12px;
  padding: 3px 7px 2px;
  margin: 0 1px;
  text-decoration: none;
}
.pager a:hover {
  background: #999;
  color: #fff;
}
.overPagerPattern {
  padding: 0 2px;
}
/* /Pager style */
/* 沿革 */
.history {
  list-style: none;
  margin: 20px;
  border-top: 1px solid #ddd;
}
.history > li {
  padding: 1em 0;
  border-bottom: 1px solid #ddd;
}
.history dt {
  font-weight: normal;
}
/* for Desktop */
@media (min-width : 768px) {
  .history > li {
    overflow: hidden;
    margin: 0;
    position: relative;
  }
  .history dt {
    width: 120px;
    display: inline-block;
    vertical-align: top;
  }
  .history dd {
    max-width: 100%;
    display: inline-block;
    vertical-align: top;
  }
  .sm-img-left {
    float: left;
    margin: 10px 40px 10px 0;
  }
}
.history-back {
  margin-top: 30px;
  text-align: center;
}
/*タブ切り替え全体のスタイル*/
.tabs {
  padding: 30px 0;
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
/*タブのスタイル*/
.tab_item {
  display: inline-block;
  width: 44%;
  margin: 0 2%;
  height: 50px;
  border: 1px solid #546961;
  background: #fff;
  line-height: 50px;
  font-size: 16px;
  text-align: center;
  color: #546961;
  font-weight: bold;
  transition: .4s;
}
.tab_item:hover {
  background-color: #b5ead5;
  color: #111;
}
/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}
/*タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  padding: 40px 20px 0;
  clear: both;
  overflow: hidden;
  text-align: left;
}
/*選択されているタブのコンテンツのみを表示*/
#english:checked ~ #english_content, #japanese:checked ~ #japanese_content, #feature:checked ~ #feature_content, #procedure:checked ~ #procedure_content, #explanation:checked ~ #explanation_content {
  display: block;
}
/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
  background-color: #b5ead5;
  color: #111;
}
/* 表 */
#main table {
  margin: 20px 20px 40px;
  max-width: 100%;
}
#main table th, #main table td {
  border: 1px solid #ccc;
  padding: 5px 10px;
  font-size: 86%;
}
#main table th {
  background: #f6f6f6;
  font-weight: normal;
}

/* スライダー */
#slider {
  width: 100%;
}
#slider li {
  margin: 0;
  padding: 0;
  height: auto;
}
#slider li img {
  width: 100%;
  vertical-align: bottom;
}
.slick-slide:not(.slick-center) {
  //  opacity: .3;
}