﻿@charset "utf-8";
/*----------------------------------
Reset Setting
-----------------------------------*/
*,
*:before,
*:after {
  margin: 0px;
  padding: 0px;
}
html {
  overflow-x: hidden;
}
body {
  min-width: 950px;
  background: #000;
}
/* 開発環境 */
html.devel body::before{
  content: "devel";
  text-align: center;
  color: #fff;
  position: fixed;
  top: 3px;
  left: 50%;
  margin: 0 0 0 -20px;
  padding: 3px;
  border-radius: 3px;
  line-height: 1;
  font-size: 12px;
  background-color: rgba(240, 0, 0, .75);
  width: 80px;
  display: block;
  z-index: 19999;
}
input[type="text"],
input[type="password"],
textarea,
select {
    outline: none;
}
input[type="button"]:focus,
button:focus {
	outline:0;
}
#cp_content {
  font-size: 100%; /*16px;*/
  line-height: 1.3;
  font-family: "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka;
  _line-break: strict;
  -webkit-text-size-adjust: 100%;
  text-align: center;
  color: #000;
  letter-spacing: 0;
}
#cp_content *{
  box-sizing: border-box;
}
#cp_content img {
  border: 0;
  vertical-align: middle;
}
#cp_content form {
  margin: 0 auto;
  padding: 0;
}
#cp_content table {
  border-collapse: collapse;
  border-spacing: 0px;
  empty-cells: hide;
  text-align: left;
  font-size: 1em;
  border: 0;
  padding: 0;
}
#cp_content tr, #cp_content td, #cp_content th, #cp_content thead, #cp_content tbody, #cp_content tfoot, #cp_content colgroup, #cp_content col {
  border-width: 0px;
}
#cp_content ul, #cp_content ol{
  margin: 0;
  padding: 0;
  list-style-type: none;
}
#cp_content li {
  margin: 0;
  padding: 0;
}
#cp_content h1, #cp_content h2, #cp_content h3, #cp_content h4, #cp_content h5 {
  margin: 0 auto;
  text-align: left;
  font-weight: bold !important;
  font-size: 1.1em;
  font-weight: bold;
}
#cp_content P {
  margin: 0 auto;
  text-align: left;
}
#cp_content hr {
  display: none;
}
#cp_content em {
  font-style: normal;
  font-weight: bold;
}
#cp_content a {
  text-decoration: underline;
  text-underline-offset: 2px;
}
#cp_content a:hover {
  text-decoration: none;
}
#cp_content a:visited {}
#cp_content p, #cp_content div, #cp_content li {
}
#cp_content h4 a {
  font-size: 110%;
  display: block;
}
#cp_content em {
  font-weight: bold;
  font-style: normal;
}
#cp_content .price_info em{
  font-weight: normal;
}
#cp_content div, #cp_content dl, #cp_content dt, #cp_content dd, #cp_content ul, #cp_content ol, #cp_content li, #cp_content pre, #cp_content form, #cp_content fieldset, #cp_content input, #cp_content textarea, #cp_content p, #cp_content blockquote, #cp_content th, #cp_content td {
  line-height: 1.4;
  word-break: break-all;
  word-wrap: break-word;
}
#cp_content h1, #cp_content h2, #cp_content h3, #cp_content h4, #cp_content h5, #cp_content h6 {
  font-size: 1.1em;
  font-weight: bold;
}
#cp_content .img_center {
  text-align: center;
}
#cp_content input, #cp_content textarea {
  font-size: 20px;
  font-weight: normal;
  line-height: 1.4;
  padding: 5px 20px;
  margin: 0 5px 0 0;
  word-break: break-all;
  word-wrap: break-word;
  height: auto;
  vertical-align: middle;
  border: 2px solid #777;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  -moz-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
}
#cp_content select {
  font-size: 20px;
  padding: 5px 50px 5px 20px;
  vertical-align: middle;
  border: 2px solid #777;
  background-color: #fff;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  -moz-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
	-moz-appearance: none; 
	-webkit-appearance: none; 
  appearance: none;
  background-image: url(./../img/input/select_icon.png);
  background-repeat: no-repeat;
  background-position: right center;
  background-size: contain;
}
#cp_content select::-ms-expand {
  display: none;
}

/*--------------------
共通クラス
--------------------*/
/* メニュー枠 */
#cp_content .icon {
  float: left;
}
#cp_content .tbl:after {
  content: "";
  clear: both;
  display: block;
}
#cp_content .tbl .inner::after {
  content: "";
  clear: both;
  display: block;
}
#cp_content .menu_info {
  float: right;
}
#cp_content .price_info {
  text-align: right;
  margin-top: .2em;
}
#cp_content .price_info SPAN{
  font-weight: normal;
  color: #000;
}
#cp_content .update {
  text-align: right;
}
#cp_content .menu_info_bot {
  float: left;
  width: 100%;
}

/* 説明設定 一式*/
#cp_content .description {
  width: 950px;
  margin: 0 auto;
}
#cp_content .description p {
  text-align: center;
}
#cp_content .description em {}
#cp_content .description a {
  font-weight: bold;
}
#cp_content .description {
}
#cp_content .description p {
  color: #fff;
}
#cp_content .description .caption {
  margin-top: 1em;
  color: #fff;
}
#cp_content .description .menucaption {
  color: #fff;
  text-align: left;
  width: 740px;
  margin: 10px auto 30px;
  line-height: 1.7;
  font-size: 18px;
}
#cp_content .description .normal_price {
  color: #fff;
}
#cp_content .description .special_price {
  color: #fff100;
}
#cp_content .description em, #cp_content .description .premium, #cp_content .description a, #cp_content .description .pr {
  color: #fff;
}
#cp_content .description a {
  color: #fff100;
}

/*input用*/
#cp_content.input .description {
}
#cp_content.inputfree .description {
}

#cp_content .info_text {
	text-align: center;
	color: #fff;
  margin: 1.5% auto 1%;
  font-size: 18px;
}

/*マウスオーバー*/
img.overBtn {
}
img.overBtn.hover {
  animation: btnBright 500ms linear 0ms 1;
}
@keyframes btnBright {
  0% {
    filter: brightness(1);
  }
  5% {
    filter: brightness(1.3);
  }
  100% {
    filter: brightness(1);
  }
}


/*--------------------
コンテンツ
--------------------*/
body {
	background-image: url(./../img/common/bg_body_hdr.jpg), url(./../img/common/bg_body_bdy.jpg);
  background-repeat: no-repeat, repeat-y;
  background-position: center top, center top;
  background-attachment: fixed;
}
#cp_content {
  font-size: 100%; /*16px;*/
  line-height: 1.3;
  font-family: 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', Arial, sans-serif;
  _line-break: strict;
  -webkit-text-size-adjust: 100%;
}
#cp_content .icon {
  width: 72px;
  width: 86px;
}
#cp_content .icon img {
  width: 72px;
  width: 86px;
}
#cp_content .menu_info img {
  max-width: 100%;
}
#cp_content #error {
  width: 856px;
  min-height: 30vh;
  margin: 0px auto;
  color: #fff;
  display: flex;
  align-items: center;
}
#cp_content #error p {
	font-size: 110%;
  text-align: center;
}

/*----------------------------------
プリロード
--------------------------------------*/
#preloaded_images {
	width: 0px;
	height: 0px;
	display: inline;
}
.index #preloaded_images {
	background-image: url(./../img/index/topmenu_btn1_on.png),
  url(./../img/index/topmenu_btn2_on.png),
  url(./../img/index/cat_nav_on.jpg),
  url(./../img/index/btn_kantei_on.png);
}
.profile #preloaded_images {
}
.input #preloaded_images {
  background-image: url(./../img/input/btn_imasugu_on.png),
  url(./../img/input/btn_tryal_on.png),
  url(./../img/input/btn_charge_on.png),
  url(./../img/input/btn_free_on.png);
}
.result #preloaded_images {
  background-image: url(../img/result/btn_next_on.png);
}

/*--------------------
pay_attention
--------------------*/
#cp_content .pay_attention {
  width: 820px;
  margin: 0 auto 20px;
  text-align: center;
}
#cp_content .pay_attention P {
  text-align: center;
  color: #fff;
  margin-top: 1em;
  line-height: 1.6;
}
#cp_content .pay_attention P EM {
  color: #e60012;
  font-weight: bold;
}
#cp_content .pay_attention P.premium {
  color: #fff;
  font-weight: bold;
}
#cp_content .pay_attention P.premium A {
  color: #FFF100;
  font-weight: bold;
}
#cp_content .pay_attention P .special_price {
  color: #e60012;
  font-weight: bold;
}
#cp_content .pay_attention P .normal_price {
  color: #fff;
  font-weight: bold;
}
#cp_content .pay_attention .text_box {
  text-align: center;
  margin-top: 0;
}

