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: #100;
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; }
.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: 950px;
}
.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.8em;
text-align: justify;
}
.paragraph p {
margin-bottom: 10px;
text-indent: 17px;
}
.text-left { text-align: left; }
.text-right { text-align: right; }
.paragraph p.text-center { text-align: center; }
.paragraph strong { color: #fe0; }
.paragraph p.text-center strong { font-size: 145%; line-height: 120%; color: #fff; }
.paragraph p.text-center strong strong { color: #fe0; }
.secMsg .paragraph p { text-indent: 0; }
p.big { font-size: 1.1em; }
p.small {
font-size: .9em;
line-height: 1.3em;
}
p.no-indent { text-indent: 0; }
.tCenter { text-align: center; }
.title {
font-size: 1.4em;
line-height: 1.2em;
font-weight: bold;
}
.blackGrad::after { color: #000; }
.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; }
.tGray { color: #d1d1d1; }
.tSPurple { color: #d7b0ff; }
.tLGreen { color: #B8FFAA; }
.tLYellow { color: #FDD891; }
.nLYellow { color: #ffeeaa; }
.tLPink { color: #FFAAFF; }
.tGreen { color: #05a30e; }
.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; }
/********************************
*** Header Part
********************************/
header{
background: transparent url(../images/common/naviBg.png) no-repeat center top;
min-height: 125px;
}
.navi-container {
background: transparent;
margin: 0 auto;
padding: 0;
width: 100%;
max-width: 850px;
height: 120px;
}
.navi-container .naviInfo {
display: table;
margin: 0 auto;
width: 100%;
max-width: 821px;
}
.navi-container .navi_btn {
background: url(../images/common/button/naviTop.jpg) no-repeat center top;
position: relative;
margin: 0 auto;
width: 280px;
height: 120px;
}
.navi-container a:hover .navi_btn { background-position: center bottom; }
.navi-container .navi_profile { background-image: url(../images/common/button/naviProfile.jpg); }
.navi-container .navi_info { background-image: url(../images/common/button/naviInfo.jpg); width: 261px; }
.navi-container .navi_input { background-image: url(../images/common/button/naviInput.jpg); width: 276px; }
.breadcrumb {
margin: 30px auto 15px;
max-width: 760px;
color: #563a3a;
font-size: .8em;
line-height: 1.5em;
}
.breadcrumb a { color: #d500dd; font-weight: bold; }
.breadcrumb a:hover { color: #fd97c2; }
.paid-container .navi-container { background: transparent; }
.mIndex .navi-container a .navi_btn.navi_input, .paid-container .navi-container a { display: none; }
/******************************** Header Part End ********************************/
.body-container .commonMenuBox .cmnInfo {
background: url(../images/common/menu/inpMnBg.jpg) repeat-y center center;
margin: 0 auto 0;
padding: 0;
color: #662200;
max-width: 830px;
font-size: 1.1em;
}
/*.body-container .commonMenuBox .cmnInfo h3 { text-shadow: 0 0 7px #8261ef; }*/
.body-container .commonMenuBox .cmnTop {
background: url(../images/common/menu/inpMnTop.jpg) no-repeat center bottom;
min-height: 60px;
}
.body-container .commonMenuBox .cmnBtm {
background: url(../images/common/menu/inpMnBtm.jpg) no-repeat center top;
min-height: 60px;
}
.body-container .secYudo .commonMenuBox .cmnInfo {
background-image: url(../images/result/free/rsltBoxBg.jpg);
margin: -20px auto;
}
.body-container .secYudo .commonMenuBox .cmnTop { background-image: url(../images/result/free/rsltBoxTop.jpg); }
.body-container .secYudo .commonMenuBox .cmnBtm { background-image: url(../images/result/free/rsltBoxBtm.jpg); }
.commonMenuBox .infoelement {
position: relative;
padding: 0 80px;
}
.commonMenuBox .iconelement {
background: transparent no-repeat center top;
background-size: 100%;
position: relative;
float: left;
margin-right: 20px;
width: 75px;
height: 75px;
}
.commonMenuBox .infoelement .titelement h3 { font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif; font-size: 23px; }
.commonMenuBox .infoelement .titelement .productTitle {
color: #760759;
font-size: 0.95em;
margin-bottom: 2px;
text-shadow: none;
}
.commonMenuBox .titelement { padding-left: 80px; }
/* icon: free, xiangyu, danlian, erdwl, ngrdxy, qihedu, jiehun, life, future, job, total, bulun, fuhuoai, qingyu, kulian, jwzh, nianyun, jueduan, fuyuan, lovedirection, rjkx, spdyx, suyuan, zhenxin, spdlq, nightqhd */
.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.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.future { 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.fuhuoai { 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.jwzh { background-image: url(../images/common/icon/icon16.png); }
.commonMenuBox .iconelement.nianyun { background-image: url(../images/common/icon/icon17.png); }
.commonMenuBox .iconelement.jueduan { 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.rjkx { 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.zhenxin { background-image: url(../images/common/icon/icon24.png); }
.commonMenuBox .iconelement.spdlq { background-image: url(../images/common/icon/icon33.png); }
.commonMenuBox .iconelement.nightqhd { background-image: url(../images/common/icon/icon34.png); }
header .secDesc {
margin: 10px auto;
width: 75%;
color: #563a3a;
font-size: 1em;
text-align: center;
}
.full-container {
background: transparent url(../images/common/mBnr.png) no-repeat center top;
display: table;
margin: 0 auto;
padding-top: 470px;
width: 100%;
}
.body-container {
background: transparent url(../images/common/mBg.png) repeat-y center top;
display: table;
margin: 0 auto;
min-height: 295px;
max-width: 990px;
width: 100%;
z-index: 44;
}
.fixed-cont, .subbody-container {
/* position: relative;*/
margin: 0 auto;
}
.body-footer {
background: transparent url(../images/common/mBg.png) repeat-y center top;
color: #b89a02;
padding: 20px 0 50px;
text-align: center;
max-width: 960px;
margin: 0 auto;
}
.body-footer .copyrightTxt {
margin-top: 20px;
text-align: center;
font-size: 0.9em;
line-height: 1.3em;
}
.body-footer a {
color: #b89a02;
}
/*##################
Button
##################*/
.input_submit a { text-decoration: none; }
.free-btn, .charge-btn {
position: relative;
display: inline-table;
width: 360px;
height: 170px;
margin-bottom: 15px;
}
.start-btn {
background-image: url(../images/common/button/btnStart.png);
background-size: 100%;
width: 360px;
height: 124px;
}
.start-btn:hover { background-position: center bottom; }
.submit-btn-type3 {
background-image: url(../images/common/button/btnType3.png);
background-size: 100%;
position: relative;
margin: 0 auto;
top: 220px;
width: 500px;
height: 156px;
}
.submit-btn-type4 {
background-image: url(../images/common/button/btnType4.png);
background-size: 100%;
position: relative;
margin: 0 auto;
top: 220px;
width: 500px;
height: 156px;
}
.submit-btn-trial {
background-image: url(../images/common/button/btnTrial.png);
background-size: 100%;
position: relative;
margin: 0 auto;
top: 230px;
width: 500px;
height: 130px;
}
.submit-btn-last {
background: transparent url(../images/common/button/btnLast.png) no-repeat center bottom;
background-size: 100%;
position: relative;
margin: 0 auto;
/* top: 230px;*/
width: 400px;
height: 90px;
}
.submit-btn-last:hover { background-position: center top; }
.submit-btn-trial:hover, .submit-btn-type3:hover, .submit-btn-type4:hover { background-position: center bottom; }
.free-btn { background: transparent url(../images/common/button/btnFree.png) no-repeat center top; }
.free-btn:hover { background-position: center bottom; }
.charge-btn { background: transparent url(../images/common/button/btnSubmit.png) 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 #fff, 0 -5px 3px #fff, 0 4px 3px #fff, 4px 4px 5px #fff, 0 4px 3px #fff;
}
.free-btn .title, .charge-btn .title , .submit-btn .title {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
position: absolute;
width: 50%;
top: 27%;
left: 26%;
font-size: 1.9em;
text-align: center;
text-shadow: 1px 1px 5px #fff, 1px 2px 10px #fff, 1px 2px 8px #fff, 1px 2px 20px #fff;
}
.free-btn .title { top: 35%; }
.free-container .submit-btn .title {
top: 36%;
font-size: 1.5em;
letter-spacing: 0.1em;
}
.free-btn .btnText { letter-spacing: 5px; }
.free-container .charge-btn .btnText {
padding: 0;
font-size: 1.6em;
}
.free-container .submit-btn {
background: transparent url(../images/common/button/btnNext.png) no-repeat center top;
background-size: 100%;
position: relative;
float: none;
display: table;
width: 340px;
height: 102px;
margin: 0 auto;
padding: 0;
font-size: 1.1em;
}
.free-container .submit-btn:hover { background-position: center bottom; }
/*################## Button End ##################*/
/*##################
info-container
##################*/
.info-container .section {
background: transparent;
background-image: url(../images/info/proTop.jpg), url(../images/info/proBtm.jpg), url(../images/info/proBg.jpg);
background-position: center top, center bottom, center top;
background-repeat: no-repeat, no-repeat, repeat-y;
margin: 0 auto 30px;
max-width: 840px;
font-size: 1em;
}
.info-container .section.profile { padding: 210px 0 80px; }
.info-container .section.profile .secInfo {
background: transparent no-repeat;
background-position: left top, 300px top;
background-image: url(../images/info/proImg.jpg), url(../images/info/proNm.jpg);
padding: 390px 90px 30px;
}
.info-container .section.profile .secInfo ul h4 {
background: transparent url(../images/info/proStarIcon.png) no-repeat left top;
padding: 6px 0 0 35px;
margin-bottom: 5px;
line-height: 1.5em;
color: #000057;
}
.info-container .section.profile .secInfo ul li { margin-bottom: 20px; }
.info-container .section.profile .secInfo ul li span {
background: transparent url(../images/info/proStarIcon2.png) no-repeat left top;
display: block;
margin-left: 4px;
padding: 5px 0 0 30px;
}
.info-container .section.profile .secInner {
position: relative;
background: transparent url(../images/info/proMsg.jpg) no-repeat center top ;
margin: 0 auto;
padding: 125px 90px 0;
max-width: 750px;
}
.info-container .section.profile .proSign {
background: url(../images/info/proSign.png) no-repeat;
background-size: 100% auto;
margin: 0 0 0 auto;
width: 270px;
height: 100px;
}
/*###### End Profile ######*/
.info-container .section.about {
background-image: url(../images/info/abtTop.jpg), url(../images/info/abtBtm.jpg), url(../images/info/abtBg.jpg);
padding: 40px 0 0;
color: #fff;
}
.info-container .section.about .heading { height: 120px; }
.info-container .abtSec {
max-width: 820px;
margin: 0 auto 10px;
}
.info-container .abtSec .paragraph { margin: 0 auto; }
.info-container .abtSec .paragraph p span { color: #fc6; }
.info-container .abtSec .abtTit {
background: transparent no-repeat center top;
margin: 0 auto 20px;
padding: 30px 0;
height: 190px;
font-size: 2em;
line-height: 1.5;
color: transparent;
}
.info-container .abtSecTit .abtTit { background-image: url(../images/info/introTit1.png); height: 270px; }
.info-container .abtSec1 .abtTit { background-image: url(../images/info/introTit2.png); }
.info-container .abtSec2 .abtTit { background-image: url(../images/info/introTit3.png); }
.info-container .abtSec .samplePhrase {
margin: 0 auto 30px;
text-align: center;
color: #000;
font-size: 260%;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
text-shadow: 0 0 8px #fff, 0 0 8px #fff, 0 0 8px #fff, 0 0 8px #fff, 0 0 8px #fff, 0 0 8px #fff, 0 0 8px #fff, 0 0 8px #fff;
}
/*###### End About ######*/
/*################## info-container End ##################*/
/*##########################
input-container
##########################*/
.input-container .komiCatch {
}
.komi {
background: transparent;
background-image: url(../images/input/inpKomiTop.jpg), url(../images/input/inpKomiBtm.jpg), url(../images/input/inpKomiBg.jpg);
background-repeat: no-repeat, no-repeat, repeat-y;
background-position: center top, center bottom, center top;
padding: 210px 0 130px;
}
.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: 590px;
font-size: 1em;
line-height: 1.5em;
z-index: 33;
}
.komi ul li {
background: transparent url(../images/input/iconStar.png) no-repeat left 2px;
padding-left: 32px;
margin-top: 14px;
color: #fff;
background-size: 24px;
}
.komi ul li br { display: none; }
/*######### question #########*/
.question {
background: transparent;
background-image: url(../images/input/inpFormBtm.jpg),url(../images/input/inpFormBg.jpg);
background-repeat: no-repeat,repeat-y;
background-position: center bottom,center top;
padding-bottom: 95px;
}
.question .top-heading {
background: transparent;
background-repeat: no-repeat;
background-position: center top;
}
.question .top-heading.self {
background-image: url(../images/input/inpFormTit1.jpg);
padding: 170px 0 0px;
}
.question .top-heading.target {
background-image: url(../images/input/inpFormTit2.jpg);
padding: 145px 0 0;
}
.question .formInfo .inputHolder {
display: table;
margin: 0 auto;
}
.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: #000;
font-size: 1.5em;
line-height: 1.5em;
font-weight: bold;
text-align: right;
/* text-shadow: 0px 0px 2px #d9a1c8, 1px 0px 2px #884697, 0px 0px 0px #d4b5d9;*/
}
.question form span.inbold {
color: #000;
font-size: 1.2em;
text-shadow: none;
}
.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: 110px;
height: 40px;
margin-right: -16px;
}
.question .inputRow .attention {
display: table;
margin: 0 auto;
font-size: 0.9em;
}
.question .rName span,
#default_check+span {
position: relative;
top: 3px;
}
.question .rBirthTime { margin: 10px 0; }
.question select.form_hh {
margin-left: 20px;
width: 90px;
}
.question select.form_mm {
margin-left: 0px;
width: 90px;
}
.question .rGender { margin: 10px 7px; }
.question .rGender span {
position: relative;
top: 0px;
}
.question .target .rGender { position: relative; z-index: 0; }
.question .target .rGender:before {
content: '';
position: absolute;
width: 150px;
height: 30px;
cursor: default;
z-index: 9;
}
.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 #8e8e8e 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 {
display: inline-block;
margin: 0 auto;
text-decoration: none;
}
span.spanError:before { top: 1px; }
/*################## input-container End ##################*/
/*##########################
result-container
##########################*/
.inCol {
width: 100%;
display: flex;
box-sizing: border-box;
}
.inCol * { width: 49%; }
.inCol * * { width: 100%; }
.inCol .userNm, .inCol .targetNm {
display: flex;
flex-wrap: nowrap;
align-items: center;
flex-direction: column;
}
.result-container .secUser {
background: url(../images/result/resUserBg.jpg) no-repeat center;
background-size: 100%;
margin: 0 auto 20px;
padding: 15px 0;
color: #9c16ac;
max-width: 700px;
text-align: center;
box-shadow: 0 0 10px #8fb3c8;
text-shadow: 0px -1px 20px #fff, 0px -1px 20px #fff, 0px -1px 10px #fff, 0px -1px 10px #fff, 0px -1px 10px #fff;
border-radius: 10px;
}
.result-container .secUser .targetNm { color: #862d14; }
/*
.result-container .secListing .listJiki .secTitle,
.result-container .secListing .listInnCmn .secInList {
display: none;
}
.result-container .secListing .listJiki .secInfo .secInList,
*/
.result-container .fadein, .result-container .fadein_trial { opacity: 0; }
.result-container .scroll_box,
.result-container .listWords .secInList {
overflow: hidden;
display: none;
}
/*######### secGreeting #########*/
.result-container .subbody-container {
background: transparent url(../images/result/resBg.jpg) repeat-y center top;
color: #fff;
max-width: 840px;
}
/*** secGreeting ***/
.result-container .secGreeting {
position: relative;
background: url(../images/result/resInfoTop.jpg) no-repeat center top;
padding: 270px 0 20px;
color: #fff;
font-weight: bold;
/* text-shadow: 0 0 5px #000, 0 0 8px #000, 0 0 10px #000;*/
}
.result-container .secGreeting .greetingInfo {
background: url(../images/result/resMsgImg1.jpg) no-repeat center top;
min-height: 380px;
padding: 40px 50px 20px;
}
.result-container .secGreeting .greetingInfo .paragraph {
margin: 0;
padding-top: 35px;
width: 395px;
line-height: 1.4em;
}
.result-container .secGreeting .greetingInfo .paragraph p { text-indent: 20px; }
.result-container .secGreeting .greetingInfo .paragraph i { font-style: inherit; }
/*** End secGreeting ***/
/*######### secCommon #########*/
.result-container .secCommon {
margin: 0 auto;
max-width: 780px;
}
/*######### secCommon End #########*/
/*######### secListing #########*/
.result-container .secListing {
background: transparent url(../images/result/resBtm.jpg) no-repeat center bottom;
padding-bottom: 30px;
}
.result-container .secListing .secInfo strong { /* font-style: normal; font-weight: bold; */ }
.result-container .secListing .fixed-cont { width: 840px; max-width: 100%; }
.result-container .secCommon .secTitle,
.result-container .secTitle {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
border-image-slice: 48 48 48 48 fill;
border-image-width: 48px 48px 48px 48px;
border-image-repeat: round stretch;
border-image-source: url(../images/result/resTit2.jpg);
background-size: 100% auto;
position: relative;
margin: 0 auto 12px;
padding: 22px 0 20px;
max-width: 840px;
color: #fff;
font-size: 20px;
font-weight: bold;
text-align: center;
clear: both;
}
.result-container .secTitle.bigTit {
background: none;
border-image-source: url(../images/result/resTit.jpg);
padding: 42px 0;
color: #c0293f;
font-size: 23px;
text-shadow: 0px -1px 20px #fff, 0px -1px 20px #fff, 0px -1px 30px #fff, 0px -1px 20px #fff, 0px -1px 10px #fff;
}
.result-container .secTitle.subTit {
background: none;
border-image-source: url(../images/result/resTit3.jpg);
padding: 30px 0;
color: #85720a;
font-size: 22px;
}
.result-container .secTitle .paragraph { padding: 0 30px; text-align: center; }
.result-container .secListing .secList {
color: #fff;
}
.result-container .secInfo .secInList {
background-color: #514c8a;
margin: 0 auto 20px;
padding: 20px;
max-width: 740px;
min-height: 120px;
border-radius: 10px;
}
.result-container .secListing .innerList .paragraph,
.result-container .secListing .secInList .paragraph {
position: relative;
padding: 0px;
z-index: 2;
}
/*######### secListing End #########*/
.result-container .secFatePoint {
border-image-slice: 48 48 48 48 fill;
border-image-width: 48px 48px 48px 48px;
border-image-repeat: round stretch;
border-image-source: url(../images/result/resPointTop.jpg);
background-size: 100% auto;
display: flex;
justify-content: center;
align-items: center;
padding: 20px 0;
margin: 0 auto 10px;
box-sizing: border-box;
}
[class^="pointIcon"]{
width: 124px;
height: 124px;
margin: 0 0;
background-size: 100% 100%;
background-repeat: no-repeat;
}
.pointIcon1{background-image: url(../images/result/resPointIcon1.png);}
.pointIcon2{background-image: url(../images/result/resPointIcon2.png);}
.pointIcon3{background-image: url(../images/result/resPointIcon3.png);}
.pointIcon4{background-image: url(../images/result/resPointIcon4.png);}
.pointIcon5{background-image: url(../images/result/resPointIcon5.png);}
.pointIcon6{background-image: url(../images/result/resPointIcon6.png);}
.pointIcon7{background-image: url(../images/result/resPointIcon7.png);}
.pointMsg {
width: 620px;
color: #85720a;
font-size: 134%;
font-weight: bold;
text-align: center;
line-height: 1.4em;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
text-shadow: 0px -1px 20px #fff, 0px -1px 20px #fff, 0px -1px 10px #fff, 0px -1px 10px #fff, 0px -1px 10px #fff;
}
.pointMsg strong { color: #514c8a; font-size: 135%; }
.result-container .secListing .listYesno {
background: transparent url(../images/result/resInfoTop3.jpg) no-repeat center top;
padding: 150px 0 30px;
}
.result-container .secMsg {
background: transparent no-repeat center top;
background-image: url(../images/result/resImg2.jpg);
padding: 30px;
min-height: 290px;
color: #fff;
}
.result-container .secCommonSub .commonCatch .secMsg {
background-image: url(../images/result/resImg4.jpg);
padding-top: 75px;
}
.result-container .secCommonSub .commonCatch .secMsg .resCatch { width: 560px; }
.result-container .secMsg .resCatch {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
background: rgba(255,255,255,0.7);
float: right;
margin: 20px 0px 20px 130px;
padding: 30px;
width: 580px;
color: #8f5706;
font-size: 110%;
line-height: 160%;
box-shadow: 0px 0px 16px 5px rgba(0,0,0,0.4);
border-radius: 16px;
}
.result-container .secMsg .resCatch strong { color: #c0293f; font-size: 120%; }
.result-container .listLast .secMsg {
background-image: url(../images/result/resHeadline.jpg);
background-position: center;
background-size: 100%;
padding: 70px 30px;
min-height: auto;
}
.result-container .listLast .secMsg .resCatch {
float: none;
padding: 0;
margin: 0 auto;
color: #c0293f;
font-size: 170%;
text-align: center;
box-shadow: none;
}
.jikiBox {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
color: #c0293f;
font-size: 250%;
margin-bottom: 12px;
}
.jikiBox .paragraph { text-align: center; }
.smpAnimWrapper { margin-bottom: 20px; }
/* か結果から流用 */
/* ----------------------
* result_type1
*---------------------- */
.topanime_type1_box1 {
position: relative;
width: 770px;
margin: 0 auto;
overflow: hidden;
}
.topanime_type1_bg1 {
width: 770px;
height: 550px;
margin: 0 auto -1px;
background: url(../images/result/type/res_type1_bg1.jpg) no-repeat;
background-size: 100% 100%;
}
.topanime_type1_txt1 {
position: absolute;
width: 770px;
height: 520px;
margin: 0 auto -1px;
background: url(../images/result/type/res_type1_txt1.png) no-repeat;
background-size: 100% 100%;
top: 0;
left: 0;
}
.topanime_type1_bg2 {
width: 770px;
margin: 0 auto -1px;
background: url(../images/result/type/res_type1_bg2.jpg) no-repeat;
background-size: 100% 100%;
}
.topanime_type1_bg3 {
width: 770px;
height: 70px;
margin: 0 auto;
background: url(../images/result/type/res_type1_bg3.jpg) no-repeat;
background-size: 100% 100%;
}
.topanime_type1_box1 img {
display: block;
position: absolute;
}
.topanime_type1_box1 p {
position: absolute;
color: #263347;
font-size: 22px;
text-align: center;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-weight: normal;
line-height: 0;
letter-spacing: -0.04em;
}
.topanime_type1_box1 .topanime_type1_bg2 p {
display: block;
position: static;
width: 700px;
margin: 0 auto;
line-height: 160%;
}
.topanime_type1_name1 {width: 140px; height: 60px; top: 69px; left: 580px;}
.topanime_type1_name2 {width: 140px; height: 60px; top: 69px; left: 428px;}
.topanime_type1_name3 {width: 140px; height: 60px; top: 69px; left: 298px;}
.topanime_type1_name4 {width: 140px; height: 60px; top: 69px; left: 168px;}
.topanime_type1_name5 {width: 140px; height: 60px; top: 69px; left: 30px;}
.topanime_type1_b1_1 {width: 100px; height: 90px; top: 98px; left: 623px;}
.topanime_type1_b1_2 {width: 100px; height: 90px; top: 98px; left: 560px;}
.topanime_type1_b1_3 {width: 100px; height: 90px; top: 98px; left: 492px;}
.topanime_type1_b1_4 {width: 100px; height: 90px; top: 98px; left: 428px;}
.topanime_type1_b1_5 {width: 100px; height: 90px; top: 98px; left: 362px;}
.topanime_type1_b1_6 {width: 100px; height: 90px; top: 98px; left: 298px;}
.topanime_type1_b1_7 {width: 100px; height: 90px; top: 98px; left: 230px;}
.topanime_type1_b1_8 {width: 100px; height: 90px; top: 98px; left: 166px;}
.topanime_type1_b2_1 {width: 100px; height: 90px; top: 182px; left: 623px;}
.topanime_type1_b2_2 {width: 100px; height: 90px; top: 182px; left: 560px;}
.topanime_type1_b2_3 {width: 100px; height: 90px; top: 182px; left: 492px;}
.topanime_type1_b2_4 {width: 100px; height: 90px; top: 182px; left: 428px;}
.topanime_type1_b2_5 {width: 100px; height: 90px; top: 182px; left: 362px;}
.topanime_type1_b2_6 {width: 100px; height: 90px; top: 182px; left: 298px;}
.topanime_type1_b2_7 {width: 100px; height: 90px; top: 182px; left: 230px;}
.topanime_type1_b2_8 {width: 100px; height: 90px; top: 182px; left: 166px;}
.topanime_type1_b3_1 {width: 100px; height: 90px; top: 264px; left: 623px;}
.topanime_type1_b3_2 {width: 100px; height: 90px; top: 264px; left: 560px;}
.topanime_type1_b3_3 {width: 100px; height: 90px; top: 264px; left: 492px;}
.topanime_type1_b3_4 {width: 100px; height: 90px; top: 264px; left: 428px;}
.topanime_type1_b3_5 {width: 100px; height: 90px; top: 264px; left: 362px;}
.topanime_type1_b3_6 {width: 100px; height: 90px; top: 264px; left: 298px;}
.topanime_type1_b3_7 {width: 100px; height: 90px; top: 264px; left: 230px;}
.topanime_type1_b3_8 {width: 100px; height: 90px; top: 264px; left: 166px;}
.topanime_type1_b4_1 {width: 100px; height: 90px; top: 355px; left: 581px;}
.topanime_type1_b4_2 {width: 100px; height: 90px; top: 355px; left: 450px;}
.topanime_type1_b4_3 {width: 100px; height: 90px; top: 355px; left: 318px;}
.topanime_type1_b4_4 {width: 100px; height: 90px; top: 355px; left: 186px;}
.topanime_type1_b5_1 {width: 150px; height: 116px; top: 84px; left: 24px;}
.topanime_type1_b5_2 {width: 150px; height: 116px; top: 172px; left: 24px;}
.topanime_type1_b5_3 {width: 150px; height: 116px; top: 256px; left: 24px;}
.topanime_type1_b5_4 {width: 150px; height: 130px; top: 339px; left: 24px;}
.topanime_type1_a1 {position: absolute; width: 148px; height: 36px; top: 144px; left: 25px; text-align: center;}
.topanime_type1_a2 {position: absolute; width: 148px; height: 36px; top: 228px; left: 25px; font-size: 0; text-align: center;}
.topanime_type1_a3 {position: absolute; width: 148px; height: 36px; top: 355px; left: 25px; font-size: 0; text-align: center;}
.topanime_type1_a4 {position: absolute; width: 470px; height: 80px; top: 435px; left: 130px;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
color: #263347;
font-size: 190%;
line-height: 4.5rem;
text-align: center;
box-sizing: border-box;
}
.topanime_type1_circlebox > div{
position: absolute;
background-size: 100% 100%;
background-repeat: no-repeat;
}
.topanime_type1_circlebox > div:nth-of-type(1) {background-image: url(../images/result/type/res_type1_circle1.png);}
.topanime_type1_circlebox > div:nth-of-type(2) {background-image: url(../images/result/type/res_type1_circle2.png);}
.topanime_type1_circlebox > div:nth-of-type(3) {background-image: url(../images/result/type/res_type1_circle3.png);}
.topanime_type1_circlebox > div:nth-of-type(4) {background-image: url(../images/result/type/res_type1_circle4.png);}
.topanime_type1_circlebox > div:nth-of-type(1).topanime_type1_a4{background-image: url(../images/result/type/res_type1_circle1_l.png);}
.topanime_type1_circlebox > div:nth-of-type(2).topanime_type1_a4{background-image: url(../images/result/type/res_type1_circle2_l.png);}
.topanime_type1_circlebox > div:nth-of-type(3).topanime_type1_a4{background-image: url(../images/result/type/res_type1_circle3_l.png);}
.topanime_type1_circlebox > div:nth-of-type(4).topanime_type1_a4{background-image: url(../images/result/type/res_type1_circle4_l.png);}
img.topanime_type1_img1 {
display: inline-block;
position: static;
width: 28px;
height: 36px;
}
img.topanime_type1_img2 {
display: inline-block;
position: static;
width: 60px;
height: 36px;
}
img.topanime_type1_img3 {
display: inline-block;
position: static;
width: 18px;
height: 36px;
margin: 0 -5px;
}
.topanime_type1_p1, .topanime_type1_p2, .topanime_type1_p3 {
display: block;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
color: #eea;
font-size: 140%;
line-height: 150%;
width: 740px;
margin: 0px auto 0px;
text-align: center;
letter-spacing: -0.05em;
background: url(../images/result/type/res_type1_p1.jpg) repeat-y;
background-size: 100% 100%;
}
.topanime_type1_p1:before {
content: "";
display: block;
width: 740px;
height: 50px;
margin: 0 0 6px;
background: url(../images/result/type/res_type1_p1_before.jpg) no-repeat;
background-size: 100% 100%;
}
.topanime_type1_p1:after {
content: "";
display: block;
width: 740px;
height: 30px;
margin: 16px 0 0;
background: url(../images/result/type/res_type1_p1_after.jpg) no-repeat;
background-size: 100% 100%;
}
.topanime_type1_p1.strong {
color: #ff3;
font-size: 200%;letter-spacing: 0.1em;
}
.topanime_type1_p1.blanck { margin-bottom: 74px; }
.topanime_type1_p2 { color: #cdf; }
.topanime_type1_p3 {
color: #fea;
background: none;
font-size: 140%;
line-height: 200%;
margin: -1px auto;
padding: 20px 0 0;
}
.topanime_type1_p1 strong {
color: #A2FF87;
}
.topanime_type1_p3 strong {
color: #cfe;
font-size: 140%;
}
.res_rec_bg > .topanime_type1_p1 {
margin: 0 auto 0;
}
/* ----------------------
* result_type1
*---------------------- */
/* ----------------------
* result_type2
*---------------------- */
.topanime_type2_box1 {
position: relative;
width: 770px;
height: 660px;
margin: 0 auto;
overflow: hidden;
box-shadow: 0 0 10px #8fb3c8;
}
.topanime_type2_bg1 {
position: relative;
width: 770px;
height: 660px;
background: url(../images/result/type/res_type2_bg1.jpg) no-repeat;
background-size: 100% 100%;
margin: 0 auto;
}
.topanime_type2_box1 img {
display: block;
position: absolute;
}
.topanime_type2_box1 p {
position: absolute;
color: #263347;
font-size: 22px;
text-align: center;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-weight: normal;
line-height: 2.4rem;
}
.topanime_type2_namebox {
width: 840px;
height: 20px;
margin: 0 auto;
position: relative;
}
.topanime_type2_namebox span {
width: 200px;
display: block;
position: absolute;
font-size: 22px;
text-align: center;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-weight: normal;
line-height: 0;
letter-spacing: -0.04em;
color: #263347;
}
.topanime_type2_namebox span:nth-of-type(1){ left: 60px; }
.topanime_type2_namebox span:nth-of-type(2){ right: 60px; }
.topanime_type2_name1 {width: 105px; height: 40px; top: 20px; left: 75px;}
.topanime_type2_name2 {width: 105px; height: 40px; top: 227px; left: 75px;}
.topanime_type2_name3 {width: 105px; height: 40px; top: 436px; left: 75px;}
.topanime_type2_name4 {width: 105px; height: 40px; top: 20px; left: 590px;}
.topanime_type2_name5 {width: 105px; height: 40px; top: 227px; left: 590px;}
.topanime_type2_name6 {width: 105px; height: 40px; top: 436px; left: 590px;}
.topanime_type2_b1_1 {width: 90px; height: 81px; top: 478px; left: 81px;}
.topanime_type2_b1_2 {width: 90px; height: 81px; top: 269px; left: 81px;}
.topanime_type2_b1_3 {width: 90px; height: 81px; top: 63px; left: 81px;}
.topanime_type2_b1_4 {width: 90px; height: 81px; top: 478px; left: 600px;}
.topanime_type2_b1_5 {width: 90px; height: 81px; top: 269px; left: 600px;}
.topanime_type2_b1_6 {width: 90px; height: 81px; top: 63px; left: 600px;}
.topanime_type2_b2_1 {width: 90px; height: 81px; top: 562px; left: 81px;}
.topanime_type2_b2_2 {width: 90px; height: 81px; top: 354px; left: 81px;}
.topanime_type2_b2_3 {width: 90px; height: 81px; top: 145px; left: 81px;}
.topanime_type2_b2_4 {width: 90px; height: 81px; top: 562px; left: 600px;}
.topanime_type2_b2_5 {width: 90px; height: 81px; top: 354px; left: 600px;}
.topanime_type2_b2_6 {width: 90px; height: 81px; top: 145px; left: 600px;}
.topanime_type2_circlebox > div{
position: absolute;
width: 770px;
height: 120px;
background-size: 100% 100%;
background-repeat: no-repeat;
display: flex;
justify-content: center;
align-items: center;
}
.topanime_type2_circlebox > div:nth-of-type(1) { background-image: url(../images/result/type/res_type2_circle1.png);}
.topanime_type2_circlebox > div:nth-of-type(2) { background-image: url(../images/result/type/res_type2_circle2.png);}
.topanime_type2_circlebox > div:nth-of-type(3) { background-image: url(../images/result/type/res_type2_circle3.png);}
.topanime_type2_circlebox > div:nth-of-type(4) { background-image: url(../images/result/type/res_type2_circle4.png);}
.topanime_type2_circlebox > div span{
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
width: 400px;
font-size: 140%;
line-height: 1.9rem;
text-align: center;
}
.topanime_type2_circlebox > div:nth-of-type(1) span{color: #da4a4a;}
.topanime_type2_circlebox > div:nth-of-type(2) span{color: #534fb5;}
.topanime_type2_circlebox > div:nth-of-type(3) span{color: #507e3d;}
.topanime_type2_circlebox > div:nth-of-type(4) span{color: #8c7d40;}
.topanime_type2_b3_1{left: 0px; top: 40px;}
.topanime_type2_b3_2{left: 0px; top: 123px;}
.topanime_type2_b3_3{left: 0px; top: 248px;}
.topanime_type2_b3_4{left: 0px; top: 331px;}
.topanime_type2_b3_5{left: 0px; top: 455px;}
.topanime_type2_b3_6{left: 0px; top: 540px;}
/* ----------------------
* result_type2
*---------------------- */
/* ----------------------
* result_type3
*---------------------- */
.topanime_type3_bg1{
width: 770px;
height: 550px;
margin: 0 auto 20px;
background: url(../images/result/type/res_type3_bg.jpg) no-repeat;
background-size: 100% 100%;
position: relative;
box-shadow: 0 0 10px #8fb3c8;
}
.topanime_type3_bg1.cate1 div.graph{
width: 720px;
height: 550px;
background: url(../images/result/type/res_type3_graph1.png);
background-size: 100% 100%;
position: absolute;
left: 25px;
top: 0;
}
.topanime_type3_bg1.cate2 div.graph{
width: 720px;
height: 550px;
background: url(../images/result/type/res_type3_graph2.png);
background-size: 100% 100%;
position: absolute;
left: 25px;
top: 0;
}
.topanime_type3_bg1.cate3 div.graph{
width: 720px;
height: 550px;
background: url(../images/result/type/res_type3_graph3.png);
background-size: 100% 100%;
position: absolute;
left: 25px;
top: 0;
}
.topanime_type3_bg1.cate4 div.graph{
width: 720px;
height: 550px;
background: url(../images/result/type/res_type3_graph4.png);
background-size: 100% 100%;
position: absolute;
left: 25px;
top: 0;
}
.topanime_type3_bg1 div.graph.topanime_type3_s01{background-position: 0 0;}
.topanime_type3_bg1 div.graph.topanime_type3_s02{background-position: -60px 0;}
.topanime_type3_bg1 div.graph.topanime_type3_s03{background-position: -120px 0;}
.topanime_type3_bg1 div.graph.topanime_type3_s04{background-position: -180px 0;}
.topanime_type3_bg1 div.graph.topanime_type3_s05{background-position: -240px 0;}
.topanime_type3_bg1 div.graph.topanime_type3_s06{background-position: -300px 0;}
.topanime_type3_bg1 div.graph.topanime_type3_s07{background-position: -360px 0;}
.topanime_type3_bg1 div.graph.topanime_type3_s08{background-position: -420px 0;}
.topanime_type3_bg1 div.graph.topanime_type3_s09{background-position: -480px 0;}
.topanime_type3_bg1 div.graph.topanime_type3_s10{background-position: -540px 0;}
.topanime_type3_bg1 div.graph.topanime_type3_s11{background-position: -600px 0;}
.topanime_type3_bg1 div.graph.topanime_type3_s12{background-position: -660px 0;}
.topanime_type3_year{
width: 720px;
height: 30px;
position: absolute;
left: 25px;
top: 415px;
display: flex;
}
.topanime_type3_year span{
width: 60px;
color: #263347;
font-size: 115%;
text-align: center;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-weight: normal;
line-height: 1rem;
}
[class^="topanime_type3_point"]{
width: 50px;
height: 480px;
}
.topanime_type3_point1{ box-sizing: border-box; border: 3px solid #0f7b00; background-color: rgba(252,255,0,0.3);}
.topanime_type3_point2{ box-sizing: border-box; border: 3px solid #ffde00; background-color: rgba(252,255,0,0.3);}
.topanime_type3_point3{ box-sizing: border-box; border: 3px solid #da4a4a; background-color: rgba(252,255,0,0.3);}
.topanime_type3_point4{ box-sizing: border-box; border: 3px solid #ff6224; background-color: rgba(252,255,0,0.3);}
.topanime_type3_point5{ box-sizing: border-box; border: 3px solid #2761c1; background-color: rgba(252,255,0,0.3);}
.topanime_type3_p1{position: absolute; left: 30px; top: 35px;}
.topanime_type3_p2{position: absolute; left: 90px; top: 35px;}
.topanime_type3_p3{position: absolute; left: 150px; top: 35px;}
.topanime_type3_p4{position: absolute; left: 210px; top: 35px;}
.topanime_type3_p5{position: absolute; left: 270px; top: 35px;}
.topanime_type3_p6{position: absolute; left: 330px; top: 35px;}
.topanime_type3_p7{position: absolute; left: 390px; top: 35px;}
.topanime_type3_p8{position: absolute; left: 450px; top: 35px;}
.topanime_type3_p9{position: absolute; left: 510px; top: 35px;}
.topanime_type3_p10{position: absolute; left: 570px; top: 35px;}
.topanime_type3_p11{position: absolute; left: 630px; top: 35px;}
.topanime_type3_p12{position: absolute; left: 690px; top: 35px;}
/* ----------------------
* result_type3
*---------------------- */
/* ----------------------
* animation
*---------------------- */
@keyframes fadein {
0% {opacity: 0;}
100% {opacity: 1;}
}
@keyframes fadeout {
0% {opacity: 1;}
100% {opacity: 0;}
}
@keyframes fadein2 {
0% {opacity: 0; transform: scale(1.2);}
100% {opacity: 1; transform: scale(1.0);}
}
@keyframes fadeinout {
0% {opacity: 0;}
50% {opacity: 1;}
100% {opacity: 0;}
}
.free_scroll_box {
margin-top: 20px;
overflow: hidden;
display: none;
}
.topanime_type1_circlebox div,
.topanime_type2_circlebox div,
.topanime_type2_circlebox div span,
[class^="topanime_type3_point"] {
opacity: 0;
}
.t_anime1 .topanime_type1_circlebox div {animation:fadein2 1.0s ease 0s 1 forwards;}
.t_anime1 .topanime_type1_circlebox div:nth-of-type(1) {animation-delay: 0.3s;}
.t_anime1 .topanime_type1_circlebox div:nth-of-type(2) {animation-delay: 0.7s;}
.t_anime1 .topanime_type1_circlebox div:nth-of-type(3) {animation-delay: 1.1s;}
.t_anime1 .topanime_type1_circlebox div:nth-of-type(4) {animation-delay: 1.5s;}
.t_anime2 .topanime_type2_circlebox div {animation:fadein2 1.0s ease 0s 1 forwards;}
.t_anime2 .topanime_type2_circlebox div:nth-of-type(1) {animation-delay: 0.3s;}
.t_anime2 .topanime_type2_circlebox div:nth-of-type(2) {animation-delay: 0.7s;}
.t_anime2 .topanime_type2_circlebox div:nth-of-type(3) {animation-delay: 1.1s;}
.t_anime2 .topanime_type2_circlebox div:nth-of-type(4) {animation-delay: 1.5s;}
.t_anime2 .topanime_type2_circlebox div span {animation:fadein 1.0s linear 2.0s 1 forwards;}
.t_anime3 [class^="topanime_type3_point"] {animation:fadein2 1.0s ease 0s 1 forwards;}
.t_anime3 .topanime_type3_point1 {animation-delay: 0.3s;}
.t_anime3 .topanime_type3_point2 {animation-delay: 0.5s;}
.t_anime3 .topanime_type3_point3 {animation-delay: 0.7s;}
.t_anime3 .topanime_type3_point4 {animation-delay: 0.9s;}
.t_anime3 .topanime_type3_point5 {animation-delay: 1.1s;}
/* ----------------------
* result_type1
*---------------------- */
.res_type1_box1 {
position: relative;
width: 770px;
margin: 0 auto;
overflow: hidden;
}
.res_type1_bg1 {
width: 770px;
height: 550px;
margin: 0 auto -1px;
background: url(../images/result/type/res_type1_bg1.jpg) no-repeat;
background-size: 100% 100%;
}
.res_type1_txt1 {
position: absolute;
width: 770px;
height: 520px;
margin: 0 auto -1px;
background: url(../images/result/type/res_type1_txt1.png) no-repeat;
background-size: 100% 100%;
top: 0;
left: 0;
}
.res_type1_bg2 {
width: 770px;
margin: 0 auto -1px;
background: url(../images/result/type/res_type1_bg2.jpg) no-repeat;
background-size: 100% 100%;
}
.res_type1_bg3 {
width: 770px;
height: 70px;
margin: 0 auto;
background: url(../images/result/type/res_type1_bg3.jpg) no-repeat;
background-size: 100% 100%;
}
.res_type1_box1 img {
display: block;
position: absolute;
}
.res_type1_box1 p {
position: absolute;
color: #263347;
font-size: 22px;
text-align: center;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-weight: normal;
line-height: 0;
letter-spacing: -0.04em;
}
.res_type1_box1 .res_type1_bg2 p {
display: block;
position: static;
width: 700px;
margin: 0 auto;
line-height: 160%;
}
.res_type1_name1 {width: 140px; height: 60px; top: 69px; left: 580px;}
.res_type1_name2 {width: 140px; height: 60px; top: 69px; left: 428px;}
.res_type1_name3 {width: 140px; height: 60px; top: 69px; left: 298px;}
.res_type1_name4 {width: 140px; height: 60px; top: 69px; left: 168px;}
.res_type1_name5 {width: 140px; height: 60px; top: 69px; left: 30px;}
.res_type1_b1_1 {width: 100px; height: 90px; top: 98px; left: 623px;}
.res_type1_b1_2 {width: 100px; height: 90px; top: 98px; left: 560px;}
.res_type1_b1_3 {width: 100px; height: 90px; top: 98px; left: 492px;}
.res_type1_b1_4 {width: 100px; height: 90px; top: 98px; left: 428px;}
.res_type1_b1_5 {width: 100px; height: 90px; top: 98px; left: 362px;}
.res_type1_b1_6 {width: 100px; height: 90px; top: 98px; left: 298px;}
.res_type1_b1_7 {width: 100px; height: 90px; top: 98px; left: 230px;}
.res_type1_b1_8 {width: 100px; height: 90px; top: 98px; left: 166px;}
.res_type1_b2_1 {width: 100px; height: 90px; top: 182px; left: 623px;}
.res_type1_b2_2 {width: 100px; height: 90px; top: 182px; left: 560px;}
.res_type1_b2_3 {width: 100px; height: 90px; top: 182px; left: 492px;}
.res_type1_b2_4 {width: 100px; height: 90px; top: 182px; left: 428px;}
.res_type1_b2_5 {width: 100px; height: 90px; top: 182px; left: 362px;}
.res_type1_b2_6 {width: 100px; height: 90px; top: 182px; left: 298px;}
.res_type1_b2_7 {width: 100px; height: 90px; top: 182px; left: 230px;}
.res_type1_b2_8 {width: 100px; height: 90px; top: 182px; left: 166px;}
.res_type1_b3_1 {width: 100px; height: 90px; top: 264px; left: 623px;}
.res_type1_b3_2 {width: 100px; height: 90px; top: 264px; left: 560px;}
.res_type1_b3_3 {width: 100px; height: 90px; top: 264px; left: 492px;}
.res_type1_b3_4 {width: 100px; height: 90px; top: 264px; left: 428px;}
.res_type1_b3_5 {width: 100px; height: 90px; top: 264px; left: 362px;}
.res_type1_b3_6 {width: 100px; height: 90px; top: 264px; left: 298px;}
.res_type1_b3_7 {width: 100px; height: 90px; top: 264px; left: 230px;}
.res_type1_b3_8 {width: 100px; height: 90px; top: 264px; left: 166px;}
.res_type1_b4_1 {width: 100px; height: 90px; top: 355px; left: 581px;}
.res_type1_b4_2 {width: 100px; height: 90px; top: 355px; left: 450px;}
.res_type1_b4_3 {width: 100px; height: 90px; top: 355px; left: 318px;}
.res_type1_b4_4 {width: 100px; height: 90px; top: 355px; left: 186px;}
.res_type1_b5_1 {width: 150px; height: 116px; top: 84px; left: 24px;}
.res_type1_b5_2 {width: 150px; height: 116px; top: 172px; left: 24px;}
.res_type1_b5_3 {width: 150px; height: 116px; top: 256px; left: 24px;}
.res_type1_b5_4 {width: 150px; height: 130px; top: 339px; left: 24px;}
.res_type1_a1 {position: absolute; width: 148px; height: 36px; top: 144px; left: 25px; text-align: center;}
.res_type1_a2 {position: absolute; width: 148px; height: 36px; top: 228px; left: 25px; font-size: 0; text-align: center;}
.res_type1_a3 {position: absolute; width: 148px; height: 36px; top: 355px; left: 25px; font-size: 0; text-align: center;}
.res_type1_a4 {position: absolute; width: 470px; height: 80px; top: 435px; left: 130px; text-align: center;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 170%;
line-height: 4.5rem;
box-sizing: border-box;
color: #263347;
}
.res_type1_circlebox > div{
position: absolute;
background-size: 100% 100%;
background-repeat: no-repeat;
}
.res_type_none { display: none !important; }
.res_type1_circlebox > div:nth-of-type(1) { background-image: url(../images/result/type/res_type1_circle1.png);}
.res_type1_circlebox > div:nth-of-type(2) { background-image: url(../images/result/type/res_type1_circle2.png);}
.res_type1_circlebox > div:nth-of-type(3) { background-image: url(../images/result/type/res_type1_circle3.png);}
.res_type1_circlebox > div:nth-of-type(4) { background-image: url(../images/result/type/res_type1_circle4.png);}
.res_type1_circlebox > div:nth-of-type(1).res_type1_a4{ background-image: url(../images/result/type/res_type1_circle1_l.png);}
.res_type1_circlebox > div:nth-of-type(2).res_type1_a4{ background-image: url(../images/result/type/res_type1_circle2_l.png);}
.res_type1_circlebox > div:nth-of-type(3).res_type1_a4{ background-image: url(../images/result/type/res_type1_circle3_l.png);}
.res_type1_circlebox > div:nth-of-type(4).res_type1_a4{ background-image: url(../images/result/type/res_type1_circle4_l.png);}
img.res_type1_img1 {
display: inline-block;
position: static;
width: 28px;
height: 36px;
}
img.res_type1_img2 {
display: inline-block;
position: static;
width: 60px;
height: 36px;
}
img.res_type1_img3 {
display: inline-block;
position: static;
width: 18px;
height: 36px;
margin: 0 -5px;
}
.res_type1_p1, .res_type1_p2, .res_type1_p3 {
display: block;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
color: #eea;
font-size: 140%;
line-height: 150%;
width: 740px;
margin: 0px auto 0px;
text-align: center;
letter-spacing: -0.05em;
background: url(../images/result/type/res_type1_p1.jpg) repeat-y;
background-size: 100% 100%;
}
.res_type1_p1:before {
content: "";
display: block;
width: 740px;
height: 50px;
margin: 0 0 6px;
background: url(../images/result/type/res_type1_p1_before.jpg) no-repeat;
background-size: 100% 100%;
}
.res_type1_p1:after {
content: "";
display: block;
width: 740px;
height: 30px;
margin: 16px 0 0;
background: url(../images/result/type/res_type1_p1_after.jpg) no-repeat;
background-size: 100% 100%;
}
.res_type1_p1.strong {
color: #ff3;
font-size: 200%;letter-spacing: 0.1em;
}
.res_type1_p1.blanck {
margin-bottom: 74px;
}
.res_type1_p2 {
color: #cdf;
}
.res_type1_p3 {
color: #fea;
background: none;
font-size: 140%;
line-height: 200%;
margin: -1px auto;
padding: 20px 0 0;
}
.res_type1_p1 strong {
color: #A2FF87;
}
.res_type1_p3 strong {
color: #cfe;
font-size: 140%;
}
.res_rec_bg > .res_type1_p1 {
margin: 0 auto 0;
}
/* ----------------------
* result_type1
*---------------------- */
/* ----------------------
* result_type2
*---------------------- */
.res_type2_box1 {
position: relative;
width: 770px;
height: 660px;
margin: 0 auto;
overflow: hidden;
box-shadow: 0 0 10px #8fb3c8;
}
.res_type2_bg1 {
position: relative;
width: 770px;
height: 660px;
background: url(../images/result/type/res_type2_bg1.jpg) no-repeat;
background-size: 100% 100%;
margin: 0 auto;
}
.res_type2_box1 img {
display: block;
position: absolute;
}
.res_type2_box1 p {
position: absolute;
color: #263347;
font-size: 22px;
text-align: center;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-weight: normal;
line-height: 2.4rem;
}
.res_type2_name1 {width: 105px; height: 40px; top: 20px; left: 75px;}
.res_type2_name2 {width: 105px; height: 40px; top: 227px; left: 75px;}
.res_type2_name3 {width: 105px; height: 40px; top: 436px; left: 75px;}
.res_type2_name4 {width: 105px; height: 40px; top: 20px; left: 590px;}
.res_type2_name5 {width: 105px; height: 40px; top: 227px; left: 590px;}
.res_type2_name6 {width: 105px; height: 40px; top: 436px; left: 590px;}
.res_type2_b1_1 {width: 90px; height: 81px; top: 478px; left: 81px;}
.res_type2_b1_2 {width: 90px; height: 81px; top: 269px; left: 81px;}
.res_type2_b1_3 {width: 90px; height: 81px; top: 63px; left: 81px;}
.res_type2_b1_4 {width: 90px; height: 81px; top: 478px; left: 600px;}
.res_type2_b1_5 {width: 90px; height: 81px; top: 269px; left: 600px;}
.res_type2_b1_6 {width: 90px; height: 81px; top: 63px; left: 600px;}
.res_type2_b2_1 {width: 90px; height: 81px; top: 562px; left: 81px;}
.res_type2_b2_2 {width: 90px; height: 81px; top: 354px; left: 81px;}
.res_type2_b2_3 {width: 90px; height: 81px; top: 145px; left: 81px;}
.res_type2_b2_4 {width: 90px; height: 81px; top: 562px; left: 600px;}
.res_type2_b2_5 {width: 90px; height: 81px; top: 354px; left: 600px;}
.res_type2_b2_6 {width: 90px; height: 81px; top: 145px; left: 600px;}
.res_type2_circlebox > div{
position: absolute;
width: 770px;
height: 120px;
background-size: 100% 100%;
background-repeat: no-repeat;
display: flex;
justify-content: center;
align-items: center;
}
.res_type2_circlebox > div:nth-of-type(1) { background-image: url(../images/result/type/res_type2_circle1.png);}
.res_type2_circlebox > div:nth-of-type(2) { background-image: url(../images/result/type/res_type2_circle2.png);}
.res_type2_circlebox > div:nth-of-type(3) { background-image: url(../images/result/type/res_type2_circle3.png);}
.res_type2_circlebox > div:nth-of-type(4) { background-image: url(../images/result/type/res_type2_circle4.png);}
.res_type2_circlebox > div span{
width: 400px;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 130%;
text-align: center;
line-height: 1.9rem;
}
.res_type2_circlebox > div:nth-of-type(1) span{color: #da4a4a;}
.res_type2_circlebox > div:nth-of-type(2) span{color: #534fb5;}
.res_type2_circlebox > div:nth-of-type(3) span{color: #507e3d;}
.res_type2_circlebox > div:nth-of-type(4) span{color: #8c7d40;}
.res_type2_b3_1{left: 0px; top: 40px;}
.res_type2_b3_2{left: 0px; top: 123px;}
.res_type2_b3_3{left: 0px; top: 248px;}
.res_type2_b3_4{left: 0px; top: 331px;}
.res_type2_b3_5{left: 0px; top: 455px;}
.res_type2_b3_6{left: 0px; top: 540px;}
/* ----------------------
* result_type2
*---------------------- */
/* ----------------------
* result_type3
*---------------------- */
.res_type3_bg1{
width: 770px;
height: 550px;
margin: 0 auto 20px;
background: url(../images/result/type/res_type3_bg.jpg) no-repeat;
background-size: 100% 100%;
position: relative;
box-shadow: 0 0 10px #8fb3c8;
}
.res_type3_graph{
width: 720px;
height: 550px;
position: absolute;
left: 25px;
top: 0;
}
.res_type3_graph img{
width: 60px;
height: 550px;
position: absolute;
top: 0;
}
.res_type3_graph img:nth-of-type(1){ left: 0px;}
.res_type3_graph img:nth-of-type(2){ left: 60px;}
.res_type3_graph img:nth-of-type(3){ left: 120px;}
.res_type3_graph img:nth-of-type(4){ left: 180px;}
.res_type3_graph img:nth-of-type(5){ left: 240px;}
.res_type3_graph img:nth-of-type(6){ left: 300px;}
.res_type3_graph img:nth-of-type(7){ left: 360px;}
.res_type3_graph img:nth-of-type(8){ left: 420px;}
.res_type3_graph img:nth-of-type(9){ left: 480px;}
.res_type3_graph img:nth-of-type(10){ left: 540px;}
.res_type3_graph img:nth-of-type(11){ left: 600px;}
.res_type3_graph img:nth-of-type(12){ left: 660px;}
/*
.res_type3_bg1.cate1 div.graph{
width: 720px;
height: 550px;
background: url(../images/result/type/res_type3_graph1.png);
background-size: 100% 100%;
position: absolute;
left: 25px;
top: 0;
}
.res_type3_bg1.cate2 div.graph{
width: 720px;
height: 550px;
background: url(../images/result/type/res_type3_graph2.png);
background-size: 100% 100%;
position: absolute;
left: 25px;
top: 0;
}
.res_type3_bg1.cate3 div.graph{
width: 720px;
height: 550px;
background: url(../images/result/type/res_type3_graph3.png);
background-size: 100% 100%;
position: absolute;
left: 25px;
top: 0;
}
.res_type3_bg1.cate4 div.graph{
width: 720px;
height: 550px;
background: url(../images/result/type/res_type3_graph4.png);
background-size: 100% 100%;
position: absolute;
left: 25px;
top: 0;
}*/
.res_type3_bg1 div.graph.res_type3_s01{ background-position: 0 0;}
.res_type3_bg1 div.graph.res_type3_s02{ background-position: -60px 0;}
.res_type3_bg1 div.graph.res_type3_s03{ background-position: -120px 0;}
.res_type3_bg1 div.graph.res_type3_s04{ background-position: -180px 0;}
.res_type3_bg1 div.graph.res_type3_s05{ background-position: -240px 0;}
.res_type3_bg1 div.graph.res_type3_s06{ background-position: -300px 0;}
.res_type3_bg1 div.graph.res_type3_s07{ background-position: -360px 0;}
.res_type3_bg1 div.graph.res_type3_s08{ background-position: -420px 0;}
.res_type3_bg1 div.graph.res_type3_s09{ background-position: -480px 0;}
.res_type3_bg1 div.graph.res_type3_s10{ background-position: -540px 0;}
.res_type3_bg1 div.graph.res_type3_s11{ background-position: -600px 0;}
.res_type3_bg1 div.graph.res_type3_s12{ background-position: -660px 0;}
.res_type3_year{
width: 720px;
height: 30px;
position: absolute;
left: 25px;
top: 415px;
display: flex;
}
.res_type3_year span{
width: 60px;
color: #263347;
font-size: 96%;
text-align: center;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-weight: normal;
line-height: 1rem;
}
[class^="res_type3_point"]{
width: 50px;
height: 480px;
}
.res_type3_point1{ box-sizing: border-box; border: 3px solid #00a945; background-color: rgba(0,238,92,0.2);}
.res_type3_point2{ box-sizing: border-box; border: 3px solid #ffde00; background-color: rgba(252,255,0,0.2);}
.res_type3_point3{ box-sizing: border-box; border: 3px solid #da4a4a; background-color: rgba(218,74,74,0.2);}
.res_type3_point4{ box-sizing: border-box; border: 3px solid #ff9b24; background-color: rgba(255,155,36,0.2);}
.res_type3_point5{ box-sizing: border-box; border: 3px solid #2761c1; background-color: rgba(39,97,183,0.2);}
.res_type3_p1{position: absolute; left: 30px; top: 35px;}
.res_type3_p2{position: absolute; left: 90px; top: 35px;}
.res_type3_p3{position: absolute; left: 150px; top: 35px;}
.res_type3_p4{position: absolute; left: 210px; top: 35px;}
.res_type3_p5{position: absolute; left: 270px; top: 35px;}
.res_type3_p6{position: absolute; left: 330px; top: 35px;}
.res_type3_p7{position: absolute; left: 390px; top: 35px;}
.res_type3_p8{position: absolute; left: 450px; top: 35px;}
.res_type3_p9{position: absolute; left: 510px; top: 35px;}
.res_type3_p10{position: absolute; left: 570px; top: 35px;}
.res_type3_p11{position: absolute; left: 630px; top: 35px;}
.res_type3_p12{position: absolute; left: 690px; top: 35px;}
/* ----------------------
* result_type3
*---------------------- */
/* ----------------------
* result_type4
*---------------------- */
.res_type4_trial1 {
width: 770px;
height: 450px;
margin: 0 auto;
background: url(../images/result/type/res_type4_trial1.jpg) no-repeat;
background-size: 100% 100%;
}
.res_type4_trial2 {
width: 770px;
height: 510px;
margin: 0 auto;
background: url(../images/result/type/res_type4_trial2.jpg) no-repeat;
background-size: 100% 100%;
}
.res_type4_trial_btn_box {
width: 540px;
height: 140px;
margin: 0 auto;
padding: 270px 0 0;
}
.res_type4_trial_btn_box input {
width: 100%;
height: 100%;
cursor: pointer;
outline: 0;
}
.res_type4_bg1, .res_type4_bg2 {
width: 770px;
margin: 0 auto 20px;
padding: 0px 0px 60px;
color: #4b5369;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
font-size: 24px;
background-image: url(../images/result/type/res_type4_top.jpg), url(../images/result/type/res_type4_bt.jpg),url(../images/result/type/res_type4_bg.jpg);
background-repeat: no-repeat, no-repeat, repeat-y;
background-position: center top, center bottom, center top;
background-size: 100% auto, 100% auto, 100% auto;
}
.res_type4_table {
border-collapse: separate;
border-spacing: 2px;
text-align: center;
line-height: 100%;
width: 740px;
margin: 0 auto;
white-space: nowrap;
overflow: hidden;
}
.res_type4_table th {
width: 155px;
padding: 34px 10px 12px;
vertical-align: middle;
color: #25366b;
letter-spacing: 0.2em;
}
.res_type4_table td {
padding: 5px 10px;
vertical-align: middle;
background: #000;
}
.res_type4_table tr:nth-child(odd) td {
background: url(../images/result/type/res_type4_td1.jpg) repeat;
}
.res_type4_table tr:nth-child(odd) td:nth-child(odd) {
background: url(../images/result/type/res_type4_td2.jpg) repeat;
}
.res_type4_table tr:nth-child(even) td {
background: url(../images/result/type/res_type4_td3.jpg) repeat;
}
.res_type4_table tr:nth-child(even) td:nth-child(odd) {
background: url(../images/result/type/res_type4_td4.jpg) repeat;
}
.res_type4_table td.res_type4_td1{ background: url(../images/result/type/res_type4_td7.jpg) repeat !important;}
.res_type4_table td.res_type4_td2{ background: url(../images/result/type/res_type4_td8.jpg) repeat !important;}
.res_type4_table td.res_type4_td3{ background: url(../images/result/type/res_type4_td9.jpg) repeat !important;}
.res_type4_table td.res_type4_td4{ background: url(../images/result/type/res_type4_td10.jpg) repeat !important;}
.res_type4_table tr.res_type4_red td {
background: url(../images/result/type/res_type4_td5.jpg) repeat !important;
color: #ff0;
}
.res_type4_table tr.res_type4_red td:nth-child(odd) {
background: url(../images/result/type/res_type4_td6.jpg) repeat !important;
}
/* ----------------------
* result_type4
*---------------------- */
/* ----------------------
* animation
*---------------------- */
.res_type1_circlebox div,
.res_type2_circlebox div,
.res_type2_circlebox div span,
[class^="res_type3_point"],
.res_type4_table tbody tr td span {
opacity: 0;
}
.anime1 .res_type1_circlebox div {animation:fadein2 1.0s ease 0s 1 forwards;}
.anime1 .res_type1_circlebox div:nth-of-type(1) {animation-delay: 0.3s;}
.anime1 .res_type1_circlebox div:nth-of-type(2) {animation-delay: 0.7s;}
.anime1 .res_type1_circlebox div:nth-of-type(3) {animation-delay: 1.1s;}
.anime1 .res_type1_circlebox div:nth-of-type(4) {animation-delay: 1.5s;}
.anime2 .res_type2_circlebox div {animation:fadein2 1.0s ease 0s 1 forwards;}
.anime2 .res_type2_circlebox div:nth-of-type(1) {animation-delay: 0.3s;}
.anime2 .res_type2_circlebox div:nth-of-type(2) {animation-delay: 0.7s;}
.anime2 .res_type2_circlebox div:nth-of-type(3) {animation-delay: 1.1s;}
.anime2 .res_type2_circlebox div:nth-of-type(4) {animation-delay: 1.5s;}
.anime2 .res_type2_circlebox div span {animation:fadein 1.0s linear 2.0s 1 forwards;}
.anime3 [class^="res_type3_point"] {animation:fadein2 1.0s ease 0s 1 forwards;}
.anime3 .res_type3_point1 {animation-delay: 0.3s;}
.anime3 .res_type3_point2 {animation-delay: 0.5s;}
.anime3 .res_type3_point3 {animation-delay: 0.7s;}
.anime3 .res_type3_point4 {animation-delay: 0.9s;}
.anime3 .res_type3_point5 {animation-delay: 1.1s;}
.anime4 .res_type4_table tbody tr td span {animation:fadein 0.5s linear 0s 1 forwards;}
.anime4 .res_type4_table tbody tr:nth-of-type(1) td span {animation-delay: 0.3s;}
.anime4 .res_type4_table tbody tr:nth-of-type(2) td span {animation-delay: 0.4s;}
.anime4 .res_type4_table tbody tr:nth-of-type(3) td span {animation-delay: 0.5s;}
.anime4 .res_type4_table tbody tr:nth-of-type(4) td span {animation-delay: 0.6s;}
.anime4 .res_type4_table tbody tr:nth-of-type(5) td span {animation-delay: 0.7s;}
.anime4 .res_type4_table tbody tr:nth-of-type(6) td span {animation-delay: 0.8s;}
.anime4 .res_type4_table tbody tr:nth-of-type(7) td span {animation-delay: 0.9s;}
.anime4 .res_type4_table tbody tr:nth-of-type(8) td span {animation-delay: 1.0s;}
.anime4 .res_type4_table tbody tr:nth-of-type(9) td span {animation-delay: 1.1s;}
.anime4 .res_type4_table tbody tr:nth-of-type(10) td span {animation-delay: 1.2s;}
.anime4 .res_type4_table tbody tr:nth-of-type(11) td span {animation-delay: 1.3s;}
.top_intro_textbox {
background-color: #6e8797;
margin: 20px auto;
padding: 20px 30px;
max-width: 760px;
color: #fff;
font-size: 110%;
line-height: 1.7em;
border-radius: 10px;
box-sizing: border-box;
}
.result-container .top_intro_textbox { max-width: 800px; }
.top_intro_textbox strong { color: #fae150; font-size: 120%; font-weight: bold; }
/*######### blur #########*/
.free-container .blur {
background: transparent url(../images/result/blur/text_img_m3.png) no-repeat center top;
background-size: 100%;
position: relative;
margin-top: 10px;
padding-top: 65px;
height: 155px;
}
.free-container .secMsg .blur {
background: transparent url(../images/result/blur/text_img_m2.png) no-repeat center top;
background-size: 100%;
position: relative;
margin-top: 10px;
padding-top: 65px;
height: 130px;
}
.free-container .blur a {
display: table;
margin: 0 auto;
text-decoration: none;
}
/*######### blur End #########*/
/*########################## result-container End ##########################*/
.info-container .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;
}
.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 {
margin: 0 auto;
padding: 0;
max-width: 620px;
}
.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;
margin: 0 auto 10px;
padding: 620px 150px 100px;
}
.secCont.secIntro {
background: transparent center top;
background-image: url(../images/top/introTop.jpg),url(../images/top/introBg.jpg);
background-repeat: no-repeat,repeat-y;
padding: 446px 20px 10px;
}
.secCont.secIntro .introRecommProd { text-align: center; }
.secCont.secIntro .introRecommProd a {
color: #fbc3f1;
text-align: center;
}
.secCont.secIntro .introRecommProd .title { font-size: 0.9em; line-height: 1.8em; }
.introSummary {
display: table;
margin: 0 auto;
}
.introSummary .introSummBtn {
background: transparent no-repeat center top;
display: inline-table;
width: 410px;
height: 160px;
text-indent: -9999px;
}
.introSummary .introSummBtn:hover { background-position: center bottom; }
.introSummary .introSummBtn.introSummBtn1 { background-image: url(../images/top/introBtn1.jpg); }
.introSummary .introSummBtn.introSummBtn2 { background-image: url(../images/top/introBtn2.jpg); }
.secCont.secSpecial {
background: transparent;
background-image: url(../images/top/spTop.jpg),url(../images/top/spBtm.jpg),url(../images/top/spBg.jpg);
background-repeat: no-repeat,no-repeat,repeat-y;
background-position: center top,center bottom,center top;
position: relative;
margin: 0 auto 10px;
padding: 610px 120px 110px;
}
.secCont.secSpecial .spCatch {
background: transparent;
background-image: url(../images/top/boxTop.png),url(../images/top/boxBtm.png),url(../images/top/boxBg.png);
background-repeat: no-repeat,no-repeat,repeat-y;
background-position: center top,center bottom,center top;
margin: 20px auto;
padding: 20px;
color: #fff;
font-weight: bold;
text-align: center;
}
.secCont.secReview {
background: transparent;
background-image: url(../images/top/reviewTop.jpg),url(../images/top/reviewBtm.jpg),url(../images/top/reviewBg.jpg);
background-repeat: no-repeat,no-repeat,repeat-y;
background-position: center top,center bottom,center top;
position: relative;
margin: 0 auto 10px;
padding: 410px 120px 110px;
}
.secCont.secReview .reviewTitle {
background: transparent;
background-image: url(../images/top/boxTop.png),url(../images/top/boxBtm.png),url(../images/top/boxBg.png);
background-position: center top,center bottom,center top;
background-repeat: no-repeat,no-repeat,repeat-y;
background-size: 100%;
margin-bottom: 10px;
padding: 20px;
color: #fff;
font-size: 1.1em;
font-weight: bold;
text-align: center;
}
.secCont.secReview .reviewMessage {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
background: transparent url(../images/top/reviewImg1.png) no-repeat left top;
margin-bottom: 30px;
padding-top: 10px;
padding-left: 130px;
color: #004477;
font-size: 1.2em;
font-weight: bold;
text-shadow: 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF;
-webkit-text-shadow: 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF;
-moz-text-shadow: 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF, 0px 0px 5px #FFFFFF
}
.secCont.secReview .reviewerInfo {
font-size: 0.8em;
text-align: right;
}
.secCont.secReview .reviewBlock {
background-color: #ffd;
margin-bottom: 20px;
padding: 16px 30px;
font-size: 0.8em;
font-weight: bold;
line-height: 1.5em;
box-shadow: 0px 0px 10px #fff inset;
border: 1px solid #cc6666;
}
.secCont.secReview .reviewComment { margin-bottom: 20px; padding: 0 20px; font-size: 0.9em; }
.secCont.secReview .reviewComment span { color: #D90003; font-weight: bold; }
.secCont.secReview .reviewQuestion {
background: #034488;
display: block;
margin: 12px auto;
padding: 8px 20px;
color: #fff;
font-size: 1em;
font-weight: bold;
border-radius: 10px;
}
.secCont.secReview .reviewBlock span { display: none; }
.secCont.secReview .reviewLink { color: #900; }
.secCont.secReview .readmoreButton {
background: #03A9F4;
position: relative;
display: inline;
top: 4px;
margin-top: 10px;
padding: 5px 15px;
color: #fff;
font-size: 0.85em;
font-weight: bold;
text-decoration: none;
text-shadow: 0 1px 0 rgba(0,0,0,0.2);
box-shadow: inset 1px 1px 0 rgba(255,255,255,0.4);
border: solid 1px #0f9ada;
border-radius: 6px;
}
.secCont.secReview .closeButton { display: none; }
.top-container .secCont .secList {
background: transparent;
background-repeat: no-repeat,no-repeat,repeat-y;
background-position: center top,center bottom,center top;
position: relative;
margin: 0 auto 10px;
padding: 220px 90px 70px;
}
.top-container .secCont .secList.secLove { background-image: url(../images/top/cateTop1.jpg),url(../images/top/cateBtm1.jpg),url(../images/top/cateBg1.jpg); }
.top-container .secCont .secList.secMarry { background-image: url(../images/top/cateTop2.jpg),url(../images/top/cateBtm2.jpg),url(../images/top/cateBg2.jpg); }
.top-container .secCont .secList.secLife { background-image: url(../images/top/cateTop3.jpg),url(../images/top/cateBtm3.jpg),url(../images/top/cateBg3.jpg); }
.top-container .secCont .secList .ichiInner {
background: transparent;
background-repeat: no-repeat,no-repeat,repeat-y;
background-position: center top,center bottom,center top;
padding: 60px 80px 30px;
}
.top-container .secCont .secList.secLove .ichiInner { background-image: url(../images/top/cateSpTop1.jpg),url(../images/top/cateSpBtm1.jpg),url(../images/top/cateSpBg1.jpg); }
.top-container .secCont .secList.secMarry .ichiInner { background-image: url(../images/top/cateSpTop2.jpg),url(../images/top/cateSpBtm2.jpg),url(../images/top/cateSpBg2.jpg); }
.top-container .secCont .secList.secLife .ichiInner { background-image: url(../images/top/cateSpTop3.jpg),url(../images/top/cateSpBtm3.jpg),url(../images/top/cateSpBg3.jpg); }
.top-container .secCont .secList .secInnerInfo {
background: transparent;
background-repeat: no-repeat,no-repeat,repeat-y;
background-position: left top,left bottom,left top;
display: flex;
flex-wrap: wrap;
margin-bottom: -20px;
padding: 50px 0 45px;
}
.top-container .secCont .secList.secLove .secInnerInfo { background-image: url(../images/top/cateInrTop1.jpg),url(../images/top/cateInrBtm1.jpg),url(../images/top/cateInrBg1.jpg); }
.top-container .secCont .secList.secMarry .secInnerInfo { background-image: url(../images/top/cateInrTop3.jpg),url(../images/top/cateInrBtm3.jpg),url(../images/top/cateInrBg3.jpg); }
.top-container .secCont .secList.secLife .secInnerInfo { background-image: url(../images/top/cateInrTop5.jpg),url(../images/top/cateInrBtm5.jpg),url(../images/top/cateInrBg5.jpg); }
.top-container .secCont .secList .secInnerInfo .secInner {
flex: 0 0 41%;
padding: 0 30px;
}
.top-container .secCont .secList .secInnerInfo.singleInr { width: 49%; }
.top-container .secCont .secList .secInnerInfo.singleInr .secInner { flex: 0 0 84%; }
.top-container .secCont .cateTop {
padding: 0 100px;
text-align: right;
}
.top-container .secCont .cateTop a {
color: #e8ca22;
text-decoration: underline;
}
.top-container .secCont .cateTop a:hover { color: #c80; text-decoration: none; }
.top-container .secCont .cateTop a:visited { color: #c80; text-decoration: underline; }
.top-container .naviCate { display: table; margin: 20px auto 0; }
.top-container .naviCate .cateBtn {
background: transparent no-repeat center top;
display: inline-table;
width: 260px;
height: 90px;
}
.top-container .naviCate .cateBtn:hover { background-position: center bottom; }
.top-container .naviCate .cateBtn.cateLove { background-image: url(../images/top/cateNavi1.jpg); }
.top-container .naviCate .cateBtn.cateMarry { background-image: url(../images/top/cateNavi2.jpg); }
.top-container .naviCate .cateBtn.cateLife { background-image: url(../images/top/cateNavi3.jpg); }
.result-container .secYudo .yudo2 {
background: url(../images/result/resInfoTop14.jpg) no-repeat center top;
margin-top: 20px;
padding-top: 60px;
}
.result-container .secYudoMsg {
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
background: transparent;
background-image: url(../images/result/resMsgImg11.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.2em;
line-height: 1.8em;
}
.result-container .secYudoMsg { background-image: url(../images/result/resMsgImg8.jpg); }
.result-container .secListing .secYudo .listLast .secYudoMsg {
background-image: url(../images/result/resMsgImg7.jpg);
min-height: 390px;
}
.result-container .secListing .secYudo .listLast .secYudoMsg .float {
margin: 0 0 0 auto;
width: 440px;
}
.result-container .secYudoMsg .float {
background: url(../images/result/free/rsltBalloonBg.png) repeat;
background-size: 100% 100%;
margin: 0 auto 0 -30px;
padding: 10px 20px;
width: 470px;
border: 1px solid #553322;
border-radius: 10px;
}
.result-container .secYudoMsg .float strong { color: #ff3; }
.secYudo .yudoContent .yudoResult .listCommon,
.secYudo .yudoContent .yudoResult .listLast .secTitle,
.secYudo .yudoContent .yudoResult .listLast .secInfo {
margin: 0 auto;
max-width: 600px;
}
.result-container .secListing .secYudo .secInList .paragraph {
padding: 0;
}
.secYudo .komiInfo {
background: transparent;
background-image: url(../images/result/resBoxTop2.png), url(../images/result/resBoxBtm.png), url(../images/result/resBoxBg.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/result/free/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 {}
.top-container .secFree .productBtn {
background: transparent no-repeat center top;
display: table;
margin: 0 auto;
height: 250px;
width: 100%;
max-width: 700px;
}
.top-container .secFree .productBtn:hover { background-position: center bottom; }
.top-container .secFree .productBtn.bnkf01 { background-image: url(../images/top/freeBtn1.jpg); }
/*
.top-container .secFree .productBtn.bnk00 { background-image: url(../images/top/free/freeBtn2.jpg); }
.top-container .secFree .productBtn.bnk97 { background-image: url(../images/top/free/freeBtn3.jpg); }
*/
.top-container .secFree a:hover .productBtn { background-position: center bottom; }