/*!
 *********************************************************************
 *  カスタムプロパティの設定*/
 *********************************************************************
 */
h1 {font-size:  var(--font-size-h1);}
h2 {font-size:  var(--font-size-h2);}
h3 {font-size:  var(--font-size-h3);}
h4 {font-size:  var(--font-size-h4);}
h5 {font-size:  var(--font-size-h5);}
h6 {font-size:  var(--font-size-h6);}
.fs_h1 {font-size:  var(--font-size-h1);}
.fs_h2 {font-size:  var(--font-size-h2);}
.fs_h3 {font-size:  var(--font-size-h3);}
.fs_h4 {font-size:  var(--font-size-h4);}
.fs_h5 {font-size:  var(--font-size-h5);}
.fs_h6 {font-size:  var(--font-size-h6);}

.fs_08 {font-size:  0.8em;}
.fs_09 {font-size:  0.9em;}
.fs_10 {font-size:  1.0em;}
.fs_11 {font-size:  1.1em;}
.fs_12 {font-size:  1.2em;}
.fs_15 {font-size:  1.5em;}

/*////////////////////////////////////////////////////////////////////
 *
 *  メディアクエリの定義
 *
 */

/*!
 ********************************************************
 * Extra small devices (portrait phones, less than 576px)
 ********************************************************
 */
@media (max-width: 575.98px) {
  :root {
    --font-size-h1: 20px;
    --font-size-h2: 18px;
    --font-size-h3: 18px;
    --font-size-h4: 18px;
    --font-size-h5: 18px;
    --font-size-h6: 18px;
  }
}
/*!
 ********************************************************
 * Small devices (landscape phones, 576px and up)
 ********************************************************
 */
@media (min-width: 576px) and (max-width: 767.98px) {
  :root {
    --font-size-h1: 20px;
    --font-size-h2: 18px;
    --font-size-h3: 18px;
    --font-size-h4: 18px;
    --font-size-h5: 18px;
    --font-size-h6: 18px;
  }
}
/*!
 ********************************************************
 * Medium devices (tablets, 768px and up)
 ********************************************************
 */
@media (min-width: 768px) and (max-width: 991.98px) {
  :root {
    --font-size-h1: 22px;
    --font-size-h2: 20px;
    --font-size-h3: 18px;
    --font-size-h4: 18px;
    --font-size-h5: 18px;
    --font-size-h6: 18px;
  }
}
/*!
 ********************************************************
 * Large devices (desktops, 992px and up)
 ********************************************************
 */
@media (min-width: 992px) and (max-width: 1199.98px) {
  :root {
    --font-size-h1: 26px;
    --font-size-h2: 24px;
    --font-size-h3: 22px;
    --font-size-h4: 20px;
    --font-size-h5: 18px;
    --font-size-h6: 18px;
  }
}
/*!
 ********************************************************
 * Extra large devices (large desktops, 1200px and up)
 ********************************************************
 */
@media (min-width: 1200px) {
  :root {
    --font-size-h1: 28px;
    --font-size-h2: 26px;
    --font-size-h3: 24px;
    --font-size-h4: 22px;
    --font-size-h5: 20px;
    --font-size-h6: 18px;
  }
}

/*!
 ********************************************************
 *  ヘッダ・フッタ・ナビメニュー
 ********************************************************
 */
:root {
  --header-footer-border-color:     silver !important;
  --header-color-for-rgba:          192, 192, 192;
  --header-footer-background-color: transparent !important;
  --menu-color:                     #333;/*black;*/
  --menu-active-color:              rgba(139,   0,   0, 1.0);
  --menu-hover-color:               rgba(139,   0,   0, 0.8);
  --toggler-color:                  rgba(192, 192, 192, 0.2);
  --toggler-border-top-color:       hsla(6, 54%, 67%, 0.5);
}


/*////////////////////////////////////////////////////////////////////
 *
 *  Bootstrapの定義
 *
 */

/*!
 ********************************************************
 * ナビゲーションのカスタマイズ
 *
 *  ロゴの表示位置の調整
 *    - 左右のパディング値の変更
 *    - スマフォでの画像サイズを縮小
 ********************************************************
 */
.navbar {
  /* 左右の値はcontainerクラスの値 */
  padding: 0 1rem 0.2rem 1rem !important;
  margin-top: -0.5rem !important;
}
.navbar-collapse {
  /* navbar-brand で指定した画像とメニュー項目の高さの位置調整 */
  padding-top: 1.8rem;
  margin-top: -0.4rem !important;
  margin-bottom: -0.4rem !important;
}
.dropdown-menu {
  /* PCでのプルダウンメニューの表示位置の調整 */
  margin-top: -0.1745rem !important;
}
.navbar .nav-item .nav-link::before {
  /* aタグのスタイル(デフォルトでは下線がつく)の調整 */
  border-bottom-style: hidden !important;
  border-bottom-width: 0px !important;
}
/* メニューの描画色 */
.dropdown-item,
.navbar-light .navbar-nav .nav-link {
  color: var(--menu-color) !important;
}
/* active なメニューの表示色 */
.navbar-light .navbar-nav .show > .nav-link,
.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .nav-link.active,
.dropdown-item.active, .dropdown-item:active {
  color: var(--menu-active-color) !important;
}
/* マウスでfocusされているメニューの表示色 */
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus,
.dropdown-item:hover, .dropdown-item:focus {
  color: var(--menu-hover-color) !important;
}
/* スマフォでのトグル表示の時のメニューの背景 */
.dropdown-item.active,
.dropdown-item:active,
.dropdown-item:hover,
.dropdown-item:focus {
  /* contents-header(saikon.cssで定義)の背景色に合わせる */
  background-color: transparent !important;
}
/* トグルの幅と高さ */
.navbar-toggler-icon {
  width: 1.2em;
  height: 1.2em;
}
/* トグルの色 contents-header(saikon.cssで定義)より濃い色 */
.navbar-toggler {
  padding: 0.25rem 0.50rem; /* トグルの大きさをパディングで調整 */
  background-color: var(--toggler-color) !important;
}