#cp_content.result .pay_attention STRONG A{
  color: #FFF100;
}

#cp_content.result .pay_attention .next_btn {
  margin-top: 20px;
}

#cp_content.index .content_box {}
#cp_content.index #header {
  background: url(./../img/common/kv_top.png) no-repeat 50% top;
  height: 840px;
  position: relative;
  z-index: 10;
}
#cp_content.index #header .header_bdy {
  width: 950px;
  height: 430px;
  margin: 0 auto;
  position: relative;
}
#cp_content.index #header H1 {
  width: 950px;
  height: 540px;
  position: absolute;
  top: 0px;
  left: 0;
  right: 0;
  margin: auto;
  text-indent: -9999px;
}
#cp_content #g_menu {
  margin: -25px auto -150px;
  background: url(./../img/common/nav_off.png) no-repeat 50% top;
  padding: 55px 0 28px 0;
  position: relative;
  z-index: 1;
  width: 100%;
  height: 258px;
}
#cp_content #g_menu .nav {
  width: 910px;
  height: 87px;
  margin: 0px auto;
  padding: 0;
}
#cp_content #g_menu .nav UL {
  display: flex;
  justify-content: space-between;
}
#cp_content #g_menu LI {
  display: block;
  width: 453px;
}
#cp_content #g_menu LI A,
#cp_content #g_menu LI SPAN {
  display: block;
  width: 100%;
  height: 87px;
  background: url(./../img/common/nav_on.jpg) no-repeat;
  text-indent: -9999px;
}
#cp_content #g_menu LI A {
  opacity: 0;
  transition: opacity .3s;
}
#cp_content #g_menu LI SPAN {
  opacity: 1;
}
#cp_content #g_menu LI.nav1 {
}
#cp_content #g_menu LI.nav2 {
}
#cp_content #g_menu LI.nav1 A,
#cp_content #g_menu LI.nav1 SPAN {
  background-position: 0px 0px;
}
#cp_content #g_menu LI.nav2 A,
#cp_content #g_menu LI.nav2 SPAN {
  background-position: -457px 0px;
}
#cp_content #g_menu LI A:hover {
  opacity: 1;
}
#cp_content .h_text {
  text-align: center;
  margin: 0 auto 110px;
}
#cp_content #contentmain {
  margin: 0;
  padding: 84px 0 0 0;
  background: url(./../img/common/bg_content.png) repeat-y 50% 40px;
}


/*--------------------
index topmenu
--------------------*/
#cp_content #topmenu {
  width: 940px;
  height: 305px;
  margin: 0px auto;
  /*
  display: flex;
  justify-content: space-between;
  */
  z-index: 1;
  position: relative;
  top: 536px;
}
#cp_content #topmenu P {
  /*flex: 0 0 469px;*/
  background-repeat: no-repeat;
  background-position: center;
  pointer-events: none;
  position: relative;
  padding: 35px 5px 10px;
  width: 469px;
  height: 305px;
}
#cp_content #topmenu P::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
#cp_content #topmenu P:hover::after {
  opacity: 1;
  animation: topmenuHover 300ms linear 0ms 1 normal forwards;
}
#cp_content #topmenu .btn1 {
  background-image: url(./../img/index/topmenu_btn1_off.png);
  float: left;
}
#cp_content #topmenu .btn1::after {
  background-image: url(./../img/index/topmenu_btn1_on.png);
}
#cp_content #topmenu .btn2 {
  background-image: url(./../img/index/topmenu_btn2_off.png);
  float: right;
}
#cp_content #topmenu .btn2::after {
  background-image: url(./../img/index/topmenu_btn2_on.png);
}
#cp_content #topmenu A {
  text-indent: -9999px;
  display: block;
  pointer-events: auto;
  width: 100%;
  height: 100%;
}

@keyframes topmenuHover {
  /*
  0% {
    filter: brightness(1);
  }
  5% {
    filter: brightness(1.3);
  }
  100% {
    filter: brightness(1);
  }
  */
  0% {
    opacity: .5;
  }
  100% {
    opacity: 1;
  }
}




/*--------------------
index toptextmenu
--------------------*/
#cp_content #toptextmenu{
  text-align: center;
  font-size: 20px;
  margin: 15px 0 25px 0;
}
#cp_content #toptextmenu a{
  line-height: 2;
}
#cp_content #toptextmenu a{
  color: #fff;
  text-decoration: underline;
}
#cp_content #toptextmenu a:hover{
  text-decoration: none;
}

/*--------------------
top_img
--------------------*/
#cp_content.index .top_img1{
  margin-bottom: 10px;
}

/*--------------------
new
--------------------*/
#cp_content #new {
  width: 900px;
  margin: 0px auto;
  background-image: url(./../img/index/new_hdr.jpg), url(./../img/index/new_ftr.jpg), url(./../img/index/new_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 0 0 58px;
  font-size: 18px;
  position: relative;
}
#cp_content #new .wrap  {
  width: 100%;
  height: auto;
  padding: 0;
}
#cp_content #new H2 {
  text-indent: -9999px;
  height: 200px;
}
#cp_content #new .tbl {
  width: 768px;
  margin: 0px auto 0;
  background-image: url(./../img/index/new_in_hdr.jpg), url(./../img/index/new_in_ftr.jpg), url(./../img/index/new_in_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 45px 0 30px;
  position: relative;
  z-index: 10;
}
#cp_content #new .inner {
  width: 680px;
  margin: 0 auto;
  padding: 0;
  position: relative;
  z-index: 11;
}
#cp_content #new .menu_info {
  width: 580px;
  margin-top: 4px;
}
#cp_content #new .menu_info_bot {
  margin-top: 8px;
  margin-bottom: 8px;
}
#cp_content #new H4 {
  font-size: 24px;
  margin-bottom: 10px;
}
#cp_content #new H4 a {
  color: #000;
}
#cp_content #new H4 a:hover {
  color: #e60012;
}
#cp_content #new .caption {
  margin-bottom: 4px;
}
#cp_content #new .update {
  color: #e60012;
  font-weight: normal;
  /*margin-right: .6em;*/
}
#cp_content #new .price_info {
  color: #e60012;
}


/*--------------------
whats_premium
--------------------*/
#cp_content #whats_premium {
  margin: 0 0 30px 0;
}
#cp_content #whats_premium P{
  text-align: center;
  color: #fff;
  font-size: 22px;
}
#cp_content #whats_premium A{
  color: #FFF100;
}

/*--------------------
selection
--------------------*/
#cp_content #selection {
  width: 900px;
  margin: 0px auto;
  background-image: url(./../img/index/selection_hdr.jpg), url(./../img/index/selection_ftr.jpg), url(./../img/index/selection_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 0 0 58px;
  font-size: 18px;
}
#cp_content #selection h2 {
  text-indent: -9999px;
  height: 274px;
  margin-bottom: 0;
}
#cp_content #selection .tbl {
  width: 768px;
  margin: 0 auto 4px;
  background-image: url(./../img/index/selection_in_hdr.jpg), url(./../img/index/selection_in_ftr.jpg), url(./../img/index/selection_in_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 40px 0 34px;
}
#cp_content #selection .inner {
  width: 680px;
  margin: 0 auto;
  color: #000;
}
#cp_content #selection .menu_info {
  width: 580px;
  margin-top: 4px;
}
#cp_content #selection .menu_info_bot {
  margin-top: 8px;
  margin-bottom: 8px;
}
#cp_content #selection h4 {
  font-size: 24px;
  margin-bottom: 0;
  min-height: 86px;
}
#cp_content #selection h4 A {
  color: #000;
}
#cp_content #selection H4 A:hover {
  color: #e60012;
}
#cp_content #selection .caption {
  margin-bottom: 0.5em;
}
#cp_content #selection .price_info {
  color: #e60012;
  font-weight: bold;
}


/*--------------------
top_img2
--------------------*/
#cp_content .top_img2 {
}

/*--------------------
top_img34
--------------------*/
#cp_content .top_img34 {
  position: relative;
  width: 900px;
}

