@charset "shift_jis";

/*スマホメニューの外枠部分「メニューを表示する」と黒幕の部分、「中身(子メニュー)は、このcssの下の方で編集*/

/*PCは非表示*/
@media screen and (min-width:800px) {
  #nav-drawer {
    display:none;
  }
}

/*「メニューを表示する」の縦位置(タブレット)*/
@media screen and (min-width:480px) and ( max-width:800px){
#nav-drawer {
  position: relative;
  top: 25px;
}
}

/*「メニューを表示する」の縦位置(スマホ)*/
@media screen and (max-width:480px) {
#nav-drawer {
  position: relative;
  top: -5px;
}
}

/*PCは非表示-トップページ*/
@media screen and (min-width:800px) {
  #nav-drawer2 {
    display:none;
  }
}

/*「メニューを表示する」の縦位置(タブレット-トップページ)*/
@media screen and (min-width:480px) and ( max-width:800px){
#nav-drawer2 {
  position: relative;
  top: 5px;
}
}

/*「メニューを表示する」の縦位置(スマホトップページ)*/
@media screen and (max-width:480px) {
#nav-drawer2 {
  position: relative;
  top: -20px;
}
}


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

/*メニューアイコン*/
/*#nav-open {
display: block;
    padding: 0px;
/* 縁取りtext-shadow:1px 1px 0 #000, -1px -1px 0 #000,
              -1px 1px 0 #000, 1px -1px 0 #000,
              0px 1px 0 #000,  0-1px 0 #000,
              -1px 0 0 #000, 1px 0 0 #000;*/
/*    font-size: 18px;
    color: #ffffff;
    font-weight: 800;
    text-shadow:1px 0 7px red;
  background-color: #fce6cc;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#fce6cc), to(#ffff00));
	background-image: -webkit-linear-gradient(#6262ff, #8a8aff 49%, #0000ff 50%);
	background-image: linear-gradient(#ffd2bd, #ffaa82 49%, #ff8040 50%);
	border-radius: 10px 10px 10px 10px;
}*/




#nav-open {
display: block;
        vertical-align: middle;
	height: 20px;
	line-height: 20px;
	font-weight: bold;
	text-align: left;
	color: #660000;
background: linear-gradient(#ffd2bd, #ffaa82 49%, #ff8040 50%);
/*元　background-color: #ffcc88;*/
/*ピンクbackground: linear-gradient(#ffba99,#ffdac8);
/*黄色	background-color: #ffff00*/
/*background-color: #990000;/*茶*/
/*赤	background-color: #ff0000;*/
/*薄紫	background-color: #cea3ef;*/
/*background-color: #ffb366;/*オレンジ*/
/*background-color: #dca0a0;/*紅梅色*/
/*青	background-color: #0000ff;*/
	border-radius: 5px 5px 5px 5px;
  /*角丸のサイズ。左上、右上、右下、左下への順。*/
/*	border-left: 1px solid #ccc;
  /*左の線の幅、線種、色*/
/*	border-top: 1px solid #ccc;
  /*上の線の幅、線種、色*/
/*	border-right: 1px solid #ccc;
  /*右の線の幅、線種、色*/
/*        border-bottom: 4px solid #ff0000;
	border-bottom: 4px solid #5fa271;*/
  /*下の線の幅、線種、色*/
/*	border: 1px solid #ccc;*/
	padding: 7px;
	box-shadow:#000 0 0 0px;

}

/*ハンバーガーアイコンをCSSだけで表現*/



/*改造部分*/
#nav-open span,n:before, #nav-open span:after {
content: "▼ メニューを表示する ▼";
}


/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}


/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0px;
  left: 0;
  z-index: 9999;/*最前面に*/
  width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 350px;/*最大幅（調整してください）*/
  height: 100%;
  background: #fff;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);/*左に隠しておく*/
}


/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}




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

　スマホメニュー中身(子メニュー)

