@charset "utf-8";
body {
    background: #000;
}

body .m-nav-breadcrumb a,
body .m-nav-breadcrumb-sub a,
body .m-nav-breadcrumb-ctg a {
    color: #fff
}

.fadeOff {
    opacity: 0;
    transform:translateY(30px);
    transition:1s;
}
.fadeOn {
    transform: translateY(0);
    opacity: 1;
}

.fbox {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
}

.fbox.nowrap {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.fbox.bxstart {
  -webkit-box-pack: start;
     -ms-flex-pack: start;
   justify-content: flex-start;
}

.fbox.bxend {
  -webkit-box-pack: end;
     -ms-flex-pack: end;
   justify-content: flex-end;
}

.fbox.bxcenter {
  -webkit-box-pack: center;
     -ms-flex-pack: center;
   justify-content: center;
}

.fbox.alstart {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.fbox.alend {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.fbox.alcenter {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.fbox.albt {
  -ms-flex-line-pack: justify;
       align-content: space-between;
}

.fbox.linedist {
  -ms-flex-line-pack: distribute;
       align-content: space-around;
}

.pos0 {
  -webkit-box-ordinal-group: 1;
             -ms-flex-order: -1;
                      order: -1;
}

.block_01 {
    max-width: 960px;
    margin: 0 auto;
    position: relative;
}

.conts p {
    margin-top: 0
}

.conts .img100 {
    margin: 0
}

.conts .img100 img {
    width: 100%;
}

.conts .w1150 {
    max-width: 1150px;
    box-sizing: border-box;
    margin: 0 auto
}

.conts .fwb {
    font-weight: bold
}

.conts .fs14 {
    font-size: 1.4rem
}

.conts .fs16 {
    font-size: 1.6rem
}

.conts .fs18 {
    font-size: 1.8rem
}

.conts .fs20 {
    font-size: 2.0rem
}

.conts .fs22 {
    font-size: 2.2rem
}

.conts .fs24 {
    font-size: 2.4rem
}

.conts .fs26 {
    font-size: 2.6rem
}

.conts .fs28 {
    font-size: 2.8rem
}

.conts .fs30 {
    font-size: 3.0rem
}

.conts .fs34 {
    font-size: 3.4rem
}

.conts .mb50 {
    margin-bottom: 50px;
}
.conts .mb55 {
    margin-bottom: 55px;
}

.conts .mt10 {
    margin-top: calc((10/1000)*100%)
}

.conts .mt20 {
    margin-top: calc((20/1000)*100%)
}

.conts .mt30 {
    margin-top: calc((30/1000)*100%)
}

.conts .mt40 {
    margin-top: calc((40/1000)*100%)
}

.conts .part_btn {
    margin: 0 auto calc((15/1000)*100%);
    width: calc((480/1000)*100%);
    min-width: 300px
}

.conts .part_btn .a-space {
    margin-right: calc((20/1000)*100%)
}

.conts .bg_b {
    background: #000;
    color: #fff;
}

.sec {
    text-align: center;
}

.fadein {
    opacity: 0;
    transform: translateY(20px);
    transition: all 1s;
}

/*------------------------------------------------
　COMMON
------------------------------------------------*/
.conts {/* 星空用CSS */
}
.conts .bottomImg {
    text-align: center;
}
.conts .bottomImg p {
    width: 100%;
    max-width: 1200px;
    height: 210px;
    display: inline-block;
    background-image: url(../img/img_05.png);
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
}

.conts .bottomImg p img {
    display: none;
}


/*------------------------------------------------
　FOOTER
------------------------------------------------*/
.l-footer {
    display:none;
}
.compass_footer_inner {
    text-align:center;
    padding:30px 15px 75px;
    background:url(/campaign/star-compass/img/footimg.png) repeat-x center bottom 10px;
    background-size:80px auto;
}
.compass_footer-logo {
    display:block;
    width:232px;
    margin:0 auto 30px;
}
.compass_footer-link {
    width:calc(100% - 30px);
    max-width:1000px;
    margin:0 auto;
    line-height:1;
}
.compass_footer-link li:not(:last-child) {
  margin-right: 1em;
  padding-right: 1em;
  border-right: 1px solid #cccccc;
}
.compass_footer-link li a {
    color:#cccccc;
}
.compass_footer-link p {
    color:#cccccc;
    font-size:1.3rem;
    margin:0;
}


/*------------------------------------------------
　CONTENTS DISPLAY
------------------------------------------------*/
.conts.top .sec {
	transition:.75s;
	opacity: 0;
}
.conts.top .sec.top {
	transition:1s;
}
.conts.top .sec.show {
	opacity: 1;
}
.conts.top .sec:not(.active) {
	display: none;
}
.conts.top .sec:not(.clickable) label {
	pointer-events: none;
}
.conts.top .sec:not(.steps) {
	overflow: hidden;
}

/*------------------------------------------------
　TOP
------------------------------------------------*/
.conts.top {
    padding: 0;
}
.conts.top .sec {
    position: relative;
}
.sec.top p {
    margin-bottom: 20px;
    font-size: 18px;
    color: #FFFFFF;
}
.sec.top p + p {
    margin-bottom:30px;
}
.sec.top {
    background-image: url(../img/bg_02.png);
    background-repeat: no-repeat;
    background-position: top center;
    margin: 0 auto 20px;
    position: relative;
    text-align: center;
}
.sec.top .img01 {
    padding-top:20px;
    margin-bottom: 20px;
}
.sec.top .img01::before {
    content: '';
    display: block;
    width: 80px;
    height: 50px;
    position: absolute;
    background: url(/campaign/star-compass/img/plane.png) no-repeat center center;
    background-size: contain;
    top: 48px;
    left: calc(50% - 203px);
}
.sec.top .img01 img {
    width:140px;
    height:auto;
	transform:rotate(0deg);
    animation:startanim 24s linear infinite;
}
@keyframes startanim {
    from {transform:trotate(0deg);}
    to {transform:rotate(360deg);}
}
.sec.top .img02 {
    margin-bottom: 40px;
}
.sec.top .btn1 {
    width:90%;
    max-width:400px;
    margin:0 auto;
}
.sec.top .btn1 label {
    height:74px;
    line-height:74px;
}
.sec.top .btn1 label span {
    background-image: url(../img/img_03.png);
    background-repeat: no-repeat;
    background-position: center center;
}
.sec.top .btn1 label:hover span {
    background-image: url(../img/img_03on.png);
}
.sec.top .btn1 {
    margin-bottom: 25px;
}

/*------------------------------------------------
　Qestion_page_Common
------------------------------------------------*/
.sec.qst {
    padding: 30px 0 0;
    margin-bottom: 40px;
}
.sec.qst h2 {
    margin-bottom: 20px;
}
.sec.qst h2 + p {
    width: 90%;
    max-width: 600px;
    margin: 0 auto 25px;
    font-size: 18px;
    color: #FFFFFF;
    line-height: 2;
}



.sec.steps {
    width:90%;
    max-width: 450px;
    margin: 0 auto 30px;
}
.sec.steps .step {
    width:100%;
    margin: 0 0 45px;
    position:relative;
}
.sec.steps .stepPoint {
    width:100%;
    margin: 0 -6px;
}
.sec.steps .step::before {
    content:'';
    display:block;
    width:45px;
    height:38px;
    position:absolute;
    top: -12px;
    left:calc(0% - 8px);
    z-index:3;
    background:url(../img/mark.png) no-repeat left center;
    background-size:contain;
    transition:.75s;
}
.sec.steps .step[data-step="2"]::before {
    left:calc((100% - 12px)/9*1 - 12px);
}
.sec.steps .step[data-step="3"]::before {
    left:calc((100% - 12px)/9*2 - 12px);
}
.sec.steps .step[data-step="4"]::before {
    left:calc((100% - 12px)/9*3 - 12px);
}
.sec.steps .step[data-step="5"]::before {
    left:calc((100% - 12px)/9*4 - 12px);
}
.sec.steps .step[data-step="6"]::before {
    left:calc((100% - 12px)/9*5 - 12px);
}
.sec.steps .step[data-step="7"]::before {
    left:calc((100% - 12px)/9*6 - 12px);
}
.sec.steps .step[data-step="8"]::before {
    left:calc((100% - 12px)/9*7 - 12px);
}
.sec.steps .step[data-step="9"]::before {
    left:calc((100% - 12px)/9*8 - 12px);
}
.sec.steps .step[data-step="10"]::before {
    left:calc((100% - 12px) - 12px);
}

.sec.steps .step::after {
    content:'';
    display:block;
    width:96%;
    height:1px;
    background-color:#FFFFFF;
    z-index:1;
    position:absolute;
    left:2%;
    top: 7.5px;
}
.sec.steps .step li {
    width:12px;
    height:12px;
    background-color:#FFFFFF;
    border-radius:50%;
    position:relative;
    z-index:2;
}
.sec.steps .toTop a {
    width: 220px;
    display: inline-block;
    background-image: url(../img/btn_01_on.png);
    background-repeat: no-repeat;
    background-size: 220px auto;
    transition-property: all;
    transition-duration: .3s;
}
.sec.steps .toTop a:hover {
    opacity: 1;
}
.sec.steps .toTop a:hover img {
    opacity: 0;
}

/*------------------------------------------------
　Qestion_Column-1_Common
------------------------------------------------*/
.c1 {
    width:90%;
    max-width:400px;
    margin:0 auto;
}

/*------------------------------------------------
　Qestion_Column-2_Common
------------------------------------------------*/
.sec.qst .c2 {
    width: 90%;
    max-width: 600px;
    margin: 0 auto;
}
.sec.qst .c2 .btn1 {
    width: calc(50% - 20px);
}

/*------------------------------------------------
　END
------------------------------------------------*/
.sec.end {
    padding-top:200px;
    background:url(/campaign/star-compass/img/bg_03.png) no-repeat center top;
    background-size:1390px auto;
}
.sec.end p {
    color: #FFFFFF;
    margin-bottom: 45px;
    font-size: 18px;
    line-height: 2;
}
.sec.end .icon {
    display: inline-block;
    margin-bottom: 0;
    position: relative;
    font-size: 12px;
    line-height: 1.5;
    text-align: left;
    box-sizing:border-box;
    padding-left:2.5em;
}
.sec.end .icon::before {
    content: url(../img/icon_01.png);
    margin-right: 0.75em;
    position: absolute;
    top: .75em;
    left:0;
}
.sec.end .btn1 {
    width:90%;
    margin:0 auto 50px;
    max-width:400px;
}
.sec.end .btn1 label {
    height:74px;
    line-height:74px;
}
.sec.end .btn1 span {
    font-family: 'Yu Mincho', YuMincho, \006e38\00660e\00671d;
    font-size: 21px;
    line-height:74px;
    color: #FFFFFF;
}

/*------------------------------------------------
　Result
------------------------------------------------*/
.conts.result p {
    font-size: 17px;
    color: #FFFFFF;
}
.conts.result {
    position: relative;
    background-repeat: no-repeat;
    background-position: center top,calc(50% + 310px) -115px;
    background-size: auto;
}
.conts.result.moon {
    position: relative;
    background-image: url(../img/bg_03.png),url(../moon/img/result_02.png);
}
.conts.result.comet {
    position: relative;
    background-image: url(../img/bg_03.png),url(../comet/img/result_02.png);
}
.conts.result.jupiter {
    position: relative;
    background-image: url(../img/bg_03.png),url(../jupiter/img/result_02.png);
}
.conts.result.mars {
    position: relative;
    background-image: url(../img/bg_03.png),url(../mars/img/result_02.png);
}
.conts.result.mercury {
    position: relative;
    background-image: url(../img/bg_03.png),url(../mercury/img/result_02.png);
}
.conts.result.neptune {
    position: relative;
    background-image: url(../img/bg_03.png),url(../neptune/img/result_02.png);
}
.conts.result.saturn {
    position: relative;
    background-image: url(../img/bg_03.png),url(../saturn/img/result_02.png);
}
.conts.result.sun {
    position: relative;
    background-image: url(../img/bg_03.png),url(../sun/img/result_02.png);
}
.conts.result.uranus {
    position: relative;
    background-image: url(../img/bg_03.png),url(../uranus/img/result_02.png);
}
.conts.result.venus {
    position: relative;
    background-image: url(../img/bg_03.png),url(../venus/img/result_02.png);
}
.conts.result .resultImg {
    width: 100%;
    margin: 0 auto;
    padding:30px 0;
    position: relative;
    text-align: center;
}
.conts.result .resultImg::before {
    content:'';
    display:block;
    width:80px;
    height:50px;
    position:absolute;
    background:url(/campaign/star-compass/img/plane.png) no-repeat center center;
    background-size:contain;
    top:80px;
    left:calc(50% - 190px);
}

.conts.result .sec01 {
    max-width: 600px;
    margin: 0 auto 80px;
}
.conts.result .sec01 .result_txt {
    font-family: 'Yu Mincho', YuMincho, \006e38\00660e\00671d;
    font-size: 21px;
    margin-bottom:1em;
}
.conts.result .sec01 h2 {
    text-align:center;
    margin-bottom: 45px;
}
.conts.result .sec01 h2 img {
    display:block;
    margin:0 auto 10px;
}
.conts.result .sec01 h2 span {
    display:block;
    font-family: 'Yu Mincho', YuMincho, \006e38\00660e\00671d;
    font-size: 32px;
    color: #FFFFFF;
}
.conts.result .sec01 h3,
#booking h3 {
    margin-bottom: 25px;
    font-family: 'Yu Mincho', YuMincho, \006e38\00660e\00671d;
    font-size: 21px;
    color: #FFFFFF;
}
#booking h3 {
    text-align: center;
}
.conts.result .sec01 h3::before,
.conts.result .sec01 h3::after,
#booking h3::before,
#booking h3::after {
    content: url(../img/icon_02.png);
    position: relative;
    top: 8px;
}
.conts.result .sec01 h3::before,
#booking h3::before {
    margin-right: 1em;
}
.conts.result .sec01 h3::after,
#booking h3::after {
    margin-left: 1em;
}