/*--------------------
.special
--------------------*/
#cp_content .special {
  width: 900px;
  margin: 0px auto 0px;
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 0 0 40px;
  font-size: 18px;
  position: relative;
}
#cp_content .special .wrap  {
  width: 100%;
  height: auto;
  padding: 0;
}
#cp_content .special H2 {
  text-indent: -9999px;
  height: 214px;
}
#cp_content .special .tbl {
  width: 796px;
  margin: 0px auto 5px;
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 40px 0 30px;
  position: relative;
  z-index: 10;
}
#cp_content .special .tbl:last-child {
  margin-bottom: 0;
}
#cp_content .special .inner {
  width: 680px;
  margin: 0 auto;
  padding: 0;
  position: relative;
  z-index: 11;
}
#cp_content .special .tbl:last-child .inner{
  padding: 0 0 10px 0;
}
#cp_content .special .menu_info {
  width: 580px;
  margin-top: 4px;
}
#cp_content .special .menu_info_bot {
  clear: both;
  margin-top: 8px;
}
#cp_content .special H4 {
  font-size: 24px;
  margin-bottom: 10px;
}
#cp_content .special H4 a {
  color: #000;
}
#cp_content .special H4 a:hover {
  color: #e60012;
}
#cp_content .special .caption {
  margin-bottom: 5px;
}
#cp_content .special .price_info {
  color: #e60012;
  font-weight: bold;
}

/* #renai */
#cp_content #renai {
  background-image: url(./../img/index/special_renai_hdr.jpg), url(./../img/index/special_renai_ftr.jpg), url(./../img/index/special_renai_bdy.jpg);
}
#cp_content #renai .tbl {
  background-image: url(./../img/index/special_renai_in_hdr.jpg), url(./../img/index/special_renai_in_ftr.jpg), url(./../img/index/special_renai_in_bdy.jpg);
}

/* #kekkon */
#cp_content #kekkon {
  background-image: url(./../img/index/special_kekkon_hdr.jpg), url(./../img/index/special_kekkon_ftr.jpg), url(./../img/index/special_kekkon_bdy.jpg);
}
#cp_content #kekkon .tbl {
  background-image: url(./../img/index/special_kekkon_in_hdr.jpg), url(./../img/index/special_kekkon_in_ftr.jpg), url(./../img/index/special_kekkon_in_bdy.jpg);
}

/* #jinsei */
#cp_content #jinsei {
  background-image: url(./../img/index/special_jinsei_hdr.jpg), url(./../img/index/special_jinsei_ftr.jpg), url(./../img/index/special_jinsei_bdy.jpg);
}
#cp_content #jinsei .tbl {
  background-image: url(./../img/index/special_jinsei_in_hdr.jpg), url(./../img/index/special_jinsei_in_ftr.jpg), url(./../img/index/special_jinsei_in_bdy.jpg);
}

#cp_content .special h5 {
  width: 688px;
  height: 133px;
  margin: 0 auto 10px;
}
#cp_content .book_sample{
  position: relative;
}
#cp_content .book_sample::after{
  content: "";
  position: absolute;
  z-index: 10;
  top: 0;
  left: 50%;
  background-image: url(./../img/book/frame.png);
  background-size: 100% 100%;
  background-position: top center;
  width: 660px;
  height: 500px;
  margin-left: -330px;
}
#cp_content .book_sample #fixed_book{
  transform-origin: top center;
  transform: scale(0.75);
  margin-bottom: -60px;
  top: 35px;
}
#cp_content .angel_sample #fixed_angel_box{
  background-image: url(./../img/angel/frame.jpg);
  width: 606px;
  height: 460px;
  min-height: auto;
  padding: 27px 0 0 0;
  margin-bottom: 20px;
}
#cp_content .angel_sample .angel_image{
  transform-origin: top center;
  transform: scale(1);
}

#cp_content .btn_kantei{
  display: block;
  width: 488px;
  height: 128px;
  margin: 0 auto 20px;
}

/*----------*/
#cp_content .ex_graphic {
  position: relative;
  margin: 5px 0 15px 0;
  z-index: 20;
}
#cp_content .ex_graphic a{
  display: block;
  width: 488px;
  height: 128px;
  margin: -5px auto 0;
}

/*--------------------
osusume
--------------------*/
#cp_content #osusume {
  width: 900px;
  margin: 0px auto;
  background-image: url(./../img/index/osusume_hdr.jpg), url(./../img/index/osusume_ftr.jpg), url(./../img/index/osusume_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 0 0 64px;
  font-size: 18px;
}
#cp_content #osusume h2 {
  text-indent: -9999px;
  height: 222px;
  margin-bottom: 0;
}
#cp_content #osusume .tbl {
  width: 768px;
  margin: 0 auto;
  background-image: url(./../img/common/blank.png), url(./../img/index/osusume_in_bdr.jpg), url(./../img/index/osusume_in_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 5px 0 20px;
}
#cp_content #osusume .tbl:first-child {
  background-image: url(./../img/index/osusume_in_hdr.jpg), url(./../img/index/osusume_in_bdr.jpg), url(./../img/index/osusume_in_bdy.jpg);
  padding: 40px 0 20px;
}
#cp_content #osusume .tbl:last-child {
  background-image: url(./../img/common/blank.png), url(./../img/index/osusume_in_ftr.jpg), url(./../img/index/osusume_in_bdy.jpg);
  padding: 5px 0 35px;
}
#cp_content #osusume .inner {
  width: 690px;
  margin: 0 auto;
}
#cp_content #osusume .menu_info {
  width: 590px;
  margin-top: 4px;
}
#cp_content #osusume .menu_info_bot {
  float: right;
  width: 590px;
  margin-bottom: 8px;
}
#cp_content #osusume H4 {
  font-size: 24px;
  margin-bottom: 0;
  min-height: 72px;
}
#cp_content #osusume H4 A {
  color: #000;
}
#cp_content #osusume H4 A:hover {
  color: #e60012;
}
#cp_content #osusume .price_info {
  color: #e60012;
  font-weight: bold;
  margin-top: .4em;
}

/*--------------------
free
--------------------*/
#cp_content #free {
  width: 900px;
  margin: 0px auto 0px;
  background-image: url(./../img/index/free_hdr.jpg), url(./../img/index/free_ftr.jpg), url(./../img/index/free_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 0 0 62px;
  font-size: 18px;
  position: relative;
}
#cp_content #free .wrap  {
  width: 100%;
  height: auto;
  padding: 0;
}
#cp_content #free H2 {
  text-indent: -9999px;
  height: 236px;
}
#cp_content #free .tbl {
  width: 796px;
  margin: 0px auto 2px;
  background-image: url(./../img/index/free_in_hdr.jpg), url(./../img/index/free_in_ftr.jpg), url(./../img/index/free_in_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 40px 0 40px;
  position: relative;
  z-index: 10;
}
#cp_content #free .tbl:last-child {
  margin-bottom: 0;
}
#cp_content #free .inner {
  width: 680px;
  margin: 0 auto;
  padding: 0;
  position: relative;
  z-index: 11;
}
#cp_content #free .menu_info {
  width: 580px;
  margin-top: 4px;
}
#cp_content #free .menu_info_bot {
  width: 100%;
}
#cp_content #free H4 {
  font-size: 24px;
  margin-bottom: 10px;
}
#cp_content #free H4 a {
  color: #000;
}
#cp_content #free H4 a:hover {
  color: #e60012;
}
#cp_content #free .price_info {
  color: #e60012;
  font-weight: bold;
}


/*--------------------
cat_menu
--------------------*/
#cp_content .cat_menu {
  width: 900px;
  height: 128px;
  margin: 0px auto 4px;
  background-image: url(./../img/index/cat_nav_on.jpg);
  background-repeat: no-repeat;
  padding: 15px 34px 0px 34px;
  display: flex;
  justify-content: space-between;
}
#cp_content .cat_menu LI {
  display: block;
}
#cp_content .cat_menu LI A {
  display: block;
  width: 272px;
  height: 88px;
  text-indent: -9999px;
  transition: 1.0s;
  background-image: url(./../img/index/cat_nav_off.jpg);
  background-repeat: no-repeat;
}
#cp_content .cat_menu LI A.love {
  background-position: -34px -15px;
}
#cp_content .cat_menu LI A.enc {
  background-position: -314px -15px;
}
#cp_content .cat_menu LI A.life {
  background-position: -594px -15px;
}
#cp_content .cat_menu LI A:hover {
  transition: 400ms;
  opacity: 0;
}

/*--------------------
category
--------------------*/
#cp_content #category {
  width: 900px;
  margin: 40px auto 0;
  font-size: 18px;
}

