@charset "utf-8";
html#kansatsu {
  background: #002e4b
}
#kansatsu #mainArea .mainAreaBox {
  background: url(/star/images/contentTop_subBg_pc.png) bottom repeat-x, url(/star/images/topMain_bg_pc.png) bottom no-repeat
}
#kansatsu .mainConArea .mainConTit {
  background: url(/star/images/tit_deco_light.png) left top no-repeat, url(/star/images/mainConTit_borderLight_pc.png) left bottom 10px no-repeat;
  background-size: 60px, contain
}
#kansatsu .date, #kansatsu .mainTitle {
  color: #fff
}
#kansatsu .explain_box a:link, #kansatsu .explain_box a:visited, #kansatsu .explain_box p {
  color: #EAF5FC
}
#calendar .date, #calendar .mainTitle, #map .date, #map .explain_box a:link, #map .explain_box a:visited, #map .explain_box p, #map .mainTitle, .mapLog_year {
  color: #002E4B
}
@media only screen and (max-width:768px) {
  #kansatsu .mainConArea .mainConTit {
    background: url(/star/images/tit_deco_light.png) left top no-repeat, url(/star/images/mainConTit_borderLight_sp.png) left bottom 1.6vw no-repeat;
    background-size: 10.6vw, contain
  }
  .sp_footNavi {
    width: 100%;
    float: none;
    margin: 16vw auto 0
  }
  .sp_footNavi .fl, .sp_footNavi .fr {
    width: 48%
  }
}
html#calendar, html#map {
  background: #D2E5F6
}
#calendar #mainArea .mainAreaBox, #map #mainArea .mainAreaBox {
  background: #002E4B
}
#calendar .mainConArea, #map .mainConArea {
  padding-bottom: 40px;
  background: url(/star/images/mainConTit_borderDark_pc.png) bottom no-repeat;
  background-size: contain;
  position: relative
}
#calendar .mainConArea .mainConTit, #map .mainConArea .mainConTit {
  background: url(/star/images/tit_deco_dark.png) left top no-repeat, url(/star/images/mainConTit_borderDark_pc.png) left bottom 10px no-repeat;
  background-size: 60px, contain;
  position: relative
}
#calendar .full_box, #map .full_box {
  width: auto;
  min-height: 732px
}
#map .icon_zoom {
  position: absolute;
  bottom: 0;
  right: 25px;
  z-index: 30
}
#map .halfMap .icon_zoom {
  position: static;
  margin-top: 0
}
#map .select_btn {
  margin: 0 auto
}
#map .explain_box {
  width: 850px;
  margin: 30px auto 10px;
  display: none
}
@media only screen and (min-width:768px) {
  #map .select_div {
    margin-bottom: 20px
  }
  #map .select_div.halfMap {
    margin-bottom: 0
  }
}
@media only screen and (max-width:768px) {
  #calendar .mainConArea, #map .mainConArea {
    padding-bottom: 28vw;
    background: url(/star/images/mainConTit_borderDark_sp.png) bottom no-repeat;
    background-size: contain
  }
  #calendar .mainConArea .mainConTit, #map .mainConArea .mainConTit {
    background: url(/star/images/tit_deco_dark.png) left top no-repeat, url(/star/images/mainConTit_borderDark_sp.png) left bottom 1.6vw no-repeat;
    background-size: 10.6vw, contain
  }
  #calendar .full_box, #map .full_box {
    min-height: 0
  }
  #map .icon_zoom {
    right: 0
  }
  #map .select_btn {
    margin: 3.2vw auto 0
  }
  #map .explain_box {
    width: 100%;
    margin: 9.33vw auto 0;
    display: none
  }
}
.select_direction_btn {
  position: absolute;
  left: 15px;
  z-index: 99
}
.select_direction_btn ul li {
  width: 102px;
  height: 30px;
  margin-bottom: 16px
}
.select_direction_btn ul li:first-child {
  pointer-events: none
}
.select_direction_btn ul li:hover {
  cursor: pointer
}
.select_direction_btn ul li:nth-child(1) {
  background: url(/star/images/select_direction_all_off_pc.png) right bottom no-repeat;
  background-size: contain
}
.select_direction_btn ul li:nth-child(2) {
  background: url(/star/images/select_direction_north_off_pc.png) right bottom no-repeat;
  background-size: contain
}
.select_direction_btn ul li:nth-child(3) {
  background: url(/star/images/select_direction_south_off_pc.png) right bottom no-repeat;
  background-size: contain
}
.select_direction_btn ul li > img {
  opacity: 0
}
.select_direction_btn ul li.hoverClass > img, .select_direction_btn ul li > img.on {
  opacity: 1
}
.select_direction_btn ul li.hoverClass {
  opacity: .5
}
@media only screen and (max-width:768px) {
  .select_direction_btn {
    position: static
  }
  .select_direction_btn ul {
    width: 100%;
    letter-spacing: -.4em;
    line-height: 1;
    margin-bottom: 5.33vw
  }
  .select_direction_btn ul li {
    width: calc((100% - (8.7vw * 2))/ 3);
    height: auto;
    margin-right: 8.7vw;
    display: inline-block;
    line-height: 1;
    letter-spacing: normal;
    margin-bottom: 0
  }
  .select_direction_btn ul li:nth-child(3n) {
    margin-right: 0
  }
  .select_direction_btn ul li:first-child {
    pointer-events: none
  }
  .select_direction_btn ul li:hover {
    cursor: pointer
  }
  .select_direction_btn ul li:nth-child(1) {
    background: url(/star/images/select_direction_all_off_sp.png) left bottom no-repeat;
    background-size: cover
  }
  .select_direction_btn ul li:nth-child(2) {
    background: url(/star/images/select_direction_north_off_sp.png) left bottom no-repeat;
    background-size: cover
  }
  .select_direction_btn ul li:nth-child(3) {
    background: url(/star/images/select_direction_south_off_sp.png) left bottom no-repeat;
    background-size: cover
  }
}
#backLogArea {
  width: 930px;
  margin: auto;
  padding-top: 30px
}
#backLogArea .acMenuClick {
  background: url(/star/images/map_log_more.png) no-repeat;
  width: 386px;
  height: 42px;
  margin: 20px auto 0;
  background-size: cover
}
#backLogArea .acMenuClick.active {
  background: url(/star/images/map_log_close.png) no-repeat;
  background-size: cover
}
.mapLog_year {
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 1em
}
.mapLog_year:after {
  content: "年";
  font-size: 1.8rem;
  padding-left: 5px
}
#backLogArea .ulBox {
  width: 760px;
  margin: auto;
  overflow: hidden
}
#map #backLogArea .ulBox {
  display: none
}
#map #backLogArea .ulBox > div {
  margin-bottom: 20px
}
#map #backLogArea .ulBox > div:nth-last-of-type(1) {
  margin-bottom: 0
}
#backLogArea ul {
  letter-spacing: -.4em;
  display: inline;
  margin-left: 26px;
  margin-bottom: 22px
}
#backLogArea ul li {
  width: 44px;
  margin: 0 10px 0 0;
  display: inline-block;
  letter-spacing: normal
}
#backLogArea ul li:last-child {
  margin: 0
}
#backLogArea ul li img {
  width: 100%
}
@media only screen and (min-width:768px) {
  #backLogArea .acMenuClick:hover {
    cursor: pointer;
    opacity: .6
  }
}
@media only screen and (max-width:768px) {
  #backLogArea {
    width: 94%;
    padding-top: 8vw
  }
  #backLogArea .acMenuClick {
    width: 100%;
    height: 9.6vw;
    background-size: cover;
    margin: 0 auto
  }
  #backLogArea .acMenuClick.active {
    background-size: cover
  }
  .mapLog_year {
    font-size: 7.46vw
  }
  .mapLog_year:after {
    font-size: 4.8vw;
    padding-left: 1.33vw
  }
  #backLogArea .ulBox {
    width: 100%
  }
  #backLogArea ul {
    display: block;
    margin-left: 0;
    margin-top: 1.13vw;
    margin-bottom: 9.06vw
  }
  #backLogArea ul li {
    width: -webkit-calc((100% - (2.66vw * 5))/ 6);
    width: calc((100% - (2.66vw * 5))/ 6);
    margin: 0 2.66vw 2.66vw 0;
    display: inline-block;
    letter-spacing: normal
  }
  #backLogArea ul li:nth-child(6n) {
    margin: 0
  }
}
.calBox {
  position: relative;
  width: 833px;
  margin: auto;
  padding-top: 28px
}
.calBox::after {
  content: "：月齢";
  font-size: 1.6rem;
  line-height: 1em;
  padding-left: 1em;
  position: absolute;
  top: 0;
  right: 0;
  background-image: url("/star/images/moonage05.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center left
}
table.calBoxTable {
  width: 100%;
  border: 1px solid #000;
  background: #E6E6E6;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed
}
table.calBoxTable td, table.calBoxTable th {
  width: 14.2857%;
  width: -webkit-calc(100% / 7);
  width: calc(100% / 7);
  border: 1px solid #000;
  color: #231815
}
table.calBoxTable th {
  font-size: 1.6rem;
  padding: 5px 0
}
table.calBoxTable td:nth-child(6), table.calBoxTable th:nth-child(6) {
  background: #D1D4EB
}
table.calBoxTable td:nth-child(7), table.calBoxTable th:nth-child(7) {
  background: #F8D1DC
}
.holiday {
  background: #F8D1DC !important
}
table.calBoxTable td {
  padding: 5px;
  vertical-align: top
}
table.calBoxTable td:first-child:before {
  content: "";
  height: 100px;
  float: left;
  display: block
}
table.calBoxTable td:nth-child(6) .dateNum, table.calBoxTable th:nth-child(6) {
  color: #0098D8
}
table.calBoxTable td:nth-child(7) .dateNum, table.calBoxTable th:nth-child(7) {
  color: #C61A22
}
.holiday .dateNum {
  color: #C61A22 !important
}
.dateNum {
  font-size: 2rem;
  font-weight: 700
}
.holidayname {
  font-size: 1.2rem;
  margin-left: .25em;
  font-weight: 400
}
.moonAge {
  position: relative;
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1em;
  margin: .2em 0;
  padding-left: 1.25em;
	/*
  width: 109px\9
	*/
  width: 109px;
}
.moonAge::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 1em;
  height: 100%;
  background-image: url(/star/images/calendar_moonAge.png);
  background-size: contain;
  background-repeat: no-repeat;
  transform: translateY(-50%)
}
/* ↓月齢イラスト変更：大日本図書 */
.moonAge.m00::before { background-image: url("/star/images/moonage00.png"); }
.moonAge.m01::before { background-image: url("/star/images/moonage01.png"); }
.moonAge.m02::before { background-image: url("/star/images/moonage02.png"); }
.moonAge.m03::before { background-image: url("/star/images/moonage03.png"); }
.moonAge.m04::before { background-image: url("/star/images/moonage04.png"); }
.moonAge.m05::before { background-image: url("/star/images/moonage05.png"); }
.moonAge.m06::before { background-image: url("/star/images/moonage06.png"); }
.moonAge.m07::before { background-image: url("/star/images/moonage07.png"); }
.moonAge.m08::before { background-image: url("/star/images/moonage08.png"); }
.moonAge.m09::before { background-image: url("/star/images/moonage09.png"); }
.moonAge.m10::before { background-image: url("/star/images/moonage10.png"); }
.moonAge.m11::before { background-image: url("/star/images/moonage11.png"); }
.moonAge.m12::before { background-image: url("/star/images/moonage12.png"); }
.moonAge.m13::before { background-image: url("/star/images/moonage13.png"); }
.moonAge.m14::before { background-image: url("/star/images/moonage14.png"); }
.moonAge.m15::before { background-image: url("/star/images/moonage15.png"); }
.moonAge.m16::before { background-image: url("/star/images/moonage16.png"); }
.moonAge.m17::before { background-image: url("/star/images/moonage17.png"); }
.moonAge.m18::before { background-image: url("/star/images/moonage18.png"); }
.moonAge.m19::before { background-image: url("/star/images/moonage19.png"); }
.moonAge.m20::before { background-image: url("/star/images/moonage20.png"); }
.moonAge.m21::before { background-image: url("/star/images/moonage21.png"); }
.moonAge.m22::before { background-image: url("/star/images/moonage22.png"); }
.moonAge.m23::before { background-image: url("/star/images/moonage23.png"); }
.moonAge.m24::before { background-image: url("/star/images/moonage24.png"); }
.moonAge.m25::before { background-image: url("/star/images/moonage25.png"); }
.moonAge.m26::before { background-image: url("/star/images/moonage26.png"); }
.moonAge.m27::before { background-image: url("/star/images/moonage27.png"); }
.moonAge.m28::before { background-image: url("/star/images/moonage28.png"); }
.moonAge.m29::before { background-image: url("/star/images/moonage29.png"); }
/* ↑月齢イラスト変更：大日本図書 */