.nav-item .dropdown > hr {
  margin: 0;
  padding: 0 1rem;
}

/*!
 ********************************************************
 * 再婚ネットのロゴの表示サイズの最適化
 ********************************************************
 */
@media (max-width: 575.98px) {
  .navbar-brand > img {
    width: 220px;
    height: auto;
  }
}
/*!
 ********************************************************
 * トグル表示の時のメニュー項目の最適化
 ********************************************************
 */
@media (max-width: 991.98px) {
  .dropdown-item,
  .navbar-light .navbar-nav .nav-link {
    border-top: 1px dashed var(--toggler-border-top-color);
  }
  .navbar-light .navbar-nav .nav-link {
    padding-left: 1rem;
  }
  .dropdown-item {
    padding-left: 2rem;
  }
  .dropdown-menu {
    background-color: transparent !important;
    border: 1px solid rgba(0, 0, 0, 0.0) !important;
  }
}

/*!
 ********************************************************
 * buttomクラス
 ********************************************************
 */
/*
.btn-red, 
.btn-red.disabled, .btn-red:disabled {
  color: #fff;
  background-color: #b21f2d;
  border-color: #ac2925;
}


.btn-red:hover {
  color: #fff;
  background-color: #c82333;
  border-color: #bd2130;
}

.btn-red:focus, .btn-red.focus {
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
}

.btn-red:not(:disabled):not(.disabled):active, .btn-red:not(:disabled):not(.disabled).active,
.show > .btn-red.dropdown-toggle {
  color: #fff;
  background-color: #bd2130;
  border-color: #b21f2d;
}

.btn-red:not(:disabled):not(.disabled):active:focus, .btn-red:not(:disabled):not(.disabled).active:focus,
.show > .btn-red.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
}
*/
:root {
  --btn-main-color:             forestgreen;//dodgerblue;//#28a745;
  --btn-main-hover-color:       green;//royalblue;#218838;
  --btn-main-focus-color:       darkgreen;//dodgerblue;//rgba(40, 167, 69, 0.5);
  --btn-main-disabled-color:    darkseagreen;//steelblue;//#28a745;
}
.btn-main {
  color: #fff;
  background-color: var(--btn-main-color);
  border-color:     var(--btn-main-color);
}

.btn-main:hover {
  color: #fff;
  background-color: var(--btn-main-hover-color);
  border-color:     var(--btn-main-hover-color);
}

.btn-main:focus, .btn-main.focus {
  box-shadow: 0 0 0 0.1rem var(--btn-main-focus-color);
}

.btn-main.disabled, .btn-main:disabled {
  color: #fff;
  background-color: var(--btn-main-disabled-color);
  border-color:     var(--btn-main-disabled-color);
}

/*////////////////////////////////////////////////////////////////////
 *
 *  再婚ネットの定義
 *
 */

/*
 ********************************************************
 *  ヘッダとフッタの位置の定義
 ********************************************************
 */
html {
  height: 100%; /*ブラウザの表示高さ*/
}
body {
  position:relative;
  min-height: 100%;
  padding-top: 0px;
  background-color: white;
}
nav {
  border-top: 1px solid rgba(var(--header-color-for-rgba), 0.5);
  border-bottom: 1px solid var(--header-footer-border-color);
}
header{
//  border-bottom: 1px solid var(--header-footer-border-color);
  margin-bottom: 0.5rem;
}
footer {
  border-top: 1px solid var(--header-footer-border-color);
  background-color: var(--header-footer-background-color);
  position: absolute;
  bottom: 0;
  width:100%;
}
article {
  padding: 0 0 2rem 0;
}
section {
  padding: 2rem 0;
}

.pagetop {
  display: none;
  position: fixed;
  right: 15px;
}
.pagetop a {
  display: block;
  background-color: #ccc;
  text-align: center;
  color: #222;
  font-size: 12px;
  text-decoration: none;
  padding: 5px 10px;
  filter:alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}
.pagetop a:hover {
  display: block;
  background-color: #b2d1fb;
  text-align: center;
  color: #fff;
  font-size: 12px;
  text-decoration: none;
  padding:5px 10px;
  filter:alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}
/*---------------------------
 * フッター
 *---------------------------*/
            /*footer-boxクラス */
.footer-box {
  position:relative;
  margin: 0;
  padding: 10px 10px;
  display: block;
  text-align: center;
}
.footer-addr,
.footer-tel,
.footer-site-map {
}
.footer-addr p {
  margin: 0;
  padding: 0;
}
.footer-tel a ,
.footer-tel p {
  margin: 0;
  padding: 0.5rem 0 0 0;
  color: #333;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.0;
}
.footer-contact {
//  text-align: center;
  display: inline-block;
}
.footer-copyright {
  margin: 0;
  padding: 0 0 1rem 0;
  font-size: 10.5px;
  text-align: center/*right*/;
  color: #a25650;
}

/*!
 ********************************************************
 * タイトル設定
 ********************************************************
 */
h1.title {
  font-weight: normal;
  font-size: 0.8rem;
  /* 左右の値はcontainerクラスの値 */
  padding: 0.5rem 0.5rem 0.3rem;
}

.headline_outer{
  text-align: center;
}
.headline_inner{
  display: inline-block;
  text-align: left;
  padding:1rem 0.5rem 1rem 1rem;
  background-color: transparent;
}
.bg_title {
  margin-bottom: 1rem;
  background-color: darkgoldenrod;
}
.title h2,
.subtitle h2,
.subtitle h3{
  font-family: 'Noto Serif JP', serif;
}
.title h2 {
  margin: 0;
  color:  snow;
  font-size:  var(--font-size-h2);
}
.subtitle{
  margin-bottom: 1rem;
  background-color: ghostwhite;
}
.subtitle h2,
.subtitle h3 {
  margin: 0;
  color:  black;//dimgray;
  font-size:  var(--font-size-h2);
}
.subtitle p {
  color:  black;//dimgray;
}