/* カテゴリー共通 */
#cp_content #category > div[id^="cat"] {
  width: 100%;
  background-repeat: no-repeat, no-repeat;
  background-position: center top, center bottom;
  background-color: #0e0515;
  padding-bottom: 38px;
  margin-bottom: 24px;
}
#cp_content #category H3 {
  width: 900px;
  height: 296px;
  margin-bottom: 0;
  text-indent: -9999px;
}
#cp_content #category .catbox {
  width: 754px;
  margin: 0 auto;
}
#cp_content #category .catbox .tbl {
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 35px 35px 35px;
  margin-bottom: 10px;
  position: relative;
}
#cp_content #category .catbox .tbl:last-child {
  margin-bottom: 0;
}
#cp_content #category .inner {
  color: #000;
  position: relative;
  z-index: 12;
}
#cp_content #category .menu_info {
  width: 580px;
  margin-top: 4px;
}
#cp_content #category .menu_info_bot {
  clear: both;
  margin-top: 8px;
}
#cp_content #category H4 {
  font-size: 24px;
  margin-bottom: 10px;
}
#cp_content #category h4 A {
  color: #000;
}
#cp_content #category h4 a:hover {
  color: rgba(0,0,0,.8);
}
#cp_content #category .caption {
  margin-bottom: 0.6em;
}
#cp_content #category .price_info {
  font-weight: bold;
}
#cp_content #category h4 a:hover{
	color: #e60012;
}
#cp_content #category .price_info {
  color: #e60012;
}

/*--------------------
cat1
--------------------*/
#cp_content #cat1 {
  background-image: url(./../img/index/cat1_hdr.jpg), url(./../img/index/cat1_ftr.jpg);
}
#cp_content #cat1 .tbl {
  background-image: url(./../img/index/cat1_in_hdr.jpg), url(./../img/index/cat1_in_ftr.jpg), url(./../img/index/cat1_in_bdy.jpg);
}

/*--------------------
cat2
--------------------*/
#cp_content #cat2 {
  background-image: url(./../img/index/cat2_hdr.jpg), url(./../img/index/cat2_ftr.jpg);
}
#cp_content #cat2 .tbl {
  background-image: url(./../img/index/cat2_in_hdr.jpg), url(./../img/index/cat2_in_ftr.jpg), url(./../img/index/cat2_in_bdy.jpg);
}

/*--------------------
cat3
--------------------*/
#cp_content #cat3 {
  background-image: url(./../img/index/cat3_hdr.jpg), url(./../img/index/cat3_ftr.jpg);
  margin-bottom: 10px !important;
}
#cp_content #cat3 .tbl {
  background-image: url(./../img/index/cat3_in_hdr.jpg), url(./../img/index/cat3_in_ftr.jpg), url(./../img/index/cat3_in_bdy.jpg);
}

/*===================================================*/
/*--------------------
下層ページ全般
--------------------*/
#cp_content.under .content_box {
  margin-bottom: 0px;
}
#cp_content.under #contentmain {
  margin: 0;
  padding: 75px 0 0;
  background: url(./../img/common/bg_content.png) repeat-y 50% top;
}
#cp_content.under #header {
  background: url(./../img/common/kv_under.png) no-repeat 50% top;
  height: 480px;
}
#cp_content.under #header .kv_bdy {
  margin: 0 auto;
  position: relative;
}
#cp_content.under #header H1 {
  width: 950px;
  height: 420px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  text-indent: -9999px;
}
#cp_content.under #header H1 A {
  display: block;
  width: 950px;
  height: 420px;
}
#cp_content.under #g_menu {
  margin: -96px auto -150px;
}
#cp_content #under_navi {
  width: 856px;
  margin: 0px auto 10px;
  font-size: 110%;
  color: #fff;
  padding-top: 0;
  position: relative;
  z-index: 10;
}
#cp_content #under_navi a {
  color: #fff100;
}

/*--------------------
監修者紹介
--------------------*/
#cp_content.profile #profile {
  width: 900px;
  margin: 0px auto 35px;
  background-image: url(./../img/profile/profile_hdr.jpg), url(./../img/profile/profile_ftr.jpg), url(./../img/profile/profile_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  color: #fff;
  padding: 0 0 90px;
  text-align: left;
}
#cp_content.profile #profile H2 {
  height: 172px;
  text-indent: -9999px;
}
#cp_content.profile #profile H3 {
  height: 260px;
  text-indent: -9999px;
}
#cp_content.profile #profile .inner {
  margin: 0 auto;
  overflow: hidden;
  width: 720px;
}
#cp_content.profile #profile .inner P {
  padding: 0;
  margin-bottom: 1em;
  line-height: 1.8;
  font-size: 18px;
}
#cp_content.profile #profile .inner P.right {
  text-align: right;
  margin-top: -1em;
}

#cp_content.profile #profile .inner DL {
  padding: 0 20px;
  margin-bottom: 1.5em;
  text-align: left;
  display: flex;
  flex-wrap: wrap;
}
#cp_content.profile #profile .inner DL DT {
  flex: 0 0 4em;
  line-height: 1.8;
}
#cp_content.profile #profile .inner DL DD {
  flex: 0 0 90%;
  line-height: 1.8;
}
#cp_content.profile #profile .inner .name {
  margin: 0 0 10px -20px;
}

#cp_content.profile #divination {
  width: 900px;
  margin: 0px auto 20px;
  background-image: url(./../img/profile/divination_hdr.jpg), url(./../img/profile/divination_ftr.jpg), url(./../img/profile/divination_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  color: #fff;
  padding: 0 0 50px;
  text-align: left;
}
#cp_content.profile #divination H2 {
  height: 172px;
  text-indent: -9999px;
}
#cp_content.profile #divination H3 {
  height: 120px;
  text-indent: -9999px;
}
#cp_content.profile #divination .inner {
  margin: 20px auto 0;
  overflow: hidden;
  width: 720px;
}
#cp_content.profile #divination .inner P {
  padding: 0;
  margin-bottom: 1em;
  line-height: 1.8;
  font-size: 18px;
}

#cp_content.profile #message {
  width: 900px;
  margin: 0px auto;
  background-image: url(./../img/profile/message_hdr.jpg), url(./../img/profile/message_ftr.jpg), url(./../img/profile/message_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  color: #fff;
  padding: 0 0 140px;
  text-align: left;
}
#cp_content.profile #message H2 {
  height: 280px;
  text-indent: -9999px;
}
#cp_content.profile #message .inner {
  margin: 0 auto;
  overflow: hidden;
  width: 720px;
}
#cp_content.profile #message .inner P {
  padding: 0;
  margin-bottom: 1em;
  line-height: 1.8;
  font-size: 18px;
}

#cp_content.profile .profile_img1 {
  margin-bottom: 10px;
}

/*--------------------
入力ページ
--------------------*/
#cp_content .menu_title {
  background-image: url(./../img/common/menu_bg.png);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100% 100%;
  height: auto;
  width: 880px;
  margin: 10px auto 10px;
  color: #000;
  position: relative;
}
#cp_content .menu_title H2 {
  width: 620px;
  height: 197px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  overflow: hidden;
  padding: 0;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
#cp_content .menu_title img {
  flex: 0 0 80px;
}
#cp_content .menu_title H2 .title {
  flex: 0 0 520px;
  font-size: 26px;
  margin: 0;
}

#cp_content .btn_imasugu {
  margin-bottom: 10px;
}

#cp_content .error_msg {
  width: 740px;
  margin: 1em auto;
  color: #e20000;
  font-weight: bold;
}

/*--------------------
judge_topic
--------------------*/
#cp_content #judge_topic {
  width: 858px;
  margin: 0px auto 0;
  background-image: url(./../img/common/judge_topic_hdr.png), url(./../img/common/judge_topic_ftr.png);
  background-repeat: no-repeat, no-repeat;
  background-position: center top, center bottom;
  padding: 0 0 98px;
  position: relative;
}
#cp_content #judge_topic::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: calc(100% - 334px);
  top: 204px;
  left: 0;
  background-image: url(./../img/common/judge_topic_bdy.png);
  background-repeat: repeat-y;
  background-position: center top;
  z-index: 9;
}
#cp_content #judge_topic H3 {
  height: 175px;
  text-indent: -9999px;
  margin-bottom: 0;
}
#cp_content #judge_topic .list {
  list-style-type: none;
  width: 680px;
  margin: 0 auto;
  position: relative;
  z-index: 10;
}
#cp_content #judge_topic OL {
  list-style-type: none;
  padding: 15px 0;
  margin: 0 auto;
  color: #fff;
}
#cp_content #judge_topic LI {
  text-align: left;
  padding: 10px 0 10px 38px;
  background: url(./../img/common/blank.png) no-repeat left center;
  background-repeat: no-repeat;
}
#cp_content #judge_topic .menuattention .attention_txt {
  padding: 0;
  color: #fff;
  font-size: 100%;
  line-height: 116%;
  text-align: center;
}
#cp_content #judge_topic .menuattention .attention_txt STRONG {
  color: #fff;
}

/*--------------------
input_img1
--------------------*/
#cp_content .input_img1 {
  margin-top: -40px;
}