******************************/
/*PCでハンバーガー非表示*/
@media screen and (max-width:800px){

    display:none;


.syncer-acdn-parent-s
{
	width: 95% ;
	margin: 1.5em 0 0 ;
	padding: 12px 18px ;
	border: 2px solid rgba( 0,0,0, 0.1 ) ;
	background: rgba( 0,0,255 , 0.1 ) ;
}

/* 子の[ul] */
.syncer-acdn-child-s
{
	display: none ;
}

/* 余白設定 */
.syncer-acdn-child-s ,
.syncer-acdn-parent-s li 
.syncer-acdn-parent-s li p
{
	margin: 5px ;
	padding: 5px ;
}

/* 親と子の[li] */
.syncer-acdn-parent-s li 
{
	list-style: none ;
	background: adccfe ;
}


/* 親の[a] (メニュー文言と「開閉」部分上からの距離と左からの距離*/
.syncer-acdn-parent-s li p a
{
	position: relative ;
	top: 0 ;
	left: 5px ;
}

.syncer-acdn-parent-s li p a:after ,
.syncer-acdn-parent-s li p a:hover:after
{
	color: #ffffff ;
	background: rgba( 0,0,255 , 0.1 );
}

.syncer-acdn-parent-s li p a:after
{
	position: absolute ;
	top: 50% ;
	right: 25px ;
	content: "▼" ;
	font-size: .85em ;
	margin-top: -12.5px ;
	height: 17px ;
	line-height: 17px ;
	padding: 4px 8px ;
	background: green ;
}


/* 親の[a]と子の[li] */
.syncer-acdn-parent-s li p a ,
.syncer-acdn-child-s li
{
	border-bottom: 1px solid rgba( 0,0,0, 0.1 ) ;
}


/* 親と子の[a] */
.syncer-acdn-parent-s li a
{
	display: block ;
	padding: 8px 0 ;
	font-weight: 700 ;
	text-decoration: none ;
	color: #333 ;
        left: 5px;
}

.syncer-acdn-parent-s li a:hover
{
	cursor: pointer ;
	color: #f00 ;
	background: rgba( 0,0,0, 0.1 ) ;
}


/* 子の[a] */
.syncer-acdn-child-s li a:before

{
	content: "・" ;
	padding-right: 5px ;
}
}

/*画像の周りに文字を回り込ませる
---------------------------------------------------------------------------*/

/*トップページ（index.html*/
<!--
img.mawarikomi{
  float : left ;
  padding: 5px;
  margin: 5px;
}
-->


/*b.htm(場所の案内*/
<!--
img.mawarikomi2{
 float : left ;
 width:50%;
 height:auto;
 padding: 5px;
 margin: 5px;
}
-->

img.fl-3 {float: left;margin-right: 20px;margin-bottom: 10px;width: 40%; height: auto;}/*「安心」の登録票画像*/

@media screen and (min-width:801px){
img.fr {float: right;margin-left: 20px;margin-bottom: 30px; width: 45%; height: auto;}
}


/*返済方法*/
@media screen and (min-width:481px) and ( max-width:800px){
img.fr {float: right;margin-left: 10px;margin-bottom: 10px; width: 45%; height: auto;}
}


@media screen and (max-width:480px){
img.fr {float: right;margin-left: 10px;margin-bottom: 5px; width: 60%; height: auto;}
}

/*画像の周りに文字を回り込ませる終了*/

/*見出しバー(左青大＋ボーダー)*/

/*top.htm*/
div.bd{
  position: relative;
  padding: .25em 0 .5em .75em;
  border-left: 6px solid #3498db;
}
div.bd::after {
  position: absolute;
  left: 0;
  bottom: 0;
  content: '';
  width: 100%;
  height: 0;
/*  border-bottom: 1px solid #ccc;*/
}
/*見出しバー(左青大＋ボーダー)終わり*/

/*見出しバー(左青小＋ボーダー)*/



/*見出しバー(p)*/
p.bd{
  background-color : #b7b7ff;
  width: 15%;
  padding: 0px;
}
/*見出しバー(p)終わり*/



/*メニュー内のボタン*/

/* solid013(赤) */
.button_solid012 a {
    background: #f44336;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    max-width: 120px;
    padding: 7px 4px;
    color: #FFF;
    transition: 0.3s ease-in-out;
    font-weight: 600;
    border-radius: 5px;
    border-bottom: 4px solid #ffcdd2;
    /*border-bottom: 4px solid #1d7fde;*/
    overflow: hidden;
}
.button_solid012 a:active {
  transform: translateY(4px);
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
  border-bottom: none;
}
.button_solid012 a:before {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: -100%;
  background-image: linear-gradient( 130deg, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0) 55%);
  animation: shine 3s infinite;
}
@keyframes shine {
  33% {
    left: 100%;
  }
  100% {
    left: 100%;
  }
}
.button_solid012 a:after {
  content: '≫';
  display: inline-block;
  color: #fff;
  padding-left: 3px;
  font-size: 12px;
}



/* solid013(青) */
.button_solid013 a {
    background: #6bb6ff;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    max-width: 260px;
    padding: 7px 4px;
    color: #FFF;
    transition: 0.3s ease-in-out;
    font-weight: 600;
    border-radius: 5px;
    border-bottom: 4px solid #1d7fde;
    overflow: hidden;
}
.button_solid013 a:active {
  transform: translateY(4px);
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
  border-bottom: none;
}
.button_solid013 a:before {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: -100%;
  background-image: linear-gradient( 130deg, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0) 55%);
  animation: shine 3s infinite;
}
@keyframes shine {
  33% {
    left: 100%;
  }
  100% {
    left: 100%;
  }
}
.button_solid013 a:after {
  content: '';
  display: inline-block;
  color: #fff;
  padding-left: 3px;
  font-size: 11px;
}

/*メニューのボタンここまで*/