/*---------------------------
 * ボタン
 *---------------------------*/
.btn_outer{
  display: table;
  width: 100%;
  margin-bottom: 0.5rem;
}
.btn_inner{
  display: table-cell;
  vertical-align: middle;
  padding: 0rem 0.25rem;
}
.btn_headline {
  display: inline-block;
  position: relative;
  width: 100%; max-width: 600px;
  padding: 0.5rem 0.5rem;
  text-align: left;
  text-decoration: none;
  color: #1B1B1B;
  background: #fff;
  border-radius: 0.5rem;
  border:1px solid lightgray;
  transition: transform ease .3s;
  
//  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.06), 0 1px 5px 0 rgba(0,0,0,0.06), 0 3px 1px -2px rgba(0,0,0,0.1);
  -webkit-tap-highlight-color: transparent;
}
.btn_headline:hover {
  color: #1B1B1B;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 5px 10px 0 rgba(0,0,0,0.12), 0 3px 20px 0 rgba(0,0,0,0.12), 0 5px 6px -2px rgba(0,0,0,0.2);
}
.w-30 {
  width: 30% !important;
}
.w-70 {
  width: 70% !important;
}

/*---------------------------
  再婚ネット照会ボタン
  ---------------------------*/
            /*hedline-linkクラス */
.hedline-link {
  width: 100%; max-width: 400px;
  margin-right:auto;
  margin-left:auto;
	padding:0.5rem 1rem;
  display: block;
//  border-radius: 1rem; 
	border: double 3px white;
	background-color: black;
//	font-size:28px;/*200%;*/
	color:white;
  text-align: center;
	line-height: 26px;/*hタグの高さ*/
}
.hedline-link:hover,
.hedline-link:focus {
	color:black;
  background-color: white;//darkred;//#c9302c;
	border: double 3px black;
//	font-weight:bold;
	text-decoration:none;
}


/*
 ****************************
 *	要素の定義
 ****************************
 */
a.dec {
  text-decoration: none;
  color: darkred;
  border-bottom: 2px dashed silver;
}
a.dec:hover {
  color: crimson;
}

h1.dec {
  position: relative;
  --dec-base-h1: calc(var(--font-size-h1)/24);
  
  font-size: 26px;
  margin: 11px 0;
  padding-left: 48.75px;
  line-height: 32.5px;
  
  font-size: calc(24 * var(--dec-base-h1));
  margin: calc(10 * var(--dec-base-h1)) 0;
  padding-left: calc(45 * var(--dec-base-h1));
  line-height: calc(30 * var(--dec-base-h1));
}
h1.dec:before {
  position:  absolute;
  content: "";
  
  top: 2.17px;
  left: 2.17px;
  width: 18.42px;
  height: 18.42px;
  border: 4.33px solid #77bf59; //#cd4d58;
  
  top: calc(2 * var(--dec-base-h1));
  left: calc(2 * var(--dec-base-h1));
  width: calc(17 * var(--dec-base-h1));
  height: calc(17 * var(--dec-base-h1));
  border: calc(4 * var(--dec-base-h1)) solid #77bf59; //#cd4d58;
}
h1.dec:after {
  position:  absolute;
  content: "";
  
  top: 13px;
  left: 13px;
  width: 15.12px;
  height: 15.12px;
  border: 4.33px solid #137008; //#ac2925;
  
  top: calc(12 * var(--dec-base-h1));
  left: calc(12 * var(--dec-base-h1));
  width: calc(14 * var(--dec-base-h1));
  height: calc(14 * var(--dec-base-h1));
  border: calc(4 * var(--dec-base-h1)) solid #137008; //#ac2925;
}

h2.dec {
  position: relative;
  --dec-base-h2: calc(var(--font-size-h2)/22);
  
  font-size: 24px;
  margin: 10.91px 0;
  padding: 3.27px 0 3.27px 32.73px;
  border-top: 2.18px solid #12a84f; //#a87a68;
  
  font-size: calc(22 * var(--dec-base-h2));
  margin: calc(10 * var(--dec-base-h2)) 0;
  padding: calc(3 * var(--dec-base-h2)) 0 calc(3 * var(--dec-base-h2)) calc(30 * var(--dec-base-h2));
  border-top: calc(2 * var(--dec-base-h2)) solid #12a84f; //#a87a68;
}
h2.dec:before {
  position: absolute;
  content: "";
  background: #77bf59; //#cd4d58;
  
  top: 3.27px;
  left: 4.36px;
  width: 6.55px;
  height: 26.18px;
  border: 4.36px solid #77bf59; //#cd4d58;
  
  top: calc(3 * var(--dec-base-h2));
  left: calc(4 * var(--dec-base-h2));
  width: calc(6 * var(--dec-base-h2));
  height: calc(24 * var(--dec-base-h2));
  border: calc(4 * var(--dec-base-h2)) solid #77bf59; //#cd4d58;
}
h2.dec:after {
  position: absolute;
  content: "";
  background: #137008; //#ac2925;
  
  top: 5.45px;
  left: 15.27px;
  width: 6.55px;
  height: 21.82px;
  border: 4.36px solid #137008; //#ac2925;
  
  top: calc(5 * var(--dec-base-h2));
  left: calc(14 * var(--dec-base-h2));
  width: calc(6 * var(--dec-base-h2));
  height: calc(20 * var(--dec-base-h2));
  border: calc(4 * var(--dec-base-h2)) solid #137008; //#ac2925;
}