.conts.result .sec01 p {
    margin-bottom: 45px;
}
.conts.result .sec01 .tal {
    text-align: left;
    line-height: 1.8;
}
.conts.result .sec01 .tac {
    text-align: center;
}
.conts.result .sec01 p:last-child {
    margin-bottom: 0;
}

.conts.result .sec02 {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    position: relative;
}
.conts.result .sec02 h3 {
    display: inline-block;
    width: 491px;
    height: 58px;
    padding: 12px 0;
    margin-bottom: 30px;
    background-image: url(../img/ttl_01.png);
    background-position:center center;
    background-repeat:no-repeat;
    background-size:contain;
    font-family: 'Yu Mincho', YuMincho, \006e38\00660e\00671d;
    font-size: 24px;
    color: #FFFFFF;
}
.conts.result .sec02 .list1 {
    width: 100%;
    max-width: 1000px;
    margin-bottom: 40px;
}
.conts.result .sec02 .list1.mb70 {
    margin-bottom: 70px;
}
.conts.result .sec02 .list1 li {
    width: calc(33% - 20px);
    margin-left: 20px;
}
.conts.result .sec02 .list1 li:first-child,
.conts.result .sec02 .list1 li:nth-child(4n) {
    margin-left: 0;
}
.conts.result .sec02 .list1 li a {
    display: inline-block;
    margin-bottom: 10px;
}
.conts.result .sec02 .list1 li h4 {
    width: 100%;
    max-width: 318px;
    font-size:15px;
    color:#FFFFFF;
    text-align:left;
    margin:0 auto 2px;
}
.conts.result .sec02 .list1 li p {
    width: 100%;
    max-width: 318px;
    margin: 0 auto;
    color:#FFFFFF;
    text-align: left;
    font-size:14px;;
}
.conts.result .sec02 .sns {
    margin-bottom: 50px;
}
.conts.result .sec02 .sns li {
    width: 60px;
    margin: 0 10px;
}
.conts.result .sec02 .sns li a {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: cover;
    transition-property: all;
    transition-duration: .3s;
}
.conts.result .sec02 .sns li:nth-child(1) a {
    background-image: url(../img/sns_01_on.png);
}
.conts.result .sec02 .sns li:nth-child(2) a {
    background-image: url(../img/sns_02_on.png);
}
.conts.result .sec02 .sns li:nth-child(3) a {
    background-image: url(../img/sns_03_on.png);
}
.conts.result .sec02 .sns li a:hover {
    opacity: 1;
}
.conts.result .sec02 .sns li a:hover img {
    opacity: 0;
}