/*--------------------
judeg_form
--------------------*/
#cp_content #judeg_form {
  width: 900px;
  margin: 0 auto 15px;
  background-image: url(./../img/input/form_hdr.jpg), url(./../img/input/form_ftr.jpg), url(./../img/input/form_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 30px 0 40px;
}
#cp_content #judeg_form .wrap{
  margin: 0px auto;
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 0 0 25px;
}
#cp_content #judeg_form H3 {
  height: 108px;
  text-indent: -9999px;
}
#cp_content #judeg_form TABLE {
  background-repeat: no-repeat, no-repeat;
  background-position: center top, center bottom;
  padding: 46px 0; 
  width: 800px;
  display: block;
  margin: 0 auto;
  position: relative;
}
#cp_content #judeg_form TABLE::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: calc(100% - 88px);
  top: 44px;
  left: 0;
  background-repeat: repeat-y;
  background-position: center top;
  z-index: 1;
}
#cp_content #judeg_form .input_tbl TBODY{
  width: 700px;
  display: block;
  margin: 0 auto;
  padding: 0;
  position: relative;
  z-index: 2;
}
#cp_content #judeg_form .input_tbl TH {
  color: #cba150;
  width: 110px;
  margin-bottom: 10px;
}
#cp_content #judeg_form .input_tbl TH IMG {
  margin-right: 10px;
}
#cp_content #judeg_form .input_tbl TD strong{
  color: #a40000;
  font-size: 14px;
}
#cp_content #judeg_form .input_tbl TD .error{
  color: #a40000;
  font-weight: bold;
  font-size: 14px;
}
#cp_content #judeg_form .input_tbl SELECT {
  margin-right: -5px;
}
#cp_content #judeg_form .input_tbl .tr_attention TD {
  font-size: 16px;
  line-height: 1.5;
  padding: 5px 0;
  color: #000;
}
#cp_content #judeg_form .input_tbl .tr_attention2 TD{
  height: 10px;
}
#cp_content #judeg_form .input_tbl .tr_attention TD strong a {
  color: #a40000;
}
#cp_content #judeg_form .input_user1{
  background-image: url(./../img/input/form_user1_hdr.jpg), url(./../img/input/form_user1_ftr.jpg), url(./../img/input/form_user1_bdy.jpg);
  margin-bottom: 12px;
}
#cp_content #judeg_form .input_user1 .input_tbl{
  background-image: url(./../img/input/form_user1_in_hdr.png), url(./../img/input/form_user1_in_ftr.png);
}
#cp_content #judeg_form .input_user1 .input_tbl::before{
  background-image: url(./../img/input/form_user1_in_bdy.png);
}
#cp_content #judeg_form .input_user2 {
  background-image: url(./../img/input/form_user2_hdr.jpg), url(./../img/input/form_user2_ftr.jpg), url(./../img/input/form_user2_bdy.jpg);
  margin-bottom: 8px;
}
#cp_content #judeg_form .input_user2 H3 {
  height: 112px;
}
#cp_content #judeg_form .input_user2 .input_tbl{
  background-image: url(./../img/input/form_user2_in_hdr.png), url(./../img/input/form_user2_in_ftr.png);
}
#cp_content #judeg_form .input_user2 .input_tbl::before{
  background-image: url(./../img/input/form_user2_in_bdy.png);
}
#cp_content #judeg_form .input_name {
  width: 360px;
}
#cp_content #judeg_form .input_caption {
  margin: 0 0 10px;
  text-align: center;
  color: #fff;
}
#cp_content #judeg_form .input_caption em {
  color: #fff;
}
/*--------------------
入力内容の保存
--------------------*/
#cp_content .save_input {
  text-align: center;
  margin: .8em 0 1em;
}
#cp_content .save_input LABEL{
  color: #FFF;
  font-size: 110%;
  user-select: none;
}
#cp_content .save_input input[type=checkbox] {
  transform: scale(1.5, 1.5);
  vertical-align: baseline;
  margin: 0 10px 0 0;
}

/*--------------------
フォームボタン設定
--------------------*/
#cp_content #frm_btn {
  margin: 0px auto 5px;
}
#cp_content #frm_btn P {
  text-align: center;
  color: #fff;
  margin-top: 10px;
}
#cp_content #frm_btn P EM {
  color: #040f65;
  font-weight: bold;
}
#cp_content #frm_btn P.premium, #cp_content #frm_btn P.premium A {
  color: #040f65;
  font-weight: bold;
}
#cp_content #frm_btn P .special_price {
  color: #C00000;
}
#cp_content #frm_btn P .normal_price {
  color: #040f65;
}
#cp_content #frm_btn .price_area {
  width: 844px;
  margin: 0 auto 0;
  overflow: hidden;
}
/*以下ボタン設定*/
#cp_content #frm_btn .btnarea INPUT {
  display: block;
  background-color: transparent;
  border-width: 0;
  cursor: pointer;
  margin: 0 auto;
  padding: 0;
  transition: 1.0s;
}
#cp_content #frm_btn .btnarea INPUT:hover {
  transition: 1.0s;
  opacity: 0;
}
/*一部無料*/
#cp_content #frm_btn .form_btn_trial {
  width: 422px;
  height: 122px;
  background: url(./../img/input/btn_tryal_on.png) no-repeat 50% top;
  margin: 0 auto;
  float: left;
}
#cp_content #frm_btn .form_btn_trial INPUT {
  width: 422px;
  height: 122px;
  background: url(./../img/input/btn_tryal_off.png) no-repeat 50% top;
}
/*有料*/
#cp_content #frm_btn .form_btn_charge {
  width: 422px;
  height: 122px;
  background: url(./../img/input/btn_charge_on.png) no-repeat 50% top;
  margin: 0 auto;
  float: right;
}
#cp_content #frm_btn .form_btn_charge INPUT {
  width: 422px;
  height: 122px;
  background: url(./../img/input/btn_charge_off.png) no-repeat 50% top;
}
/*無料*/
#cp_content #frm_btn .form_btn_free {
  width: 422px;
  height: 122px;
  background: url(./../img/input/btn_free_on.png) no-repeat 50% top;
  margin: 10px auto 0;
}
#cp_content #frm_btn .form_btn_free INPUT {
  width: 422px;
  height: 122px;
  background: url(./../img/input/btn_free_off.png) no-repeat 50% top;
}
/*--------------------
プライバシー
--------------------*/
#cp_content #privacy {
  margin: 0 auto;
  width: 720px;
  padding: 20px 10px;
  background-image: url(./../img/input/privacy_hdr.png), url(./../img/input/privacy_ftr.png), url(./../img/input/privacy_bdy.png);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
}
#cp_content #privacy P {
  color: #000;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: -0.01em;
  text-align: center;
}
#cp_content #privacy P A {
  color: #a40000;
}
/*--------------------
結果ページ
--------------------*/
#cp_content.result .introductory_wrap {
  display: flex;
}
#cp_content.result .text_introductory {
  width: 968px;
  height: 416px;
  margin: -20px auto 0;
  background-image: url(./../img/result/result_img1.jpg);
  background-position: center right;
  background-repeat: no-repeat;
  display: flex;
  justify-content: left;
  align-items: center;
}
#cp_content.result .text_introductory P {
  width: 500px;
  padding: 30px 30px;
  margin: -20px 0 0 80px;
  border-radius: 60px;
  font-size: 20px;
  line-height: 1.7;
  color: #fff;
  background-color: rgba(141, 0, 230, .6);
  box-shadow: 0px 0px 10px 0px #000;
}

/*------入力情報----*/
#cp_content.result #input_box {
  margin-bottom: 16px;
}
#cp_content.result #input_box P {
  background-image: url(./../img/result/name_bg.jpg);
  background-repeat: no-repeat;
  background-position: center;
  color: #fff;
  width: 900px;
  min-height: 68px;
  margin-bottom: 0;
  text-align: center;
  font-size: 20.5px;
  line-height: 3.6;
}
#cp_content.result #input_box #input_user1{
  text-shadow: 0 0 6px #ff005a,0 0 10px #ff005a;
  margin-bottom: 12px;
}
#cp_content.result #input_box #input_user2{
  text-shadow: 0 0 6px #0078ff,0 0 10px #0078ff;
}