h3.dec {
  position: relative;
  --dec-base-h3: calc(var(--font-size-h3)/16);
  
  font-size: 22px;
  margin: 12.22px 0;
  line-height: 36.67px;
  padding-left: 29.33px;
  
  font-size: calc(16 * var(--dec-base-h3));
  margin: calc(10 * var(--dec-base-h3)) 0;
  line-height; calc(30 * var(--dec-base-h3));
  padding-left: calc(24 * var(--dec-base-h3));
}
h3.dec:before {
  position: absolute;
  content: "";
  background: #fff;
  
  top: 9.78px;
  left: 4.89px;
  width: 14.67px;
  height: 14.67px;
  
//  top: calc(10 * var(--dec-base-h3));
  left: calc(4 * var(--dec-base-h3));
  width: calc(12 * var(--dec-base-h3));
  height: calc(12 * var(--dec-base-h3));
}
h3.dec:after {
  position: absolute;
  content: "";
  
  top: 9.78px;
  left: 4.89px;
  width: 14.67px;
  height: 14.67px;
  border: 4.89px solid #137008; //#cd4d58;
  
//  top: calc(10 * var(--dec-base-h3));
  left: calc(4 * var(--dec-base-h3));
  width: calc(12 * var(--dec-base-h3));
  height: calc(12 * var(--dec-base-h3));
  border: calc(4 * var(--dec-base-h3)) solid #137008; //#cd4d58;
}


h2.caption {
padding: 0 0.5em;/*文字周りの余白*/
color: #333;//green; /*文字色*/
border-bottom: solid 3px #9bcb67; /*下線*/
}
h3.caption {
color: #333;//green;/*文字色*/
border-bottom: dashed 2px #9bcb67;
/*線の種類（点線）2px 線色*/
}
h1.caption2 {
padding: 0.5em;/*文字周りの余白*/
color: #494949;/*文字色*/
background: #fffaf4;/*背景色*/
border-left: solid 5px #ffaf58;/*左線（実線 太さ 色）*/
}
h2.caption2 {
border-bottom: double 5px #FFC778;
/*線の種類（二重線）太さ 色*/
}
h3.caption3 {
padding: 0.5em;/*文字周りの余白*/
color: #2d2d2d;/*文字色*/
background: #fff0d9;/*背景色*/
border-bottom: solid 3px orange;/*下線*/
}

/*
 ********************************************************
 *  CLASSの定義
 ********************************************************
 */
/*---------------------------
 * TOPページ Message
 *---------------------------*/
a.message {
  text-decoration: none;
  color: black;
  border-bottom: 2px dashed silver;
}
a.message:hover {
  color: darkred;
}
a.message_detail {
  text-decoration: none;
	color: #12a84f;
  border-bottom: 2px dashed silver;
}
.message_detail:hover {
  color: green;
}
.message_detail:hover > img {
  opacity:0.9;
}
/*
.bg-dot {
	background-color: #fcfcfc !important;
	background-image: radial-gradient(#eee 10%, transparent 20%), radial-gradient(#eee 10%, transparent 20%) !important;
	background-position: 0 0, 10px 10px !important;
	background-size: 20px 20px !important;
}
*/
.bg-dot {
	background-color: white !important;
	background-image: radial-gradient(yellow 10%, transparent 20%), radial-gradient(yellow 10%, transparent 20%) !important;
	background-position: 0 0, 5px 5px !important;
	background-size: 10px 10px !important;
}



/*
.note_green{
  color: #137008;
}
.note_brown{
  color: hsla(4, 44%, 31%, 1);
}
.note{
  color: black;
}


section.bg_img1 {
  margin-top: -1.5rem;
  width: 100%;
//  background-color: rgba(23,162,184,0.1);//#d0e7f5;info: #17a2b8;
  background-image: url("../images/bg_img1.png");
  background-repeat: no-repeat;
  background-position: center center;
//  opacity:0.7;
}
.bg_img3 {
  margin-top: -1rem;
  margin-bottom: -1rem;
  margin-left: 0;
  margin-right: 0;
  padding-top:5rem;
  padding-bottom:5rem;
  padding-left: 2rem;
  padding-right: 2rem;
  background-image: url(../images/bg_image-3-1.jpg);
  background-size: cover;
}
.parallax {position: relative;background-attachment: fixed;background-position: center;background-repeat: no-repeat;background-size: cover;}
*/

/*---------------------------
 *  お知らせ
 *---------------------------*/
.info-box {
  border-color: #9d9891;
}
.info-box > .card-header {
  margin: 0 0.4rem;
  padding-bottom: 0 0.4rem;
  font-size: 1.2rem;
  font-weight: bold;
  color: #333;
  background-color: white;
  border-bottom: 1px dashed #9d9891;
}
.info-box .card-body {
  padding: 0 1rem;
}
.info-box .card-footer {
  margin: 0 0 0.4rem;
  padding-top: 0 0.4rem;
  padding-bottom: 0;
  background-color: white;
  border-top: 1px dashed #9d9891;
}
.info-box dl {
  margin: 0 0.4rem 0 0 0;
}
.info-box dt {
  font-weight: bold;
  line-height: 1.6;
  color: #70312c;
}
.info-box dd {
  font-weight: normal;
  line-height: 1.6;
  margin: 0 0 0 1rem;
}
.info-box dd p {
  color: #70312c;
  margin: 0;
  padding: 0;
}
.info-box p {
  line-height: 1.6;
}
.info-box .link > a {
  color: darkred;//hsla(356, 69%, 66%, 1);
  margin: 0;
  padding: 1rem 0 0 0;
  font-weight: bold;
}
.info-box .link > a:hover {
  color: crimson;
}

/*---------------------------
 * パンくず
 *---------------------------*/