.android .moonAge::before {
  top: 38%
}
.seasons {
  color: #007339;
  font-weight: 700
}
.calMemo {
  font-size: 1.2rem;
  line-height: 1.34em;
  color: #000;
	/*
  width: 109px\9
	*/
  width: 109px;
}
@media only screen and (max-width:768px) {
  .calBox {
    width: 100%;
    padding-top: 5vw
  }
  .calBox::after {
    font-size: 3.2vw
  }
  table.calBoxTable th {
    font-size: 3.3vw;
    padding: .53vw 0
  }
  table.calBoxTable td {
    padding: .8vw;
    vertical-align: top
  }
  table.calBoxTable td:first-child:before {
    content: "";
    height: 22vw
  }
  .dateNum {
    font-size: 3.8vw;
    letter-spacing: -.02em
  }
  .calMemo, .holidayname, .moonAge {
    font-size: 2.6vw
  }
  @media screen and (min-width:0\0) and (min-resolution:.001dpcm) {
    .dateNum {
      width: 11.4vw
    }
  }
  .holidayname {
    display: inline-block;
    transform: scale(.85);
    transform-origin: left top;
    letter-spacing: 0
  }
  .calMemo {
    transform: scale(.85);
    transform-origin: left top;
    width: 120%
  }
  @media screen and (min-width:0\0) and (min-resolution:.001dpcm) {
    .calMemo {
      width: 11.4vw
    }
  }
}
.calendar_pdf {
  width: 230px;
  margin: 35px auto 0
}
.calendar_pdf img {
  width: 100%
}
#calendar #backLogArea ul li img {
  vertical-align: baseline
}
.mainConNext_btn, .mainConPrev_btn {
  position: absolute;
  width: 30px;
  top: 430px
}
.mainConPrev_btn {
  left: 0
}
.mainConNext_btn {
  right: 0
}
@media only screen and (max-width:768px) {
  .mainConNext_btn, .mainConPrev_btn {
    position: absolute;
    top: auto;
    bottom: 6.66vw;
    width: 26.1vw;
    margin-top: 8vw
  }
}
#calendar #footer, #kansatsu #footer, #map #footer {
  background: #002e4b;
  color: #B3B3B3
}