.conts.result .sec02 h4 {
    margin-bottom: 50px;
}
.conts.result .toTop {
    margin-bottom: 70px;
}
.conts.result .toTop a {
    display: inline-block;
    background-image: url(../img/btn_02_on.png);
    background-repeat: no-repeat;
    transition-property: all;
    transition-duration: .3s;
}
.conts.result .toTop a:hover {
    opacity: 1;
}
.conts.result .toTop a:hover img {
    opacity: 0;
}
.conts.result .sec03 .list2 {
    margin-bottom: 70px;
    box-sizing:border-box;
    padding:0 20px;
}
.conts.result .sec03 .list2 li {
    width:calc(50% - 25px);
    max-width:380px;
}
.conts.result .sec03 .list2 li:first-child {
    margin-right:50px;
}
.conts.result .sec03 .list2 li a {
    display: inline-block;
    /* background-image: url(../img/btn_02_on.png); */
    background-repeat: no-repeat;
    transition-property: all;
    transition-duration: .3s;
}
.conts.result .sec03 .list2 li:nth-child(1) a {
    background-image: url(../img/btn_03_on.png);
}
.conts.result .sec03 .list2 li:nth-child(2) a {
    background-image: url(../img/btn_04_on.png);
}
.conts.result .sec03 .list2 li a:hover {
    opacity: 1;
}
.conts.result .sec03 .list2 li a:hover img {
    opacity: 0;
}
.conts.result .sec03 .img {
    margin-bottom: 80px;
}
.conts.result .sec03 .msBtn {
    width:68px;
    height:68px;
    position: fixed;
    top: 150px;
    right: 50px;
    z-index: 99;
}
.conts.result .sec03 .msBtn a {
    display:block;
    width:68px;
    height:68px;
    background-image: url(../img/icon_03_off.png);
    background-repeat: no-repeat;
    background-position:center center;
    background-size:contain;
    transition-property: all;
    transition-duration: .3s;
}
.conts.result .sec03 .msBtn.on a {
    background-image: url(../img/icon_03_on.png);
}
.conts.result .sec03 .msBtn a:hover {
    opacity: .66;
}

