@charset "Shift_JIS";

/*
 * display
 */
.show, .detailHeader.fixed .detailHeader-btnArea .btnReviewEntryLB, .detailHeader.fixed .detailHeader-btnArea .btnReviewEntryEditLB, .detailHeader.fixed .detailHeader-btnArea .btnPhotoEntryLB, .detailHeader.fixed .detailHeader-btnArea.btnExists .btnReservePlan, .detailHeader.fixed .detailHeader-btnArea.activityExists .btnReservePlan, .detailHeader.fixed .btnKuchikomiPointBalloon {
  display: block !important;
}

.hide, .detailHeader.fixed .rating, .detailHeader.fixed .detailHeader-categories, .detailHeader.fixed .detailHeader-btnArea .btnReservePlan, .detailHeader.fixed .detailHeader-btnArea.btnExists .btnReviewEntryLB, .detailHeader.fixed .detailHeader-btnArea.btnExists .btnPhotoEntryLB, .detailHeader.fixed .detailHeader-btnArea.btnExists .btnReviewEntryEditLB, .detailHeader.fixed .detailHeader-btnArea.activityExists .btnReviewEntryLB, .detailHeader.fixed .detailHeader-btnArea.activityExists .btnPhotoEntryLB, .detailHeader.fixed .detailHeader-btnArea.activityExists .btnReviewEntryEditLB,  .detailHeader.fixed .btnExists .btnKuchikomiPointBalloon, .detailHeader.fixed .detailTitle-text, .detailHeader.fixed .detailHeader-adminCouponBanner, .detailHeader.fixed .detailHeader-tags, .detailHeader.fixed .detailHeader-btnArea ul li {
  display: none !important;
}

#errMsgArea {
  display: none;
}

/* lazyload */
.lazyload,
.lazyloading {
  opacity: 0;
}
.lazyloaded {
  opacity: 1;
  transition: opacity 800ms;
}
.lazyload__option {
  background-color: #eee;
}
.lazyload__option-loaded {
  background-color: #fff;
  transition: background-color 800ms;
}

/* loading */
@keyframes rotation {
  0% {
    transform:rotate(0);
  }
  100% {
    transform:rotate(360deg);
  }
}

/*
 * headline
 */
.basicTitle,
.subTitle {
  position: relative;
  padding-left: 12px;
  font-size: 18px;
  font-weight: bold;
  line-height: 1.5;
  word-wrap: break-word;
}

.subTitle {
  font-size: 16px;
  padding-left: 11px;
}

.basicTitle::before,
.subTitle::before {
  content: '';
  position: absolute;
  top: 3px;
  left: 0;
  bottom: 0;
  width: 4px;
  height: calc(100% - 6px);
  background-color: #e77611;
  border-radius: 2px;
}

.subTitle::before {
  width: 3px;
  height: calc(100% - 8px);
  top: 4px;
}

.subTitle > span {
  font-size: 14px;
}

/* 上書き */
.recommendCassette--detail h2 {
  position: relative;
  padding-left: 11px;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
  word-wrap: break-word;
}

.recommendCassette--detail h2::before {
  position: absolute;
  top: 4px;
  bottom: 0;
  left: 0;
  width: 3px;
  height: calc(100% - 8px);
  content: '';
  background-color: #e77611;
  border-radius: 2px;
}

.activityBrowsingHistory .basicTitle,
.otherPlanList .basicTitle {
  padding-left: 11px;
  font-size: 16px;
}

/* alert */
.alertWrapper {
  margin-bottom: 20px;
  padding: 15px;
  border: solid 1px #bcb6b3;
}

.alertWrapper-info {
  margin-bottom: 20px;
  padding: 12px;
  border: solid 2px #ca1738;
  border-radius: 4px;
}

.alertContents,
.alertWrapper-info .alertContents {
  padding-left: 22px;
  color: #ca1738;
  font-size: 12px;
  font-weight: bold;
  background: url('/ou/d/cs/pc/image/icon_alert_triangle.svg') no-repeat 0 0 / 18px auto;
  line-height: 1.5;
}

/* icon */
.iconHelp {
  display: inline-block;
  padding-left: 16px;
  background: url('/ou/d/cs/pc/image/icon_question.svg') no-repeat 0 0 / auto 16px;
  line-height: 16px;
}
.moreLink {
  text-align: right;
}
.moreLink > a {
  padding-left: 13px;
  background: url('/ou/d/cs/pc/image/icon_triangle.svg') no-repeat center left / auto 10px;
  font-size: 12px;
  font-weight: bold;
}
.icon-addSpotMap {
  position: absolute;
  z-index: 10;
  width: 24px;
  height: 24px;
  background: url('/ou/d/cs/pc/image/icon_add_spot_map.png') no-repeat 0 0;
}

/*
 * rating
 */
/* m */
.starM,
.starM::before {
  background: url('/ou/d/cs/pc/image/icon_stars_m.svg') no-repeat 0 0 / 78px auto;
}

.starM {
  position: relative;
  display: inline-block;
  width: 78px;
  height: 14px;
}

.starM::before {
  content: '';
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: 0 -28px;
  z-index: 10;
}