/*------固定項目----*/
#cp_content.result #fixed_box {
  width: 900px;
  margin: 0px auto 30px;
  background-image: url(./../img/result/fixed_hdr_user1.jpg), url(./../img/result/fixed_ftr.jpg), url(./../img/result/fixed_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 0 0 62px;
  position: relative;
}
#cp_content.result #fixed_box.double {
  background-image: url(./../img/result/fixed_hdr_user2.jpg), url(./../img/result/fixed_ftr.jpg), url(./../img/result/fixed_bdy.jpg);
}
#cp_content.result #fixed_box h2 {
  width: 100%;
  height: 502px;
  text-indent: -9999px;
  margin-bottom: -4px;
}
#cp_content.result #fixed_box p.read {
  display: none;
}
#cp_content #fixed_book {
  width: 794px;
  height: 574px;
  margin: 0 auto;
  position: relative;
  left: 1px;
  padding: 0;
  color: #fff;
  background-image: url(./../img/book/bg.jpg);
  background-repeat: no-repeat;
  background-position: center top;
}
#cp_content #fixed_book .scrl_anim{
  width: 794px;
  height: 574px;
  position: relative;
}

#cp_content #fixed_book .scrl_anim > DIV{
  position: absolute;
  top: 0;
  left: 0;
  width: 794px;
  height: 574px;
  background-repeat: no-repeat;
  background-position: center top;
}
#cp_content #fixed_book .scrl_anim .book_base{
  background-image: url(./../img/book/book_base.png);
}
#cp_content #fixed_book .scrl_anim .book_page{
  background-image: url(./../img/book/book_page.png);
  opacity: 0;
  background-position: 0 0;
}
#cp_content #fixed_book .scrl_anim.open .book_page{
  transition: opacity 100ms linear 300ms;
  opacity: 1;
  animation: book_page 1000ms steps(5) 500ms 1,
            book_page 700ms steps(5) 1500ms 1,
            book_page 150ms steps(5) 2200ms 20;
}
@keyframes book_page {
  to {
    background-position: -3970px 0;
  }
}

#cp_content #fixed_book .wind{
  background-image: url(./../img/book/wind.jpg);
  mix-blend-mode: overlay;
  opacity: 0;
}
#cp_content #fixed_book .open .wind{
  animation: wind1 500ms linear 0ms 4,
            wind2 400ms linear 2000ms 8;
}
@keyframes wind1 {
  0% {opacity: 0.1;}
  50% {opacity: 0.3;}
  100% {opacity: 0.1;}
}
@keyframes wind2 {
  0% {opacity: 0.3;}
  50% {opacity: 0.6;}
  100% {opacity: 0.3;}
}
@keyframes wind3 {
  0% {opacity: 0.4;}
  50% {opacity: 0.8;}
  100% {opacity: 0.4;}
}
#cp_content #fixed_book .shine{
  background-image: url(./../img/book/shine.jpg);
  mix-blend-mode: screen;
  opacity: 0;
}
#cp_content #fixed_book .open .shine{
  animation: shine 4000ms linear 3000ms 1;
}
@keyframes shine {
  0% {opacity: 0;}
  20% {filter: brightness(0);}
  30% {opacity: 1;}
  50% {filter: brightness(5);}
  60% {opacity: 1;}
  100% {opacity: 0;}
}

#cp_content #fixed_book .white{
  background-color: #fff;
  opacity: 0;
}
#cp_content #fixed_book .open .white{
  animation: white 800ms linear 4800ms 1;
}
@keyframes white {
  0% {opacity: 0;}
  30% {opacity: 1;}
  50% {opacity: 1;}
  100% {opacity: 0;}
}

#cp_content #fixed_book .scrl_anim .result{
  background-image: url(./../img/book/result_bg.jpg);
  opacity: 0;
}
#cp_content #fixed_book .result > DIV{
  width: 620px;
  height: 300px;
  position: relative;
  top: 120px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: space-between;
}
#cp_content #fixed_book .result P{
  font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
  font-weight: bold;
  font-size: 22px;
  color: #000;
  flex: 0 0 290px;
  margin: 0;
  line-height: 1.7;
  letter-spacing: -1px;
  opacity: 0;
  filter: blur(12px);
}
#cp_content #fixed_book .result P:nth-child(1){
  color: #ef7000;
}
#cp_content #fixed_book .result P:nth-child(2){
  color: #0080b2;
}
#cp_content #fixed_book .result P:nth-child(3){
  color: #856000;
}
#cp_content #fixed_book .result P:nth-child(4){
  color: #a70000;
}
#cp_content #fixed_book .open .result P{
  opacity: 1;
  filter: blur(0);
}
#cp_content #fixed_book .open .result P:nth-child(1){
  transition: all 600ms linear 6000ms;
}
#cp_content #fixed_book .open .result P:nth-child(2){
  transition: all 600ms linear 7200ms;
}
#cp_content #fixed_book .open .result P:nth-child(3){
  transition: all 600ms linear 6600ms;
}
#cp_content #fixed_book .open .result P:nth-child(4){
  transition: all 600ms linear 7800ms;
}

#cp_content #fixed_book .open .result{
  transition: opacity 400ms linear 5000ms;
  opacity: 1;
}

#cp_content #fixed_book .scrl_anim .sample{
  background-image: url(./../img/book/sample.png);
  width: 168px;
  height: 55px;
  top: auto;
  left: auto;
  right: 30px;
  bottom: 30px;
}


/*------あなた、2人に起こるうれしいこと----*/
#cp_content.result .fixed_detail {
  background-repeat: no-repeat;
  background-position: center top;
  padding: 0 0 0 0;
}
#cp_content.result #fixed_user1 {
  background-image: url(./../img/result/fixed_user1_hdr.jpg);
}
#cp_content.result #fixed_user2 {
  background-image: url(./../img/result/fixed_user2_hdr.jpg);
}
#cp_content.result .fixed_detail H3{
  width: 100%;
  height: 165px;
  text-indent: -9999px;
  margin-bottom: 16px;
}
#cp_content.result .fixed_txt {
  width: 792px;
  min-height: 250px;
  margin: 0px auto;
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  padding: 62px 60px 50px;
  position: relative;
  font-size: 18px;
}
#cp_content.result #fixed_user1 .fixed_txt {
  background-image: url(./../img/result/fixed_user1_in_hdr.jpg), url(./../img/result/fixed_user1_in_ftr.jpg), url(./../img/result/fixed_user1_in_bdy.jpg);
}
#cp_content.result #fixed_user2 .fixed_txt {
  background-image: url(./../img/result/fixed_user2_in_hdr.jpg), url(./../img/result/fixed_user2_in_ftr.jpg), url(./../img/result/fixed_user2_in_bdy.jpg);
}
#cp_content.result .fixed_txt H4{
  width: 100%;
  height: 48px;
  margin-bottom: 35px;
  color: #000;
  display: flex;
  align-items: center;
  justify-content: center;
}
#cp_content.result .fixed_txt P{
  color: #fff;
}

/*------固定項目2----*/
#cp_content #fixed_angel_box {
  width: 968px;
  margin: 0px auto;
  background-image: url(./../img/result/fixed_angel_hdr.jpg), url(./../img/result/fixed_angel_ftr.jpg), url(./../img/result/fixed_angel_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
  min-height: 1300px;
  padding: 0 0 180px;
  position: relative;
  color: #fff;
}
#cp_content #fixed_angel_box h2 {
  width: 100%;
  height: 351px;
  text-indent: -9999px;
  margin-bottom: 52px;
}
#cp_content #fixed_angel_box p.read {
  display: none;
}
#cp_content #fixed_angel_box .angel_name{
  width: 600px;
  height: 94px;
  margin: 0 auto 62px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#cp_content #fixed_angel_box .angel_name img{
  transition: all 2000ms 1600ms ease-out;
  opacity: 0;
}
#cp_content #fixed_angel_box .angel_image{
  width: 554px;
  height: 408px;
  margin: 0 auto 45px;
  background-image: url(./../img/angel/bg.jpg);
  background-position: center;
  overflow: hidden;
  position: relative;
}
#cp_content #fixed_angel_box .angel_image .image{
  width: 339px;
  height: 390px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -196px 0 0 -170px;
  box-shadow: 0 0 10px 2px rgba(0,0,0,1);
  opacity: 0;
  transform: scale(0.92);
}
#cp_content #fixed_angel_box .angel_image .door{
  position: relative;
  display: flex;
  transition: transform 1700ms 0ms ease-in;
}
#cp_content #fixed_angel_box .angel_image .door .left{
  width: 277px;
  height: 408px;
  background-image: url(./../img/angel/door_l.jpg);
  background-position: center;
  transform: perspective(1000px) rotateY(0deg);
  transform-origin: left center;
  transition: transform 1600ms 100ms ease-in;
}
#cp_content #fixed_angel_box .angel_image .door .right{
  width: 277px;
  height: 408px;
  background-image: url(./../img/angel/door_r.jpg);
  background-position: center;
  transform: perspective(1000px) rotateY(0deg);
  transform-origin: right center;
  transition: transform 1600ms 100ms ease-in;
}
#cp_content #fixed_angel_box .angel_image .effect{
  width: 554px;
  height: 408px;
  margin: 0 auto;
  background-image: url(./../img/angel/effect_1.jpg);
  background-position: center;
  mix-blend-mode: lighten;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}