/*------------------------------------------------
　BTN_COMMON
------------------------------------------------*/
.sec.qst .btn1 {
    transition:.75s;
    transform:translateY(-30px);
    opacity:0;
}
.sec.qst.show .btn1 {
    transform:translateY(0);
    opacity:1;
}
.sec.qst.active .btn1:nth-child(1) {
    transition-delay:.1s;
}
.sec.qst.active .btn1:nth-child(2) {
    transition-delay:.2s;
}
.sec.qst.active .btn1:nth-child(3) {
    transition-delay:.3s;
}
.sec.qst.active .btn1:nth-child(4) {
    transition-delay:.4s;
}
.sec.qst.active .btn1:nth-child(5) {
    transition-delay:.5s;
}

.conts .btn1 input {
    display:none;
}
.conts .btn1 label {
    width: 100%;
    height:60px;
    line-height:60px;
    display: block;
    position: relative;
    background-color: #333333;
    overflow:hidden;
	text-decoration: none;
	cursor:pointer;
}
.conts .btn1 span {
    width: 100%;
    height: 100%;
    display: block;
    position:relative;
    z-index: 5;
    font-size: 18px;
    color: #FFFFFF;
    line-height: 60px;
    text-align: center;
	transition:.3s;
}
.conts .btn1 label:hover span {
	color:#000000;
}
.conts .btn1 label::after {
    content:'';
    display:block;
    width:100%;
    height:74px;
    position:absolute;
    top:0;
    left:0;
	background-color:#FFFFFF;
    z-index:1;
    opacity:0;
    transition:.3s;
}
.conts .btn1 label:hover::after {
    opacity:1;
}
.conts .c1 .btn1,
.conts .c2 .btn1 {
    margin-bottom: 20px;
}
.sec.qst .c1 .btn1:last-child,
.sec.qst .c2 .btn1:last-child {
    margin-bottom: 0;
}
.conts .btn1 label span img {
    display: none;
}
.conts .btn1 label span::before,
.conts .btn1 label span::after {
    content: '';
    display: block;
    width: 40px;
    height: 40px;
    box-sizing:border-box;
    position: absolute;
    transition:.3s;
    z-index:2;
}
.conts .btn1 label span::before {
    bottom: 0;
    left: 0;
    border-left:1px solid #FFFFFF;
    border-bottom:1px solid #FFFFFF;
}
.conts .btn1 label span::after {
    top: 0;
    right: 0;
    border-right:1px solid #FFFFFF;
    border-top:1px solid #FFFFFF;
}
.conts .btn1 label span:hover::before,
.conts .btn1 label span:hover::after {
    width: 100%;
    height: 100%;
}
.conts .btn1 label:hover,
.conts .btn1 label *:hover {
    opacity: 1;
}
.conts .btn1 label::before {
    content: "";
    background-color: rgba(200,200,200,0.3);
    height: 100%;
    width: 100px;
    display: block;
    position: absolute;
    top: 0;
    left: -150px;
    transform: skewX(-45deg) translateX(0);
    transition: none;
    z-index:2;
}
.conts .btn1 label:hover::before {
     transform: skewX(-45deg) translateX(600px);
     transition: all 0.5s ease-in-out;
}
@keyframes sheen {
  0% {
    transform: skewY(-45deg) translateX(0);
  }
  100% {
    transform: skewY(-45deg) translateX(600px);
  }
}


