html { margin: 0; padding: 0; }
body {
font-family: '微軟正黑體', '蘋果儷黑體', '新細明體', "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Tahoma, Verdana, sans-serif;
background: #000 url(../images/common/mBgTop.jpg) no-repeat center top;
background-attachment: fixed;
color: #000;
font-size: 17px;
line-height: 1.5em;
margin: 0;
padding: 0;
}
@media (max-width: 1200px){
body { display: inline-block; }
}
.hidden-md { display: none !important; }
div { display: block; }
small { font-size: 69%; letter-spacing: 0.1px; line-height: 0.6em; }
.clear { clear: both; }
.clearfix:after {
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
*:first-child+html .clearfix { zoom: 1; }
.txtHide { text-indent: -9999px; }
img.center {
display: block;
margin: 0 auto;
}
.block-center {
display: table;
margin: 0 auto;
}
a:hover { text-decoration: none; }
.pull-left { float: left; }
.pull-right { float: right; }
.no-touch { pointer-events: none; }
section.small,
.result-container section.small {
margin: 0 auto;
width: 990px;
}
.col { float: left; }
.colFull { width: 100%; }
h1, h2, h3, h4, h5, h6 { line-height: 1.3em; }
strong { font-weight: bold !important; }
.paragraph {
line-height: 1.5em;
text-align: justify;
}
.paragraph p { display: table; padding: 0 20px; margin-bottom: 10px; text-indent: 20px; }
p.big { font-size: 1.1em; }
p.small {
font-size: .9em;
line-height: 1.3em;
}
p.no-indent { text-indent: 0!important; }
.tCenter { text-align: center; }
strong { font-weight: bold; }
.title {
font-size: 1.4em;
line-height: 1.2em;
font-weight: bold;
}
.whiteGrad::after { color: #fff; }
.tgrad {
position: relative;
width: 100%;
}
.tgrad:before,
.tgrad:after {
position: absolute;
content: attr(title);
display: block;
width: 100%;
top: 0;
left: 0;
}
.gradColor::after { color: #330356; }
.gradTop::after {
mask-image: -webkit-linear-gradient(top,rgba(0,0,0,1),rgba(0,0,0,0.4) 40%,rgba(0,0,0,0.2) 52%,rgba(0,0,0,0));
-webkit-mask-image: -webkit-linear-gradient(top,rgba(0,0,0,1),rgba(0,0,0,0.4) 40%,rgba(0,0,0,0.2) 52%,rgba(0,0,0,0));
}
.gradBtm::after {
mask-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.4) 40%, rgba(0, 0, 0, 0.2) 52%, rgba(0, 0, 0, 0));
-webkit-mask-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.4) 40%, rgba(0, 0, 0, 0.2) 52%, rgba(0, 0, 0, 0));
}
.tRed, .attention { color: red; }
.tMaroon { color: #860000; }
.tYellow { color: #ff0; }
.tSPurple { color: #d7b0ff; }
.tLGreen { color: #B8FFAA; }
.tLYellow { color: #FDD891; }
.nLYellow { color: #ffeeaa; }
.tLPink { color: #FFAAFF; }
.tDGreen { color: #0a5d01; }
.tBrown { color: #941601; }
.tAqua { color: #2ee8e6; }
.tDBlue { color: #01258d; }
.tBlue { color: #1e06a3; }
.tPurple { color: #960fc7; }
.tLPurple { color: #d78ef6; }
.tDPurple { color: #44237e; }
.tPink { color: #ff5d99; }
.tGold { color: #e4d271; }
.tBlack { color: #000; }
.tWhite { color: #fff; }
.navi-container { min-height: 100px; }
.navi-container .naviInfo {
position: relative;
display: block;
left: 1px;
margin: 0px auto;
height: 58px;
max-width: 900px;
}
.paid-container .navi-container .naviInfo { display: none; }
.navi-container .naviInfo a { display: inline-block; }
.navi-container .navi_button {
background: transparent no-repeat left top;
position: relative;
top: 9px;
margin: 0;
width: 289px;
height: 48px;
}
.navi-container .navi_info { background-image: url(../images/common/button/naviInfo.jpg); width: 305px; }
.navi-container .navi_input { background-image: url(../images/common/button/naviInput.jpg); width: 292px; }
.navi-container .navi_profile { background-image: url(../images/common/button/naviProfile.jpg); }
.navi-container .navi_home { background-image: url(../images/common/button/naviTop.jpg); }
.navi-container .navi_button:hover { background-position: left bottom; }
.top-container .fixed-cont { display: none; }
.info-container .headercontainer:not(.hasID) .navi-container .navi_button.navi_input,
.top-container .navi-container .navi_button.navi_input { display: none; }
.info-container .hasID .navi-container.hasTop .navi_button.navi_input,
.top-container .hasID .navi-container.hasTop .navi_button.navi_input {
display: block;
}
.full-container .info {
display: table;
margin: 15px auto;
width: 990px;
max-width: 100%;
}
.header-container {
background: transparent url(../images/common/naviBg.jpg) no-repeat center top;
margin: 0 auto;
}
.breadcrumb {
margin: 20px auto;
max-width: 760px;
color: #563a3a;
font-size: .8em;
line-height: 1.5em;
}
.breadcrumb a { color:#d500dd; }
.breadcrumb a:hover { color:#fd97c2; text-decoration: none; }
.body-container .commonMenuBox {
background: transparent;
background-image: url(../images/common/menu/cmnMenuTop.jpg), url(../images/common/menu/cmnMenuBtm.jpg), url(../images/common/menu/cmnMenuBg.jpg);
background-position: center top, center bottom, center 49px;
background-repeat: no-repeat, no-repeat, repeat-y;
margin: 0 auto;
padding: 30px 0;
max-width: 830px;
color: #662200;
}
.body-container .commonMenuBox .productTitle { color: #ee189b; }
.body-container .commonMenuBox.noBg { background: none; padding: 0; }
.commonMenuBox.noBg .infoelement { padding: 0; }
.body-container .secYudo .commonMenuBox { background-image: url(../images/result/free/cmnMenuTop.jpg), url(../images/result/free/cmnMenuBtm.jpg), url(../images/result/free/cmnMenuBg.jpg); }
.commonMenuBox .infoelement {
position: relative;
padding: 0 60px;
}
.commonMenuBox .iconelement {
background: transparent no-repeat center top;
background-size: 100%;
position: relative;
float: left;
width: 70px;
height: 70px;
}
.commonMenuBox .titelement { padding: 0 0 0 85px; }
/* icon: free, xiangyu, danlian, erdwl, ngrdxy, wkar, qihedu, jiehun, life, weilai, job, total, bulun, fuhe, qingyu, kulian, ksc, nianyun, ketsudan, fuyuan, lovedirection, nkkk, spdyx, suyuan, honne, tenki, kaiun, saikon, rikon, toshisa, getsuun, kidankoi, spdlq, nightqhd, ngrdqy */
.commonMenuBox .iconelement.free { background-image: url(../images/common/icon/icon0.png); }
.commonMenuBox .iconelement.xiangyu { background-image: url(../images/common/icon/icon1.png); }
.commonMenuBox .iconelement.danlian { background-image: url(../images/common/icon/icon2.png); }
.commonMenuBox .iconelement.erdwl { background-image: url(../images/common/icon/icon3.png); }
.commonMenuBox .iconelement.ngrdxy { background-image: url(../images/common/icon/icon4.png); }
.commonMenuBox .iconelement.wkar { background-image: url(../images/common/icon/icon5.png); }
.commonMenuBox .iconelement.qihedu { background-image: url(../images/common/icon/icon6.png); }
.commonMenuBox .iconelement.jiehun { background-image: url(../images/common/icon/icon7.png); }
.commonMenuBox .iconelement.life { background-image: url(../images/common/icon/icon8.png); }
.commonMenuBox .iconelement.weilai { background-image: url(../images/common/icon/icon9.png); }
.commonMenuBox .iconelement.job { background-image: url(../images/common/icon/icon10.png); }
.commonMenuBox .iconelement.total { background-image: url(../images/common/icon/icon11.png); }
.commonMenuBox .iconelement.bulun { background-image: url(../images/common/icon/icon12.png); }
.commonMenuBox .iconelement.fuhe { background-image: url(../images/common/icon/icon13.png); }
.commonMenuBox .iconelement.qingyu { background-image: url(../images/common/icon/icon14.png); }
.commonMenuBox .iconelement.kulian { background-image: url(../images/common/icon/icon15.png); }
.commonMenuBox .iconelement.ksc { background-image: url(../images/common/icon/icon16.png); }
.commonMenuBox .iconelement.nianyun { background-image: url(../images/common/icon/icon17.png); }
.commonMenuBox .iconelement.ketsudan { background-image: url(../images/common/icon/icon18.png); }
.commonMenuBox .iconelement.fuyuan { background-image: url(../images/common/icon/icon19.png); }
.commonMenuBox .iconelement.lovedirection { background-image: url(../images/common/icon/icon20.png); }
.commonMenuBox .iconelement.nkkk { background-image: url(../images/common/icon/icon21.png); }
.commonMenuBox .iconelement.spdyx { background-image: url(../images/common/icon/icon22.png); }
.commonMenuBox .iconelement.suyuan { background-image: url(../images/common/icon/icon23.png); }
.commonMenuBox .iconelement.honne { background-image: url(../images/common/icon/icon24.png); }
.commonMenuBox .iconelement.tenki { background-image: url(../images/common/icon/icon26.png); }
.commonMenuBox .iconelement.kaiun { background-image: url(../images/common/icon/icon27.png); }
.commonMenuBox .iconelement.saikon { background-image: url(../images/common/icon/icon28.png); }
.commonMenuBox .iconelement.rikon { background-image: url(../images/common/icon/icon29.png); }
.commonMenuBox .iconelement.toshisa { background-image: url(../images/common/icon/icon30.png); }
.commonMenuBox .iconelement.getsuun { background-image: url(../images/common/icon/icon31.png); }
.commonMenuBox .iconelement.kidankoi { background-image: url(../images/common/icon/icon32.png); }
.commonMenuBox .iconelement.spdlq { background-image: url(../images/common/icon/icon33.png); }
.commonMenuBox .iconelement.nightqhd { background-image: url(../images/common/icon/icon34.png); }
.commonMenuBox .iconelement.ngrdqy { background-image: url(../images/common/icon/icon35.png); }
header .secDesc {
margin: 10px auto 30px;
width: 75%;
font-size: 1em;
}
.full-container {
background: transparent url(../images/common/mBnr.png) no-repeat center top;
display: table;
margin: 0 auto;
padding-top: 500px;
width: 100%;
}
.body-container {
background: transparent url(../images/common/mBg.jpg) repeat-y center top;
position: relative;
display: table;
margin: 0 auto;
min-height: 295px;
max-width: 990px;
width: 100%;
z-index: 44;
}
.fixed-cont,
.subbody-container {
/* position: relative;*/
display: block;
margin: 0 auto;
}
.body-footer {
background: transparent center top;
background-image: url(../images/common/footerTop.jpg), url(../images/common/mBg.jpg);
background-repeat: no-repeat, repeat-y;
margin: 0 auto;
padding: 90px 0 30px;
max-width: 990px;
font-size: 15px;
text-align: center;
}
.body-footer .copyrightTxt { margin-top: 20px; text-align: center; }
.body-footer a { color: #181159; font-weight: bold; }
/*##################
Button
##################*/
.input_submit a { text-decoration: none; }
.free-btn, .charge-btn {
position: relative;
display: inline-table;
width: 386px;
height: 170px;
margin-bottom: 15px;
}
.free-btn { background: transparent url(../images/common/button/btnFree.jpg) no-repeat center top; }
.free-btn:hover {background-position: center bottom; }
.charge-btn { background: transparent url(../images/common/button/btnSubmit.jpg) no-repeat center top; }
.charge-btn:hover { background-position: center bottom; }
.free-btn .btnText,
.charge-btn .btnText {
font-family: "ヒラギノ明朝 ProN W6", HiraMinProN-W6, HG明朝E, "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
display: table-cell;
padding: 40px 20px;
height: 100%;
width: 100%;
line-height: 0;
font-size: 1.8em;
text-align: center;
opacity: .85;
color: #f5be19;
vertical-align: middle;
text-shadow: -4px 1px 3px #000, 0 -5px 3px #000, 0 4px 3px #000, 4px 4px 5px #000, 0 4px 3px #000;
}
.free-btn .title, .charge-btn .title , .submit-btn .title {
position: absolute;
width: 100%;
top: 20%;
color: #ffe77e;
font-size: 2.2em;
text-align: center;
letter-spacing: 2px;
text-shadow: 1px 1px 5px #703957, 1px 2px 5px #703957, 2px 2px 5px #703957;
}
.free-btn .title { top: 35%!important; }
.free-container .submit-btn .title {
top: 28%;
font-size: 1.4em;
text-shadow: 1px 1px 5px #9b243c, 1px 2px 5px #9b243c, 2px 2px 5px #9b243c;
}
.free-btn .btnText { letter-spacing: 5px; }
.free-container .charge-btn .btnText {
padding: 0;
font-size: 1.6em;
}
.free-container .submit-btn {
position: relative;
background: transparent url(../images/common/button/btnNext.png) no-repeat center top;
float: none;
display: table;
width: 335px;
height: 90px;
margin: 0 auto 5px;
padding: 0;
font-size: 1.1em;
}
.free-container .submit-btn:hover { background-position: center bottom; }
/*################## Button End ##################*/
/*##################
info-container
##################*/
.globalDiv {
background: url(../images/common/footerTop.jpg) no-repeat center top;
display: table;
height: 80px;
width: 100%;
margin-bottom: 20px;
}
.info-container .infoProfile {
position: relative;
display: table;
margin: 0 auto;
max-width: 860px;
color: #100;
letter-spacing: 1px;
}
.info-container .infoProfile p { text-indent: 0; padding: 0; line-height: 1.8em; }
.info-container .section {
background: transparent no-repeat center top;
}
.info-container .section.profile { background-image: url(../images/info/proTop.jpg); }
.info-container .section.proMsg { background-image: url(../images/info/proMsgTit.jpg); }
.info-container .section.about { background-image: url(../images/info/aboutTop.jpg); }
.info-container .section .heading {
position: relative;
width: 100%;
height: 150px;
margin-bottom: 15px;
}
.info-container .section.proMsg .heading { height: 70px; }
.info-container .section .secInfo { padding: 30px 100px; }
.info-container .section.profile .secInfo { padding-top: 330px; }
.milestone { margin-top: 20px; font-size: 14px; }
.info-container .section.profile .secInfo ul li {
position: relative;
margin-bottom: 20px;
padding-top: 3px;
padding-left: 30px;
}
.info-container .section.profile .secInfo ul li span {
font-size: 1.2em;
font-weight: bold;
}
.info-container .section.profile .secInfo ul li:before {
content: "■";
position: absolute;
left: 0;
}
.info-container .section .proSign {
background: url(../images/info/proSign.jpg) no-repeat center top;
width: 300px;
height: 60px;
padding: 17px 0;
margin: 0px 0 0px auto;
}
/*########### intro #############*/
.section.intro {
margin: 0 auto;
width: 860px;
}
.section.intro .introTit {
background: no-repeat center top;
height: 195px;
}
.section.intro .introSec1 .introTit { background-image: url(../images/info/intro/introTit1.jpg); height: 150px; }
.section.intro .introSec2 .introTit { background-image: url(../images/info/intro/introTit2.jpg); }
.section.intro .introSec3 .introTit { background-image: url(../images/info/intro/introTit3.jpg); }
.section.intro .paragraph {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HGP明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
padding: 10px 100px 40px;
line-height: 1.8em;
}
.section.intro .paragraph .float,
.result-container .commonMsg .float {
background-color: #944e5e;
margin: 0 auto 20px;
padding: 20px 30px 11px;
max-width: 640px;
color: #fff;
font-weight: bold;
border-radius: 16px;
}
/*########### intro End #############*/
/*################## info-container End ##################*/
/*##########################
input-container
##########################*/
.komi {
background: transparent;
background-image: url(../images/input/inpKmTop.jpg), url(../images/input/inpKmBtm.jpg), url(../images/input/inpKmBg.jpg);
background-repeat: no-repeat, no-repeat, repeat-y;
background-position: center top, center bottom, center top;
padding: 160px 0 90px;
}
.komi .komiBtm {
background: transparent url(../images/input/komiBtm.jpg) no-repeat center top;
position: relative;
height: 220px;
}
.komi .komiUl {
position: relative;
display: block;
margin: 0 auto;
max-width: 580px;
line-height: 1.5em;
z-index: 33;
}
.komi ul li {
background: transparent url(../images/input/iconStar.jpg) no-repeat left -2px;
padding-left: 40px;
margin-top: 15px;
color: #ddd;
letter-spacing: 1px;
}
.komi ul li.cmn { color: #b7f4fc; }
.komi ul li br { display: none; }
.komi ul li li {
background-position: left -407px;
padding-left: 0;
padding-top: 5px;
margin-top: 1px;
color: #fff;
font-weight: normal;
}
.komi ul li li:before {
content: "• ";
float: left;
padding-right: 10px;
font-weight: bold;
}
.komi ul li li.isStar {
color: #fff350;
font-weight: bold;
padding-left: 20px;
}
.komi ul li li.isStar:before {
content: "┗ ";
margin-left: -5px;
}
/*######### question #########*/
.question {
background: transparent;
background-image: url(../images/input/formBtm.jpg), url(../images/input/formBg.jpg);
background-repeat: no-repeat, repeat-y;
background-position: center bottom, center top;
}
.question .top-heading {
background: transparent;
background-repeat: no-repeat;
background-position: center top;
}
.question .top-heading.self { background-image: url(../images/input/inpFmTitMe.jpg); padding: 130px 0 50px; }
.question .top-heading.target { background-image: url(../images/input/inpFmTitYou.jpg); padding: 130px 0 0; }
.question .formInfo .inputHolder {
display: table;
margin: 0 auto;
}
.question form span.bold { vertical-align: middle; }
.question form span.inbold, .question form span.bold {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
display: inline;
width: 35px;
height: 32px;
color: #241600;
font-size: 1.5em;
line-height: 1.5em;
font-weight: bold;
text-align: right;
text-shadow: 0 0 2px rgba(29, 68, 19, 0.7);
}
.question form span.inbold {
color: #000;
font-size: 1.2em;
}
.question form #sex11+span,
.question form #sex21+span {
display: initial;
background: none;
}
.question form #sex12+span,
.question form #sex22+span {
background-position: -310px -337px;
background-size: 650px;
}
.question form label.inbold {
font-family: "ヒラギノ明朝 ProN W6","HiraMinProN-W6","HG明朝E","ＭＳ Ｐ明朝","MS PMincho","MS 明朝",serif;
color: #000;
font-size: 1.5em;
line-height: 36px;
cursor: pointer;
}
.question form label.inbold input { vertical-align: middle; margin-bottom: 6px; }
.question form span.birth_unit {
display: inline-table;
margin-left: -2px;
width: 22px;
height: 29px;
font-weight: bold;
}
.question form .form_month+span.birth_unit { background-position: -165px -395px; }
.question form .form_day+span.birth_unit { background-position: -312px -395px; }
.question .col { float: left; }
.tcolHalf { width: 48%; }
.question .col:first-child { margin-right: 0px; }
.question .inputRow {
display: table;
margin: 10px auto;
min-width: 90%;
}
.question .inputRow.name .col {
float: left;
text-align: center;
}
.question .inputRow.name .col:first-child {
position: relative;
display: table;
width: 100px;
height: 40px;
}
.question .inputRow .attention {
display: table;
margin: 0 auto;
}
.question .rName span,
#default_check+span {
position: relative;
top: 3px;
}
.question .rBirthTime { margin: 10px 0; }
select {
-webkit-rtl-ordering: logical;
-webkit-text-fill-color: #000000;
opacity: 1;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.question select.form_hh {
margin-left: 20px;
width: 90px;
}
.question select.form_mm {
margin-left: 0px;
width: 90px;
}
.question .rGender { margin: 10px 0; }
.question .rGender span {
position: relative;
top: 0px;
}
.question .gender {
display: table;
float: left;
min-width: 96px;
margin-right: 20px;
}
.question select {
margin: 0 5px;
padding: 5px;
font-size: 1.2em;
box-shadow: 1px 1px 1px 0 #8e8e8e inset;
border-radius: 6px;
}
select {
-webkit-appearance: menulist;
box-sizing: border-box;
align-items: center;
white-space: pre;
-webkit-rtl-ordering: logical;
cursor: default;
border-width: 1px;
border-style: solid;
border-color: initial;
border-image: initial;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
width: 65px;
vertical-align: middle;
margin: 0 3px 3px 5px;
padding: 5px;
-webkit-border-radius: 3px;
border: 2px solid #7d7d7d;
border-radius: 3px;
background-color: #fff;
background-image: url(../images/common/iconArrow.png);
background-repeat: no-repeat;
background-position: 92% center;
-webkit-background-size: 16px;
background-size: 10px;
}
input[type="text"],
input[type="date"] {
background: #fff;
display: inline-block;
width: 220px;
margin-bottom: 3px;
margin-left: 5px;
padding: 7px 5px;
appearance: none;
-webkit-appearance: none;
vertical-align: middle;
border: 2px solid #7d7d7d;
border-radius: 7px;
-webkit-border-radius: 3px;
font-size: 1.2em;
box-shadow: 1px 1px 1px 0 #ddd inset;
}
.question select option {
padding: 20px;
}
.question select.form_year {
margin-left: 20px;
width: 90px;
}
.question .entry_save {
text-align: center;
font-weight: bold;
font-size: 15px;
margin: 0 auto 30px;
}
.caption_input {
width: 213px;
position: absolute;
top: 60px;
right: 10px;
}
.formBtn_content {
color: #fff;
text-align: center;
padding: 0 35px;
font-size: 17px;
line-height: 1.4em;
}
.formBtn_content span {
font-weight: bold;
}
.formBtn_text {
width: 498px;
margin: 170px auto 10px;
}
.input_submit {
display: table;
margin: 30px auto 0;
}
.input_submit a { text-decoration: none; }
span.spanError:before { top: 0px; }
/*################## input-container End ##################*/
/*##########################
result-container
##########################*/
.commonTit {
box-sizing: border-box;
border-image-source: url(../images/result/rsltKmTit.jpg);
border-image-slice: 48 0 48 0 fill;
border-image-repeat: round stretch;
border-image-width: 48px 0px 48px 0px;
background-size: 100% auto;
margin-bottom: 10px;
padding: 50px;
color: #c9143d;
font-size: 2em;
font-weight: bold;
line-height: 1.2em;
text-align: center;
letter-spacing: 2px;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HGP明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}
/*######### blur #########*/
.free-container .blur {
background: transparent url(../images/result/blur/text_img_m.png) no-repeat center top;
background-size: 96%;
position: relative;
margin-top: 10px;
padding-top: 50px;
height: 140px;
}
.free-container .listCard .blur, .free-container .listGraph .blur {
background-image: url(../images/result/blur/text_img_s.png);
float: left;
padding-top: 90px;
max-width: 360px;
width: 100%;
height: 170px;
margin-left: 10px;
margin-top: -18px;
}
.free-container .listGraph .blur {
max-width: 460px;
margin-top: -20px;
height: 210px;
}
.free-container .listCommon [class^="res_type1_bg"] .blur { background-image: url(../images/result/blur/text_img_m2.png); padding-top: 50px; height: 130px; }
.free-container .res_card_btn_box.blur.nobg { background: none; width: 100%; max-width: 100%; padding-top: 0; }
.free-container .blur a { display: table; margin: 0 auto; text-decoration: none; }
/*######### blur End #########*/
.result-container .subbody-container {
color: #fff;
max-width: 860px;
}
.result-container .secGreet {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
background: transparent url(../images/result/rsltMsgBg1.jpg) no-repeat center top;
position: relative;
padding: 60px 20px 20px;
margin: 0 auto 20px;
min-height: 370px;
font-size: 1.2em;
color: #4d2322;
z-index: 45;
}
.result-container .secGreet .greetInfo, .fukiBlock .float {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HGP明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
background: transparent url(../images/result/rsltMsgBg.png) repeat center top;
padding: 20px;
width: 500px;
color: #4d2322;
line-height: 160%;
font-weight: bold;
box-shadow: 0 2px 8px #5f0518;
border-radius: 10px;
}
.result-container .secUser {
max-width: 700px;
margin: 0 auto 20px;
text-align: center;
}
.result-container .secUser .userTit {
color: #fea;
margin-bottom: 10px;
font-weight: bold;
}
.result-container .secUser .usrDate,
.result-container .secUser .userInfo {
color: #85253b;
font-size: 14px;
font-weight: bold;
line-height: 1.4em;
}
.result-container .secUser .userInfo p:last-child {
margin: 4px 0;
color: #0c3307;
}
.result-container .secUser .usrDate span { margin-left: 10px; }
.result-container .secList .secTitle {
box-sizing: border-box;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HGP明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
margin: 0px auto 20px;
padding: 8px 20px;
max-width: 790px;
color: #85253b;
font-size: 1.1em;
line-height: 1.4em;
font-weight: bold;
text-align: center;
border-bottom: 5px double #85253b;
border-top: 5px double #85253b;
}
.result-container .secList .secInList .float {
box-sizing: border-box;
background-color: #4c3137;
margin: 10px auto 20px;
max-width: 770px;
text-align: left;
border-radius: 16px;
}
.result-container .secList.listCard .secInList .float,
.result-container .secList.listGraph .secInList .float { background-color: #3f4c31; }
.result-container .secList .secInList .float { padding: 25px; }
.result-container .secList .secInList .secTitle {
padding: 15px 20px;
color: #fff;
border-bottom: 5px double #fff;
border-top: 5px double #fff;
}
.result-container .secList .secTitle .titFloat {
font-size: 1.2em;
line-height: 1.3em;
text-align: center;
}
.result-container .secList .secInList .paragraph {
box-sizing: border-box;
margin: 0 auto;
}
.result-container .secList.listCard .secInList .paragraph { padding: 0 20px; }
.result-container .secList .secInList .paragraph p span, .result-container .secList .secInList .paragraph p strong { color: #fffc01; }
.result-container .common {
background: transparent url(../images/result/cmnBg.jpg) repeat-y center top;
margin-bottom: 20px;
}
.scroll_box {
display: none;
overflow: hidden;
transition: all 2.0s ease 0.6s;
}
/* ----------------------
* result_type1
*---------------------- */
.res_type1_bg1,
.res_type1_bg2 {
width: 840px;
min-height: 414px;
margin: 0 auto 20px;
background-size: 100% auto;
background-repeat: repeat-y;
background-position: center top;
overflow: hidden;
}
.res_type1_bg1 { background-image: url(../images/result/rsltType1Bg.jpg); }
.res_type1_bg2 { background-image: url(../images/result/rsltType1Bg2.jpg); }
.res_type1_bg_top {
width: 840px;
height: 520px;
margin: 0 auto;
background-size: 100% auto;
background-repeat: no-repeat;
background-position: center top;
position: relative;
}
.res_type1_bg_top { background-image: url(../images/result/rsltType1Top.jpg); }
.listCommon2 .res_type1_bg_top { background-image: url(../images/result/rsltType1Top2.jpg); }
.res_type1_bt {
width: 840px;
height: 50px;
margin: 0 auto;
background-size: 100% auto;
background-repeat: no-repeat;
background-position: center bottom;
position: relative;
}
.res_type1_bt { background-image: url(../images/result/rsltType1Btm.jpg); }
.listCommon2 .res_type1_bt { background-image: url(../images/result/rsltType1Btm2.jpg); }
.res_type1_tit1,
.res_type1_tit2,
.res_type1_tit3,
.res_type1_tit4{
width: 565px;
height: 87px;
background-size: 100% auto;
background-repeat: no-repeat;
margin: 0 auto;
}
.res_type1_tit1 { background-image: url(../images/result/rsltType1Tit1.jpg); }
.res_type1_tit2 { background-image: url(../images/result/rsltType1Tit2.jpg); }
.res_type1_tit3 { background-image: url(../images/result/rsltType1Tit3.jpg); }
.res_type1_tit4 { background-image: url(../images/result/rsltType1Tit4.jpg); }
.res_type1_name{
position: absolute;
top: 40px;
left: 190px;
width: 460px;
height: 100px;
}
.res_type1_img{
position: absolute;
top: 160px;
left: 240px;
width: 350px;
height: 350px;
}
.res_type1_img img{
position: absolute;
top: 0;
left: 0;
width: 350px;
height: 350px;
}
.res_type1_name img {
position: absolute;
top: 0;
left: 0;
width: 460px;
height: 100px;
}
.res_type1_name img, .res_type1_img.second img, .res_type_text2_wrap .res_type_text2 div, .res_type2_bar_box1 div,
.res_type2_bar_box1 div.strong:before, .res_type2_point_box1, .res_type2_point_box1 img, .res_type2_msgbox1, .res_type2_msgbox2,
.res_type2_trialbox, .res_card_btn_box a, .res_type3_card.front img, .res_type3_card.light img, .res_type_text0 {
opacity: 0;
}
[class^="res_type1_bg"] .res_type_text0 {
width: 280px;
top: 145px;
left: 35px;
font-size: 180%;
line-height: 130%;
text-align: center;
}
[class^="res_type1_bg"] .res_type_text1 {
width: 380px;
top: 10px;
left: 310px;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HGP明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 180%;
line-height: 130%;
text-align: center;
}
.res_type_text2_wrap {
margin: 20px auto;
width: 700px;
color: #6b02c4;
}
[class^="res_type1_bg"] .res_type_text2 {
width: 700px;
padding: 10px 30px;
box-sizing: border-box;
font-size: 110%;
line-height: 135%;
text-shadow: none;
}
.res_type1_bg1 .res_type_text2 { background-color: rgba(255,169,222,0.4); }
.res_type1_bg2 .res_type_text2 { background-color: rgba(185,255,95,0.4); }
.res_type_text2 div {
background-position: left 1px;
background-repeat: no-repeat;
padding: 5px 5px 5px 50px;
text-align: left;
}
.res_type1_bg1 .res_type_text2 div { background-image: url(../images/result/iconSakura1.png); }
.res_type1_bg2 .res_type_text2 div { background-image: url(../images/result/iconSakura2.png); }
.res_type1_text {
width: 620px;
margin: 0 auto;
padding-top: 10px;
padding-bottom: 15px;
font-weight: bold;
}
.res_type1_text.text2 { color: #100; }
/*背景*/
.res_type2_bg2_wrap {
background-image: url(../images/result/rsltType2Graph1.jpg), url(../images/result/rsltType2Btm.jpg), url(../images/result/rsltType2Bg.jpg);
background-repeat: no-repeat, no-repeat, repeat-y;
background-position: center top, center bottom, center top;
position: relative;
margin: 0 auto 20px;
width: 760px;
min-height: 760px;
}
.res_type2_trialbox{
width: 724px;
height: 370px;
background-color: rgba(0,0,0,0.7);
position: absolute;
left: 18px;
top: 4px;
}
/*各ボックス*/
div.res_type2_bar_box1 {
position: absolute;
top: 5px;
left: 19px;
width: 720px;
height: 360px;
display: flex;
align-items: flex-end;
overflow: hidden;
}
.res_type2_year_box1 {
position: absolute;
top: 405px;
left: 19px;
width: 720px;
height: 20px;
}
.res_type2_year_box1 div.res_type2_year1 {
width: 60px;
height: 20px;
position: absolute;
top: 0;
}
.res_type2_kami_box1,
.res_type2_month_box1 {
width: 720px;
height: 60px;
position: absolute;
top: 345px;
left: 19px;
}
.res_type2_kami_box1 { top: 430px; }
.res_type2_kami_box1 .res_type2_kami ,
.res_type2_month_box1 .res_type2_month1 {
width: 60px;
height: 60px;
position: absolute;
top: 0;
}
.res_type2_date_box1 {
width: 720px;
height: 90px;
position: absolute;
top: 495px;
left: 19px;
}
.res_type2_date_box1 .res_type2_date {
width: 60px;
height: 90px;
position: absolute;
top: 0;
}
div.res_type2_bar_box1 div {
display: flex;
position: relative;
width: 60px;
background-image: url(../images/result/rsltType2Bar1.png);
background-size: 100%;
background-position: center top;
}
.res_type2_point_box1{
width: 720px;
height: 50px;
position: absolute;
top: 495px;
left: 19px;
}
.res_type2_point_box1 .res_type2_point{
width: 60px;
height: 90px;
position: absolute;
top: 0;
box-sizing: border-box;
box-shadow: 0 0 10px #ff0, 0 0 10px #ff0, 0 0 10px #ff0, 0 0 10px #ff0, 0 0 10px #ff0;
}
.res_type2_point img{
top: -175px;
left: 5px;
position: absolute;
}
div.res_type2_bar_box1 div.strong:before {
content:"";
display: block;
width: 100%;
height: 100%;
background-image: url(../images/result/rsltType2Bar2.png);
background-size: 100%;
background-position: center top;
}
.p1{height:60px;}
.p2{height:90px;}
.p3{height:120px;}
.p4{height:150px;}
.p5{height:180px;}
.p6{height:210px;}
.p7{height:240px;}
.p8{height:270px;}
.p9{height:300px;}
.b1 {top:0; left:0px;}
.b2 {top:0; left:60px;}
.b3 {top:0; left:120px;}
.b4 {top:0; left:180px;}
.b5 {top:0; left:240px;}
.b6 {top:0; left:300px;}
.b7 {top:0; left:360px;}
.b8 {top:0; left:420px;}
.b9 {top:0; left:480px;}
.b10 {top:0; left:540px;}
.b11 {top:0; left:600px;}
.b12 {top:0; left:660px;}
.res_type2_msgbox1{
width: 340px;
background-color: #f9d6de;
border-radius: 10px;
box-sizing: border-box;
padding: 10px;
border: 2px solid #a20401;
position: absolute;
left: 30px;
top: 590px;
display: flex;
align-items: center;
justify-content: flex-start;
}
.res_type2_msgbox2{
width: 340px;
background-color: #e7d6f9;
box-sizing: border-box;
padding: 10px;
border-radius: 10px;
border: 2px solid #6701a2;
position: absolute;
left: 385px;
top: 590px;
display: flex;
align-items: center;
justify-content: flex-start;
}
.res_type2_icnbox{
width: 60px;
float: left;
margin-right: 10px;
}
@media all and (-ms-high-contrast: none) {
.res_type2_icnbox{
width: 150px;
}
}
.res_type2_combox {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HGP明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 1.1em;
line-height: 1.4em;
font-weight: bold;
color: #4d2322;
letter-spacing: 0.2rem;
text-align: left;
word-break: break-all;
}
/*モチーフ詳細*/
.motifImg.res_type2_img2 {
position: relative;
margin-top: 40px;
width: 230px;
height: 290px;
}
.res_type2_img2 img {
position: absolute;
top: 0;
left: 0;
width: 250px;
height: 290px;
}
.res_type2_point2 {
background: url(../images/result/res_type2_check1.png) no-repeat;
position: absolute;
width: 120px;
height: 94px;
top: 8px;
left: 170px;
}
[class^="res_type3_bg"] {
width: 832px;
height: 624px;
background-size: 100% 100%;
background-repeat: no-repeat;
background-position: center top;
}
.res_type3_bg {
margin: 0 auto 20px;
background-image: url(../images/result/card/res_card_bg.jpg);
position: relative;
overflow: hidden;
}
/*先生*/
.res_type3_bg1 {
background-image: url(../images/result/card/res_type3_bg1.jpg);
position: absolute;
top: 0;
left: 0;
}
.res_type3_bg2 {
background-image: url(../images/result/card/res_type3_bg2.jpg);
position: absolute;
top: 0;
left: 0;
}
/*テキスト*/
.res_type3_bg .res_type_text0 {
width: 800px;
position: absolute;
top: 170px;
left: 16px;
font-size: 170%;
line-height: 130%;
text-align: center;
}
/*スプレッド５パターン（p1-p5）*/
.res_type3_card img {
width: 140px;
height: 193px;
position: absolute;
}
.res_type3_bg.p1 .res_type3_card img {
width: 221px;
height: 304px;
}
/*p1：１枚パターン*/
.res_type3_bg.p1 .res_type3_card img:nth-of-type(1) { top: 143px; left: 306px; }
.res_type3_bg.p1 .res_type3_card img:nth-of-type(2),
.res_type3_bg.p1 .res_type3_card img:nth-of-type(3),
.res_type3_bg.p1 .res_type3_card img:nth-of-type(4),
.res_type3_bg.p1 .res_type3_card img:nth-of-type(5),
.res_type3_bg.p1 .res_type3_card img:nth-of-type(6),
.res_type3_bg.p1 .res_type3_card img:nth-of-type(7) { display: none; }
/*p2：３枚パターン*/
.res_type3_bg.p2 .res_type3_card img:nth-of-type(1) {top: 104px;left: 351px;}
.res_type3_bg.p2 .res_type3_card img:nth-of-type(2) {top: 299px;left: 182px;}
.res_type3_bg.p2 .res_type3_card img:nth-of-type(3) {top: 299px;left: 520px;}
.res_type3_bg.p2 .res_type3_card img:nth-of-type(4),
.res_type3_bg.p2 .res_type3_card img:nth-of-type(5),
.res_type3_bg.p2 .res_type3_card img:nth-of-type(6),
.res_type3_bg.p2 .res_type3_card img:nth-of-type(7) { display: none; }
/*p3：4枚パターン*/
.res_type3_bg.p3 .res_type3_card img:nth-of-type(1) {top: 202px;left: 180px;}
.res_type3_bg.p3 .res_type3_card img:nth-of-type(2) {top: 202px;left: 520px;}
.res_type3_bg.p3 .res_type3_card img:nth-of-type(3) {top: 90px;left: 351px;}
.res_type3_bg.p3 .res_type3_card img:nth-of-type(4) {top: 290px;left: 351px;}
.res_type3_bg.p3 .res_type3_card img:nth-of-type(5),
.res_type3_bg.p3 .res_type3_card img:nth-of-type(6),
.res_type3_bg.p3 .res_type3_card img:nth-of-type(7){ display: none; }
/*p4：６枚パターン*/
.res_type3_bg.p4 .res_type3_card img:nth-of-type(1) {top: 130px;left: 143px;}
.res_type3_bg.p4 .res_type3_card img:nth-of-type(2) {top: 130px;left: 559px;}
.res_type3_bg.p4 .res_type3_card img:nth-of-type(3) {top: 384px;left: 189px;}
.res_type3_bg.p4 .res_type3_card img:nth-of-type(4) {top: 26px;left: 351px;}
.res_type3_bg.p4 .res_type3_card img:nth-of-type(5) {top: 384px;left: 514px;}
.res_type3_bg.p4 .res_type3_card img:nth-of-type(6) {top: 260px;left: 351px;}
.res_type3_bg.p4 .res_type3_card img:nth-of-type(7){ display: none; }
/*p5：７枚パターン*/
.res_type3_bg.p5 .res_type3_card img:nth-of-type(1) { top: 5px; left: 351px; }
.res_type3_bg.p5 .res_type3_card img:nth-of-type(2) { top: 330px; left: 539px; }
.res_type3_bg.p5 .res_type3_card img:nth-of-type(3) { top: 330px; left: 163px; }
.res_type3_bg.p5 .res_type3_card img:nth-of-type(4) { top: 400px; left: 351px; }
.res_type3_bg.p5 .res_type3_card img:nth-of-type(5) { top: 114px; left: 163px; }
.res_type3_bg.p5 .res_type3_card img:nth-of-type(6) { top: 114px; left: 540px; }
.res_type3_bg.p5 .res_type3_card img:nth-of-type(7) { top: 204px; left: 351px; }
/* カード強調 */
[class^="res_type_text"] {
color: #6b02c4;
font-weight: bold;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HGP明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
text-shadow: 3px 3px 3px #fff, -3px -3px 3px #fff, -3px 3px 3px #fff, 3px -3px 3px #fff, 3px 0px 3px #fff, -3px 0px 3px #fff, 0px 3px 3px #fff, 0px -3px 3px #fff;
}
.res_type3_card img.strong{
box-sizing: border-box;
box-shadow: 0 0 10px #ff0,0 0 10px #ff0,0 0 10px #ff0,0 0 10px #ff0,0 0 10px #ff0;
}
.res_card_hand1{
width: 832px;
height: 624px;
background-image: url(../images/result/card/res_card_hand1.jpg);
background-size: 100% 100%;
position: absolute;
top: 0;
left: 0;
}
.res_card_hand2{
width: 832px;
height: 624px;
background-image: url(../images/result/card/res_card_hand2.jpg);
background-size: 100% 100%;
position: absolute;
top: 0;
left: 0;
}
/*モチーフ詳細*/
.motifImg {
position: relative;
float: left;
margin-top: 0px;
margin-right: 20px;
width: 290px;
}
.listCard .motifImg { height: 400px; }
.motifImg img {
position: absolute;
top: 0;
left: 0;
max-width: 100%;
height: auto;
}
/* ----------------------
* animation
*---------------------- */
.res_type1_name img,
.res_type1_img.second img,
.res_type_text2_wrap .res_type_text2 div,
.res_type2_bar_box1 div,
.res_type2_bar_box1 div.strong:before,
.res_type2_point_box1,
.res_type2_point_box1 img,
.res_type2_msgbox1,
.res_type2_msgbox2,
.res_type2_trialbox,
.res_card_btn_box a,
.res_type3_card.front img,
.res_type3_card.light img,
.res_type_text0 {
opacity: 0;
}
.res_type1_img.second img.woman {transform: translateY(-150px); transition: all 2.0s ease 0.6s;}
.res_type1_img.second img.hermit {transform: translateX(-200px); transition: all 2.0s ease 0.3s;}
.res_type2_bar_box1 div {
transform: translateY(300px);
transition-duration: 2.6s;
transition-timing-function: ease;
}
.res_type2_bar_box1 div.p1 {transition-duration: 1.0s;}
.res_type2_bar_box1 div.p2 {transition-duration: 1.2s;}
.res_type2_bar_box1 div.p3 {transition-duration: 1.4s;}
.res_type2_bar_box1 div.p4 {transition-duration: 1.6s;}
.res_type2_bar_box1 div.p5 {transition-duration: 1.8s;}
.res_type2_bar_box1 div.p6 {transition-duration: 2.0s;}
.res_type2_bar_box1 div.p7 {transition-duration: 2.2s;}
.res_type2_bar_box1 div.p8 {transition-duration: 2.4s;}
.res_type2_bar_box1 div.p9 {transition-duration: 2.6s;}
.res_type2_bar_box1 div:nth-of-type(1) {transition-delay: 0s;}
.res_type2_bar_box1 div:nth-of-type(2) {transition-delay: 0.1s;}
.res_type2_bar_box1 div:nth-of-type(3) {transition-delay: 0.2s;}
.res_type2_bar_box1 div:nth-of-type(4) {transition-delay: 0.3s;}
.res_type2_bar_box1 div:nth-of-type(5) {transition-delay: 0.4s;}
.res_type2_bar_box1 div:nth-of-type(6) {transition-delay: 0.5s;}
.res_type2_bar_box1 div:nth-of-type(7) {transition-delay: 0.6s;}
.res_type2_bar_box1 div:nth-of-type(8) {transition-delay: 0.7s;}
.res_type2_bar_box1 div:nth-of-type(9) {transition-delay: 0.8s;}
.res_type2_bar_box1 div:nth-of-type(10) {transition-delay: 0.9s;}
.res_type3_bg .res_type3_card.back img {transition: all 0.5s ease 4.0s;}
.res_type3_bg.p1 .res_type3_card.back img {transform: scale(0.588,0.59);}
.res_type3_bg.p2 .res_type3_card.back img:nth-of-type(1) {transform: translate(0px,118px);}
.res_type3_bg.p2 .res_type3_card.back img:nth-of-type(2) {transform: translate(169px,-77px);}
.res_type3_bg.p2 .res_type3_card.back img:nth-of-type(3) {transform: translate(-169px,-77px);}
.res_type3_bg.p3 .res_type3_card.back img:nth-of-type(1) {transform: translate(143px,21px);}
.res_type3_bg.p3 .res_type3_card.back img:nth-of-type(2) {transform: translate(-143px,21px);}
.res_type3_bg.p3 .res_type3_card.back img:nth-of-type(3) {transform: translate(0px,118px);}
.res_type3_bg.p3 .res_type3_card.back img:nth-of-type(4) {transform: translate(0px,-77px);}
.res_type3_bg.p4 .res_type3_card.back img:nth-of-type(1) {transform: translate(208px,92px);}
.res_type3_bg.p4 .res_type3_card.back img:nth-of-type(2) {transform: translate(-208px,92px);}
.res_type3_bg.p4 .res_type3_card.back img:nth-of-type(3) {transform: translate(163px,-161px);}
.res_type3_bg.p4 .res_type3_card.back img:nth-of-type(4) {transform: translate(0px,196px);}
.res_type3_bg.p4 .res_type3_card.back img:nth-of-type(5) {transform: translate(-163px,-161px);}
.res_type3_bg.p4 .res_type3_card.back img:nth-of-type(6) {transform: translate(0px,-38px);}
.res_type3_bg.p5 .res_type3_card.back img:nth-of-type(1) {transform: translate(0px,203px);}
.res_type3_bg.p5 .res_type3_card.back img:nth-of-type(2) {transform: translate(-189px,-108px);}
.res_type3_bg.p5 .res_type3_card.back img:nth-of-type(3) {transform: translate(189px,-108px);}
.res_type3_bg.p5 .res_type3_card.back img:nth-of-type(4) {transform: translate(0px,-168px);}
.res_type3_bg.p5 .res_type3_card.back img:nth-of-type(5) {transform: translate(189px,108px);}
.res_type3_bg.p5 .res_type3_card.back img:nth-of-type(6) {transform: translate(-189px,108px);}
.res_type3_bg.p5 .res_type3_card.back img:nth-of-type(7) {transform: translate(0px,18px);}
.res_card_btn_box a {pointer-events: none;}
.anime1.woman .res_type1_img.second {animation:motif1_woman 2.0s ease 0.3s 1 forwards;}
.anime1 .res_type1_img.second img.woman {transform: translateY(0px); opacity: 1;}
.anime1 .res_type1_img.second img.hermit {transform: translateX(0px); opacity: 1;}
.anime1 .res_type1_img.second img.man {animation:fadein 0.5s linear 0.3s 1 forwards;}
.anime1.man .res_type1_img.second {animation:motif1_man 6.0s ease 1.0s 1 forwards;}
.anime1 .res_type1_name img {animation:fadein 0.5s linear 2.0s 1 forwards;}
.anime1 .res_type_text2_wrap .res_type_text2 div {animation:fadein 0.5s linear 0s 1 forwards;}
.anime1 .res_type_text2_wrap .res_type_text2 div:nth-of-type(1) {animation-delay: 2.5s;}
.anime1 .res_type_text2_wrap .res_type_text2 div:nth-of-type(2) {animation-delay: 2.7s;}
.anime1 .res_type_text2_wrap .res_type_text2 div:nth-of-type(3) {animation-delay: 2.9s;}
.anime2 .res_type2_bar_box1 div {opacity: 1;transform: translateY(0);}
.anime2 .res_type2_bar_box1 div.strong:before,
.anime2 .res_type2_point_box1 {animation: fadein 1.5s ease 3s forwards;}
.anime2 .res_type2_point_box1 img {animation: bounds 1.0s linear 4.0s 1 forwards;}
.trial2 .res_type2_trialbox,
.trial2 .res_card_btn_box a,
.anime2 .res_type2_msgbox1,
.anime2 .res_type2_msgbox2 {animation:fadein 0.5s linear 4.5s 1 forwards;}
.trial2_end .res_type2_bar_box1 div {transition:none !important;}
.trial2_end .res_type2_bar_box1 div.strong:before,
.trial2_end .res_type2_point_box1,
.trial2_end .res_type2_point_box1 img,
.trial2_end .res_type2_trialbox,
.trial2_end .res_type2_msgbox1,
.trial2_end .res_type2_msgbox2 {opacity:1; animation:none;}
.trial2_end .res_card_btn_box a {opacity:1; animation:none; pointer-events: auto;}
.anime3 .res_type_text0 {animation:fadein 0.5s linear 0.3s 1 forwards, fadeout 0.5s linear 2.5s 1 forwards;}
.anime3 .res_card_hand2 {animation:fadeinout2 2.2s linear 0.8s 1 forwards;}
.anime3 .res_card_hand1 {animation:fadeout 1.0s linear 3.0s 1 forwards;}
.anime3 .res_type3_card.back img {transform: translate(0px,0px) scale(1,1) !important;}
.anime3 .res_type3_card.front img {animation:fadein 0.5s linear 0s 1 forwards;}
.anime3 .res_type3_card.front img:nth-of-type(1) {animation-delay: 4.5s;}
.anime3 .res_type3_card.front img:nth-of-type(2) {animation-delay: 4.6s;}
.anime3 .res_type3_card.front img:nth-of-type(3) {animation-delay: 4.7s;}
.anime3 .res_type3_card.front img:nth-of-type(4) {animation-delay: 4.8s;}
.anime3 .res_type3_card.front img:nth-of-type(5) {animation-delay: 4.9s;}
.anime3 .res_type3_card.front img:nth-of-type(6) {animation-delay: 5.0s;}
.anime3 .res_type3_card.front img:nth-of-type(7) {animation-delay: 5.1s;}
.anime3 .res_type3_card.light img,
.anime3 .res_card_btn_box a {animation:fadein 1.0s linear 5s 1 forwards;}
.anime3_end .res_type_text0,
.anime3_end .res_card_hand2,
.anime3_end .res_card_hand1,
.anime3_end .res_type3_card.back img {display:none;}
.anime3_end .res_type3_card.front img {opacity: 1; animation: none;}
.res_card_btn_box {position: relative; top: 240px;}
.listGraph .res_card_btn_box {top: 170px;}
.anime3_end .res_card_btn_box a {opacity:1; animation:none; pointer-events: auto;}
@keyframes fadein {
0% {opacity: 0;}
100% {opacity: 1;}
}
@keyframes fadein2 {
0% {opacity: 0;}
100% {opacity: 0.5;}
}
@keyframes fadein3 {
0% {opacity: 0; transform:scale(1.3);}
100% {opacity: 1; transform:scale(1.0);}
}
@keyframes fadeout {
0% {opacity: 1;}
100% {opacity: 0;}
}
@keyframes fadeinout {
0% {opacity: 0;}
25% {opacity: 1;}
50% {opacity: 1;}
75% {opacity: 0;}
100% {opacity: 0;}
}
@keyframes fadeinout2 {
0% {opacity: 1;}
20% {opacity: 0;}
40% {opacity: 0;}
60% {opacity: 1;}
80% {opacity: 1;}
100% {opacity: 0;}
}
@keyframes motif1_woman {
0% {transform: translateX(-200px);}
100% {transform: translateX(0px);}
}
@keyframes motif1_man {
0% {transform:translate(0px,0px) rotate(0deg);}
1% {transform:translate(0px,0px) rotate(0deg);}
2% {transform:translate(0px,0px) rotate(-3deg);}
3% {transform:translate(0px,-1px) rotate(0deg);}
4% {transform:translate(0px,-1px) rotate(3deg);}
5% {transform:translate(1px,0px) rotate(-2deg);}
6% {transform:translate(0px,1px) rotate(0deg);}
7% {transform:translate(0px,0px) rotate(3deg);}
8% {transform:translate(0px,0px) rotate(0deg);}
100% {transform:translate(0px,0px) rotate(0deg);}
}
@keyframes bounds {
0% {opacity: 0;transform: scale(1);}
8% {opacity: 1;transform: scale(1.1);}
17% {opacity: 1;transform: scale(1.2);}
34% {opacity: 1;transform: scale(1);}
100% {opacity: 1;transform: scale(1);}
}
.topanime_type1_name img,
.topanime_type1_img.second img,
.topanime_type_text2_wrap .topanime_type_text2 div,
.topanime_type2_bar_box1 div,
.topanime_type2_bar_box1 div.strong:before,
.topanime_type2_point_box1,
.topanime_type2_point_box1 img,
.topanime_type2_msgbox1,
.topanime_type2_msgbox2,
.topanime_type3_card.front img,
.topanime_type3_card.light img,
.topanime_type_text0 {
opacity: 0;
}
.topanime_type1_img.second img {transform: translateX(-200px); transition: all 2.0s ease 0.3s;}
.t_anime1 .topanime_type1_img.second img {transform: translateX(0px); opacity: 1;}
.t_anime1 .topanime_type1_name img {animation:fadein 0.5s linear 2.0s 1 forwards;}
.t_anime1 .topanime_type_text2_wrap .topanime_type_text2 div {animation:fadein 0.5s linear 0s 1 forwards;}
.t_anime1 .topanime_type_text2_wrap .topanime_type_text2 div:nth-of-type(1) {animation-delay: 2.5s;}
.t_anime1 .topanime_type_text2_wrap .topanime_type_text2 div:nth-of-type(2) {animation-delay: 2.7s;}
.t_anime1 .topanime_type_text2_wrap .topanime_type_text2 div:nth-of-type(3) {animation-delay: 2.9s;}
.topanime_type2_bar_box1 div {
transform: translateY(300px);
transition-duration: 2.6s;
transition-timing-function: ease;
}
.topanime_type2_bar_box1 div.p1 {transition-duration: 1.0s;}
.topanime_type2_bar_box1 div.p2 {transition-duration: 1.2s;}
.topanime_type2_bar_box1 div.p3 {transition-duration: 1.4s;}
.topanime_type2_bar_box1 div.p4 {transition-duration: 1.6s;}
.topanime_type2_bar_box1 div.p5 {transition-duration: 1.8s;}
.topanime_type2_bar_box1 div.p6 {transition-duration: 2.0s;}
.topanime_type2_bar_box1 div.p7 {transition-duration: 2.2s;}
.topanime_type2_bar_box1 div.p8 {transition-duration: 2.4s;}
.topanime_type2_bar_box1 div.p9 {transition-duration: 2.6s;}
.topanime_type2_bar_box1 div:nth-of-type(1) {transition-delay: 0s;}
.topanime_type2_bar_box1 div:nth-of-type(2) {transition-delay: 0.1s;}
.topanime_type2_bar_box1 div:nth-of-type(3) {transition-delay: 0.2s;}
.topanime_type2_bar_box1 div:nth-of-type(4) {transition-delay: 0.3s;}
.topanime_type2_bar_box1 div:nth-of-type(5) {transition-delay: 0.4s;}
.topanime_type2_bar_box1 div:nth-of-type(6) {transition-delay: 0.5s;}
.topanime_type2_bar_box1 div:nth-of-type(7) {transition-delay: 0.6s;}
.topanime_type2_bar_box1 div:nth-of-type(8) {transition-delay: 0.7s;}
.topanime_type2_bar_box1 div:nth-of-type(9) {transition-delay: 0.8s;}
.topanime_type2_bar_box1 div:nth-of-type(10) {transition-delay: 0.9s;}
.t_anime2 .topanime_type2_bar_box1 div {opacity: 1;transform: translateY(0);}
.t_anime2 .topanime_type2_bar_box1 div.strong:before,
.t_anime2 .topanime_type2_point_box1 {animation: fadein 1.5s ease 3s forwards;}
.t_anime2 .topanime_type2_point_box1 img {animation: bounds 1.0s linear 4.0s 1 forwards;}
.t_anime2 .topanime_type2_msgbox1,
.t_anime2 .topanime_type2_msgbox2 {animation:fadein 0.5s linear 4.5s 1 forwards;}
.topanime_type3_bg .topanime_type3_card.back img {transition: all 0.5s ease 4.0s;}
.topanime_type3_bg.p1 .topanime_type3_card.back img {transform: scale(0.588,0.59);}
.topanime_type3_bg.p2 .topanime_type3_card.back img:nth-of-type(1) {transform: translate(0px,118px);}
.topanime_type3_bg.p2 .topanime_type3_card.back img:nth-of-type(2) {transform: translate(169px,-77px);}
.topanime_type3_bg.p2 .topanime_type3_card.back img:nth-of-type(3) {transform: translate(-169px,-77px);}
.topanime_type3_bg.p3 .topanime_type3_card.back img:nth-of-type(1) {transform: translate(143px,21px);}
.topanime_type3_bg.p3 .topanime_type3_card.back img:nth-of-type(2) {transform: translate(-143px,21px);}
.topanime_type3_bg.p3 .topanime_type3_card.back img:nth-of-type(3) {transform: translate(0px,118px);}
.topanime_type3_bg.p3 .topanime_type3_card.back img:nth-of-type(4) {transform: translate(0px,-77px);}
.topanime_type3_bg.p4 .topanime_type3_card.back img:nth-of-type(1) {transform: translate(208px,92px);}
.topanime_type3_bg.p4 .topanime_type3_card.back img:nth-of-type(2) {transform: translate(-208px,92px);}
.topanime_type3_bg.p4 .topanime_type3_card.back img:nth-of-type(3) {transform: translate(163px,-161px);}
.topanime_type3_bg.p4 .topanime_type3_card.back img:nth-of-type(4) {transform: translate(0px,196px);}
.topanime_type3_bg.p4 .topanime_type3_card.back img:nth-of-type(5) {transform: translate(-163px,-161px);}
.topanime_type3_bg.p4 .topanime_type3_card.back img:nth-of-type(6) {transform: translate(0px,-38px);}
.topanime_type3_bg.p5 .topanime_type3_card.back img:nth-of-type(1) {transform: translate(0px,203px);}
.topanime_type3_bg.p5 .topanime_type3_card.back img:nth-of-type(2) {transform: translate(-189px,-108px);}
.topanime_type3_bg.p5 .topanime_type3_card.back img:nth-of-type(3) {transform: translate(189px,-108px);}
.topanime_type3_bg.p5 .topanime_type3_card.back img:nth-of-type(4) {transform: translate(0px,-168px);}
.topanime_type3_bg.p5 .topanime_type3_card.back img:nth-of-type(5) {transform: translate(189px,108px);}
.topanime_type3_bg.p5 .topanime_type3_card.back img:nth-of-type(6) {transform: translate(-189px,108px);}
.topanime_type3_bg.p5 .topanime_type3_card.back img:nth-of-type(7) {transform: translate(0px,18px);}
.t_anime3 .topanime_type_text0 {animation:fadein 0.5s linear 0.3s 1 forwards, fadeout 0.5s linear 2.5s 1 forwards;}
.t_anime3 .topanime_card_hand2 {animation:fadeinout2 2.2s linear 0.8s 1 forwards;}
.t_anime3 .topanime_card_hand1 {animation:fadeout 1.0s linear 3.0s 1 forwards;}
.t_anime3 .topanime_type3_card.back img {transform: translate(0px,0px) scale(1,1) !important;}
.t_anime3 .topanime_type3_card.front img {animation:fadein 0.5s linear 0s 1 forwards;}
.t_anime3 .topanime_type3_card.front img:nth-of-type(1) {animation-delay: 4.5s;}
.t_anime3 .topanime_type3_card.front img:nth-of-type(2) {animation-delay: 4.6s;}
.t_anime3 .topanime_type3_card.front img:nth-of-type(3) {animation-delay: 4.7s;}
.t_anime3 .topanime_type3_card.front img:nth-of-type(4) {animation-delay: 4.8s;}
.t_anime3 .topanime_type3_card.front img:nth-of-type(5) {animation-delay: 4.9s;}
.t_anime3 .topanime_type3_card.front img:nth-of-type(6) {animation-delay: 5.0s;}
.t_anime3 .topanime_type3_card.front img:nth-of-type(7) {animation-delay: 5.1s;}
.t_anime3 .topanime_type3_card.light img {animation:fadein 1.0s linear 5.0s 1 forwards;}
.fukiBlock {
background: url(../images/result/rsltMsgBg2.jpg) no-repeat center top;
position: relative;
padding: 60px 20px 40px;
min-height: 370px;
font-size: 26px;
text-align: center;
}
.fukiBlock .float { position: absolute; top: 36%; font-size: 28px; }
.listJiki .fukiBlock { background-image: url(../images/result/rsltMsgBg3.jpg); }
.listJiki .fukiBlock .float { float: right; right: 6%; }
.fukiBlock + .secInfo .secTitle { display: none; }
.fukiBlock .float strong {
display: block;
color: #c9143d;
font-size: 110%;
line-height: 130%;
text-align: center;
}
/*##########################
spJiki
##########################*/
.listJiki .date-container {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
background: url(../images/result/dateBg.png) no-repeat;
background-size: cover;
color: #ff3;
max-width: 660px;
padding: 20px;
margin: 0 auto;
border: 2px solid #300;
border-radius: 4px;
text-align: center;
overflow: hidden;
margin-bottom: 20px;
}
.listJiki .date-container strong {
display: block;
line-height: 1.5em;
font-size: 2.2em;
text-shadow: 0px 0px 20px #0FF;
}
/*####### spJiki End #######*/
/*##########################
animeCardMsg
##########################*/
.result-container.two-0 .animeCardMsg {
background: transparent url(../images/result/psCardTitImg1.jpg) no-repeat center top;
display: table;
margin: 0 auto;
padding-top: 140px;
margin-top: 40px;
width: 100%;
}
.result-container.two-1 .animeCardMsg {
background: transparent url(../images/result/psCardTitImg2.jpg) no-repeat center top;
display: table;
margin: 0 auto;
padding-top: 140px;
margin-top: 40px;
width: 100%;
}
.result-container .animeCardMsg .listTit {
color: #fea;
position: relative;
padding: 20px 0 30px;
margin: 0 auto;
text-align: center;
max-width: 840px;
}
.result-container .animeCardMsg .listTit strong { color: #cfe; }
.result-container .animeCardMsg .res_type4_box4 {
display: block;
position: relative;
float: left;
width: 230px;
height: 335px;
vertical-align: top;
margin: 0 30px 0 0px;
}
.result-container .animeCardMsg .res_type4_box4 img { width: 100%; }
/*####### animeCardMsg End #######*/
/*########################## result-container End ##########################*/
/*####################
top-container
######################*/
.top-container .full-container .info {
display: block;
width: inherit;
}
.top-container .commonMenuBox {
font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "Arial", Sans-serif;
color: #110;
background: 0;
padding: 0;
text-shadow: none;
}
.top-container .commonMenuBox .titelement .title {
font-weight: bold;
font-size: 1.1em;
}
.top-container .commonMenuBox .infoelement {
max-width: 100%;
padding: 0;
}
.top-container .commonMenuBox .titelement a {
color: #836;
font-weight: bold;
text-decoration: underline;
}
.top-container .commonMenuBox .titelement a:hover {
color: #a3c;
text-decoration: none;
transition: 0.3s linear;
}
.top-container .commonMenuBox .titelement a .productTitle { color: #a3c; }
.top-container .secCont,
.top-container .secCont .secList {
background: transparent;
background-repeat: no-repeat, no-repeat, repeat-y;
background-position: center top, center bottom, center top;
}
.secCont .commonMenuBox .desc {
margin-top: 10px;
text-align: justify;
text-shadow: none;
font-family: initial;
}
.secCont .commonMenuBox .price {
text-align: right;
text-shadow: none;
font-weight: bold;
color: #330078;
}
.secCont.secNew {
background: transparent;
background-image: url(../images/top/newTop.jpg),url(../images/top/newBtm.jpg),url(../images/top/newBg.jpg);
background-repeat: no-repeat,no-repeat,repeat-y;
background-position: center top,center bottom,center top;
position: relative;
padding: 520px 0 80px;
margin: 0 auto 10px;
}
.secCont.secNew .secInner {
display: inline-flex;
padding: 10px 85px;
}
.full-container .secNew .secInner.info { width: 650px; }
.top-container .secCatchInfo {
background: url(../images/top/catchInfoBg.png) no-repeat center top;
background-size: 100%;
border-radius: 10px;
border: 1px solid #335522;
margin: 0 35px 0 auto;
width: 580px;
}
.top-container .secCatchInfo.leftCI {
margin: 0 auto 0 60px;
width: 490px;
}
.top-container .secCatchInfo p {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
color: #fff;
display: block;
padding: 18px;
text-align: left;
font-size: 1.5em;
line-height: 1.5em;
}
.top-container .secCatchInfo strong { color: #eab2f1; }
.top-container .secCatchInfo strong.green { color: #af9; }
.top-container .secRecommCatch {
background: transparent url(../images/top/monthCatch.jpg) no-repeat center bottom;
min-height: 439px;
}
.top-container .secRecomm {
background-image: url(../images/top/monthTop.jpg), url(../images/top/monthBtm.jpg), url(../images/top/monthBg.jpg);
padding: 545px 0 70px;
}
.top-container .secRecomm .claireAudience {
background: transparent url(../images/top/monthTop2.jpg) no-repeat center top;
padding-top: 320px;
}
.top-container .secRecomm .claireSentiensu {
background: transparent url(../images/top/monthTop3.jpg) no-repeat center top;
padding-top: 320px;
}
.top-container .secRecomm .psychicCard {
background: transparent url(../images/top/monthTop4.jpg) no-repeat center top;
padding-top: 350px;
}
.top-container .secRecomm .secInnerInfo { padding: 15px 85px 20px; }
.top-container .secSpCatch {
background: transparent url(../images/top/spCatch.jpg) no-repeat center bottom;
min-height: 415px;
}
.top-container .secSpCatch .secInfo .secInner {
width: 580px;
margin: 0 35px 0 auto;
}
.top-container .secSpCatch .secInfo .lead {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
background: rgba(0,0,75,0.7);
border-radius: 10px;
padding: 15px 15px;
font-size: 1.2em;
text-align: left;
}
.top-container .secSpCatch .secInfo .lead:nth-child(even) { background: rgba(55,11,55,0.8); }
.top-container .secSpCatch .secInfo .lead a {
color: #ff3;
text-decoration: underline;
}
.top-container .secSpCatch .secInfo .lead a:hover {
color: #fff;
text-decoration: none;
}
.top-container .secSpecial {
position: relative;
background-image: url(../images/top/spTop.jpg), url(../images/top/spBtm.jpg), url(../images/top/spBg.jpg);
padding: 165px 145px 80px;
margin-bottom: 20px;
}
.top-container .secSpecial .secInnerInfo:first-child { padding: 20px 0 10px; }
.top-container .secSpecial .secInnerInfo { padding: 10px 0; }
.top-container .secSpInpCatch {
background: transparent url(../images/top/spInpCatch.jpg) no-repeat center top;
min-height: 580px;
}
.top-container .secSpInp {
position: relative;
background-image: url(../images/top/spInpBg.jpg), url(../images/top/spInpBtm.jpg), url(../images/top/spInpBg.jpg);
padding-bottom: 100px;
}
.top-container .secSpInp .secInnerInfo { padding: 0 85px 30px; }
.top-container .secSpInp .question {
background-image: none;
padding: 0;
}
.top-container .secSpInp .question .top-heading.self {
background-image: url(../images/top/spInpFormTit1.jpg);
padding: 100px 0 30px;
}
.top-container .secSpInp .question .top-heading.target {
background-image: url(../images/top/spInpFormTit2.jpg);
padding: 100px 0 30px;
}
.top-container .secPackSp {
background-image: url(../images/top/packTop.jpg), url(../images/top/packBtm.jpg), url(../images/top/packBg.jpg);
padding: 490px 0 85px;
}
.top-container .secPackSp .secInnerInfo { padding: 0 85px; }
.top-container .secPackSp .commonMenuBox .titelement .title { font-size: 1em; }
.top-container .secPackSp .secInnerInfo .desc,
.top-container .secPackSp .secInnerInfo .price {
font-size: 0.8em;
}
.top-container .secPackSp .secInfo a {
display: block;
font-family: sans-serif;
font-weight: bold;
font-size: 1.1em;
}
.top-container .secPackSp .secInfo .inrTop { padding: 0 45px; }
.top-container .secPackSp .secInfo .inrTop:nth-child(2) {
background: url(../images/top/packInrTop.jpg) no-repeat center top;
padding-top: 220px;
}
.top-container .secPackSp .secInfo .inrTop a {
color: #060;
margin-bottom: 15px;
font-size: 1.5em;
line-height: 1.5em;
text-align: center;
}
.top-container .secPackSp .secInfo .inrTop.inrLove a { color: #903; }
.top-container .secPackSp .secInfo .inrTop.inrMarry a { color: #009; }
.top-container .secReview {
background-image: url(../images/top/reviewTop.jpg), url(../images/top/reviewBtm.jpg), url(../images/top/reviewBg.jpg);
padding: 210px 85px 85px;
}
.top-container .secReview .secInfo p {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
color: #333333;
font-size: 0.9em;
font-weight: 400;
}
.top-container .secReview .secInfo a {
display: block;
font-family: sans-serif;
font-weight: bold;
font-size: 1.1em;
}
.top-container .secReview .secInfo a.blue { color: #0700ed; }
.top-container .secReview .secInfo p .red { color: #B70066; }
.top-container .secReview .secInfo p .green { color: #080; }
.top-container .secReview .secInfo .secInner { padding: 15px 35px; }
.top-container .directLink {
display: table;
margin: 30px auto 0;
max-width: 90%;
width: 100%;
color: #e8ca22;
text-align: right;
font-weight: bold;
}
.top-container .directLink:hover { color: #e8ca22; }
.top-container .directLink:visited { color: #c80; }
.top-container .naviCate {
margin: 20px auto 0;
text-align: center;
}
.top-container .naviCate a { display: inline-table; }
.top-container .naviCate .cateBtn {
background: transparent no-repeat center top;
display: inline-table;
width: 260px;
height: 90px;
pointer-events: none;
}
.top-container .naviCate .cateBtn.cateLove { background-image: url(../images/top/naviLove.jpg); }
.top-container .naviCate .cateBtn.cateMarry { background-image: url(../images/top/naviMarry.jpg); }
.top-container .naviCate .cateBtn.cateLife { background-image: url(../images/top/naviLife.jpg); }
.top-container .naviCate a:hover .cateBtn { opacity: 0.8; }
.top-container .cateTop { padding: 0 10px; }
.top-container .cateTop .directLink {
max-width: inherit;
width: inherit;
margin: 10px auto 15px;
font-weight: normal;
font-size: 0.9em;
float: right;
color: #c80;
}
.top-container .cateTop a.directLink:hover { color: #e8ca22; }
.top-container .secListing .secList {
position: relative;
padding: 185px 40px 100px;
}
.top-container .secCont .secLove { background-image: url(../images/top/loveTit.jpg), url(../images/top/loveBtm.jpg), url(../images/top/loveBg.jpg); }
.top-container .secCont .secMarry { background-image: url(../images/top/marrTit.jpg), url(../images/top/marrBtm.jpg), url(../images/top/marrBg.jpg); }
.top-container .secCont .secLife { background-image: url(../images/top/lifeTit.jpg), url(../images/top/lifeBtm.jpg), url(../images/top/lifeBg.jpg); }
.top-container .secListing .ichiInner {
background: transparent;
background-repeat: no-repeat,no-repeat,repeat-y;
background-position: center top,center bottom,center top;
background-image: url(../images/top/loveIchiTop.jpg),url(../images/top/loveIchiBtm.jpg),url(../images/top/loveIchiBg.jpg);
background-size: 100%;
padding: 60px;
}
.top-container .secCont .secMarry .ichiInner { background-image: url(../images/top/marrIchiTop.jpg), url(../images/top/marrIchiBtm.jpg), url(../images/top/marrIchiBg.jpg); }
.top-container .secCont .secLife .ichiInner { background-image: url(../images/top/lifeIchiTop.jpg), url(../images/top/lifeIchiBtm.jpg), url(../images/top/lifeIchiBg.jpg); }
.top-container .secListing .secInnerInfo {
background: transparent;
background-repeat: no-repeat, no-repeat, repeat-y;
background-position: left top, left bottom, left top;
background-image: url(../images/top/loveInrTop.jpg), url(../images/top/loveInrBtm.jpg), url(../images/top/loveInrBg.jpg);
display: flex;
padding: 12px 0;
position: relative;
}
.top-container .secListing .secMarry .secInnerInfo { background-image: url(../images/top/marrInrTop.jpg), url(../images/top/marrInrBtm.jpg), url(../images/top/marrInrBg.jpg); }
.top-container .secListing .secLife .secInnerInfo { background-image: url(../images/top/lifeInrTop.jpg), url(../images/top/lifeInrBtm.jpg), url(../images/top/lifeInrBg.jpg); }
.top-container .secListing .titelement a:hover { color: #ff4335; }
.top-container .secListing .titelement {
display: block;
text-shadow: none;
}
.top-container .secListing .secInnerInfo .iconelement {
width: 72px;
height: 72px;
}
.top-container .secListing .secInnerInfo .titelement { padding-left: 80px; }
.top-container .secListing .titelement a .listTitle { color: #a3c; }
.top-container .secListing .titelement a:hover .listTitle { color: #a3c; }
.top-container .secListing .secLove .titelement a { color: #bf0031; }
.top-container .secListing .secLove .titelement a:hover { color: #e11d75; }
.top-container .secListing .secMarry .titelement a { color: #71009b; }
.top-container .secListing .secMarry .titelement a:hover { color: #b900ff; }
.top-container .secListing .secLife .titelement a { color: #00398f; }
.top-container .secListing .secLife .titelement a:hover { color: #0042ff; }
.top-container .secListing .secInnerInfo .secInner {
display: inline-flex;
width: 50%;
}
.top-container .secListing .secInnerInfo .secInner .float {
padding: 20px 35px;
min-height: 210px;
}
.top-container .secListing .secInnerInfo .desc {
font-size: .85em;
line-height: 1.4em;
text-align: justify;
}
.top-container .secListing .secInnerInfo .price { font-size: .9em; }
.top-container .secListing .secInnerInfo.singleInr { width: 50.5%; }
.top-container .secListing .secInnerInfo.singleInr .secInner { width: 100%; }
.top-container .secListing .secList .secInfo { position: relative; }
.top-container .secListing .secList .secInfo:before {
content: '';
position: absolute;
background: url(../images/top/llmInrImg.png) right center no-repeat;
background-size: 100%;
width: 365px;
height: 315px;
bottom: 0;
right: 0;
}
/*#################### End top-container ######################*/
.result-container .secYudoMsg {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
background: transparent;
background-image: url(../images/result/unmeiTopImg2.jpg);
background-repeat: no-repeat;
background-position: center top;
background-size: 100%;
position: relative;
padding: 20px 75px 30px;
margin: 0 auto;
text-align: left;
max-width: 690px;
min-height: 350px;
font-size: 1.5em;
line-height: 1.8em;
}
.result-container .secYudoMsg .float {
background: url(../images/result/dateBg.png) no-repeat;
background-size: 100% 100%;
margin: 0 -30px 0 auto;
padding: 10px 20px;
width: 490px;
border-radius: 10px;
border: 1px solid #553322;
}
.result-container .secYudoMsg .float span { color: #ff3; }
.secYudo .komiInfo {
background: transparent;
background-image: url(../images/result/free/komiTopTit.png), url(../images/result/free/komiBtm.png), url(../images/result/free/komiBg.png);
background-repeat: no-repeat, no-repeat, repeat-y;
background-position: center -5px, center bottom, center top;
padding: 130px 0 60px;
margin-bottom: 20px;
}
.secYudo .komiInfo .komiUl {
margin: 0 auto;
max-width: 500px;
}
.secYudo .komiInfo .komiUl li {
position: relative;
padding-left: 25px;
padding-bottom: 10px;
}
.secYudo .komiInfo .komiUl li:before {
content: "";
background: transparent url(../images/common/iconStar.gif) no-repeat center top;
position: absolute;
width: 12px;
height: 12px;
top: 8px;
left: 0;
}
.next_alert {
margin: 0 auto;
padding: 10px;
max-width: 440px;
width: 100%;
height: auto;
color: #ff9;
font-size: 15px;
border: solid #9a0a17 1px;
}
.buttonCatch { text-align: center; }
/* top-container | secFree */
.top-container .secFree {
background: transparent url(../images/top/free/freeTop.jpg) no-repeat center top;
padding-top: 140px;
padding-bottom: 40px;
text-align: center;
}
.top-container .secFree .productBtn {
background: transparent url(../images/top/free/freeBtn4.png) no-repeat center top;
display: inline-block;
height: 250px;
width: 100%;
}
.top-container .secFree a:hover .productBtn {
background-position: center bottom;
}
/* info anime */
[class^="topanime_type_text"] {
width: 100%;
margin: 0 auto;
text-align: center;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HGP明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 140%;
line-height: 1.6;
font-weight: bold;
color: #6b02c4;
letter-spacing: -0.05rem;
text-shadow: 3px 3px 3px #fff, -3px -3px 3px #fff, -3px 3px 3px #fff, 3px -3px 3px #fff, 3px 0px 3px #fff, -3px 0px 3px #fff, 0px 3px 3px #fff, 0px -3px 3px #fff;
}
.topanime_type1_name img, .topanime_type1_img.second img, .topanime_type_text2_wrap .topanime_type_text2 div, .topanime_type2_bar_box1 div,
.topanime_type2_bar_box1 div.strong:before, .topanime_type2_point_box1, .topanime_type2_point_box1 img, .topanime_type2_msgbox1, .topanime_type2_msgbox2,
.topanime_type3_card.front img, .topanime_type3_card.light img, .topanime_type_text0 { opacity: 0; }
.topanime_type1_bg1,
.topanime_type1_bg2 {
width: 840px;
min-height: 414px;
margin: 0 auto;
background-size: 100% auto;
background-repeat: repeat-y;
background-position: center top;
overflow: hidden;
}
.topanime_type1_bg1 { background-image: url(../images/result/rsltType1Bg.jpg); }
.topanime_type1_bg2 { background-image: url(../images/result/rsltType1Bg2.jpg); }
.topanime_type1_bg1_top,
.topanime_type1_bg2_top {
width: 840px;
height: 520px;
margin: 0 auto;
background-size: 100% auto;
background-repeat: no-repeat;
background-position: center top;
position: relative;
}
.topanime_type1_bg1_top { background-image: url(../images/result/rsltType1Top.jpg); }
.topanime_type1_bg2_top { background-image: url(../images/result/rsltType1Top2.jpg); }
.topanime_type1_bt1,
.topanime_type1_bt2 {
width: 840px;
height: 50px;
margin: 0 auto;
background-size: 100% auto;
background-repeat: no-repeat;
background-position: center bottom;
position: relative;
}
.topanime_type1_bt1 { background-image: url(../images/result/rsltType1Btm.jpg); }
.topanime_type1_bt2 { background-image: url(../images/result/rsltType1Btm2.jpg); }
.topanime_type1_tit1,
.topanime_type1_tit2{
width: 565px;
height: 87px;
background-size: 100% auto;
background-repeat: no-repeat;
margin: 0 auto;
}
.topanime_type1_tit1 { background-image: url(../images/result/rsltType1Tit1.jpg); }
.topanime_type1_tit2 { background-image: url(../images/result/rsltType1Tit2.jpg); }
.topanime_type1_name{
position: absolute;
top: 40px;
left: 190px;
width: 460px;
height: 100px;
}
.topanime_type1_img{
position: absolute;
top: 160px;
left: 240px;
width: 350px;
height: 350px;
}
.topanime_type1_img img{
position: absolute;
top: 0;
left: 0;
width: 350px;
height: 350px;
}
.topanime_type1_name img {
position: absolute;
top: 0;
left: 0;
width: 460px;
height: 100px;
}
/*テキスト*/
[class^="topanime_type1_bg"] .topanime_type_text0 {
width: 280px;
top: 145px;
left: 35px;
font-size: 180%;
line-height: 130%;
text-align: center;
}
[class^="topanime_type1_bg"] .topanime_type_text1 {
width: 380px;
top: 10px;
left: 310px;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HGP明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 180%;
line-height: 130%;
text-align: center;
}
.topanime_type_text2_wrap {
width: 700px;
margin: 20px auto;
}
[class^="topanime_type1_bg"] .topanime_type_text2 {
width: 700px;
padding: 10px;
box-sizing: border-box;
font-size: 90%;
line-height: 135%;
text-shadow: none;
}
.topanime_type1_bg1 .topanime_type_text2 {
background-color: rgba(255,169,222,0.4);
}
.topanime_type1_bg2 .topanime_type_text2 {
background-color: rgba(185,255,95,0.4);
}
.topanime_type_text2 div {
text-align: left;
background-position: left 1px;
background-repeat: no-repeat;
padding:5px 5px 5px 40px;
}
.topanime_type1_bg1 .topanime_type_text2 div { background-image: url(../images/result/iconSakura1.png); }
.topanime_type1_bg2 .topanime_type_text2 div { background-image: url(../images/result/iconSakura2.png); }
.topanime_type1_text {
width: 620px;
margin: 0 auto;
padding-top: 10px;
padding-bottom: 15px;
}
.topanime_type1_text.text2 {
text-align: left;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HGP明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 135%;
line-height: 160%;
}
.topanime_type2_bg2_wrap {
width: 760px;
min-height: 760px;
margin: 0 auto 20px;
background-image:
url(../images/result/rsltType2Graph1.jpg),
url(../images/result/rsltType2Btm.jpg),
url(../images/result/rsltType2Bg.jpg);
background-repeat:
no-repeat,
no-repeat,
repeat-y;
background-position:
center top,
center bottom,
center top;
position: relative;
}
.topanime_type2_trialbox{
width: 720px;
height: 370px;
background-image: url(../images/result/type/res_type2_trial1.jpg);
position: absolute;
left: 20px;
top: 4px;
}
/*各ボックス*/
div.topanime_type2_bar_box1 {
position: absolute;
top: 5px;
left: 19px;
width: 720px;
height: 360px;
display: flex;
align-items: flex-end;
overflow: hidden;
}
.topanime_type2_year_box1{
position: absolute;
top: 405px;
left: 19px;
width: 720px;
height: 20px;
}
.topanime_type2_year_box1 div.topanime_type2_year1{
width: 60px;
height: 20px;
position: absolute;
top: 0;
}
.topanime_type2_kami_box1,
.topanime_type2_month_box1{
width: 720px;
height: 60px;
position: absolute;
top: 345px;
left: 19px;
}
.topanime_type2_kami_box1{
top: 430px;
}
.topanime_type2_kami_box1 .topanime_type2_kami ,
.topanime_type2_month_box1 .topanime_type2_month1{
width: 60px;
height: 60px;
position: absolute;
top: 0;
}
.topanime_type2_date_box1{
width: 720px;
height: 90px;
position: absolute;
top: 495px;
left: 19px;
}
.topanime_type2_date_box1 .topanime_type2_date{
width: 60px;
height: 90px;
position: absolute;
top: 0;
}
div.topanime_type2_bar_box1 div {
display: flex;
position: relative;
width: 60px;
background-image: url(../images/result/rsltType2Bar1.png);
background-size: 100%;
background-position: center top;
}
.topanime_type2_point_box1{
width: 720px;
height: 50px;
position: absolute;
top: 495px;
left: 19px;
}
.topanime_type2_point_box1 .topanime_type2_point{
width: 60px;
height: 90px;
position: absolute;
top: 0;
box-sizing: border-box;
box-shadow: 0 0 10px #ff0, 0 0 10px #ff0, 0 0 10px #ff0, 0 0 10px #ff0, 0 0 10px #ff0;
}
.topanime_type2_point img{
top: -175px;
left: 5px;
position: absolute;
}
div.topanime_type2_bar_box1 div.strong:before {
content:"";
display: block;
width: 100%;
height: 100%;
background-image: url(../images/result/rsltType2Bar2.png);
background-size: 100%;
background-position: center top;
}
.topanime_type2_msgbox1{
width: 340px;
background-color: #f9d6de;
border-radius: 10px;
box-sizing: border-box;
padding: 10px;
border: 2px solid #a20401;
position: absolute;
left: 30px;
top: 590px;
display: flex;
align-items: center;
justify-content: flex-start;
}
.topanime_type2_msgbox2{
width: 340px;
background-color: #e7d6f9;
box-sizing: border-box;
padding: 10px;
border-radius: 10px;
border: 2px solid #6701a2;
position: absolute;
left: 385px;
top: 590px;
display: flex;
align-items: center;
justify-content: flex-start;
}
.topanime_type2_icnbox{
width: 60px;
float: left;
margin-right: 10px;
}
@media all and (-ms-high-contrast: none) {
.topanime_type2_icnbox{
width: 100px;
}
}
.topanime_type2_combox{
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HGP明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 120%;
line-height: 1.4;
font-weight: bold;
color: #4d2322;
letter-spacing: 0.2rem;
text-align: left;
}
/*モチーフ詳細*/
.topanime_type2_img2 {
width: 250px;
height: 290px;
margin-top: 40px;
position: relative;
}
.topanime_type2_img2 img {
width: 250px;
height: 290px;
position: absolute;
top: 0;
left: 0;
}
.topanime_type2_point2 {
width: 120px;
height: 94px;
position: absolute;
background: url(../images/result/type/res_type2_check1.png) no-repeat;
top: 8px;
left: 170px;
}
[class^="topanime_type3_bg"] {
width: 832px;
height: 624px;
background-size: 100% 100%;
background-repeat: no-repeat;
background-position: center top;
}
.topanime_type3_bg {
background-image: url(../images/result/card/res_card_bg.jpg);
position: relative;
margin: 0 auto 20px;
overflow: hidden;
}
/*先生*/
.topanime_type3_bg1 {
background-image: url(../images/result/type/res_type3_bg1.jpg);
position: absolute;
top: 0;
left: 0;
}
.topanime_type3_bg2 {
background-image: url(../images/result/type/res_type3_bg2.jpg);
position: absolute;
top: 0;
left: 0;
}
/*テキスト*/
.topanime_type3_bg .topanime_type_text0 {
width: 800px;
position: absolute;
top: 170px;
left: 16px;
font-size: 200%;
line-height: 130%;
text-align: center;
}
/*スプレッド５パターン（p1-p5）*/
.topanime_type3_card img {
width: 140px;
height: 193px;
position: absolute;
}
.topanime_type3_bg.p1 .topanime_type3_card img {
width: 221px;
height: 304px;
}
/*p1：１枚パターン*/
.topanime_type3_bg.p1 .topanime_type3_card img:nth-of-type(1) { top: 143px; left: 306px; }
.topanime_type3_bg.p1 .topanime_type3_card img:nth-of-type(2),
.topanime_type3_bg.p1 .topanime_type3_card img:nth-of-type(3),
.topanime_type3_bg.p1 .topanime_type3_card img:nth-of-type(4),
.topanime_type3_bg.p1 .topanime_type3_card img:nth-of-type(5),
.topanime_type3_bg.p1 .topanime_type3_card img:nth-of-type(6),
.topanime_type3_bg.p1 .topanime_type3_card img:nth-of-type(7) { display: none; }
/*p2：３枚パターン*/
.topanime_type3_bg.p2 .topanime_type3_card img:nth-of-type(1) {top: 104px;left: 351px;}
.topanime_type3_bg.p2 .topanime_type3_card img:nth-of-type(2) {top: 299px;left: 182px;}
.topanime_type3_bg.p2 .topanime_type3_card img:nth-of-type(3) {top: 299px;left: 520px;}
.topanime_type3_bg.p2 .topanime_type3_card img:nth-of-type(4),
.topanime_type3_bg.p2 .topanime_type3_card img:nth-of-type(5),
.topanime_type3_bg.p2 .topanime_type3_card img:nth-of-type(6),
.topanime_type3_bg.p2 .topanime_type3_card img:nth-of-type(7) { display: none; }
/*p3：4枚パターン*/
.topanime_type3_bg.p3 .topanime_type3_card img:nth-of-type(1) {top: 202px;left: 208px;}
.topanime_type3_bg.p3 .topanime_type3_card img:nth-of-type(2) {top: 202px;left: 494px;}
.topanime_type3_bg.p3 .topanime_type3_card img:nth-of-type(3) {top: 104px;left: 351px;}
.topanime_type3_bg.p3 .topanime_type3_card img:nth-of-type(4) {top: 299px;left: 351px;}
.topanime_type3_bg.p3 .topanime_type3_card img:nth-of-type(5),
.topanime_type3_bg.p3 .topanime_type3_card img:nth-of-type(6),
.topanime_type3_bg.p3 .topanime_type3_card img:nth-of-type(7){ display: none; }
/*p4：６枚パターン*/
.topanime_type3_bg.p4 .topanime_type3_card img:nth-of-type(1) {top: 130px;left: 143px;}
.topanime_type3_bg.p4 .topanime_type3_card img:nth-of-type(2) {top: 130px;left: 559px;}
.topanime_type3_bg.p4 .topanime_type3_card img:nth-of-type(3) {top: 384px;left: 189px;}
.topanime_type3_bg.p4 .topanime_type3_card img:nth-of-type(4) {top: 26px;left: 351px;}
.topanime_type3_bg.p4 .topanime_type3_card img:nth-of-type(5) {top: 384px;left: 514px;}
.topanime_type3_bg.p4 .topanime_type3_card img:nth-of-type(6) {top: 260px;left: 351px;}
.topanime_type3_bg.p4 .topanime_type3_card img:nth-of-type(7){ display: none; }
/*p5：７枚パターン*/
.topanime_type3_bg.p5 .topanime_type3_card img:nth-of-type(1) { top: 20px; left: 351px; }
.topanime_type3_bg.p5 .topanime_type3_card img:nth-of-type(2) { top: 330px; left: 539px; }
.topanime_type3_bg.p5 .topanime_type3_card img:nth-of-type(3) { top: 330px; left: 163px; }
.topanime_type3_bg.p5 .topanime_type3_card img:nth-of-type(4) { top: 390px; left: 351px; }
.topanime_type3_bg.p5 .topanime_type3_card img:nth-of-type(5) { top: 114px; left: 163px; }
.topanime_type3_bg.p5 .topanime_type3_card img:nth-of-type(6) { top: 114px; left: 540px; }
.topanime_type3_bg.p5 .topanime_type3_card img:nth-of-type(7) { top: 204px; left: 351px; }
/* カード強調 */
.topanime_type3_card img.strong{
box-sizing: border-box;
box-shadow: 0 0 10px #ff0,0 0 10px #ff0,0 0 10px #ff0,0 0 10px #ff0,0 0 10px #ff0;
}
.topanime_card_hand1{
width: 832px;
height: 624px;
background-image: url(../images/result/card/res_card_hand1.jpg);
background-size: 100% 100%;
position: absolute;
top: 0;
left: 0;
}
.topanime_card_hand2{
width: 832px;
height: 624px;
background-image: url(../images/result/card/res_card_hand2.jpg);
background-size: 100% 100%;
position: absolute;
top: 0;
left: 0;
}
/* 続きを読む */
.res_card_btn_box input {
width: 360px;
height: 108px;
position: absolute;
top: 186px;
left: 140px;
}
.res_card_btn_mask {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
/*モチーフ詳細*/
.topanime_type3_img2 {
width: 290px;
height: 400px;
margin-top: 0px;
position: relative;
}
.topanime_type3_img2 img {
width: 290px;
height: 400px;
position: absolute;
top: 0;
left: 0;
}