.bread_crumb {
  padding: 3px 15px;
  margin-top: 5px;
  margin-bottom: 20px;
  list-style: none;
}
.bread_crumb:after {
  margin-left: -10px;
  content: "";
  display: block;
  height: 2px;
  background: -moz-linear-gradient(to right, rgb(155, 203, 103), transparent);
  background: -webkit-linear-gradient(to right, rgb(155, 203, 103), transparent);
  background: linear-gradient(to right, rgb(155, 203, 103), transparent);
}
.bread_crumb > li {
  display: inline-block;
}
.bread_crumb > li + li:before {
  padding: 0 5px;
  color: #ccc;
  content: ">\00a0";
}
.bread_crumb a {
  text-decoration: none;
  color: #77bf59;
}
.bread_crumb a:hover {
  color: green;
}

/*---------------------------
 * SNS
 *---------------------------*/
            /*sns-info-boxクラス */
.sns-info-box {
  margin: 1rem 2rem;
}
.sns-info-box hr {
  border: 0;
  margin-bottom: 5px;
  background: #fff;
  border-bottom: 1px dashed #9d9891;
}
/*---------------------------
 * Google Map
 *---------------------------*/
.google-maps {
  position: relative;
  padding-bottom: 75%; // これが縦横比
  height: 0;
  overflow: hidden;
 }
 .google-maps iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
 }
/*---------------------------
 * フォーム
 *---------------------------*/
/* 新規会員の追加のプロフィールの項目をalert表示する */
.alert{
  padding: 0 !important;
  margin: 0 0 1px 0 !important;
}

/* SELECTボックスの幅の定義 */
.select-pref{
  width:7rem !important;
}
.select-year{
  width:6rem !important;
}
.select-month,
.select-day{
  width:5rem !important;
}
.select-age{
  width:4rem !important;
}

.width-3{
  width:3rem !important;
}
.width-4{
  width:4rem !important;
}
.width-6{
  width:6rem !important;
}
.width-8{
  width:8rem !important;
}
.width-12{
  width:12rem !important;
}
.width-16{
  width:16rem !important;
}

legend {
  padding: 0;
  border-bottom: 1px solid #9bcb67;//#a87a68;
  font-size: var(--font-size-h2);
}
.table dl{
  padding: 0;
}
.table dt{
  font-weight: normal;
}
.name-inline input{
  width: 9rem !important;
  display: inline-block;
}
.num-inline input{
  width: 6rem !important;
  display: inline-block;
}
.birthday-inline input,
.card-inline input,
.tel-inline input{
  width: 4rem !important;
  display: inline-block;
}
.age-inline input{
  width: 4rem !important;
  display: inline-block;
}
.card-no input,
.card-name input{
  width: 14rem !important;
}
.card-ccv input{
  width: 4rem !important;
}
.help-text {
  color: #737373;
}

.required {
}

.required:after {
    color: #cd4d58;
    padding-left: 2px;
    content: "*";
}
.submit-box {
  text-align: center;
}
.submit-box ul,
.submit-box li {
  margin: 0;
  padding: 0;
}
.submit-box li+li {
  padding-left: 0px;
}
/* bootstrap のCSSに準拠
  .radio-inline input[type="radio"] */
.child-num-inline {
  width: 3rem !important;
}
.confitm {
  padding-top: 8px;
}
/*---------------------------
 * 注釈
 *---------------------------*/
.help-block {
  display: block;
  margin-top: 5px;
  margin-bottom: 10px;
  font-size:  0.875rem;
//  color: #333; //#737373;
}

/*---------------------------
 * 囲み枠
 *---------------------------*/
.info_box {
  border: 1px solid #9bcb67;
  background-color: #ecf7e1;
  margin: 1em 0;
  padding: 1em;
  border-radius: 0.5rem;/*角丸*/
}
.happy_box {
//	background: #ebf5f5; // #cdebf7;
  display: inline-block; /* インラインブロック化 */
  margin: 1em 0 0 0;
  padding: 0 0.5em 1rem 0.5rem;
  border-radius: 0.5rem;/*角丸*/
  border: 2px solid #9bcb67; //#5bbee5
}
.happy2_box {
	background: #ebf5f5; // #cdebf7;
  margin: 1em 0;
  padding: 1em;
  border-radius: 0.5rem;/*角丸*/
  border: 2px solid #0183e0; //#9bcb67; //#5bbee5
}
.cancel_box {
//  border: 1px solid #9bcb67;
//  background-color: #ecf7e1;
  margin: 0.5rem;
  padding: 0.5rem;
//  border-radius: 0.5rem;/*角丸*/
}

/*---------------------------
 * 各案内ページ
 *---------------------------*/
.image-box {
  margin: 5px 10px;
  width:150px;
  height:auto;
  float:left;
}
.image-box img {
  border-radius: 10px;
  border: 1px solid #eee;
}
.image-box span {
  display: block;
  border-radius: 10px;
}
.image-box-clear {
  clear: both;
}
.explain-box {
  height:15em;
  overflow-x: hidden;
  overflow-y: scroll;
}
/*---------------------------
 * サイトマップ
 *---------------------------*/
.sitemap {
  padding-left: 30px;
  padding-right: 30px;
}
.sitemap .table-hover a {
  display: block;
  color: #333;
  text-decoration: none;
}
.sitemap .table-hover > tbody > tr:hover {
  background-color: #deebea;//#f2dcdb;
}
/*---------------------------
 * クロスワンパーティ
 *---------------------------*/
div.list{
	clear: both;
	width: 100%;
}
.list dl,
.list dt,
.list dd{
	display: block;
	margin: 0;
	padding: 0;
	font-weight: normal;
	color: #444;
}
.list a{
	color: #CE4D58;
}
.list dl{
	border: 4px double #9bcb67; //orange;
}
.list dt.title {
	background-color: #12a84f;//#ac2925; #12a84f;
	border-bottom: 1px double  #9bcb67; //orange;
	padding: 5px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	line-height: 20px;
}
.list dt {
	background-color: #ffe;
	padding: 5px;
	line-height: 20px;
}
.list dt + dd {
	border-top: 1px solid #9bcb67; //orange;
}
.list dd + dt {
	border-top: 1px solid #9bcb67; //orange;
}
.list dd{
	padding: 5px;
	line-height: 19px;
}
.list dd.link{
	padding: 0 5px 5px 5px;
	line-height: 19px;
	text-align: right;
}
/*---------------------------
 * 文字装飾
 *---------------------------*/