.conts .color .btn1 label:hover span {
	color:#FFFFFF;
}
.conts .color .btn1.red label:after {
	background: #C7000B;
}
.conts .color .btn1.red label:hover span::before,
.conts .color .btn1.red label:hover span::after {
	border-color: #C7000B;
}
.conts .color .btn1.green label:after {
	background: #00873C;
}
.conts .color .btn1.green label:hover span::before,
.conts .color .btn1.green label:hover span::after {
	border-color: #00873C;
}
.conts .color .btn1.blue label:after {
	background: #005AA0;
}
.conts .color .btn1.blue label:hover span::before,
.conts .color .btn1.blue label:hover span::after {
	border-color: #005AA0;
}
.conts .color .btn1.yellow label:after {
	background: #DCB402;
}
.conts .color .btn1.yellow label:hover span::before,
.conts .color .btn1.yellow label:hover span::after {
	border-color: #DCB402;
}
.conts .color .btn1.purple label:after {
	background: #800073;
}
.conts .color .btn1.purple label:hover span::before,
.conts .color .btn1.purple label:hover span::after {
	border-color: #800073;
}


@media only screen and (min-width: 901px) {

/*------------------------------------------------
　TOP-sec
------------------------------------------------*/
.tbOnly {
    display: none;
}


/*------------------------------------------------
　Under_PC
------------------------------------------------*/


}/* END min-width: 901px */