.starM.star0::before {
  width: 0;
}

.starM.star1::before, .starM.star2::before {
  width: 3px;
}

.starM.star3::before, .starM.star4::before {
  width: 6px;
}

.starM.star5::before {
  width: 7.2px;
}

.starM.star6::before, .starM.star7::before {
  width: 9px;
}

.starM.star8::before, .starM.star9::before {
  width: 11px;
}

.starM.star10::before {
  width: 15px;
}

.starM.star11::before, .starM.star12::before {
  width: 19px;
}

.starM.star13::before, .starM.star14::before {
  width: 22px;
}

.starM.star15::before {
  width: 23px;
}

.starM.star16::before, .starM.star17::before {
  width: 25px;
}

.starM.star18::before, .starM.star19::before {
  width: 27px;
}

.starM.star20::before {
  width: 31px;
}

.starM.star21::before, .starM.star22::before {
  width: 35px;
}

.starM.star23::before, .starM.star24::before {
  width: 38px;
}

.starM.star25::before {
  width: 39px;
}

.starM.star26::before, .starM.star27::before {
  width: 41px;
}

.starM.star28::before, .starM.star29::before {
  width: 43px;
}

.starM.star30::before {
  width: 46px;
}

.starM.star31::before, .starM.star32::before {
  width: 51px;
}

.starM.star33::before, .starM.star34::before {
  width: 54px;
}

.starM.star35::before {
  width: 55px;
}

.starM.star36::before, .starM.star37::before {
  width: 57px;
}

.starM.star38::before, .starM.star39::before {
  width: 59px;
}

.starM.star40::before {
  width: 62px;
}

.starM.star41::before, .starM.star42::before {
  width: 67px;
}

.starM.star43::before, .starM.star44::before {
  width: 70px;
}

.starM.star45::before {
  width: 71px;
}

.starM.star46::before, .starM.star47::before {
  width: 73px;
}

.starM.star48::before, .starM.star49::before {
  width: 75px;
}

.starM.star50::before {
  width: 78px;
}

/* s */
.starS {
  display: block;
}
.starS,
.starS::before {
  height: 12px;
  background: no-repeat 0 0 / 68px auto url('/ou/d/cs/pc/image/icon_star_s.svg');
}
.starS {
  width: 68px;
}
.starS::before {
  display: block;
  content: '';
  background-position: 0 -24px;
}
.starS.star0::before {
  width: 0;
}
.starS.star1::before,
.starS.star2::before {
  width: 3px;
}
.starS.star3::before,
.starS.star4::before {
  width: 5px;
}
.starS.star5::before {
  width: 6px;
}
.starS.star6::before,
.starS.star7::before {
  width: 8px;
}
.starS.star8::before,
.starS.star9::before {
  width: 9px;
}
.starS.star10::before {
  width: 12px;
}
.starS.star11::before,
.starS.star12::before {
  width: 17px;
}
.starS.star13::before,
.starS.star14::before {
  width: 19px;
}
.starS.star15::before {
  width: 20px;
}
.starS.star16::before,
.starS.star17::before {
  width: 22px;
}
.starS.star18::before,
.starS.star19::before {
  width: 23px;
}
.starS.star20::before {
  width: 26px;
}
.starS.star21::before,
.starS.star22::before {
  width: 31px;
}
.starS.star23::before,
.starS.star24::before {
  width: 33px;
}
.starS.star25::before {
  width: 34px;
}
.starS.star26::before,
.starS.star27::before {
  width: 36px;
}
.starS.star28::before,
.starS.star29::before {
  width: 37px;
}
.starS.star30::before {
  width: 40px;
}
.starS.star31::before,
.starS.star32::before {
  width: 45px;
}
.starS.star33::before,
.starS.star34::before {
  width: 47px;
}
.starS.star35::before {
  width: 48px;
}
.starS.star36::before,
.starS.star37::before {
  width: 50px;
}
.starS.star38::before,
.starS.star39::before {
  width: 51px;
}
.starS.star40::before {
  width: 54px;
}
.starS.star41::before,
.starS.star42::before {
  width: 59px;
}
.starS.star43::before,
.starS.star44::before {
  width: 61px;
}
.starS.star45::before {
  width: 62px;
}
.starS.star46::before,
.starS.star47::before {
  width: 64px;
}
.starS.star48::before,
.starS.star49::before {
  width: 65px;
}
.starS.star50::before {
  width: 68px;
}