.extra {
  font-weight: bold;
	color: #CE4D58;
}
.small-extra {
	color: #CE4D58;
}
.small-extra a:link{
	color: #CE4D58;
}
.title {
	font-weight: bold;
}
p{
	overflow: hidden;
}
span.start,
p.start:first-letter{
	padding-left: 1em;
}
*.end{
	margin-bottom: 1em;
	clear: both;
}
p.small{
  font-size: 12px;
	padding-right: 10px;
}
p.right{
  text-align: right;
}
.dec dl,
.dec dt,
.dec dd,
.assoc dl,
.assoc dt,
.assoc dd{
	font-weight: normal;
}
.assoc dd{
	padding-left: 1rem;
}

/*---------------------------
  新規会員登録ボタン
  ---------------------------*/
            /*joyus-linkクラス */
.joyus-link {
  margin-right:auto;
  margin-left:auto;
	padding:0.5rem;
  display: block;
  border-radius: 0.5rem; 
//	border: double 3px #ffffff;
	background-color: #ff9f07; //red;//#ac2925;
	color:#fff;
	font-weight: bold;
  text-align: center;
  width: 22rem;
}
.joyus-link:hover,
.joyus-link:focus {
  opacity: 0.8;   /*透明度*/
	color:#fff;
	text-decoration:none;
}

/*---------------------------
  登録案内
  ---------------------------*/
.detail_info{
  border-radius: 1rem;
  border: 2px solid #a0d468;
  margin: 2rem 0;
  padding: 1rem;
  background-color: #e0f0c0;
}
.regist_info{
  border-radius: 1rem;
  border: 2px solid #a0d468;
  margin: 2rem 0;
  padding: 1rem;
  background-color: #e0f0c0;
}

/*!
 ********************************************************
 * 文字色
 ********************************************************
 */
.bold {
  font-weight: bold;
}
.goldenrod {
  color: goldenrod;
}
.orange {
	color: orange;
}
.orange2 {
	color: #ff6600;
}
.darkorange{
  color: darkorange;
}
.orangered{
  color: orangered;
}
.green {
	color: green;
}
.green2 {
	color: #12a84f;
}
.blue {
	color: blue;
}
.royalblue{
  color: royalblue;
}
.deep_blue {
	color: #364e96;
}
.mediumblue{
	color: mediumblue;
}
.navy {
	color: navy;
}
.darkblue {
  color: darkblue;
}
.red {
	color: red;
}
.darkred {
	color: darkred;
}
.crimson {
  color: crimson;
}
.yellow {
	color: yellow;
}
.firebrick {
	color: firebrick;
}
.maroon {
  color: maroon;
}
.gray{
  color: gray;
}
.dimgray{
  color: dimgray;
}
.black{
  color: black;
}
.white {
	color: white;
}
.indigo{
  color: indigo;
}
.purple{
  color: purple;
}

.outline2 {
  text-shadow: hsla(4, 44%, 31%, 1) 0 1px 2px;
}
.outline {
  text-shadow: rgba(0,0,0,1) 0 1px 2px;
}
.outline1 {
  text-shadow: rgba(255,255,255,1) 0 1px 2px;
}
.outline3 {
  text-shadow: #12a84f 0 1px 1px;
}

.outline_b1 {
text-shadow:
    black 1px 1px 2px, black -1px 1px 2px,
    black 1px -1px 2px, black -1px -1px 2px;
}
.outline_b2 {
text-shadow: 
    black 1px 1px 10px, black -1px 1px 10px,
    black 1px -1px 10px, black -1px -1px 10px;
}
.outline_b8 {
text-shadow: 
    black 2px 0px 2px, black -2px 0px 2px,
    black 0px -2px 2px, black -2px 0px 2px,
    black 2px 2px 2px, black -2px 2px 2px,
    black 2px -2px 2px, black -2px -2px 2px,
    black 1px 2px 2px, black -1px 2px 2px,
    black 1px -2px 2px, black -1px -2px 2px,
    black 2px 1px 2px, black -2px 1px 2px,
    black 2px -1px 2px, black -2px -1px 2px,
    black 1px 1px 2px, black -1px 1px 2px,
    black 1px -1px 2px, black -1px -1px 2px;
}
.outline_w1 {
text-shadow:
    white 1px 1px 2px, white -1px 1px 2px,
    white 1px -1px 2px, white -1px -1px 2px;
}
.outline_w2 {
text-shadow: 
    white 1px 1px 10px, white -1px 1px 10px,
    white 1px -1px 10px, white -1px -1px 10px;
}
.outline_w8 {
text-shadow: 
    white 2px 0px 2px, white -2px 0px 2px,
    white 0px -2px 2px, white -2px 0px 2px,
    white 2px 2px 2px, white -2px 2px 2px,
    white 2px -2px 2px, white -2px -2px 2px,
    white 1px 2px 2px, white -1px 2px 2px,
    white 1px -2px 2px, white -1px -2px 2px,
    white 2px 1px 2px, white -2px 1px 2px,
    white 2px -1px 2px, white -2px -1px 2px,
    white 1px 1px 2px, white -1px 1px 2px,
    white 1px -1px 2px, white -1px -1px 2px;
}

hr.separator {
  margin: 0;
  padding: 0;
//  width: 90%;
  margin-right: auto;
  margin-left: auto;
}
/*!
 ********************************************************
 * 矢印
 ********************************************************
 */