@media only screen and (max-width: 900px) {

/*------------------------------------------------
　FOOTER
------------------------------------------------*/
.compass_footer-link li a {
    font-size:1.3rem
}
.compass_footer-link p {
    font-size:1.2rem;
}

}/* END max-width: 900px */

@media screen and (min-width: 768px) {

/*------------------------------------------------
　TOP
------------------------------------------------*/
.spOnly {
    display: none;
}

}/* END max-width: 768px */

@media screen and (min-width: 768px) and (max-width: 900px) {

}/* END min-width: 768px and max-width: 900px */

@media screen and (max-width: 767px) {

.pcOnly {
    display: none;
}

/*------------------------------------------------
　COMMON
------------------------------------------------*/
.conts .bottomImg p {
    width: 100%;
    height: auto;
    background-image: none;
}
.conts .bottomImg p img {
    display: inline-block;
}

/*------------------------------------------------
　FOOTER
------------------------------------------------*/
.l-footer {
    display:none;
}
.compass_footer_inner {
    text-align:center;
    padding:30px 15px 90px;
    background:url(/campaign/star-compass/img/footimg.png) repeat-x center bottom 10px;
    background-size:100px auto;
}
.compass_footer-logo {
    width:200px;
}
.compass_footer-link ul {
    margin-bottom:15px;
}
.compass_footer-link li {
    margin-bottom:1em;
}
.compass_footer-link li:not(:first-child) {
  border-right:0;
  margin-right:0;
  padding-right:0;
}
.compass_footer-link p {
    width:100%;
    text-align:center;
}

/*------------------------------------------------
　TOP
------------------------------------------------*/
.sec.top {
    background-image: url(../img/sp/bg_02.png);
    background-size: 400px auto;
}
.sec.top .img01 {
    width: 100%;
    margin:0 auto 20px;
    background-image: none;
}
.sec.top .img01::before {
    content: '';
    display: block;
    width: 40px;
    height: 25px;
    position: absolute;
    background: url(/campaign/star-compass/img/plane.png) no-repeat center center;
    background-size: contain;
    top: 75px;
    left: calc(50% - 125px);
}
.sec.top .img01 img {
    width:130px;
}
.sec.top .img02 {
    width: 100%;
    max-width:300px;
    margin: 0 auto 20px;
}
.sec.top p {
    font-size: 14px;
    line-height: 2;
}
.sec.top .btn1 label {
    height:60px;
    line-height:60px;
}

/*------------------------------------------------
　Qestion_page_Common
------------------------------------------------*/

.sec.qst h2 img {
    max-height: 35px;
}
.sec.steps .toTop a {
    width: 200px;
    display: inline-block;
    background-image: none;
}
.sec.steps {
    max-width:320px;
    margin: 0 auto 60px;
}
.sec.steps .stepPoint {
    margin: 0 -5px;
}
.sec.steps .step::before {
    width:40px;
    height:30px;
    top: -7px;
    left:calc(0% - 6px);
    z-index:3;
}
.sec.steps .step::after {
    top: 7.5px;
}
.sec.steps .step li {
    width:10px;
    height:10px;
}
.sec.steps .step[data-step="2"]::before {
    left:calc((100% - 10px)/9*1 - 10px);
}
.sec.steps .step[data-step="3"]::before {
    left:calc((100% - 10px)/9*2 - 10px);
}
.sec.steps .step[data-step="4"]::before {
    left:calc((100% - 10px)/9*3 - 10px);
}
.sec.steps .step[data-step="5"]::before {
    left:calc((100% - 10px)/9*4 - 10px);
}
.sec.steps .step[data-step="6"]::before {
    left:calc((100% - 10px)/9*5 - 10px);
}
.sec.steps .step[data-step="7"]::before {
    left:calc((100% - 10px)/9*6 - 10px);
}
.sec.steps .step[data-step="8"]::before {
    left:calc((100% - 10px)/9*7 - 10px);
}
.sec.steps .step[data-step="9"]::before {
    left:calc((100% - 10px)/9*8 - 10px);
}
.sec.steps .step[data-step="10"]::before {
    left:calc((100% - 10px) - 10px);
}



/*------------------------------------------------
　Qestion_Column-1_Common
------------------------------------------------*/
.c1 {
    max-width:320px;
}
.sec.qst .c1 .btn1 {
    margin-bottom: 25px;
}

/*------------------------------------------------
　Qestion_Column-2_Common
------------------------------------------------*/
.sec.qst .c2 {
    max-width:320px;
}
.sec.qst .c2 .btn1 {
    width: calc(50% - 12px);
    margin-bottom: 25px;
}

/*------------------------------------------------
　END
------------------------------------------------*/
.sec.end {
    padding-top: 150px;
    background:url(/campaign/star-compass/img/sp/bg_03.png) no-repeat center top;
    background-size:400px auto;
}
.sec.end .img01 {
    margin-bottom: 10px;
}
.sec.end .img01 img:first-child {
    display: none;
}
.sec.end .img01 img:nth-child(2) {
    display: inline-block;
    margin: 0 auto;
}
.sec.end .icon {
    font-size: 11px;
}
.sec.end .btn1 {
    max-width:320px;
}
.sec.end .btn1 label {
    height:60px;
    line-height:60px;
}
.sec.end .btn1 span {
    line-height:60px;
}

/*------------------------------------------------
　Result
------------------------------------------------*/
.conts.result {
    background-position: right -90px;
    background-size: 240px auto;
}
.conts.result.moon {
    position: relative;
    background-image: url(../moon/img/result_02.png);
    background-position: calc(50% + 60px) -90px;
    
}
.conts.result.comet {
    position: relative;
    background-image: url(../comet/img/result_02.png);
    background-position: calc(50% + 130px) -40px;
}
.conts.result.jupiter {
    position: relative;
    background-image: url(../jupiter/img/result_02.png);
    background-position: calc(50% + 145px) -50px;
}
.conts.result.mars {
    position: relative;
    background-image: url(../mars/img/result_02.png);
    background-position: calc(50% + 115px) -45px;
}
.conts.result.mercury {
    position: relative;
    background-image: url(../mercury/img/result_02.png);
    background-position: calc(50% + 95px) -35px;
}
.conts.result.neptune {
    position: relative;
    background-image: url(../neptune/img/result_02.png);
    background-position: calc(50% + 120px) -60px;
}
.conts.result.saturn {
    position: relative;
    background-image: url(../saturn/img/result_02.png);
    background-position: calc(50% + 110px) -10px;
}
.conts.result.sun {
    position: relative;
    background-image: url(../sun/img/result_02.png);
    background-position: calc(50% + 95px) -45px;
}
.conts.result.uranus {
    position: relative;
    background-image: url(../uranus/img/result_02.png);
    background-position: calc(50% + 110px) -60px;
}
.conts.result.venus {
    position: relative;
    background-image: url(../venus/img/result_02.png);
    background-position: calc(50% + 100px) -55px;
}
    
.conts.result .resultImg {
    width: 180px;
    padding:40px 0 10px;
}
.conts.result.neptune .resultImg {
    width: 150px;
    padding:40px 0 10px;
}
.conts.result.comet .resultImg {
    width: 140px;
    padding:50px 0 25px;
}
.conts.result.comet .resultImg img {
    transform:translateX(20px) rotate(-15deg);
}
.conts.result .resultImg::before {
    width: 45px;
    height: 27px;
    top:80px;
    left:calc(50% - 120px);
}
.conts.result .sec01 {
    width: 90%;
    margin: 0 auto 50px;
}
.conts.result .sec01 .result_txt {
    font-size: 18px;
}
.conts.result .sec01 h2 {
    margin-bottom: 30px;
}
.conts.result .sec01 h2 img {
    width:180px;
}
.conts.result .sec01 h2 span {
    font-size: 28px;
}
.conts.result.mercury .sec01 h2 span,
.conts.result.comet .sec01 h2 span {
    font-size: 24px;
}

.conts.result .sec01 p {
    width: 90%;
    margin: 0 auto 30px;
    font-size:15px;
}
.conts.result .sec01 .tac {
    text-align: left;
}


.conts.result .sec01 h3,
#booking h3 {
    font-size: 18px;
}
.conts.result .sec01 h3::before, 
.conts.result .sec01 h3::after, 
#booking h3::before, 
#booking h3::after {
    top: 10px;
}