/* Button */
.btn-primary {
  display: block;
  background: linear-gradient(#38affc, #0174e7);
  border: 1px solid #2171e0;
  border-radius: 4px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
}

.btn-primary:hover {
  background: linear-gradient(#2182e7, #3844ce);
  color: #cde9f7;
}

.btn-secondary {
  display: block;
  background: linear-gradient(#fff, #dfeef7);
  border: 1px solid #1558ce;
  border-radius: 4px;
  color: #1558ce;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
}

.btn-secondary:hover {
  background: linear-gradient(#dfeef7, #b9dbea);
  color: #0182e7;
}

.btn-normally {
  display: block;
  background: #f4f2f2;
  background: linear-gradient(#fff, #eae6e5);
  border: solid 1px #938c89;
  border-radius: 4px;
  color: #3b1800;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
}

.btn-normally:hover {
  background: #e8e3e1;
  background: linear-gradient(#f4f0ef, #ddd6d3);
  color: #595656;
}

.btnReserveStatus a {
  width: 160px;
  height: 32px;
  line-height: 30px;
}

.btnReservePlan a {
  width: 200px;
  height: 40px;
  background: linear-gradient(#38affc, #0174e7);
  color: #fff;
  text-decoration: none;
  line-height: 38px;
  font-size: 16px;
}

.btnPrintMap {
  width: 160px;
  height: 32px;
  font-family: inherit;
  line-height: 30px;
}

.btnShare {
  position: relative;
  padding-left: 20px;
  background: url('/ou/d/cs/pc/image/icon_share.svg') no-repeat 0 center / 15px auto;
}

.btnMail {
  padding-left: 20px;
  background: url('/ou/d/cs/pc/image/icon_mail.svg') no-repeat 0 center / 16px auto;
  cursor: pointer;
}

.detailHeader-btnArea .btnMail span {
  text-decoration: none;
  color: #1558ce;
}

.detailHeader-btnArea .btnMail span:hover {
  color: #e77611;
}

.btnShare .snsCon {
  display: block;
  width: 200px;
  position: absolute;
  margin: 0 auto;
  top: -9999px;
  left: 0;
  z-index: 100;
}

/* label */
.planTags {
  display: inline-block;
  overflow: hidden;
  letter-spacing: -.3em;
  vertical-align: -1px;
}

.planTags > li {
  display: inline-block;
  height: 16px;
  padding: 0 4px;
  margin-left: 5px;
  letter-spacing: normal;
}

.planTags > li:first-child {
  margin-left: 0;
}

.planTag__point {
  border: 1px solid #918b8a;
  color: #918b8a;
  font-size: 10px;
  font-weight: bold;
  line-height: 1.5;
}

.planTag__reserve {
  border: 1px solid #e78a13;
  color: #e78a13;
  font-size: 10px;
  font-weight: bold;
  line-height: 1.5;
}

.planTag__payment {
  background-color: #399aca;
  color: #fff;
  font-size: 10px;
  font-weight: bold;
  line-height: 1.6;
}

.reserveTag {
  background: #e77611;
  border: solid 1px #e77611;
  color: #fff;
}

/*
 * エラーメッセージ
 */
.detailAlert {
  background: #ffebeb;
  border: 1px solid #f00;
  border-radius: 3px;
  color: #f00;
  font-weight: bold;
  padding: 10px;
  margin-bottom: 20px;
}

/* detail-header */
.detailHeader {
  width: 740px;
  margin-bottom: 20px;
  font-size: 12px;
  line-height: 20px;
}

.detailHeader::after {
  content: '';
  display: block;
  clear: both;
}

.detailHeader .detailHeader-infoArea {
  float: left;
  width: 525px;
  margin-right: 15px;
}

.detailHeader .detailTitle {
  margin-bottom: 5px;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.3;
}

.detailHeader-ratingArea {
  overflow: hidden;
}

.detailHeader-ratingArea .starM {
  vertical-align: -1px;
}

.detailHeader-ratingArea .rating {
  float: left;
}

.detailHeader-ratingArea .reviewPoint {
  display: inline-block;
  float: none;
  margin-right: 2px;
  font-size: 16px;
  color: #e77611;
  font-weight: bold;
}

.detailHeader-ratingArea .reviewCount {
  display: inline-block;
  float: none;
  margin-left: 2px;
  font-size: 14px;
}

.detailHeader-tags {
  margin-top: 8px;
  font-size: 0;
  line-height: 1;
}

.detailHeader-tags > li {
  display: inline-block;
  font-size: 10px;
  border: solid 1px #918b8a;
  padding: 0 4px;
  margin-right: 5px;
  line-height: 14px;
  color: #918b8a;
  font-weight: bold;
}

.detailHeader-tags > .reserveTag {
  margin-top: 0;
  border: solid 1px #e77611;
  color: #fff
}

.detailHeader-tags > .tagSpots {
  padding-left: 15px;
  border: solid 1px #e77611;
  color: #e77611;
  background: url('/ou/d/cs/pc/image/icon_royalroad.svg') no-repeat 3px center / 10px auto;
}

.detailHeader-categories {
  margin-top: 20px;
}

.detailHeader .detailHeader-categories dl::after {
  content: '';
  display: block;
  clear: both;
}

.detailHeader .detailHeader-categories dt {
  float: left;
  width: 60px;
  padding-top: 5px;
  line-height: 1.5;
  font-weight: bold;
}

.detailHeader .detailHeader-categories .c-area,
.detailHeader .detailHeader-categories .c-genre {
  position: relative;
}

.detailHeader .detailHeader-categories .c-genre {
  margin-top: 8px;
}

.detailHeader .detailHeader-categories .dropdown {
  float: left;
  position: relative;
  margin: 8px 8px 0 0;
}

.detailHeader .detailHeader-categories .dropdown .dropdownList {
  display: none;
  position: absolute;
  top: 10;
  left: -1;
  margin-top: -4px;
  padding: 8px 0;
  min-width: 300px;
  background: #fff;
  border: solid 1px #bcb6b3;
  border-radius:  0 4px 4px 4px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .2);
  z-index: 11;
}

.detailHeader .detailHeader-categories .dropdown.isOpen::after {
  content: '';
  display: block;
  width: calc(100% - 2px);
  height: 2px;
  position: absolute;
  left: 1px;
  bottom: 3px;
  z-index: 12;
  background-color: #fff;
}

.detailHeader .detailHeader-categories .dropdown.isOpen .dropdownCurrent {
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .2);
}

.detailHeader .detailHeader-categories .dropdown .dropdownCurrent {
  display: block;
  height: 28px;
  padding: 4px 20px 4px 3px;
  border: solid 1px #bcb6b3;
  border-radius: 4px;
  background: url('/ou/d/cs/pc/image/icon_chevron_down_gray.svg') #fff no-repeat right 5px top 10px / 10px auto;
  color: #3b1800;
  text-decoration: none;
  font-size: 11px;
  line-height: 1.6;
  overflow: hidden;
  cursor: pointer;
  z-index: 11;
}

.detailHeader .detailHeader-categories .dropdown:last-child {
  margin-right: 0;
}

.detailHeader-categoriesInner {
  float: left;
  width: 465px;
  margin-top: -8px;
}

.detailHeader-categoriesInner ul::after {
  content: '';
  display: block;
  clear: both;
}

.detailHeader .detailHeader-categories .dropdown .dropdownList .categoryList li {
  padding-top: 4px;
  font-size: 11px;
  line-height: 1.5;
}

.detailHeader .detailHeader-categories .dropdown .dropdownList .categoryList li:first-child {
  padding-top: 0;
}

.detailHeader .detailHeader-categories .dropdown .dropdownList .categoryList a {
  display: block;
  padding: 4px;
  color: #1558ce;
  text-decoration: none;
  white-space: nowrap;
}

.detailHeader .detailHeader-categories .dropdown .dropdownList .categoryList a:hover {
  background-color: #fef5d8; 
  color: #e77611;
}

.detailHeader .detailHeader-categories .headerToggleBtn {
  display: inline-block;
  margin: 8px 0 0 -60px;
  white-space: nowrap;
  cursor: pointer;
}

.detailHeader-categories .headerToggleBtn {
  background: url('/ou/d/cs/pc/image/icon_plus_circle.svg') no-repeat 0 center / 14px auto;
  padding-left: 18px;
  line-height: 1.5;
  color: #1558ce;
  font-weight: bold;
}

.detailHeader-categories .headerToggleBtn:hover {
  color: #e77611;
}

.detailHeader-categories .headerToggleBtn::before {
  content: '全てみる';
}

#headerToggleSwitch:checked ~ .headerToggleBtn::before {
  content: '閉じる';
}

#headerToggleSwitch:checked ~ .headerToggleBtn {
  background: url('/ou/d/cs/pc/image/icon_minus_circle.svg') no-repeat 0 center / 14px auto;
}

#headerToggleSwitch {
  position: absolute;
  width: 0;
  height: 0;
  margin: 0;
  visibility: hidden;
  opacity: 0;
}

.headerToggleContents {
  display: none;
}

#headerToggleSwitch:checked ~ .headerToggleContents {
  display: block;
}

.detailHeader .detailHeader-btnArea {
  position: relative;
  float: right;
  width: 200px;
}

.detailHeader .detailHeader-btnArea li {
  float: left;
  margin-bottom: 10px;
  line-height: 1.5;
}

.detailHeader .detailHeader-btnArea li.btnReviewEntryEditLB {
  position: relative;
}

.detailHeader .detailHeader-btnArea li.btnReviewEntryLB,
.detailHeader .detailHeader-btnArea li.btnReviewEntryEditLB,
.detailHeader .detailHeader-btnArea li.btnShare {
  margin-right: 10px;
}

.detailHeader .detailHeader-btnArea li.btnWannagoSpot,
.detailHeader .detailHeader-btnArea li.btnWentSpot,
.detailHeader .detailHeader-btnArea li.btnWentSpotCurrent,
.detailHeader .detailHeader-btnArea li.btnWannagoSpotCurrent {
  margin-bottom: 10px;
  margin-right: 10px;
}

.detailHeader-btnArea .btnWentSpot,
.detailHeader-btnArea .btnWannagoSpot,
.detailHeader-btnArea .btnClipSpot,
.detailHeader-btnArea .btnWentSpotCurrent,
.detailHeader-btnArea .btnWannagoSpotCurrent,
.detailHeader-btnArea .btnClipSpotCurrent {
  width: calc(33% - 6px);
}

.detailHeader-btnArea .btnWentSpot span,
.detailHeader-btnArea .btnWannagoSpot span,
.detailHeader-btnArea .btnClipSpot span,
.detailHeader-btnArea .btnWentSpotCurrent span,
.detailHeader-btnArea .btnWannagoSpotCurrent span,
.detailHeader-btnArea .btnClipSpotCurrent span {
  width: 100%;
  height: 32px;
  font-size: 12px;
  font-weight: bold;
  line-height: 30px;
}

.detailHeader-btnArea .btnClipSpot span {
  background: linear-gradient(#fff, #eae6e5);
}

.detailHeader-btnArea .btnClipSpot span,
.detailHeader-btnArea .btnClipSpotCurrent span {
  display: block;
  background: #f4f2f2;
  background: linear-gradient(#fff, #eae6e5);
  border: solid 1px #938c89;
  border-radius: 4px;
  color: #3b1800;
  text-align: center;
  cursor: pointer;
}

.detailHeader-btnArea .btnClipSpot span:hover,
.detailHeader-btnArea .btnClipSpotCurrent span:hover {
  background: #e8e3e1;
  background: linear-gradient(#f4f0ef, #ddd6d3);
  color: #595656;
}

.detailHeader-btnArea .btnWentSpotCurrent > span,
.detailHeader-btnArea .btnWentSpotCurrent > span:hover,
.detailHeader-btnArea .btnWannagoSpotCurrent > span,
.detailHeader-btnArea .btnWannagoSpotCurrent > span:hover,
.detailHeader-btnArea .btnClipSpotCurrent > span,
.detailHeader-btnArea .btnClipSpotCurrent > span:hover {
  background: #ccc;
  border-color: #ccc;
  color: #fff;
}

.detailHeader-btnArea .btnReviewEntryLB,
.detailHeader-btnArea .btnReviewEntryEditLB,
.detailHeader-btnArea .btnPhotoEntryLB,
.detailHeader-btnArea .btnShare,
.detailHeader-btnArea .btnMail {
  width: calc(50% - 5px);
}

.detailHeader-btnArea .btnReviewEntryLB a,
.detailHeader-btnArea .btnReviewEntryEditLB a,
.detailHeader-btnArea .btnPhotoEntryLB a {
  display: block;
  padding-left: 20px;
}

.detailHeader-btnArea .btnReviewEntryLB a,
.detailHeader-btnArea .btnReviewEntryEditLB a {
  background: url('/ou/d/cs/pc/image/icon_bubble_fill.svg') no-repeat 0 center / 16px auto;
}

.detailHeader-btnArea .btnPhotoEntryLB a {
  background: url('/ou/d/cs/pc/image/icon_photo.svg') no-repeat 0 center / 16px auto;
}

.btnReviewEntryEditLB .draftMark {
  position: absolute;
  top: -4px;
  left: 5px;
  padding-left: 20px;
  color: #e78a13;
  font-size: 10px;
}

.detailHeader-btnArea .btnShareEntry {
  width: 100%;
}

/* 追従 */
.detailHeader.fixed {
  display: flex;
  align-items: center;
  position: fixed;
  top: 0;
  width: 740px;
  padding: 12px 0;
  border-bottom: solid 1px #bcb6b3;
  background: none repeat scroll 0 0 #fff;
  z-index: 999;
}

.detailHeader.fixed .detailTitle,
.detailHeader.fixed .btnReservePlan {
  margin-bottom: 0;
}

.detailHeader.fixed .detailHeader-infoArea,
.detailHeader.fixed .detailHeader .detailHeader-btnArea {
  float: none;
}

.socialIcon.snsBtnBox {
  position: relative;
  width: 168px;
  min-height: 120px;
  background-color: #f8f8f8;
  border: 1px solid #ccc;
  margin-bottom: 10px !important;
  padding: 5px !important;
  text-align: left;
  border-radius: 4px;
}

.socialIcon.snsBtnBox ul {
  text-align: left;
}

.socialIcon.snsBtnBox ul li.nonmrg {
  position: relative;
  display: block;
  float: left;
  margin: 5px 5px 0 0 !important;
}

.socialIcon.snsBtnBox .b-count {
  line-height: 18px;
  display: block;
  width: auto;
  height: 18px;
  background-color: #FFF;
  position: absolute;
  left: 25px;
  top: 1px;
  border: 1px solid #b0c1d8;
  border-radius: 3px;
  padding: 0 5px !important;
  font-size: 12px;
}

.socialIcon.snsBtnBox .b-count::after {
  border-width: 3px;
  border-right-color: #FFF;
  top: 6px;
}

.socialIcon.snsBtnBox .b-count::before {
  border-width: 5px;
  border-right-color: #b0c1d8;
  top: 4px;
}

.socialIcon.snsBtnBox #___plusone_0 {
  width: 65px !important;
}

.socialIcon.snsBtnBox #twitter-widget-0 {
  width: 72px !important;
}

.b-count-common, .socialIcon.snsBtnBox .b-count::after, .socialIcon.snsBtnBox .b-count::before {
  border: solid transparent;
  content: ' ';
  height: 0;
  right: 100%;
  position: absolute;
  width: 0;
}

/* ふるさとクーポンバナー */
.detailHeader-adminCouponBanner {
  clear: both;
  padding-top: 20px;
}

.detailHeader-adminCouponBanner > a {
  display: block;
  cursor: pointer;
}

.detailHeader-adminCouponBanner > a:hover {
  opacity: .6;
}

.detailHeader-adminCouponBanner img {
  vertical-align: bottom;
}

/*
 * detail
 */
.detail .detailTabs {
  display: block;
  height: 42px;
  border-bottom: 2px solid #e77611;
  margin-bottom: 16px;
  padding: 0 0 2px 6px;
}

.detail .detailTabs li {
  float: left;
  margin: 0 1px -2px;
  text-align: center;
}

.detail .detailTabs li a {
  display: block;
  font-size: 12px;
  width: 89px;
  height: 40px;
  padding: 12px 0 0 0;
  line-height: 1.3;
  background-color: #fff;
  border-top: 2px solid #ccc;
  border-left: 2px solid #ccc;
  border-right: 2px solid #ccc;
  border-radius: 4px 4px 0 0;
  font-weight: bold;
  color: #3b1800;
}

.detail .detailTabs li a:hover {
  background-color: #fef5d8;
  color: #e77611;
  border-color: #e77611;
}

.detail .detailTabs li .count {
  font-size: 11px;
}

.detail .detailTabs::after {
  clear: both;
  content: '.';
  display: block;
  height: 0;
  visibility: hidden;
}

.detail .detailTabs .active {
  width: 89px;
  height: 42px;
  color: #e77611;
  border-top: 2px solid #e77611;
  border-left: 2px solid #e77611;
  border-right: 2px solid #e77611;
  border-bottom: 2px solid #fff;
  border-radius: 4px 4px 0 0;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.3;
}

.detail .detailTabs .active > span {
  display: block;
  padding: 12px 0 0 0;
}

.detail .detailTabs .active .tab2Line {
  padding: 7px 0 0 0 !important;
}

.detail .detailTabs .tab2Line a {
  height: 40px;
  padding-top: 5px;
  line-height: 1.2;
}

/* surroundNav */
.surroundNav {
  display: table;
  table-layout: fixed;
  width: 100%;
  margin-bottom: 16px;
  overflow: hidden;
}

.surroundNav::after {
  content: '';
  display: block;
  clear: both;
}

.detailTabs + .surroundNav {
  margin-top: -16px;
}

.surroundNav > li {
  display: table-cell;
  position: relative;
  width: 25%;
  border-bottom: 1px solid #bcb6b3;
  line-height: 1.5;
  text-align: center;
}

.surroundNav li:first-child {
  border-left: none;
}

.surroundNav > li::after {
  content: '';
  position: absolute;
  top: 6px;
  right: -1px;
  height: 30px;
  border-right: 1px solid #e0dbd7;
}

.surroundNav > li:last-child::after {
  content: none;
}

.surroundNav > li > a,
.surroundNav > li > span {
  display: block;
  padding: 14px 0 10px;
  border-bottom: 4px solid #fff;
  color: #3b1800;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  line-height: 1.5;
  text-decoration: none;
}

.surroundNav > li > a {
  cursor: pointer !important;
}  

.surroundNav > li > a:hover,
.surroundNav > li.current > span {
  border-bottom-color: #e77611;
  color: #e77611;
  cursor: default;
}

.surroundNav > li.disabled > span {
  color: #ccc;
  cursor: default;
}

/*
 * tables
 */
.basicInfoTable {
  width: 100%;
  border-top: 1px solid #bcb6b3;
}

.basicInfoTable th,
.basicInfoTable td {
  border-bottom: 1px solid #bcb6b3;
  line-height: 1.5;
  padding: 8px;
  font-size: 12px;
  word-break: break-all;
}

.basicInfoTable th {
  background: #f7f5f2;
  font-weight: bold;
  width: 200px;
  vertical-align: top;
}

.basicInfoTable td .detailMap-canvas {
  height: 400px;
  margin: 8px 0;
}

/* Recoomend */
.relatedList {
  margin-bottom: 40px;
}

.relatedList .moreLink,
.jlnpc-otherPlanList__moreLink {
  margin-top: 20px;
}

.cassetteList-contentRelated .item {
  position: relative;
}

.cassetteList-contentRelated {
  display: flex;
  margin-top: 12px;
  overflow: hidden;
}

/* デザインガイドライン反映後レコメンド (プラン詳細のみ) */
.otherPlanList .cassetteList-contentRelated > li {
  width: 174px;
  margin-left: 14px;
}

.otherPlanList .cassetteList-contentRelated > li:first-of-type {
  margin-left: 0;
}

.otherPlanList .cassetteList-contentRelated > li a {
  display: block;
  height: 100%;
  text-decoration: none;
  border: 1px solid #bcb6b3;
}

.otherPlanList .cassetteList-contentRelated > li:hover h3 {
  color: #e77611;
}

.otherPlanList .cassetteList-contentRelated > li:hover .item-image {
  opacity: 0.6;
}

.otherPlanList .cassetteList-contentRelated > li .item-image {
  position: relative;
  width: 172px;
  height: 129px;
  margin: 0 auto;
}

.otherPlanList .cassetteList-contentRelated > li .item-image img {
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
  vertical-align: bottom;
  transform: translate(-50%, -50%);
}

.otherPlanList .cassetteList-contentRelated > li h3 {
  position: relative;
  display: -webkit-box;
  height: 54px;
  overflow: hidden;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.5;
  color: #1558ce;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  word-break: break-all;
}

.otherPlanList .cassetteList-contentRelated > li .item-info {
  padding: 8px 5px;
  line-height: 1.5;
}

/* 周辺情報 */
.surroundList {
  margin-bottom: 40px;
}
.surroundList .moreLink {
  margin-top: 12px;
}
.rankCaution {
  margin-top: 8px;
}
.rankCaution > p {
  margin-top: 2px;
  color: #5b4843;
}
.rankCaution > p:first-child {
  margin-top: 0;
}
.cassetteList-surround {
  margin-top: 20px;
}
.cassetteList-surround > li {
  cursor: pointer;
  border-bottom: 1px solid #bcb6b3;
}
.cassetteList-surround > li:first-child {
  border-top: 1px solid #bcb6b3;
}
.cassetteList-surround > li:hover .item-mainImg {
  opacity: 0.6;
}
.cassetteList-surround > li:hover .item-name a {
  color: #e77611;
}
.cassetteList-surround > li:has(.item-innerBtnArea ul:hover) .item-name a,
.cassetteList-surround > li:has(.reviewCount:hover) .item-name a {
  color: #1558ce;
}
.cassetteList-surround > li:has(.reviewCount:hover) .item-mainImg,
.cassetteList-surround > li:has(.item-innerBtnArea ul:hover) .item-mainImg,
.cassetteList-surround > li:has(.reviewCount:hover) .item-thumbs,
.cassetteList-surround > li:has(.item-innerBtnArea ul:hover) .item-thumbs {
  opacity: 1;
}
.cassetteList-surround .item-listContents {
  display: flex;
  padding: 12px 8px;
  overflow: hidden;
}
.cassetteList-surround .item-photo {
  position: relative;
  margin-right: 8px;
}
.cassetteList-surround .item-mainImg {
  width: 212px;
  height: 159px;
  overflow: hidden;
  outline: 1px solid #bcb6b3;
  outline-offset: -1px;
}
.cassetteList-surround .item-mainImg > img {
  object-fit: contain;
}
.cassetteList-surround .item-info {
  flex: 1;
  min-width: 0;
}
.cassetteList-surround .item-info .item-innerBtnArea {
  margin: 0 0 0 12px;
}
.cassetteList-surround .item-info .item-innerBtnArea li {
  margin-top: 8px;
}
.cassetteList-surround .item-info .item-innerBtnArea li:first-child {
  margin-top: 0;
}
.cassetteList-surround .btnWannagoSpotGray > button,
.cassetteList-surround .btnWentSpotGray > button {
  width: 60px;
  height: 32px;
  font-family: inherit;
  font-size: 12px;
  line-height: 30px;
}
.cassetteList-surround .btnWannagoSpotGray.current > button,
.cassetteList-surround .btnWentSpotGray.current > button {
  color: #fff;
  background: #ccc;
  border-color: #ccc;
}
.cassetteList-surround .item-infoHeader {
  display: flex;
  margin-bottom: 12px;
}
.cassetteList-surround .item-innerInfo {
  flex: 1;
  min-width: 0;
}
.cassetteList-surround .item-info .item-distance {
  overflow: hidden;
  color: #5b4843;
}

.cassetteList-surround .item-info .item-distance > span{
  color: #e77611;
}

.cassetteList-surround .item-info .item-name {
  margin-top: 4px;
}
.cassetteList-surround .item-info .item-name a {
  font-size: 14px;
  font-weight: bold;
}
.cassetteList-surround .item-info .item-categories {
  margin-top: 4px;
  overflow: hidden;
  color: #5b4843;
}
.cassetteList-surround .reviewPoint {
  display: inline-block;
  margin-right: 2px;
  font-size: 14px;
  font-weight: bold;
  color: #e77611;
}
.cassetteList-surround .rating .starM {
  vertical-align: -1px;
}
.cassetteList-surround .item-info .reviewCount {
  display: inline-block;
  margin-left: 2px;
}
.cassetteList-surround .item-info .reviewDetail {
  margin-top: 12px;
}
.cassetteList-surround .item-info .reviewDetail li {
  margin-bottom: 6px;
  font-size: 11px;
  line-height: 12px;
}
.cassetteList-surround .item-hotelCatch {
  margin-top: 8px;
  overflow: hidden;
  font-weight: bold;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cassetteList-surround .item-hotelCopy {
  display: -webkit-box;
  width: 100%;
  max-height: 54px;
  margin-top: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  word-break: break-all;
}

/* 観光スポット 宿 */
.surroundListHeader {
  margin-top: 20px;
}
.surroundListHeader-sort {
  margin-bottom: 7px;
  text-align: right;
}
.surroundListHeader-sortGroup {
  display: flex;
  justify-content: end;
  overflow: hidden;
  line-height: 1;
}
.surroundListHeader-sort ul {
  overflow: hidden;
}
.surroundListHeader-sort ul {
  display: flex;
}
.surroundListHeader-sort ul li {
  padding-left: 5px;
  margin-left: 5px;
  border-left: 1px solid #ccc;
}
.surroundListHeader-sort ul li:first-child {
  padding-left: 0;
  border: 0;
}
.surroundListHeader-sort ul li a {
  cursor: pointer;
}
.surroundListHeader-sort span {
  padding: 0;
  font-weight: bold;
  color: #e77611;
  border-radius: 0;
}
.surroundList .item-access,
.surroundList .item-lowestPrice {
  display: flex;
  margin-bottom: 8px;
  overflow: hidden;
}
.surroundList .item-access dt,
.surroundList .item-lowestPrice dt {
  margin-right: 8px;
  font-weight: bold;
}
.surroundList .item-access dt {
  padding-left: 22px;
  background: url('/ou/d/cs/pc/image/icon_location.svg') no-repeat 3px 0 / auto 18px;
}
.surroundList .item-lowestPrice dt {
  padding-left: 22px;
  background: url('/ou/d/cs/pc/image/icon_price_outline_gra.svg') no-repeat 0 0 / auto 18px;
}
.surroundList .item-access dd,
.surroundList .item-lowestPrice dd {
  flex: 1;
}

/* 周辺情報 観光スポット */
.cassetteList-surround .item-activityLabel {
  position: absolute;
  top: 1px;
  left: 1px;
  z-index: 1;
}
.cassetteList-surround .item-activityLabel > .reserveTag {
  display: block;
  padding: 0 4px;
  font-size: 10px;
  font-weight: bold;
  line-height: 14px;
  color: #fff;
  background-color: #e77611;
}
.cassetteList-surround .item-thumbs {
  display: flex;
  margin-top: 8px;
}
.cassetteList-surround .item-thumbs li {
  position: relative;
  width: 68px;
  height: 51px;
  margin-left: 4px;
  overflow: hidden;
  background-color: #fff;
  outline: 1px solid #bcb6b3;
  outline-offset: -1px;
}
.cassetteList-surround .item-thumbs li:first-child {
  margin-left: 0;
}
.cassetteList-surround .item-thumbs li > img {
  object-fit: contain;
}
.cassetteList-surround > li:hover .item-thumbs {
  opacity: 0.6;
}
.cassetteList-surround .item-tags {
  margin-top: 8px;
  font-size: 0;
  line-height: 1;
}
.cassetteList-surround .item-tags > li {
  display: inline-block;
  padding: 0 4px;
  margin-right: 5px;
  font-size: 10px;
  font-weight: bold;
  line-height: 14px;
  color: #918b8a;
  border: solid 1px #918b8a;
}
.cassetteList-surround .item-tags > .tagSpots {
  padding-left: 15px;
  color: #e77611;
  background: url('/ou/d/cs/pc/image/icon_royalroad.svg') no-repeat 3px center / 10px auto;
  border: solid 1px #e77611;
}
.cassetteList-surround .item-reviewText {
  width: 100%;
  padding: 8px;
  margin-top: 8px;
  background-color: #f7f5f2;
}
.cassetteList-surround .item-reviewText p {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-all;
}
.cassetteList-surround .item-reviewText span {
  display: block;
  margin-top: 4px;
  color: #5b4843;
  text-align: right;
}
.cassetteList-surround .item-reviewText a {
  display: block;
  margin-top: 4px;
  text-align: right;
}
.cassetteList-surround .item-desc {
  display: -webkit-box;
  width: 100%;
  max-height: 54px;
  margin-top: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-all;
}

/* 周辺情報 グルメ一覧 */
.cassetteList-surround .item-tags > .tagRestaurants {
  padding-left: 15px;
  color: #e77611;
  background: url('/ou/d/cs/pc/image/icon_restaurants.svg') no-repeat 3px center / auto 12px;
  border: solid 1px #e77611;
}
.cassetteList-surround .gourmetRatings,
.cassetteList-surround .gourmetPrices {
  display: flex;
  margin-top: 8px;
  color: #5b4843;
}
.cassetteList-surround .gourmetRatings dt,
.cassetteList-surround .gourmetPrices dt {
  margin-left: 8px;
  font-weight: bold;
}
.cassetteList-surround .gourmetRatings dt:first-child,
.cassetteList-surround .gourmetPrices dt:first-child {
  margin-left: 0;
}

/* 周辺情報 イベント一覧 */
.cassetteList-surround .item-innerInfo .item-tags {
  margin-top: 0;
  margin-bottom: 4px;
}
.cassetteList-surround .item-eventInfo {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.cassetteList-surround .item-eventInfo dt {
  width: 36px;
  font-weight: bold;
}
.cassetteList-surround .item-eventInfo dd {
  width: calc(100% - 36px);
}
.cassetteList-surround .item-eventInfo dt:first-child,
.cassetteList-surround .item-eventInfo dd:nth-child(2) {
  margin-bottom: 4px;
}

/* Googleマップレビュレーション準拠対応 */
dialog.zlDrU-basic-dialog-element {
  margin: auto;
}