#cp_content #fixed_angel_box .scrl_anim .sample{
  background-image: url(./../img/angel/sample.png);
  position: absolute;
  width: 144px;
  height: 48px;
  top: auto;
  left: auto;
  right: 10px;
  bottom: 10px;
}


/*anim*/
#cp_content #fixed_angel_box .open .angel_image .door{
  transform: scale(1.1);
}
#cp_content #fixed_angel_box .open .angel_image .door .left{
  transform: perspective(1500px) rotateY(-90deg) translateX(-10px);
}
#cp_content #fixed_angel_box .open .angel_image .door .right{
  transform: perspective(1500px) rotateY(90deg) translateX(10px);
}
#cp_content #fixed_angel_box .open .angel_image .image{
  transition: all 2000ms 1600ms ease-out;
  transform: scale(1);
  opacity: 1;
}
#cp_content #fixed_angel_box .open .angel_name img{
  opacity: 1;
}
#cp_content #fixed_angel_box .open .angel_image .effect{
  animation: angel_effect 3800ms linear 500ms 1;
}
@keyframes angel_effect {
  0% {
    opacity: 0;
    filter: brightness(0);
  }
  20% {
    opacity: 1;
  }
  40% {
    opacity: 1;
    filter: brightness(4);
  }
  100% {
    opacity: 0;
  }
}



#cp_content #fixed_angel_box .angel_txt{
  width: 650px;
  min-height: 100px;
  margin: 0px auto;
  font-size: 18px;
  color: #fff;
}

/*------result_img2----*/
#cp_content.result .result_img2 {
  margin: 0;
}


/*------モザイク----*/
#cp_content.result .mosaic {
  font-size: 0;
  position: relative;
  text-align: left;
}
#cp_content.result .mosaic IMG{
  height: 30px;
  width: auto;
  margin-right: -3px;
  opacity: .7;
  filter: blur(3px);
}

/*
#cp_content.result .mosaic0 {
  width: 690px;
  height: 165px;
  margin: 3px -10px 0;
  position: relative;
}
#cp_content.result #fixed_user1 .mosaic0 {
  background-image: url("../img/result/mosaic0_user1.jpg");
}
#cp_content.result #fixed_user2 .mosaic0 {
  background-image: url("../img/result/mosaic0_user2.jpg");
}
#cp_content.result #fixed_user1 .mosaic0.free {
  background-image: url("../img/result/mosaic0_user1_free.jpg");
}
#cp_content.result #fixed_user2 .mosaic0.free {
  background-image: url("../img/result/mosaic0_user2_free.jpg");
}
#cp_content #fixed_angel_box .mosaic0 {
  width: 671px;
  height: 254px;
  margin: 3px -10px 5px;
  background-image: url("../img/result/mosaic0_angel.jpg");
}

#cp_content.result .mosaic1,
#cp_content.result .mosaic5 {
  background-image: url("../img/result/mosaic1.jpg");
  width: 689px;
  height: 166px;
  margin: 3px 0 0 -10px;
  position: relative;
}
#cp_content.result .mosaic2 {
  background-image: url("../img/result/mosaic2.jpg");
  width: 445px;
  height: 308px;
  margin: 3px 0 0 -10px;
  position: relative;
}
#cp_content.result .mosaic4,
#cp_content.result .mosaic5 {
  background-image: url("../img/result/mosaic4.jpg");
  width: 694px;
  height: 166px;
  margin: 3px -10px 0;
  position: relative;
}
#cp_content.result .mosaic5 {
  background-image: url("../img/result/mosaic5.jpg");
}
#cp_content.result .mosaic3,
#cp_content.result .mosaic6 {
  background-image: url("../img/result/mosaic3.jpg");
  width: 444px;
  height: 333px;
  margin: 3px -6px 0;
  position: relative;
}
#cp_content.result .mosaic7 {
  background-image: url("../img/result/mosaic7.jpg");
  width: 456px;
  height: 308px;
  margin: 3px -6px 0;
  position: relative;
}
#cp_content.result .mosaic8 {
  background-image: url("../img/result/mosaic8.jpg");
  width: 672px;
  height: 280px;
  margin: 3px -12px 0;
  position: relative;
}
*/

/*--*/
#cp_content.result a.btn_continue {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  right: 0;
  transition: 0.5s;
  background: url("../img/result/btn_next_off.png");
  background-repeat: no-repeat;
  background-position: center;
  width: 488px;
  height: 128px;
  margin: auto auto auto -244px;
  cursor: pointer;
}
#cp_content.result a.btn_continue:hover {
  transition: 0.5s;
  background: url("../img/result/btn_next_on.png");
}
#cp_content.result a span {
  display: none;
}


/*------鑑定結果枠----*/
#cp_content.result .res_box {
  font-size: 18px;
}
#cp_content.result .res_box .box {
  width: 900px;
  margin: 0px auto 10px;
  background-repeat: no-repeat, no-repeat;
  background-position: center top, center bottom;
  position: relative;
}
#cp_content.result .res_box .box::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  background-repeat: repeat-y;
  background-position: center top;
  left: 0;
  z-index: 9;
}
#cp_content.result .res_box .inner {
  width: 690px;
  margin: 0 auto;
  position: relative;
  z-index: 11;
  background-repeat: no-repeat;
}
#cp_content.result .res_box H3 {
  position: relative;
  z-index: 11;
  color: #000;
  font-size: 24px;
  display: flex;
  width: 560px;
  height: 74px;
  margin: 0 auto;
  align-items: center;
  justify-content: center;
}
#cp_content.result .res_box H3 span{
  text-align: center;
}

#cp_content.result .res_box .tpl2::after,
#cp_content.result .res_box .tpl3::after,
#cp_content.result .res_box .tpl6::after,
#cp_content.result .res_box .tpl7::after{
  content: "";
  width: 370px;
  height: 480px;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  bottom: 45px;
  z-index: 11;
}
#cp_content.result .res_box .tpl1,
#cp_content.result .res_box .tpl3,
#cp_content.result .res_box .tpl6 {
  background-image: url(./../img/result/tpl1_hdr.png), url(./../img/result/tpl1_ftr.png);
  min-height: 240px;
  padding: 90px 0 90px 0;
}
#cp_content.result .res_box .tpl1::before,
#cp_content.result .res_box .tpl3::before,
#cp_content.result .res_box .tpl6::before {
  height: calc(100% - 272px);
  top: 188px;
  background-image: url(./../img/result/tpl1_bdy.png);
}
#cp_content.result .res_box .tpl1 H3,
#cp_content.result .res_box .tpl3 H3,
#cp_content.result .res_box .tpl6 H3 {
  margin-bottom: 36px;
}
#cp_content.result .res_box .tpl1 .inner{
  min-height: 170px;
}
#cp_content.result .res_box .tpl3 .inner,
#cp_content.result .res_box .tpl6 .inner {
  min-height: 350px;
}
#cp_content.result .res_box .tpl1 .wrap,
#cp_content.result .res_box .tpl3 .wrap,
#cp_content.result .res_box .tpl6 .wrap {
  padding: 0 10px;
}
#cp_content.result .res_box .tpl3::after {
  background-image: url(./../img/result/tpl3_img.png);
  height: 440px;
  left: 0;
  bottom: 62px;
}
#cp_content.result .res_box .tpl3 .wrap {
  width: 460px;
  margin-left: 240px;
}
#cp_content.result .res_box .tpl6::after {
  background-image: url(./../img/result/tpl6_img.png);
  height: 410px;
  right: -5px;
  bottom: 68px;
}
#cp_content.result .res_box .tpl6 .wrap {
  width: 460px;
  margin-left: 0;
}

/*.tpl2 .tpl7*/
#cp_content.result .res_box .tpl2,
#cp_content.result .res_box .tpl7 {
  background-image: url(./../img/result/tpl2_hdr.png), url(./../img/result/tpl2_ftr.png);
  min-height: 240px;
  padding: 116px 0 154px 0;
  margin-bottom: 20px;
  color: #fff;
}
#cp_content.result .res_box .tpl7 {
  background-image: url(./../img/result/tpl7_hdr.png), url(./../img/result/tpl7_ftr.png);
}
#cp_content.result .res_box .tpl2::before,
#cp_content.result .res_box .tpl7::before {
  height: calc(100% - 400px);
  top: 210px;
  background-image: url(./../img/result/tpl2_bdy.png );
}
#cp_content.result .res_box .tpl7::before {
  background-image: url(./../img/result/tpl7_bdy.png );
}
#cp_content.result .res_box .tpl2 H3,
#cp_content.result .res_box .tpl7 H3 {
  margin-bottom: 24px;
  color: #fff;
}
#cp_content.result .res_box .tpl2 .wrap,
#cp_content.result .res_box .tpl7 .wrap {
  width: 420px;
}
#cp_content.result .res_box .tpl7 .wrap {
  margin-left: 260px;
}
#cp_content.result .res_box .tpl2 .inner,
#cp_content.result .res_box .tpl7 .inner {
  min-height: 350px;
}