.arrow_left {
    position: relative;
    background-color: rgba(223,15,93,.9);
}
.arrow_left:after {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-right-color: rgba(223,15,93,.9);
    border-width: 20px;
    margin-top: -20px;
}
.arrow_right {
    position: relative;
    background-color: rgba(222,115,0,.9);
}
.arrow_right:after {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-left-color: rgba(222,115,0,.9);
    border-width: 20px;
    margin-top: -20px;
}

.arrow-down
{
    position: relative;
    margin-bottom: 50px;
}
.blue.arrow-down:after
{
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(246, 114, 128, 0);
    border-top-color: #0075c0;
    border-width: 25px;
    margin-left: -30px;
}
.red.arrow-down:after
{
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(246, 114, 128, 0);
    border-top-color: #ca0000;
    border-width: 25px;
    margin-left: -30px;
}
.yellow.arrow-down:after
{
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(246, 114, 128, 0);
    border-top-color: #de7300;
    border-width: 25px;
    margin-left: -30px;
}

/*!
 ********************************************************
 * リスト項目の左に記す チェック 記号
 ********************************************************
 */
/*ul.check_mark {
    list-style: none;
    margin:0; padding:0;
}
ul.check_mark li {
    background: url(../images/check01.png) no-repeat left;
    padding-top: 9px;
    padding-left: 44px;
    padding-bottom: 9px;
    text-align: left;
    margin-bottom: 0px;
    min-height: 35px;
    line-height: 1.5;
}
*/



ul.minus,
ul.arrow,
ul.arrow2,
ul.check {
  padding-left: 2rem;
  position: relative;
}

ul.minus  li,
ul.arrow  li,
ul.arrow2 li,
ul.check  li {
  list-style-type: none!important;
}
ul.minus  li:before,
ul.arrow  li:before,
ul.arrow2 li:before,
ul.check  li:before {
  font-family: FontAwesome;
  position: absolute;
  left : 0.5rem; /*左端からのアイコンまで*/
}
ul.check li:before {
  content: "\f00c";
  color: #ffb03f; /*アイコン色*/
}
ul.arrow li:before {
  content: "\f0da";
}
ul.arrow2 li:before {
  content: "\f138";
  color: orange; /*アイコン色*/
}
ul.minus li:before {
  content: "\f068";
}

ol.circle {
  padding-left:0.5rem;
  counter-reset:number; /*数字をリセット*/
  list-style-type: none!important; /*数字を一旦消す*/
}
ol.circle li {
  position: relative;
  padding-left: 1.5rem;
  line-height: 1.1rem;
}

ol.circle li:before{
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number;
  content: counter(number);
  /*以下数字のデザイン変える*/
  display:inline-block;
  background: #5c9ee7;
  color: white;
  font-size: 0.9rem;
  border-radius: 50%;
  left: 0;
  width: 1.1rem;
  height: 1.1rem;
  line-height: 1.1rem;
  text-align: center;
  /*以下 上下中央寄せのため*/
//  top: 50%;
//  -webkit-transform: translateY(-50%);
//  transform: translateY(-50%);
}

/*!
 ********************************************************
 * 区切り線
 ********************************************************
 */