.conts.result .sec02 h3 {
    display: inline-block;
    width: 90%;

    height: auto;
    padding: 4.5vw 0px;
    margin-bottom: 30px;
    background-image: none;
    background-size: cover;
    background-repeat: no-repeat;
    font-size: 5vw;
    position: relative;
}
.conts.result .sec02 h3::before {
    content: '';
    width: 99.9%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(../img/sp/ttl_01.png);
    background-size: contain;
    background-repeat: no-repeat;
}
.conts.result .sec02 .list1 {
    width: 80%;
}
.conts.result .sec02 .list1 li {
    width: 100%;
    margin: 0 0 20px 0;
}

.conts.result .sec02 .list1.mb70 {
    margin-bottom: 50px;
}
.conts.result .sec02 h4 {
    width: 65%;
    margin: 0 auto 40px;
}

.conts.result .toTop {
    width: 90%;
    margin: 0 auto 80px;
}

.conts.result .sec03 .img {
    width: 97.5%;
    margin: 0 auto 50px;
}
.conts.result .sec03 .img img:first-child {
    display: none;
}

.conts.result .sec03 .list2 {
    width: 80%;
    margin-bottom: 0;
    padding: 0;
}
.conts.result .sec03 .list2 li {
    width:100%;
    padding: 0;
    margin: 0 0 20px;
}
.conts.result .sec03 .list2 li:first-child {
    margin-right:0;
}

.conts.result .sec03 .msBtn {
    width:40px;
    height:40px;
    top: 70px;
    right: 5px;
}
.conts.result .sec03 .msBtn a {
    width:40px;
    height:40px;
}



/*------------------------------------------------
　BTN_COMMON
------------------------------------------------*/
.conts .btn1 label {
    height: 50px;
    line-height: 50px;
}
.conts .btn1 label span {
    background-size:90px auto;
    line-height: 50px;

}
.conts .btn1 label span img {
    max-width: 75px;
    display: inline-block;
}

}/* END max-width: 767px */

@media only screen and (max-width: 400px) {

}/* END max-width: 400px */

@media only screen and (max-width: 375px) {

.conts.result .sec01 h2 span {
    font-size: 7.5vw;
}
.conts.result.mercury .sec01 h2 span,
.conts.result.comet .sec01 h2 span {
    font-size: 6.5vw;
}

}/* END max-width: 375px */