#cp_content.result .res_box .tpl2::after {
  height: 480px;
  background-image: url(./../img/result/tpl2_img.png);
  right: -5px;
}
#cp_content.result .res_box .tpl7::after {
  height: 480px;
  background-image: url(./../img/result/tpl7_img.png);
  left: 0px;
  bottom: 60px;
}


/*.tpl4 .tpl5*/
#cp_content.result .res_box .tpl4,
#cp_content.result .res_box .tpl5 {
  background-image: url(./../img/result/tpl4_hdr.png), url(./../img/result/tpl4_ftr.png);
  min-height: 240px;
  padding: 116px 0 122px 0;
  color: #fff;
}
#cp_content.result .res_box .tpl5 {
  background-image: url(./../img/result/tpl5_hdr.png), url(./../img/result/tpl5_ftr.png);
}
#cp_content.result .res_box .tpl4::before,
#cp_content.result .res_box .tpl5::before {
  background-image: url(./../img/result/tpl4_bdy.png);
  height: calc(100% - 354px);
  top: 214px;
}
#cp_content.result .res_box .tpl5::before {
  background-image: url(./../img/result/tpl5_bdy.png);
}
#cp_content.result .res_box .tpl4 H3,
#cp_content.result .res_box .tpl5 H3 {
  margin-bottom: 20px;
  color: #fff;
}
#cp_content.result .res_box .tpl4 .inner,
#cp_content.result .res_box .tpl5 .inner {
  min-height: 150px;
  width: 690px;
}
#cp_content.result .res_box .tpl4 .wrap,
#cp_content.result .res_box .tpl5 .wrap {
  padding: 0 10px;
}

/*.tpl8*/
#cp_content.result .res_box .tpl8 {
  margin-top: 0;
  background-image: url(./../img/result/tpl8_hdr.png), url(./../img/result/tpl8_ftr.png);
  min-height: 180px;
  padding: 100px 0 120px 0;
}
#cp_content.result .res_box .tpl8::before {
  height: calc(100% - 566px);
  top: 420px;
  background-image: url(./../img/result/tpl8_bdy.png);
}
#cp_content.result .res_box .tpl8 H3 {
  height: 175px;
  margin-bottom: 40px;
  text-indent: -9999px;
}
#cp_content.result .res_box .tpl8 .inner {
  width: 718px;
  min-height: 180px;
  color: #fff;
  /*
  display: flex;
  align-items: center;
  */
}
#cp_content.result .res_box .tpl8 .wrap {
  width: 672px;
  padding: 0 10px;
  margin: 0 auto;
}


/*------誘導枠----*/
#cp_content.result .relation_img1 {
  text-indent: -9999px;
  width: 968px;
  height: 386px;
  margin-top: -20px;
}
#cp_content.result .relation_img1.single {
  background-image: url(./../img/result/relation_img_1_1.jpg);
}
#cp_content.result .relation_img1.double {
  background-image: url(./../img/result/relation_img_1_2.jpg);
}

#cp_content.result .relation_img2 {
  text-indent: -9999px;
  width: 968px;
  height: 418px;
  background-image: url(./../img/result/relation_img_2.jpg);
}

#cp_content.result .induction {
  width: 900px;
  margin: 0px auto;
  padding: 25px 0 25px;
  background-size: 100% auto, 100% auto, 100% auto;
  -webkit-background-size: 100% auto, 100% auto, 100% auto;
  background-image: url(./../img/result/relation_bg_hdr.jpg), url(./../img/result/relation_bg_ftr.jpg), url(./../img/result/relation_bg_bdy.jpg);
  background-repeat: no-repeat, no-repeat, repeat-y;
  background-position: center top, center bottom, center top;
}

#cp_content.result .next_btn {
  width: 720px;
  height: 128px;
  position: relative;
  margin-top: 20px;
}


/*--------------------
footer
--------------------*/
#cp_content .goto_top {
  margin: 0 auto 30px;
  text-align: right;
  width: 800px;
}
#cp_content .goto_top a {
  color: #ffe400;
}
/*--------------------
footer_box
--------------------*/
#cp_content #footer_box {
  width: 900px;
  margin: 25px auto 0px;
  padding: 40px 0 40px;
  background-image: url(./../img/common/footer_hdr.jpg), url(./../img/common/footer_bdy.jpg);
  background-repeat: no-repeat, repeat-y;
  background-position: center top, center top;
  /*background: url(./../img/common/bg_content.png) repeat-y 50% top;*/
}
#cp_content.extra #footer_box {
  margin: 0px auto 0px;
  padding: 0px 0;
  /*background: url(./../img/common/bg_content.png) repeat-y 50% top;*/
  padding-top: 10px;
  padding-bottom: 40px;
}
#cp_content #footer_box P{
  text-align: center;
  color: #fff;
  line-height: 1.7;
}
#cp_content #footer_box A {
  color: #fff100;
}
#cp_content #footer_box A.red {
  color: #ff0000;
}
#cp_content #footer_box LI A:visited {
  color: #fff100;
}
#cp_content #footer_box LI A:hover {
  color: #fff100;
}
#cp_content #footernavi {
  text-align: center;
  padding: 0px 0px 0px;
  margin-bottom: 15px;
}
#cp_content #footernavi UL {
	font-size: 0;
	display: inline-block;
	border-left: 1px solid #fff;
}
#cp_content #footernavi LI {
	font-size: 1rem;
	display: inline-block;
	padding: 0 .6em;
	color: #fff;
  line-height: 1;
	border-right: 1px solid #fff;
}
#cp_content #footernavi LI A {
  color: #fff100;
}

/*--------------------
attention
--------------------*/
#attention .attentionwrap{
  color:#fff;
}
#attention h3{
  color: #fff100;
  text-align: center;
  margin: 10px 0 10px;
  font-size: 22px;
}
#attention h4{
  color: #fff100;
  font-size: 16px;
  line-height: 1.6;
}
#attention P{
  margin: 0 0 1.5em;
  font-size: 16px;
  line-height: 1.6;
}
#attention table,
#attention th,
#attention td{
  border:1px solid #fff;
  color:#fff;
}
#attention A{color:#fff100;}
#attention A:hover{}
#attention A:visited{}

#attention .attentionwrap{
  width: 760px;
  margin: 0 auto 0px;
}

#attention table{margin:10px; padding:0px;}
#attention table tr{margin:0px; padding:0px; }
#attention table th{padding:7px 15px; text-align:center;vertical-align:middle;}
#attention table td{margin:0px; padding:7px;vertical-align:middle;}

#attention UL{
  margin: 0;
  font-size: 16px;
  list-style: none;
  text-align: left;
}
#attention LI{
  margin: 0 0 1.5em 0;

}


/*--------------------
pay
--------------------*/
body#pay{
  min-width: auto;
  background: #fff;
  color: #000;
  font-size: 13px;
}
body#pay a{
  color: #B90101;
  text-decoration: underline;
  font-weight: bold;
}
body#pay a:hover{
  text-decoration: none;
  color: #f00;
}
body#pay a.black{
  color: #000;
  font-weight: normal;
}
body#pay .content{
  max-width: 620px;
  margin: 0 auto;
  padding: 0 5px;
}
body#pay .box_other{
  text-align: center;
}
body#pay .pay_title{
  margin: 0px;
  padding: 10px 0px;
  text-align: center;
  width: 100%;
  font-size: 16px;
  font-weight: bold;
}
body#pay .box_other table{
  width: 100%;
  border: 1px solid #ccc;
  text-align: left;
  margin: 0 0 15px 0;
}
body#pay .box_other table th,
body#pay .box_other table td{
  border: 1px solid #ccc;
  font-weight: normal;
  padding: 5px;
}
body#pay .box_other table th{
  width: 20%;
}
body#pay .box_other table td{
  width: 80%;
}
body#pay .box_other p{
  margin: 0 0 15px 0;
}
body#pay hr{
  border-bottom: 6px solid #003366;
  margin: 0 0 15px 0;
}
body#pay .copy{
  font-size: 11px;
}