.border-01 { border-style: solid;  border-width: 1px; border-color: #9bcb67/*#d41c84*/;}
.text-color-01 { color: #21a753;}

/*!
 ********************************************************
 * お客様の声＆よくある質問設定
 ********************************************************
 */
dl.evaluation { margin-left:auto; margin-right:auto; /*width:850px;*/}
dl.evaluation dt { color: #df0f5d; text-align:left; /*font-size:18px;*/ margin-bottom:1rem; position:relative;}
dl.evaluation dt:after { content: "";  border-top: 5px solid #df0f5d; display:block; position: absolute; width: 100%; height: 1rem; opacity:0.3;}
dl.evaluation dd { margin-bottom:50px;}

dl.qa {/*width:850px; margin:0 auto; text-align:left;*/ }
dl.qa dt { margin-bottom:1rem;  margin-left: 2rem;  text-indent: -2rem;  }
.qna {color:#ffa200; font-size: 2rem; line-height: 100%;}
dl.qa dd { background-color: #ffffd5;  background-size: auto 100%; height: auto; /*text-align:center;*/ padding:1rem; /*color:#333333; font-size:1rem;*/ /*text-align:center;*/ position: relative; width: 100%; /*margin-bottom:40px;*/}
dl.qa dd:after { content: ' '; height: 0; position: absolute; width: 0; border: 20px solid transparent; border-bottom-color: #ffffd5; bottom: 100%; left: 8%; margin-left: -20px; }


/*!
 ********************************************************
 * 再婚ネットについて
 ********************************************************
 */
#saikonMenu dt{
  font-weight: normal;
}
#saikonMenu dd{
  display: none;
  margin-bottom: 3rem;
}
.overture{
	background-color: #1a8e6b;//#1a8e6b;
  border: solid 3px #1a8e6b;//#b9df90;  /*線色*/
  color: white; //#137008;/*文字色*/
}
.intro_menu{ 
  margin: .5rem 0;
  padding-left: 0rem;
}
.intro_title{ 
//	background-color: #137008;
//  border: solid 3px #137008;  /*線色*/
	background-color: #1a8e6b;; //#04194e;//#364e96;
  border: solid 3px #1a8e6b;; //#04194e;//#364e96;/*線色*/
  margin-top: 3rem;
  margin-bottom: 3rem;
  color: #fff;/*文字色*/
  padding: 0.5rem;/*文字周りの余白*/
  border-radius: 0.5rem;/*角丸*/
}

.intro_box{
  margin-top: 3rem;
  position: relative;
  cursor: pointer;
}

.intro_open,
.intro_close{
  position: absolute;
  right: 2rem; bottom: 0rem;
  color:#1a8e6b;
  font-size:1.2rem;
}
.intro_close{
  display: none;
  color:blue;
}

.form{
  border-radius: 0.5rem;
  border: 1px solid #9bcb67;
  background-color: #ecf7e1;
  margin: 1rem 0 2rem 0;
  padding: 1rem;
}


.intro_detail{
  border-radius: 0.5rem;
  border: 1px solid green;
  background-color: #ecf7e1;
  margin: 1rem 0;
  padding: 0.5rem 1rem;
}

.intro,
.intro_xone,
.intro_ibj {
  border-radius: 1rem;
  margin: 2rem 0;
  padding: 1rem 0;
}
.intro{
  border: 2px solid #75c92b; //skyblue;
}
.intro_xone{
  border: 2px solid orange;
}
.intro_ibj{
  border: 2px solid #5bbee5;
	background: #cdebf7;
}
.intro_joyus{ 
  margin-top: 3rem;
  margin-bottom: 3rem;
  color: #fff;/*文字色*/
	background-color: #04194e;//#364e96;
  border: solid 3px #04194e;//#364e96;/*線色*/
  padding: 0.5rem;/*文字周りの余白*/
  border-radius: 0.5rem;/*角丸*/
}
/*
.intro_joyus{ 
	background: #3364ca;
  border: solid 3px #3364ca;
  margin-top: 3rem;
  margin-bottom: 3rem;
  color: #fff;
  padding: 0.5rem;
}
*/
.intro_joyus_box,
.intro_joyus_image{
  padding: 0.5rem 2rem;/*文字周りの余白*/
}
.intro_joyus_image{
//  width: 70%;
  text-align:center;
  margin: 0 auto;
}

/*---------------------------
  再婚ネットのご紹介
  ---------------------------*/
.bg_aside{
  background-color: white;//wheat;
}
.intro_guide{
  border: 1px solid silver;
  border-radius: 0.5rem;
  position : relative;
  margin-top:1rem;
  margin-bottom:1rem;
  background-color: white;
  overflow: hidden;
//  z-index: 3;
}
.intro_guide_text > .title{
  padding-top: 0.5rem;
}
.intro_guide_text > .detail{
  font-size:  0.8rem;
  padding-left:1rem;
  padding-right:1rem;
}
.intro_guide_text > .detail_right{
  font-size:  0.8rem;
  padding-left:6rem;
  padding-right:1rem;
}
.intro_guide_text > .detail_left{
  font-size:  0.8rem;
  padding-left:1rem;
  padding-right:6rem;
}
.bg_guide_regist{
  background-image: url(../images/bg_side_01.jpg);
  background-repeat: no-repeat;
  background-size: auto 70%;
  position : relative;
//  z-index: 4;
  padding-bottom:1rem;
}
.bg_guide_omiai{
  background-image: url(../images/bg_side_02.jpg);
  background-repeat: no-repeat;
  background-position: right 30%;
  background-size: 50% auto;
  position : relative;
//  z-index: 4;
//  padding-bottom:1rem;
}
.bg_guide_ibj{
  background-image: url(../images/bg_side_03.jpg);
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: 35% auto;
  position : relative;
//  z-index: 4;
  padding-bottom:1rem;
}
.bg_guide_counseling{
  background-image: url(../images/bg_side_04.jpg);
  background-repeat: no-repeat;
  background-position: 0.5rem 30%;
  background-size: 25% auto;
  position : relative;
//  z-index: 4;
//  padding-bottom:1rem;
}
.btn_guide {
  display: inline-block;
  position: relative;
  padding: 0.6rem 1.2rem;
  text-align: center;
  text-decoration: none;
  color: #1B1B1B;
  background: #fff;
  border-radius: 1.2rem;
  border:1px solid silver;
  transition: transform ease .3s;

  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
  -webkit-tap-highlight-color: transparent;
}
.btn_guide:hover {
  cursor: pointer;
  text-decoration: none;

  box-shadow: 0 5px 10px 0 rgba(0,0,0,0.12), 0 3px 20px 0 rgba(0,0,0,0.12), 0 5px 6px -2px rgba(0,0,0,0.2);
}
.btn_faw span {
  display: inline-block;
  text-decoration: none;	
  transition: transform ease .3s;
}
.btn_faw:hover span{
  cursor: pointer;
  text-decoration: none;
  transform: translateX(6px);
}
.bg-addition {
  color:            #8b0000 !important;
  background-color: #fcf0f1 !important;
  border-color:     #f0b8bf !important;
}
.bg-addition2 {
  color:            #1b1b1b !important;
}
.bg-mask3 {
  height: 100%;
  background: rgba(255,255,255,0.3);
  position : relative;
//  z-index: 10;
  padding-bottom:1rem;
}
.bg-mask5 {
  height: 100%;
  background: rgba(255,255,255,0.5);
  position : relative;
//  z-index: 10;
  padding-bottom:1rem;
}





.minchou {
  font-family: 'Noto Serif JP', serif;
}

.inline-block {
  display: inline-block; /* インラインブロック化 */
}

.outer{
  text-align: center;
}
.inner{
  display: inline-block;
  text-align: left;
}

.p-t05{
  padding-top: 0.125rem;
}




/*---------------------------
  iframe(レスポンシブ対応)
  ---------------------------*/
.if-video {
    position:relative;
    width: 100%;
}

.if-video::before {
    content: "";
    display: block;
    width: 100%;
    padding-top: 56.25%;
}

.if-video iframe{
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/*---------------------------
  YouTube(レスポンシブ対応)
  ---------------------------*/
.youtube {
  position:relative;
  width: 100%;
  max-width: 560px;
}

.youtube::before {
  content: "";
  display: block;
  width: 100%;
  padding-top: 56.25%;
}

.youtube iframe{
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

/*////////////////////////////////////////////////////////////////////
 *
 *  画像の保存禁止
 *
 */
img {
  pointer-events: none; 
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  -moz-touch-callout:none;
  -moz-user-select:none;
  touch-callout:none;
  user-select:none;

}
img.link  {
  pointer-events: auto !important; 
}