/* 共通 */
html{
    width:100%;
    min-width:100%;
    height:100%;
}

body {
    width:100%;
    min-width:100%;
    height:100%;
    background-size:450px;
    /*background-color: #f5f2f3;*/
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
}
div.catalogapp{
    position: relative;
    width:100%;
    background-color: #f3f0e9;
    z-index: 2;
}


div {
	color: #222222;
}
div.eventTopScroll{
	color: #222222;
	height: 50%;
}
div.subEventTopScroll{
        color: #222222;
        height: 50%;
}

a:hover,a:focus{
    text-decoration:none
}

h1.no-margin {
    margin-top: 0; 
    margin-bottom: 0;
}

h1.no-margin-text-bold {
    margin-top: 0; 
    margin-bottom: 0;
    font-weight: bold;
}

/* グローバルトップ */

div.globalHeader img{
	width: 100%;
}

div.globalTopMessage{
	background: #EEE;
	border: 3px solid #DDD;
	color: #111;
	width: 570px;
	padding: 10px 10px;
	margin: 250px auto;
	font-size: 20px;
}

/* イベントトップ */

div.eventList {
    margin: 0.3em 0;
}

div.eventList img {
    width: 100%;
}

div.eventTopBase, div.subEventTopBase{
    position: relative;
	  z-index:2;
}
@media screen and (min-width: 641px){
    div.subEventTopBase{
        width: 1024px;
        height: 190px;
    }
}

div.eventTopBase img {
    width: 100%;
    height: 100%;
}

div.eventTopBase1023px img {
    width: 1023px;
    height: 100%;
}

div.subEventTopBase img {
    width: 100%;
    height: 100%;  
}

div.offlineTop{
	width:100%;
	background-color:#a008;
	color:white;
	position:absolute;
	top:0px;
	height:60px;
	text-align: center;
	font-size:26px;
	vertical-align:middle;
	line-height:60px;
}

div.favoriteBtn {
	position: absolute;
	left: 10px;
    top: 10px;
}

div.favoriteBtn img {
	width: 145px;
	height: 40px;
    border-radius:6px;
}

div.favoriteDeleteBtn {
	position: absolute;
	left: 165px;
    top: 10px;
}

div.favoriteDeleteBtn img {
	width: 175px;
	height: 40px;
    border-radius:6px;
}

div.otherBtn {
	position: absolute;
	right: 165px;
    top: 10px;
    cursor: pointer;
}

div.otherBtn img {
	width: 145px;
	height: 40px;
    border-radius:6px;
}

div.topBtn {
	position: absolute;
    width: 145px;
	right: 10px;
    top: 10px;
}

div.topBtn img {
	width: 145px;
	height: 40px;
    border-radius:6px;
}

div.multipleModeBtn{
    position:absolute;
    right:0;
    bottom: 0;
    text-align:right;
    width: 33.3%;
}
div.multipleModeBtn img{
    width: 100%;
    height: 100%;
    color:#fff;
    font-weight:bold;
    opacity: 0;
}

div.costumesReserveListBtn{
    position: absolute;
    top: 10px;
    left: 350px;
}

div.costumesReserveListBtn img{
    display: table-cell;
    width: 170px;
    height:40px;
}

div.hairCatalogBtn{
    position: absolute;
    top:10px;
    right: 320px;
    cursor: pointer;
}

div.hairCatalogBtn img{
    width: 170px;
    height: 40px;
    border-radius:6px;
/*
    width: 145px;
    color: #fff;
    font-size:15px;
    font-weight: bold;
    border-radius: 5px;
    background: #07b82d;
    text-align: center;
    vertical-align: middle;
*/
}

div.displayCostumeCloseBtn {
    display: block;
    position: absolute;
    right: 10px;
    top: 10px;
    width: 145px;
    height: 40px;
    border-radius:6px;
    color: white;
    background-color: rgb(36,145,202);
    text-align: center;
    line-height: 40px;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
}

div.eventTitleImg {
	position: absolute;
	top: 60%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}

.header-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    border-radius: 6px;
    font-size: 15px;
    font-weight: bold;
    color: #ffffff !important;
    text-decoration: none !important;
    box-sizing: border-box;
    box-shadow: 0px 2px 4px rgba(0,0,0,0.15);
    transition: all 0.2s;
    cursor: pointer;
    vertical-align: middle;
    width: 145px;
}
.header-btn:hover {
    opacity: 0.85;
    text-decoration: none;
    color: #ffffff;
}
.header-btn-disabled, 
.header-btn-non {
    background-color: #a8a8a8 !important;
    color: #666666 !important;
    cursor: default;
    box-shadow: none;
}
.header-btn-disabled:hover,
.header-btn-non:hover {
    opacity: 1;
}
.header-btn-blue { background-color: #2da1d6; }
.header-btn-pink { background-color: #fe67d1; }
.header-btn-brown { background-color: #beaea3; }
.header-btn-orange { background-color: #ffae22; }
.header-btn-green { background-color: #07b82d; }
.header-btn-grey { background-color: #888888; }

/*
*イベント画面のレイアウト
*/
div.eventTopList{
	float: left;
	position: relative;
    z-index:2;
}
@media screen and (min-width: 641px){
	div.eventTopList{
		width: 33.3%;
		height: 55%;
	}
}
div.eventTopList2{
	float: left;
  position: relative;
	z-index:2;
}
@media screen and (min-width: 641px){
    div.eventTopList2{
      width: 50%;
    }
}
div.eventTopList3{
	float: left;
  position: relative;
	z-index:2;
}
@media screen and (min-width: 641px){
    div.eventTopList3{
      width: 33.3%;
    }
}
/*
*サブイベント画面のレイアウト
*/
/*サブメニュー数：１*/
div.subEventTopList1{
  position: relative;
  z-index:2;
}
@media screen and (min-width: 641px){
  div.subEventTopList1{
	  width: 100%;
      float: left;
  }
}
/*サブメニュー数：２*/
div.subEventTopList2{
    position: relative;
    z-index:2;
}
@media screen and (min-width: 641px){
    div.subEventTopList2{
        width:50%;
        float: left;
    }
}
/*サブメニュー数：３*/
div.subEventTopList3{
    position: relative;
    z-index:2;
}
@media screen and (min-width: 641px){
    div.subEventTopList3{
        width:33.3%;
        float: left;
    }
}
/*サブメニュー数：４*/
div.subEventTopList4{
    position: relative;
    z-index:2;
}
@media screen and (min-width: 641px){
    div.subEventTopList4{
        width:25%;
        float: left;
    }
}
/*サブメニュー数：５*/
div.subEventTopList5{
    position: relative;
    z-index:2;
}
@media screen and (min-width: 641px){
    div.subEventTopList5{
        width: calc((100% - 4px) / 5);
        float: left;
    }
}

/*サブメニュー数：６*/
div.subEventTopList6{
    position: relative;
    z-index:2;
}
@media screen and (min-width: 641px){
    div.subEventTopList6{
      width:170px;
      height: 576px;
      float: left;
    }
}

/*サブメニュー数：１２*/
div.subEventTopList12{
    position: relative;
    z-index:2;
}
@media screen and (min-width: 641px){
    div.subEventTopList12{
      width:170px;
      height: 288px;
      float: left;      /* スマホ版はフッターのレイアウトが崩れるためPC版のみleftを指定 */
    }
}

/*サブメニュー数：１８*/
div.subEventTopList18{
    position: relative;
    z-index:2;
}
@media screen and (min-width: 641px){
    div.subEventTopList18{
      width:170px;
      height: 192px;
      float: left;
    }
}

/*サブメニュー数：２４*/
div.subEventTopList24{
    position: relative;
    z-index:2;
}
@media screen and (min-width: 641px){
    div.subEventTopList24{
      width: 170px;
      height: 144px;
      float: left;
    }
}

/*サブメニュー数：7x2*/
div.subEventTopList14{
    position: relative;
    z-index:2;
}
@media screen and (min-width: 641px){
    div.subEventTopList14{
      width: 146px;
      height: 288px;
      float: left;
    }
}

/*サブメニュー数：7x3*/
div.subEventTopList21{
    position: relative;
    z-index:2;
}
@media screen and (min-width: 641px){
    div.subEventTopList21{
      width: 146px;
      height: 192px;
      float: left;
    }
}

/*サブメニュー数：7x4*/
div.subEventTopList28{
    position: relative;
    z-index:2;
}
@media screen and (min-width: 641px){
    div.subEventTopList28{
      width: 146px;
      height: 144px;
      float: left;
    }
}
@media screen and (min-width: 641px){
    div.sub-menu-lists-6-col {
        padding-left: 2px;
        padding-right: 2px;
    }
    div.sub-menu-lists-6-col a{
        width: 100%;
        height: 100%;
        display: block;
    }

    div.sub-menu-lists-7-col {
        padding-left: 1px;
        padding-right: 1px;
    }
    div.sub-menu-lists-7-col a{
        width: 100%;
        height: 100%;
        display: block;
    }

    div.sub-menu-lists a{
        width: 100%;
        height: 100%;
        display: block;
    }
}

div.eventTopList img {
	height: 100%;
	width: 100%;
}

div.eventTopList2 img {
	width: 100%;
	height: 100%;
}

div.eventTopList3 img {
        width: 100%;
        height: 100%;
}

div.eventTopListIcon img {
	position: absolute;
	left: 0;
    top: 0;
	height: 210px;
	width: 175px;
}

div.eventTopListIcon2 img {
	position: absolute;
	left: 0;
    top: 0;
	padding-top: 40px;
	height: 380px;
	width: 315px;
}

div.eventTopListIcon3 img {
	position: absolute;
	left: 0;
    top: 0;
}

div.costumeSearchModalBtn {
    position: absolute;
    left: 350px;
    top: 10px;
}

div.costumeSearchModalBtn img {
    width: 145px;
    height: 40px;
    border-radius: 6px;
}

div.costumeSearchModalContent {
    background-color: #ffffff;
    height: 400px;
    width: 630px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border: #996633 solid 3px;
    padding-top: 100px;
}
.no-scroll {
    overflow: hidden;
}

form.inputForm .modalText {
    font-size: 28px;
    font-weight: bold;
    padding-bottom: 5px;
}

form.inputForm .nyuryokuhuyoText {
    font-size:22px;
}

.unsearchableMessage {
    position: absolute;
    font-size: 20px;
    top: calc(50% + 300px);
    left: 53%;
    transform: translate(-50%,-50%);
    text-align: left;
}

/* 認証用電話番号確認モーダル */

/* モーダルCSS */
.authPhoneNumberCheckModal {
  position:absolute;
  width:100%;
  height:100vh;
  top:0;
  left:0;
  display:none;
}

.authPhoneNumberCheckModalOverLay {
  position:fixed;
	top:0;
	left:0;
	background:rgba(255,255,255,0.9);
	width:100%;
	height:120%;
	z-index:11;
}

/* モーダルウィンドウの中身のスタイル */
.authPhoneNumberCheckModal .inner {
	position:absolute;
	z-index:12;
	position:relative;
    height:100%;
	margin:0 auto;
	text-align:center;
}

.modalContents {
  font-size: 20px;
  color: #333;
  background-color: #ffffff;
  height: 350px;
  width: 550px;
  position:fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  border: #f25388 solid 3px;
  border-radius: 10px;
  padding-top: 90px;
}

/* ボタンデザイン */
input.authPhoneNumberCheckModalBtn, input.authPhoneNumberCheckModalBtn {
    border-radius: 50px;
    border-style: none;
    height: 60px;
    width: 170px;
    position: absolute;
    bottom: 70px;
    cursor: pointer;
    font-size: 20px;
    line-height: 55px;
}

input.authPhoneNumberCheckApplyBtn {
    background-color: #f25388;
    color: whitesmoke;
    left: 75px;
}

input.authPhoneNumberCheckCancelBtn {
    background-color: #f2f0e9;
    color: #333;
    right: 75px;
}

@media screen and (max-width: 641px){
  /* モーダルCSS */
  .authPhoneNumberCheckModal {
    position:absolute;
    width:100%;
    height:100vh;
    top:0;
    left:0;
    display:none;
  }

  .authPhoneNumberCheckModalOverLay {
    position:fixed;
    top:0;
    left:0;
    background:rgba(255,255,255,0.9);
    width:100%;
    height:120%;
    z-index:11;
  }

  /* モーダルウィンドウの中身のスタイル */
  .authPhoneNumberCheckModal .inner {
    position:absolute;
    z-index:12;
    position:relative;
      height:100%;
    margin:0 auto;
    text-align:center;
  }

  .modalContents {
    font-size: 16px;
    height: 320px;
    width: 340px;
    position:fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    padding-top: 70px;
  }

  /* ボタンデザイン */
  input.authPhoneNumberCheckModalBtn, input.authPhoneNumberCheckModalBtn {
      height: 50px;
      width: 110px;
      bottom: 60px;
      font-size: 16px;
      line-height: 45px;
  }

  input.authPhoneNumberCheckCancelBtn {
      right: 45px;
  }

  input.authPhoneNumberCheckApplyBtn {
      left: 45px;
  }
}
/* 認証用電話番号確認モーダルここまで */

form.inputForm input {
    border: #996633 solid 1px;
    height: 50px;
    width: 280px;
    font-size: 25px;
    padding: 10px;
}

form.inputForm input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: searchfield-cancel-button;
}


/* サブイベントトップ */

div.subEventTopList1 img,
div.subEventTopList2 img,
div.subEventTopList3 img,
div.subEventTopList4 img,
div.subEventTopList5 img,
div.subEventTopList6 img,
div.subEventTopList12 img,
div.subEventTopList14 img,
div.subEventTopList18 img,
div.subEventTopList21 img,
div.subEventTopList24 img,
div.subEventTopList28 img {
    width: 100%;
    height: 100%;
}

/* 衣装一覧トップ */

div.searchBtn {
	position:absolute;
    cursor: pointer;
}

div.searchBtn img {
	width: 185px;
	height: 49px;
	margin: 28px 0px 0px 40px;
	float: left;
}

div.searchBtnWeb {
	position:absolute;
    cursor: pointer;
}

div.searchBtnWeb img {
	width: 185px;
	height: 49px;
	margin: 28px 0px 0px 40px;
	float: left;
}

div.offlineMessage {
	position:absolute;
	right: 10px;
	top: 73px;
	color: #FF0000;
}

div.offlineMessage2 {
	position:absolute;
	right: 10px;
	top: 68px;
	color: #FF0000;
}

div.costumeIcon {
    position:relative;
    display:inline-block;
	height: 255px;
	width: 155px;
}

div.costumeIcon img {
	width: 155px;
	height: 185px;
	margin: 15px 0px 0px 0px;
}

div.costumeIcon_shrine {
    position:relative;
    display:inline-block;
	height: 255px;
	width: 155px;
}
div.managementBtn{
  height: 0px;
  text-align: right;
}
div.managementBtn img {
  width: 100px;
  height: 60px;
  position: relative;
  bottom: 85px;
  right: 20px
}
div.managementRegistration{
  height: 0px;
  text-align: right;
}
div.managementRegistration img {
  width: 100px;
  height: 60px;
  position: relative;
  bottom: 85px;
  right: 20px
}

div.managementBackBtn{
  height: 0px;
  text-align: right;
}
div.managementBackBtn img {
  width: 170px;
  height: 72px;
  position: relative;
  bottom: 89px;
  right: 130px;
}

div.costumeIcon_shrine img {
	width: 155px;
	height: 185px;
}

div.zoom_rentalBtn img {
	position: relative;
	left: 3px;
  top: 0px;
	width: 45px;
  height: 45px;
	z-index:1;
}
a.rentalBtn img{
  width: 94px;
  height: 27px;
}

div.costumeIcon a {
	text-decoration: none;
	font-size:10px;
}

div.costumeIcon a:link {
	color: #000000;
	text-decoration: none;
}

div.costumeIcon a:visited {
	color: #000000;
}

div.costumeIcon a:hover {
	color: #000000;
}

div.costumeIcon a:active {
	color: #000000;
}

div.costumeTopTitle {
    margin-top:60px;
	font-size: 10px;
	font-weight: bold;
	width: 100%;
	background: #F5F5F5;
	border-top-style: solid;
	border-width: 2px;
	border-color: #D8BEA3;
    position: relative;
}

div.costumeTopTitleIcon img {
	height: 85px;
	margin: 10px 0px 10px 0px;
}

div.getCostumeFailedMsg{
    position: relative;
    top: 215px;
    font-size: 25px;
    text-align: center;
}

div.hairCatalogTitleIcon img {
    height: 40px;
    margin: 30px 0px;
}

img.hairCatalogImg{
    width:100%;
}
div.hairCatalogPageHeader{
    padding:20px;
    border-bottom:1px solid #ccc;
}
div.hairCatalogPageLogo{
    display:inline-block;
}
div.hairCatalogPageTitle{
    display:inline-block;
    padding:15px;
    float:right;
}
div.hairCatalogPageTitle img{
    height:40px;
}
div.hairCatalogPageContents{
    padding:30px;
}
div.hairCatalogPageItem{
    margin:0 0 30px;
}
div.hairCatalogPageBtn{
    display:inline-block;
    width:390px;
    padding: 30px;
    margin: 0 30px;
    background: #e7346e;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    border-radius: 10px;
    text-align:center;
    cursor: pointer;
}
div.hairCatalogPageBtn:hover,div.hairCatalogPageBtn:focus{
    color:pink;
}

img.hairCatalogPageImg{
    /*width:500px;*/
    width:100%;
}

div.hairCatalogModalImg{
    width:100%;
    height:100%;
}
div.hairCatalogModalImg img{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    margin:auto;
}

div.contents{
    list-style-type: none;
    width: 100%;
    height: 707px;
    padding-left: 0.5em;
    margin-top: 60px;
    overflow: auto;
    border: 1px solid #FFFFFF;
    background-color: #FFFFFF;
}

div.center_scroll {
    width: 1024px;
    height: 600px;
    margin: 0 auto;
}

div.scroll {
	list-style-type: none;
	width: 100%;
    height: 600px;
	overflow: auto;
	border: 1px solid #FFFFFF;
	padding-right: 13px;
	padding-left: 30px;
	background-color: #FFFFFF;
}

div.costumetopScroll {
    height: 100%;
}

div.scroll::-webkit-scrollbar{ 
    width: 15px;
}
div.scroll::-webkit-scrollbar-thumb{ 
    background: #F70841;
    border-radius: 5px;
}
div.scroll::-webkit-scrollbar-track-piece:start{
    background: #eee;
}
div.scroll::-webkit-scrollbar-track-piece:end{
    background: #eee;
}

.outOfStockDisplay {
    position: absolute;
    right: 30px;
    top: 40px;
    font-size: 18px;
    font-weight: normal;
}

.outOfStockDisplayForSelectedcostume {
    position: absolute;
    right: 150px;
    top: 30px;
    font-size: 18px;
    font-weight: normal;
}

.outOfStockDisplay input, .outOfStockDisplayForSelectedcostume input {
    width: 18px;
    height: 18px;
    vertical-align: -3px;
    margin: 0 5px 0 0;
}

div.outOfStockTop {
	width:100%;
    background-color: rgba(170,0,0,0.3);
	color:white;
	position:absolute;
	top:0px;
	height:60px;
	text-align: center;
	font-size:25px;
    font-weight: bold;
	vertical-align:middle;
	line-height:60px;
    pointer-events: none;
}

div.outOfStockTop .rightJustify {
    padding-left: 180px;
}

div.passcordInputModalContent, div.eventtopMoveModalContent, div.costumetopMoveModalContent {
    background-color: #ffffff;
    height: 370px;
    width: 630px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border: #996633 solid 3px;
    padding-top: 70px;
}

div.passcordInputModalContent .modalText {
    font-size: 23px;
    font-weight: bold;
    padding-bottom: 5px;
}

 div.eventtopMoveModalContent .modalText {
    font-size: 18px;
    font-weight: bold;
    padding-bottom: 5px;
    text-align: left;
    width: 280px;
    margin: 40px auto 0;
    line-height: 30px;
}

div.costumetopMoveModalContent .modalText {
   font-size: 18px;
   font-weight: bold;
   padding-bottom: 5px;
   text-align: left;
   width: 325px;
   margin: 40px auto 0;
   line-height: 30px;
}

div.passcordInputModalContent input {
    border: #996633 solid 1px;
    height: 50px;
    width: 280px;
    font-size: 25px;
    padding: 10px;
}

div.furisodeModalBtn {
    border-radius: 5px;
    height: 60px;
    width: 170px;
    position: absolute;
    bottom: 70px;
    cursor: pointer;
    color: #ffffff;
    font-size: 20px;
    line-height: 60px;
}

div.cancelBtn {
    background-color: #9c27b0;
    left: 120px;
}

div.applyBtn {
    background-color: #5cb85c;
    right: 120px;
}

h2.selectSearchCostume {
    font-size: large;
    font-weight: bold;
    margin-top: 0; 
    margin-bottom: 0;
}

@media screen and (min-width: 641px){
    p.swiper-colorname {
        width: 79px;
        margin: 20px 0 0 0;
    }
}

/* ページ全体 */
#wrapper {
  overflow: hidden;
  width: 100%;
  height: 100%;
  position: relative;
}

/* サイドメニュー */
div.side-menu {
  width: 100%;
  height: 94%;
  background-color: #fdfdfd;
  position: absolute;
  top: 60px;
  left: -100%;
  -webkit-transform: translateZ(0);
  -webkit-perspective: 1000;
  -webkit-backface-visibility: hidden;
  z-index: 10;
  overflow: auto;
}
div.side-menu-open {
  transform: translate(100%, 0px);
}

/* サイドメニュー以外の部分 */
#container {
  background-color: #F3F0E9;
  position: relative;
  width: 100%;
  overflow: hidden;
  -webkit-transform: translateZ(0);
  -webkit-perspective: 1000;
  -webkit-backface-visibility: hidden;
  z-index: 9;
  padding: 0 !important;
  margin: 0 !important;
}

div.sideMenuTitle {
	font-size: 15px;
	font-weight: bold;
	width: 100%;
	background-color: #F5F5F5;
	border-top-style: solid;
	border-top-width: 2px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-color: #D8BEA3;
	height: 105px;
}

div.sideMenuCloseBtn {
	position: relative;
    cursor: pointer;
}

div.sideMenuCloseBtn img {
    position: relative;
	height: 50px;
	margin: 28px 40px 28px 0;
	float: right;
}

div.sideMenuCloseTopBtn {
	position: relative;
    cursor: pointer;
    text-align: center;
	background-color: rgb(255, 75, 75);
    border-radius: 7px;
    color: rgb(255, 255, 255);
    height: 50px;
    line-height: 50px;
    width: 340px;
	font-family: sans-serif;
    margin: 28px 40px 28px 0;
	float: right;
}

div.sideMenuAllCloseBtn div.selectCostumeBtn{
    position: absolute;
    cursor: pointer;
    text-align: center;
	background-color: rgb(255, 75, 75);
    border-radius: 7px;
    color: rgb(255, 255, 255)!important;
    height: 50px;
    line-height: 50px;
    width: 340px;
	font-family: sans-serif;
    margin: 28px 40px 28px 0;
    right: 157px;
}

div.hairSideMenuCloseBtn {
    position: absolute;
    right:0;
    cursor: pointer;
}

div.hairSideMenuCloseBtn img {
    height: 50px;
    margin: 28px 40px 28px 0;
    float: right;
}

div.sideMenuTitleText {
    margin-top: 0px;
}

@media screen and (min-width:640px) {
    div.sideMenuTitleText {
        position: absolute;
        float: left;
        font-size: 16px;
        left: 50%;
        margin-top: 50px;
        transform: translateY(-50%) translateX(-106%);
        -webkit- transform: translateY(-50%) translateX(-106%);
        width: 46%;
     }
 }

div.sideMenuTitleText img {
	height: 20px;
	margin-top: -5px;
	margin-right: 5px;
}

div.sideMenuObject{
    position:relative;
	width: 100%;
	background-color: #FFFFFF;
}

div.selectDays{
	float: left;
	background-color: #FFF5EE;
	width: 424px;
	height: 344px;
}

div.selectDays img.selectDaysIcon{
	margin: 35px 0 0 100px;
	height: 80px;
}

div.selectDays img.selectDaysBtn{
	margin: 40px 0 0 75px;
	width: 295px;
	height: 70px;
}

div.selectCostume{
	float: left;
}

div.selectCostume img.selectCostumeIcon{
	height: 80px;
    margin:35px 16px 0px;
}

div.selectCostume div.selectCostumeBtn{
	width: 475px;
	height: 70px;
    margin:40px 16px 5px;
    cursor: pointer;
    text-align: center;
	background-color: rgb(255, 75, 75);
    border-radius: 7px;
    color: rgb(255, 255, 255);
    line-height: 70px;
    font-size: 19px;
    font-weight: bold;
	font-family:  sans-serif;
}

div.newSelectCostume{
	display: inline-block;
}

div.costumeBrandList{
    text-align:center;
}

div.selectCostume img.selectCostumeBrandBtn{
	height: 70px;
    margin:0 8px;
}

div.selectCostume img.selectNewCostumeBrandBtn{
        margin: 20px 0 0 75px;
        height: 70px;
        float: left;
}

/*div.selectCostume img.selectCostumeNonBrandBtg{
	margin: 20px 0 0 15px;
	height: 70px;
	float: left;
}*/
/*追加分*/
.selectCostumeNonBrandBtn{
    /*font-family:游ゴシック;*/
    width: 230px;
    height: 70px;
    /*padding: 5px 0 0;*/
    margin:0 8px;
    background: #ff4b4b;
    border-radius: 10px;
    color: #fff;
    font-size: 19px;
    font-weight: bold;
    text-align: center;
}
.selectCostumeNonBrandBtn>span{
    display: table-cell;
    vertical-align: middle;
}
/*/追加分*/

div.selectColor{
    text-align:center;
}

div.selectColor.furisodeColor{
    padding:16px 0;
}

img.selectColorIcon{
	height: 19px;
	margin: 24px 8px 0;
}

img.selectCategoryIcon{
	height: 29px;
	margin: 0px 8px 0;
}

div.selectColorList {
}

div.selectColorListItem img {
	margin: 20px 0 0 8px;
	height: 62px;
	float: left;
}

/*a.selectColorListItem {
	border: 2px solid;
	color: #111;
	height: 62px;
	width: 62px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	text-decoration: none;
	float: left;
	margin: 20px 0 0 8px;
}*/
div.selectColorListItem {
        border: 2px solid;
        color: #111;
        height: 62px;
        width: 62px;
        border-radius: 6px;
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        text-decoration: none;
        float: left;
        margin: 20px 0 0 8px;
    cursor: pointer;
}

div.selectColorBtn {
    position:relative;
    text-align: center;
}

div.selectCostumeBlock{
    margin:0 40px 24px;
    text-align: center;
}

div.selectSearchListOuter{
    position:relative;
    min-height:192px;
    padding:16px 0;
    margin: 0 5px;
    border-bottom: 1px #ccc solid;
    text-align: center;
    min-height:180px;
}
div.selectSearchListInner{
    width: 100%;
    margin-top: 8px;
}
div.selectSearchListItem{
    position:relative;
    display:inline-block;
    border: 2px solid;
    border-color:#DDD;
    width: 168px;
    margin:8px 7px;
    /* background-color: rgb(180, 180, 180); */
}
div.searchCriteriaLayer{
    position:absolute;
    width:100%;
    height:100%;
}
img.searchCriteriaImg{
    width:100%;
    height:100%;
}

div.selectRentalDate{
    margin: 0 20px;
    border-top: 1px #ccc solid;
}

div.selectRentalDate div.selectSearchListOuter{
    border-bottom: 0px;
    min-height: 100px;
}

div.selectRentalDate input.rentalDate {
    width: 200px;
    height: 50px;
    font-size: 16pt;
    position: relative;
    text-align: center;
    background-color: #fff;
    border: 1px gray solid;
}

div.selectRentalDate input.rentalDate::-webkit-calendar-picker-indicator {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
}

@media screen and (max-width: 640px) {
    div.selectSearchListOuter{
        min-height:0px;
    }
    div.selectSearchListInner{
        position:relative;
        top:0px;
        left:0px;
        transform:none;
        -webkit- transform:none;
        display: flex;
        flex-wrap: wrap;
    }
    div.selectSearchListItem{
        font-size: 3vw;
        width: 48%;
        box-sizing: border-box;
    }
    p.swiper-colorname {
        width: 62px;
        margin: 20px 0 0 0;
    }
}
div.selectColorBtn div.conditionsSearch {
	position:relative;
	background-color: rgb(180, 180, 180);
        border-radius: 7px;
        color: rgba(136, 136, 136, 0.5);
        font-weight: bold;
        height: 70px;
        line-height: 70px;
        text-shadow: 1px 1px 1px rgb(180, 180, 180), 0 0 0 rgb(100, 94, 94);
        width: 295px;
	font-family: sans-serif;
	margin: 1px auto 0;
}
@media screen and (max-width: 640px) {
    div.selectColorBtn div.conditionsSearch{
        width:70vw;
        height: 12vw;
        font-size:3vw;
        line-height: 12vw;
    }
}
div.selectColorBtn div.conditionsSearchImg {
	position: relative;
    height: 70px;
    width: 295px;
	margin: 30px auto 0;
}
div.selectColorBtn img {
	height: 70px;
}

div.popBase {
	background-color: #F3F0E9;
	height: 440px;
	width: 630px;
	position:absolute;
    top:140px;
	left:200px;
	border:#996633 solid 3px;
	border-radius: 10px;  
    -webkit-border-radius: 10px;  
    -moz-border-radius: 10px;
	box-shadow:5px 5px 10px;
}

div.popCloseBtn{
    cursor: pointer;
}

div.popCloseBtn img {
	float: right;
	height: 55px;
	margin-top: 10px;
	margin-right: 10px;
}

div.popText {
	text-align:left;
	font-size: 18px;
	font-weight: bold;
	margin-top:130px;
	margin-left:170px;
}

div.multiPopText {
    text-align:left;
    font-size: 18px;
    font-weight: bold;
    margin-top:130px;
    margin-left:110px;
}

div.popYesBtn img {
	height: 70px;
	float:left;
	margin-top:90px;
	margin-left:120px;
}

div.popNoBtn{
    cursor: pointer;
}

div.popNoBtn img {
	height: 70px;
	float:right;
	margin-top:90px;
	margin-right:120px;
}

div.popCloseDoneBtn{
    cursor: pointer;
}

div.popCloseDoneBtn img {
	height: 70px;
	margin-top:90px;
}

div.popDoneText {
	text-align:left;
	font-size: 18px;
	font-weight: bold;
	margin-top:130px;
	margin-left:155px;
}

/* 衣装詳細 */

div.detailTitle {
	padding-left: 0.5em;
	padding-bottom: 1em;
	padding-top: 1em;
	margin-top: 60px;
	font-size: 15px;
	font-weight: bold;
	width: 100%;
	background: #F5F5F5;
	border-top-style: solid;
	border-width: 2px;
	border-color: #D8BEA3;
}

div.detailTitle img {
	height: 20px;
	margin: -5px 7px 0 40px;
}

div.detailNewIcon img {
	height: 15px;
	float: right;
}

div.detailRecomIcon img {
	height: 15px;
	float: right;
}
div.favoriteAddBlock {
    position: absolute;
    bottom: 40px;
    left: 30px;
}
div.favoriteAddBtn img {
    width: 180px;
    padding: 10px 10px;
    margin: 0px 10px 10px 10px;
}

div.detailImgBase {
	position: relative;
	//width:455px;
	width:460px;
	margin-right: auto;
	margin-left: auto;
}
div.detailImg{
	height: 445px;
	position:relative;
}

div.detailImg img {
    display:table-cell;
	max-width:460px;
	max-height: 445px;
	margin:0 auto;
    vertical-align: middle;
    object-fit: contain;
	z-index:1;
}

div.detailImgZoomBtn img {
	position: absolute;
	right: 0px;
    top: 0px;
	width: 65px;
  height: 65px;
	z-index:1;
}

div.detailImgPrevBtn{
    cursor: pointer;
}
div.detailImgPrevBtn img {
	position: absolute;
	//left: -5px;
	left: 5px;
    top: 190px;
	width: 40px;
	z-index:1;
}
div.detailImgNextBtn{
    cursor: pointer;
}
div.detailImgNextBtn img {
	position: absolute;
	//right: -5px;
	right: 5px;
    top: 190px;
	width: 40px;
	z-index:1;
}
div.detailZoomImgPrevBtn{
    cursor: pointer;
}
div.detailZoomImgPrevBtn img {
	position: absolute;
	left: 30px;
    top: 330px;
	width: 60px;
	z-index:13;
}

div.detailZoomImgNextBtn{
    cursor: pointer;
}
div.detailZoomImgNextBtn img {
	position: absolute;
	right: 30px;
    top: 330px;
	width: 60px;
	z-index:13;
}

div.bookingBtn {
	margin: 30px 0 0 18px;
	padding: 10px 10px;
}

div.bookingBtn img {
	width: 190px;
}

div.detailObject{
	width: 100%;
	height: 660px;
	background-color: #FFFFFF;
	overflow: hidden;
	display: flex;
	justify-content: space-between;
}

div.detailLeft{
	max-width:230px;
	float: left;
	padding-top: 1em;
	padding-left: 2em;
}

div.detailCenter{
	padding-top: 1em;
	float: left;
	padding-left: 2em;
}

div.detailRight{
	float: left;
	padding-top: 1em;
	padding-right: 1em;
}

div.calenderDesc{
    position: absolute;
	//right: 60px;
	right: 15px;
    bottom: 20px;
    padding: 5px;
    background-color: #92a2a8;
    color: white;
}

div.calenderDesc div{
    display:inline-block;
    margin-right:20px;
    color:#fff;
}

div.calenderBase{
	width:100%;
}

div.detailImgList {
    padding: 2px 2px;
	margin: 4px 3.5px 4px 3.5px;
	//float: left;
	display:inline-block;
    cursor: pointer;
}

div.detailImgList img {
	max-height: 75px;
	max-width:64px;
}

div.caution {
	font-size: 10px;
	width:380px;
        margin:auto;
}
div.detailitemlist{
	margin:15px 0;	
	padding:15px 0 0;
}
div.detailitemlist ul{
    list-style:none;
	padding:0;
}

div.rentalfrom{
  margin-bottom: 5px;
	font-weight:bold;
  font-size:16px;
}

li.itemname{
	font-weight:bold;
	font-size:20px;
}

#formKariYoyaku {
    margin: 190px auto;
}

#formKariYoyaku input[type="submit"] {
    display: inline-block;
    border-radius: 5px;
    font-size: 24px;
    text-align: center;
    cursor: pointer;
    padding: 12px 12px;
    color: #ffffff;
    border: #3e8f3e;
    width: 250px;
    background: #3e8f3e;
}

/* モーダルウィンドウのスタイル */
.modal {
	width:100%;
	height:100%;
	top:0;
	left:0;
	display:none;
}
 
/* オーバーレイのスタイル */
.overLay {
	position:absolute;
	top:0;
	left:0;
	background:rgba(255,255,255,0.9);
	width:100%;
	height:100%;
	z-index:11;
}
 
/* */
.overlayHeader {
    position: absolute;
    top: 120px;
    left: 10px;
    z-index: 12;
    width: 180px;
    height: 40px;
    background: radial-gradient(#c0ac9c99, #fefefe00);
    font-weight: bold;
    border-radius: 40pt;
    padding: 10px;
    text-align: center;
}

/* モーダルウィンドウの中身のスタイル */
.modal .inner {
	position:absolute;
	z-index:12;
	position:relative;
    height:100%;
	margin:0 auto;
	text-align:center;
}

/* モーダルの画像のスタイル */
.zoomImg {
    top:30px;
    width:100%;
    height:768px;
}

.zoomImg img {
	max-height:100%;
	max-width:900px;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}

/* モーダルの閉じるボタンのスタイル */
.closeBtn {
	position:absolute;
    top:30px;
    right:30px;
	z-index:13;
    cursor: pointer;
}

.closeBtn img {
	height: 60px;
}

/* カレンダー（画面） */

div.calenderTitle {
	font-size: 15px;
	font-weight: bold;
	width: 100%;
	background-color: #F5F5F5;
	border-top-style: solid;
	border-top-width: 2px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-color: #D8BEA3;
	height: 105px;
	margin-top: 60px;
}

div.calenderTitleText {
	float: left;
	font-size: 16px;
	margin: 40px 0 0 40px;
}

div.calenderTitleText img {
	height: 20px;
	margin-top: -5px;
	margin-right: 5px;
}

div.calenderTitleImg {
}

div.calenderTitleImg img {
	height: 50px;
	margin: 28px 40px 28px 0;
	float: right;
}

div.calenderObject{
	width: 100%;
	height: 497px;
	background-color: #F3F0E9;
}

div.calender{
	position:absolute;
}

div.calender table tr.dayName{
	font-size: 25px;
	font-weight: bold;
}

div.calender table tr.calenderTitle{
	font-size: 40px;
}

div.calender table tr.calenderDays{
	font-size: 25px;
}

div.calender table tr.calenderDays td a {
	display: block;
}

div.calenderSelectBtn {
	position: relative;
	text-align: center;
    margin-bottom:15px;
    cursor: pointer;
}

div.calenderSelectBtn img {
	height: 70px;
	margin: 0 0 0 0;
}

img.calenderLastMonthIcon {
	float: left;
	height: 48px;
	margin: 5px 0 0 5px;
}

img.calenderNextMonthIcon {
	float: right;
	height: 48px;
	margin: 5px 5px 0 0;
}

div.calenderDay {
	position:relative;
}

a.calenderDayText {
	text-decoration: none;
}

a.calenderDayText:link{
	color:#000000;
}
a.calenderDayText:visited{
	color:#000000;
}
a.calenderDayText:hover{
	color:#000000;
}
a.calenderDayText:active{
	color:#000000;
}

img.calenderSelect {
	height: 45px;
	position: absolute;
	top :-5px;
	left :22px;
}

/* お気に入り一覧 */

div.favoriteTitle {
	margin-top: 60px;
	font-size: 15px;
	font-weight: bold;
	width: 100%;
	background-color: #FFFFFF;
	border-top-style: solid;
	border-top-width: 2px;
	border-color: #D8BEA3;
	height: 82px;
}

div.favoriteTitleImg {
}

div.favoriteTitleImg img {
	height: 40px;
	margin: 20px 40px 20px 0;
	float: right;
}

div.favoriteObject{
	width: 100%;
	height: 625px;
	background-color: #FFFFFF;
	overflow: visible;
	display: flex;
	justify-content: space-between;
}

div.favoriteObjectBase{
    margin: auto;
	width: 1024px;
	height: 625px;
	background-color: #FFFFFF;
}

div.favoriteImgBase {
	position: relative;
	height: 500px;
}

div.favoriteImg {
	height: 435px;
	/*background-color: #D8BEA3;*/
	background-color: #FFFFFF;
	margin-top: 25px;
}

div.favoriteImg img {
	height: 435px;
}

div.favoriteRecomIcon img {
	position: absolute;
	height: 20px;
	left: 0px;
    top: 0px;
}

div.favoriteNewIcon img {
	position: absolute;
	height: 20px;
	left: 0px;
    top: 30px;
}

div.favoriteDetailBtn img {
	position: absolute;
	right: 5px;
    top: 30px;
	width: 65px;
}

div.favoriteBottomObject{
}

div.favoriteLeftObject{
	float: left;
	margin: 10px 0 0 10px;
}

div.favoriteRightObject{
	float: right;
}

div.favoriteRightObject img{
	height: 50px;
	margin: 20px 20px 0 0;
    cursor: pointer;
}

/* 絞り込み衣装一覧 */

div.selectedCostumeTitle {
	margin-top: 60px;
	font-size: 15px;
	font-weight: bold;
	width: 100%;
	background-color: #F5F5F5;
	border-top-style: solid;
	border-top-width: 2px;
	/* border-bottom-style: solid; */
	border-bottom-width: 1px;
	border-color: #D8BEA3;
	height: 40px;
}

div.selectedCostumeTitleText {
	position: relative;
	float: left;
	font-size: 16px;
	margin: 8px 0 0 30px;
}

div.selectedCostumeTitleText img {
	height: 20px;
	margin-top: -5px;
	margin-right: 5px;
}

div.selectedCostumeBlock {
    width: 1024px;
    margin: 0 auto;
}

div.selectedCostumeSubObject{
	width: 100%;
	height: 110px;
	background-color: #FFFFFF;
    position: relative;
}

div.selectedCostumeTitleImg {
}

div.selectedCostumeTitleImg img {
	height: 50px;
	margin: 28px 40px 28px 0;
	float: right;
}

div.selectedCostumeObject{
	width: 100%;
	background-color: #FFFFFF;
	overflow: hidden;
	display: block;
	justify-content: space-between;
	text-align: center;
	margin: 0 auto ;
}

div.selectedCostumeObjectBase{
	width: 100%;
    min-height: 350px;
	background-color: #FFFFFF;
}

div.selectedCostumeImgBase {
	position: relative;
	width: 196px;
	float: left;
	margin: 0 0 0 0;
}

div.selectedCostumeImg {
	height: 227px;
	width: 190px;
	background-color: #D8BEA3;
	/*background-color: #FFFFFF;*/
	margin-top: 20px;
}

div.selectedCostumeImg img {
	height: 227px;
	width: 190px;
}

div.selectedCostumeRecomIcon img {
	position: absolute;
	height: 15px;
	width: 72px;
	left: 0px;
    top: 0px;
}

div.selectedCostumeNewIcon img {
	position: absolute;
	height: 15px;
	width: 58px;
	left: 0px;
    top: 25px;
}

div.selectedCostumeDetailBtn img {
	position: absolute;
	left: 5px;
    top: 192px;
	width: 50px;
}

div.selectedCostumeBottomObject{
	text-align:left;
}

div.selectedCostumeLeftObject{
	float: left;
	font-size:12px;
    padding:5px;
    width:135px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.selectedCostumePagerBase {
	width: 100%;
	min-height: 208px;
    background-color: #FFFFFF;
}

.selectedCostumePager {
	margin: 0 0 0 -100px;
    overflow: hidden;
}
 
.selectedCostumePager ul {
    list-style: none;
    position: relative;
    left: 50%;
    float: left;
	margin: 30px 0 0 0;
}
 
.selectedCostumePager ul li {
    margin: 0 1px;
    position: relative;
    left: -50%;
    float: left;
}

.selectedCostumePager ul li a img{
    height: 18px;
	margin-top: -2px;
}

.selectedCostumePager ul li a {
    text-decoration: none;
}

.selectedCostumePager ul li.left a:link,
.selectedCostumePager ul li.interval a:link {color:#222222;}
.selectedCostumePager ul li.left a:visited,
.selectedCostumePager ul li.interval a:visited{color:#222222;} 
.selectedCostumePager ul li.left a:hover,
.selectedCostumePager ul li.interval a:hover{color:#222222;} 
.selectedCostumePager ul li.left a:active,
.selectedCostumePager ul li.interval a:active{color:#222222;} 

.selectedCostumePager ul li.current a:link {color:#E94D4D;}
.selectedCostumePager ul li.current a:visited{color:#E94D4D;} 
.selectedCostumePager ul li.current a:hover{color:#E94D4D;} 
.selectedCostumePager ul li.current a:active{color:#E94D4D;} 

.selectedCostumePager ul li.normal a:link,
.selectedCostumePager ul li.right a:link {color:#FFFFFF;}
.selectedCostumePager ul li.normal a:visited,
.selectedCostumePager ul li.right a:visited{color:#FFFFFF;} 
.selectedCostumePager ul li.normal a:hover,
.selectedCostumePager ul li.right a:hover{color:#FFFFFF;} 
.selectedCostumePager ul li.normal a:active,
.selectedCostumePager ul li.right a:active{color:#FFFFFF;} 

.selectedCostumePager ul li.left {
    height: 42px;
	display: block;
    font-size: 16px;
    padding: 0.6em 1em;
    border-radius: 3px;
	background: #F2EFE7;
    color: #000;
}

.selectedCostumePager ul li.current {
	height: 42px;
    display: block;
    font-size: 16px;
    padding: 0.5em 1em;
    border-radius: 3px;
	background: #FFFFFF;
    color: #E94D4D;
	border:#E94D4D solid 2px;
}

.selectedCostumePager ul li.normal {
	height: 42px;
    display: block;
    font-size: 16px;
    padding: 0.6em 1em;
    border-radius: 3px;
	background: #E94D4D;
    color: #000;
}

.selectedCostumePager ul li.interval {
    height: 42px;
	display: block;
    font-size: 16px;
    padding: 0.6em 1em;
    border-radius: 3px;
	background: #FFFFFF;
    color: #000;
}

.selectedCostumePager ul li.right {
    height: 42px;
	display: block;
    font-size: 16px;
    padding: 0.6em 1em;
    border-radius: 3px;
	background: #E94D4D;
    color: #000;
}

.selectedCostumePagerText {
    position: relative;
	text-align:center;
	padding: 50px 0 0 0;
	font-size: 20px;
	color: #222222;
}

.selectedCostumeCaution {
    font-size: 14px;
	font-weight: bold;
    padding-left: 30px;
}

div.selectColorListItemDecision{
	border-color:#ff4b4b !important;
}

div.textCenter{
	text-align:center;
}

div.slideCostumeImg{
    z-index: 2;
    position: relative;
    max-width: 455px;
    margin: 0 auto;
}
/*タウンロードページ、追加分*/
.downloadPage{
    position: absolute;
    background: rgba(70, 70, 70, 0.5);
    width: 100%;
    height: 100%;
    font-size:20px;
    text-align:center;
    display:table;
}
.downloadContent{
    display: table-cell;
    vertical-align: middle;
    color:#fff;
}
.downloadCancel{
    background: #bbb;
    padding: 8px 10px;
    color: white;
	font-size: 13px;
	border-radius: 10px;	
}
.downloadCancel:hover{ 
	text-decoration: none;
	color:#fff;
}

@keyframes spin{
    0% { transform: rotate(0deg);   opacity: 0.2; } /*0%の時は20％の透明度*/
    50%  { transform: rotate(180deg); opacity: 1.0; } /*50%の時は透明度なし*/
    100%   { transform: rotate(360deg); opacity: 0.2; } /*100%の時に20％の透明度に戻る*/
}
/*オフライン実装につき、追加分*/
div.offlineDaysBtn{
    text-align:center;
    width:360px;
    height:70px;
    padding:23px 0 0;
    margin:40px auto 0;
    font-size:18px;
    font-weight:bold;
    color:#7D7B7B;
    background:#B4B4B4;
    border-radius:10px;
}

div.offlineFavoriteAddBtn{
    width: 180px;
    padding: 8px 10px;
    margin: 165px 10px 10px 10px;
    text-align: center;
    font-weight:bold;
    color:#7D7B7B;
    background:#B4B4B4;
    border-radius:5px;
}

div.offlineDaysTable{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
	width:270px;
    //height: 308px;
    height: 360px;
    border: 3px solid #eee;
    border-radius: 5px;
	font-size: 20px;
    color: #999;
	position:relative;
	top:50px;
}

div.errorDaysTable{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
	width:270px;
    //height: 308px;
    height: 360px;
    border: 3px solid #ff0000;
    border-radius: 5px;
	font-size: 20px;
    color: #ff0000;
	position:relative;
	top:50px;
}

div.firstDaysTable{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
	width:270px;
    height: 410px;
    border: 3px solid #eee;
    border-radius: 5px;
	font-size: 20px;
    color: #999;
	position:relative;
	top:0px;
}
div.calenderMessage{
	padding-bottom:10px;
}
div.detailRightCalender{
	width:270px;
	top:10px;
}
.limitedTimeMessage{
    width: 270px;
    margin: 165px 0;
    color: red;
    font-weight: bold;
    text-align: left;
}
div.monthSelect{
	padding-bottom:10px;
}
div.costumeReservenBtn{
    display:table;
    margin:20px auto 0;
}
div.costumeReservenBtn img{
    width: 150px;
    height: 40px;
}

div.offlineIncompatible{
	display: table;
    position: absolute;
    width: 1024px;
    height: 766px;
    text-align: center;
	z-index:1;
}
div.offlineIncompatible>span{
	display: table-cell;
    vertical-align: middle;
	font-size: 30px;
}

/*管理画面ここから
table , td, th {
	border: 1px solid #595959;
	border-collapse: collapse;
}
td, th {
	padding: 3px;
	width: 30px;
	height: 25px;
}
th {
	background: #f0e6cc;
}
.even {
	background: #fbf8f0;
}
.odd {
	background: #fefcf9;
}
管理画面ここまで*/
.w80 {
	width: 80px;
}
.w120 {
	width: 120px;
}
.adminPageTitle{
	background: #BCAC9E;
	padding: 10px;
	text-align: center;
	color: white;
	margin:0;
	//border: #FDEED7 5px solid;
	border-right: none;
    	border-left: none;
}
.titleShadow{
box-shadow: 2px 2px 5px 2px #CCC;
margin-bottom:15px;
}
.adminMenu{
    padding: 0px 60px;
    width: 950px;
    margin: auto;
}
.adminMenuList{
    list-style: none;
}

#cacheRegeneration{
    position: absolute;
    top:8px;
    right: 30px;
}

#cacheRegenerationBtn{
    position: relative;
    cursor: pointer;
    width: 260px;
    height: 32px;
    border: 1px solid #00FF00;
    border-radius:6px;
    background:#00FF00;
    box-shadow: 1px 1px 1px 1px #00AA00;
    text-align: center;
    line-height: 30px;
    color:#fff;
    font-size:16px;
}

#cacheRegenerationBtn:hover, #cacheRegenerationBtn:focus{
    background:#00DD00 ! important;
    box-shadow:none ! important;
}

#cacheRegenerationTime{
    position: relative;
    color:#fff;
    font-size: 16px;
    text-align: center;
}

#maintenance{
    margin: 0 0 0 40px;
}

#maintenanceTitle{
    padding: 0 10px;
    width: 760px;
    height: 32px;
    border: 1px solid #fff;
    border-radius:6px;
    background:#00AA00;
    text-align: left;
    line-height: 30px;
    color:#fff;
    font-size:16px;
}
.maintenanceItem{
    margin: 10px;
    font-size: 16px;
}
.maintenanceDatetimeItem{
    width: 170px;
}
#maintenanceConfigDisplayArea{
    position: relative;
    padding: 0 10px;
    background:#CCC;
    text-align: left;
    line-height: 30px;
    color:#000;
    font-size:16px;
}
.adminTopBtn{
    margin: 10px 0;

}
.adminTopBtn a{
    width: 370px;
    height:85px;
    background:#BCAC9E;
    text-align: center;
    border-radius: 10px;
    border: 3px solid #dcc5b9;
    color:#fff;
    display: table-cell;
    vertical-align: middle;
    text-decoration: none;
    box-shadow: 2px 2px 5px 2px #CCC;
    font-size: 20px;
}
.adminTopBtn a:hover, .adminTopBtn a:focus{
    background:#9A8A7C;
    box-shadow:none;
}
table.adminTable{
	width: 100%;
	background:white;
	border-radius: 10px;
	font-size: 12px;
	border: 1px #DEB887 solid;
}
.adminTable>tbody{
	text-align:center;
}
.adminTable td{
	padding:15px 0;
	border: 1px #DEB887 solid;
}
.adminTableHead{
	background:#BCAC9E;
	color:#fff;
}
.adminActionBtn{
    height:35px;
    margin-bottom:10px;
	float:right;
}
.adminCreateBtn{
	width: 120px;
	height: 34px;
	padding: 7px 30px;
	margin-right: 10px;
        color:#fff !important;
	background: #FF6CC6;
	border-radius: 5px;
 	float: right;
	text-align:center;
}
.adminBackBtn{
	width: 120px;
        height: 34px;
        padding: 7px 0;
        background: #FFB21C;
        color:#fff !important;
        border-radius: 5px;
	text-align:center;
        float: right;
}
.adminEditBtn{
	background: #DCC5B9;
	color: #fff;
	padding: 5px 10px;
	border-radius: 5px;
	margin-right: 5px;
}
.adminDeleteBtn{
        background: #DCC5B9;
        color: #fff;
        padding: 5px 10px;
        border-radius: 5px;
}
.adminEditTable{
	background:#FFF;
	width:100%;
	border-collapse: collapse;
}
.adminEditTable td{
	border:#DCC5B9 1px solid;
}
.adminEditTable td{
	padding:10px;
    position:relative;
}
.adminEditTd{
	background:#BCAC9E;
	width: 200px;
	color: white;
}
.adminSupplement{
        font-size:13px;

}

.adminEntryBtn{
	background: #FF6cc6;
	border-radius: 5px;
	color: white;
	border: none;
	width: 124px;
	height: 32px;
}

.adminImageDeleteBtn{
	width: 50px;
	height: 30px;
	padding: 3px 15px;
	margin-right: 10px;
    color:#000000;
	background: #F0F0F0;
	border: 1px solid #000000;  
	text-align:center;
}

.adminPager{
	text-align:center;
	margin:10px;
	clear:both;
}
.pagerNum{
	padding:0 5px;
	margin:0 5px;
}
.pagerBtn{
	padding: 3px 10px;
	margin: 0 15px;
	color: white !important;
	background: #dcc5b9;
	border-radius: 5px;
}
.costumeAutoRegistrationBtn{
    padding: 7px;
    margin: 15px 15px;
    color: white !important;
    background: #dcc5b9;
    border-radius: 5px;
    width: 180px;
    display: inline-block;
    border: none;
    text-align: center;
}
.invisibleCostumeAutoRegistrationBtn{
    padding: 7px;
    margin: 15px 15px;
    color: white !important;
    background: #e9e9e9;
    border-radius: 5px;
    width: 180px;
    display: inline-block;
    border: none;
    text-align: center;
    pointer-events: none;
}
.pointer{
    cursor: pointer;
}
.leftInlineBlock{
    text-align: left;
}
.exportSelectEvent{
    display: inline-block;
    width: 210px;
}
.cautionUpdate{
    margin: 0px -15px;
    color: #ff0000;
    text-align: left;
    display: inline-block;
}
.output{
    width: 750px;
    margin: 0px 25px;
    display: table;
}
.outputMessageTitle{
    padding: 7px 9px;
    border: 1px solid #dcc5b9;
    color: white;
    background-color: #dcc5b9;
}
.outputMessage{
    overflow: auto;
    height: 300px;
    padding: 7px 9px;
    border: 1px solid #dcc5b9;
    color: #000000;
    background-color: #ffffff;
    line-height: 1.5em;
    user-select: text;
}
.searchtoggle{
    width: 185px;
    height: 34px;
    padding: 7px 30px;
    margin-right: 10px;
    color: #fff !important;
    background: #09BBCB;
    border-radius: 5px;
    float: left;
    text-align: center;
	cursor: pointer;
}
.searchmenu{
    clear:both;
    background:#fff;
    border:2px solid #ccc;
    margin-bottom: 30px;
}
.serachmenutitle{
    background: #BCAC9E;
    color: #fff;
    padding: 10px 20px;
    font-size: 20px;
    background:;
}
ul.searchitem{
    list-style:none;
    float:left;
    width:50%;
    padding:0;
}

.searchitem li{
    display: inline-block;
    box-sizing: border-box;
    width:30%;
}
input.adminsearchBtn{
    width: 120px;
    height: 34px;
    padding: 7px 0;
    background: #2491CA;
    color: #fff;
    border-radius: 5px;
    border: none;
}
div.searchMenuLast{
    text-align: center;
    border-top: 1px solid #ccc;
    padding-top: 15px;
    margin-top: 15px;
}
.downloadBtn{
	width: 160px;
	height: 34px;
	padding: 7px 30px;
	margin-right: 30px;
	margin-top: 15px;
    color:#fff !important;
	background: #BCAC9E;
	border-radius: 5px;
 	float: right;
	text-align:center;
	position: relative;
}

input#Checkbox{
	float: right;
	margin-top: 23px;
	margin-right: 80px;
}

.checkbox-parts{
	float: right;
	margin-right: -80px;
	margin-top: 21.5px;
	color: #666666;
}

.CheckLabel{
	color:#fff !important;
	position: absolute;
	display: block;
	left: 0px;
	top: 0px;
	width: 160px;
	height: 34px;
	vertical-align: middle;
	line-height: 34px;
}

.adminMultiDisabled{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:#000;
    opacity:0.5;
}

.adminWebDisplayNumberDisabled{
    background:#AAA;
}

/*  複数予約画面    */

div.costumeTypeSelection{
    width: 100%;
    height: 100%;
    padding: 30px;
}
div.costumeTypeSelection center img{
    height:95px;
}

div.costumeTypeSelectBox{
    width:800px;
    margin:0 auto 80px;
}
div.costumeTypeSelectItem{
    display:table;
    margin: 50px 0;
}
div.selectionOrder{
    display:table-cell;
    width:150px;
    font-size:25px;
    font-weight:bold;
    vertical-align: middle;
}
div.selectionCostumeType{
    display:table-cell;
    vertical-align: middle;
}
a.clearCostumeType{
    display:table-cell;
    width:80px;
    vertical-align:middle;
}
a.clearCostumeType img {
    width:32px;
    float:right;
}


div.selectionCostume{
    display: table-cell;
    width: 530px;
    height:75px;
    padding: 10px 40px;
    color: #fff;
    font-size:25px;
    background: #ff4b4b;
    border-radius: 10px;
    vertical-align: middle;
}
div.unselected{
    text-align:center;
}

img.confirmBtn{
    width:230px;
    float:right;
}

div.unactive{
    background: #aaa;
}

div.selectedDateStatus{
    display: inline-block;
    margin: 0 30px;
    font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
    font-size: 20px;
    vertical-align: middle;
}
div.selectedDateStatus img{
    width:32px;
    margin: 0 15px 5px;
    cursor: pointer;
}

img.selectDateBtn{
    width:230px;
    float: right;
    margin: 6px 0;
}

div.costumeSelectionBox{
    display:inline-block;
    width:280px;
    margin:0px 10px;
    vertical-align: top;
}

div.costumeNotSelection{
    display: table;
    width: 100%;
    height:330px;
    background:#ff4b4b;
    border-radius: 10px;
}
div.costumeSelectionTypeName{
    display: table-cell;
    color:#fff; 
    font-size: 25px;
    font-weight: bold;
    vertical-align: middle;
}
img.costumeSelectionImg{
    height: 330px; 
    vertical-align: top;
    margin-bottom: 5px;
}
div.costumeSelectionDetail{
    float:left;
    text-align:left;
    font-size: 13px;
}
img.costumeSelectionDel{
    float:right;
    height:40px;
    margin-top:6px;
}
table.multiCalender{
    width:630px; 
    height: 517px;
    margin:0 0 0 100px;
}
table.multiCalender tr{
    font-size: 25px;
}
table.multiCalender td.calenderTitle{
    position:relative;
    height:60px;
    padding:0;
    color:#fff;
    background-color: rgb(255, 178, 28);
    font-size:40px;
    z-index:1;
    cursor: pointer;
}
table.multiCalender td.calenderTitle img{
    height: 48px;
    vertical-align: top;
}
table.multiCalender .calenderPrevBtn{
    position:relative;
    float: left;
    height: 48px;
    margin:5px 0 0 5px;
    z-index:2;
    
}
table.multiCalender .calenderNextBtn{
    position:relative;
    float: right;
    height: 48px;
    margin: 5px 5px 0 0;
    z-index:2;
    cursor: pointer;
}
table.multiCalender tr.dayName td{
    color:#fff;
    font-weight:bold;

}
td.weekdays{
    background:#08c93e;
}
td.sunday{
    background:#ff4b4b;
}
td.saturday{
    background:#2491ca;
}
td.calenderDay{
    position:relative;
    background:#fff;
    cursor: pointer;

}
td.calenderNoneDay{
    position:relative;
    background:#bcac9e;
}
.calenderCircle{
    display:none;
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    width:30px;
    height:30px;
    margin:auto;
    border:3px solid #ff4b4b;
    border-radius:50%;
}
div.multiCalenderSide{
    position:absolute;
    right:0;
    text-align:center;
    cursor: pointer;
}
div.multiCalenderSide img{
    width:230px;
}

div.multiCalenderSide.menu1{
    top:20px;
    margin:0 60px;
}
div.multiCalenderSide.menu2{
    top:130px;
    margin:0 30px;
}
div.multiCalenderSide.menu3{
    top:310px;
    margin:0 30px;
}


form.monthSelectedFrom{
    font-size:18px;
}

form.monthSelectedFrom p{
    margin-bottom: 20px;
}

form.monthSelectedFrom select{
    width: 170px;
    padding:5px 20px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid #999;
    border-radius:5px;
}

.selectedDate{
    width:100%;
    height: 35px;
    padding: 5px 20px;
    background: #f7f5ed;
    font-size: 15px;
    opacity: 0.5;
}
.selectedDate div{
    font-weight:bold;
    font-size: 18px;
}
.slideSelectedDate{
    position:absolute;
    width:100%;
    height: 35px;
    padding: 5px 20px;
    background: #f7f5ed;
    font-size: 15px;
    opacity: 0.5;
}
.slideSelectedDate div{
    font-weight:bold;
    font-size: 18px;
}

.costumesReserveListTitle,.multiCalenderTitle{
    font-size: 15px;
    font-weight: bold;
    width: 100%;
    height: 105px;
    padding:15px 38px 10px;
    margin-top: 60px;
    background: #F5F5F5;
    border-top-style: solid;
    border-width: 2px;
    border-color: #D8BEA3;
}

.costumesReserveListTitleImg{
    height:80px;
}

.costumesReserveListMain{
    padding:15px 30px;
}
.costumesReserveListMain>img {
     height:80px;
}
.costumesReserveListMain center{
    height:400px;
    margin: 25px 0 0;
}
.gotoReservationForm{
    position:absolute;
    right:45px;
}

.gotoReservationBtn{
    width: 230px;
    height: 60px;
    border: none;
    border-radius: 5px;    
}
.notGotoReservationBtn{
    width: 230px;
    height: 60px;
    border: none;
    border-radius: 5px;
}

.multiCalenderTitle img {
    height: 80px;
}
.multiCalender .calenderTitle div{
    position:absolute;
    right:0;
    left:0;
    color:#fff;
}

.multiCalenderMain{
    position:relative;
    width: 100%;
}
.freeScheduleOpen div.unactive{
    position: absolute;
    width: 230px;
    height: 80px;
    background: #000;
    border-radius: 5px;
    opacity: 0.5;
}

.freeScheduleScroll{
    padding:0;
    background-color:#fff7f4 !important;
}

.freeScheduleContent{
    width:100%;
    margin:0 0 20px;
    text-align:center;
}

td.timeZone{
    background:#fff;
    border: 1px solid #B9BAB6
    ;border-collapse: collapse;
}
td.costumeStock{
    width: 125px;
    background:#fff;
    border: 1px solid #B9BAB6;
    border-collapse: collapse;
}
td.notExistStock{
    background:#aaa;
}
td.noneStock{
    background:#aaa;
    color:red;
}

.error404{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    margin:auto;
}

.errorInfoWrap {
    height: 100%;
}

.errorInfoWrap .ribbon1 {
    display: inline-block;
    position: relative;
    height: 40px;
    line-height: 40px;
    text-align: center;
    padding: 0 80px;
    background: #f57a78;
    color: #fff;
    box-sizing: border-box;
    min-width: 350px;
}

.errorInfoWrap .ribbon1:before,
.errorInfoWrap .ribbon1:after {
    position: absolute;
    content: "";
    width: 0px;
    height: 0px;
    z-index: 1;
}

.errorInfoWrap .ribbon1:before {
    top: 0;
    left: 0;
    border-width: 25px 0px 25px 15px;
    border-color: transparent transparent transparent #fff;
    border-style: solid;
}

.errorInfoWrap .ribbon1:after {
    top: 0;
    right: 0;
    border-width: 25px 15px 25px 0px;
    border-color: transparent #fff transparent transparent;
    border-style: solid;
}

/*
 *ローディング
 */
.loadingCalender{
    position:relative;
    top:-70px;
    left:75px;
    height: 70px;
    width: 295px;
    float: left;
    background:rgba(0,0,0,.5);
    z-index:11;
    border-radius: 10px;
}
.loading_iconCalender{
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    border: 8px solid #FFFFFF;
    border-right-color: transparent;
    animation: spin 1s linear infinite;
    z-index:12;
}
.loadingAll{
    position:absolute;
    /*top:265px;*/
    top:0px;
    left:0px;
    width: 475px;
    height: 70px;
    margin:40px 16px 0px;
    background:rgba(0,0,0,.5);
    z-index:11;
    border-radius: 7px;
}
.loadingCatalog{
    position:absolute;
    /*top:265px;*/
    top:0px;
    right:158px;
    width: 339px;
    height: 50px;
    margin:28px 40px 28px 0;
    background:rgba(0,0,0,.5);
    z-index:11;
    border-radius: 7px;
}
.loading_iconAll{
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    border: 8px solid #FFFFFF;
    border-right-color: transparent;
    animation: spin 1s linear infinite;
    z-index:12;
}
.loadingBrand{
    position:absolute;
    /*top:355px;*/
    top:0px;
    left:0px;
    height: 100%;
    width: calc(100% - 16px);
    margin:0px 8px;
    background:rgba(0,0,0,.5);
    z-index:11;
    border-radius: 7px;
}
.loadingBrandNoCalender{
    position:absolute;
    /*top:355px;*/
    top:0px;
    left:0px;
    height: 100%;
    width: calc(100% - 16px);
    margin:0px 8px;
    background:rgba(0,0,0,.5);
    z-index:11;
    border-radius: 7px;
}
.loading_iconBrand{
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    border: 8px solid #FFFFFF;
    border-right-color: transparent;
    animation: spin 1s linear infinite;
    z-index:12;
}
.loadingNonBrand{
    position:absolute;
    /*top:355px;*/
    top:0px;
    left:0px;
    height: 100%;
    width: calc(100% - 16px);
    margin:0px 8px;
    background:rgba(0,0,0,.5);
    z-index:11;
    border-radius: 7px;
}
.loadingNonBrandNoCalender{
    position:fixed;
    position:absolute;
    /*top:355px;*/
    top:0px;
    left:0px;
    height: 100%;
    width: calc(100% - 16px);
    margin:0 8px;
    background:rgba(0,0,0,.5);
    z-index:11;
    border-radius: 7px;
}
.loading_iconNonBrand{
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    border: 8px solid #FFFFFF;
    border-right-color: transparent;
    animation: spin 1s linear infinite;
    z-index:12;
}
.loadingColor{
    position:absolute;
    /*top:611px;*/
    top:30px;
    left:364px;
    height: 70px;
    width: 296px;
    float: left;
    background:rgba(0,0,0,.5);
    z-index:11;
    border-radius: 10px;
}
.loading_iconColor{
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    border: 8px solid #FFFFFF;
    border-right-color: transparent;
    animation: spin 1s linear infinite;
    z-index:12;
}

.loadingIsyoIdSearch{
    position: absolute;
    top: 0px;
    width: 170px;
    height: 25px;
    background: rgba(0,0,0,.5);
    z-index: 11;
    border-radius: 7px;
}
.loading_searchedIsyo{
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    border: 8px solid #FFFFFF;
    border-right-color: transparent;
    animation: spin 1s linear infinite;
    z-index:12;
}
.eventmenu_loading{
    position:absolute;
    float: left;
    top:0px;
    background:rgba(0,0,0,.5);
    z-index:11;
}
.sub_eventmenu_loading{
    position:fixed;
    position:absolute;
    height: 100%;
    float: left;
    top:0px;
    background:rgba(0,0,0,.5);
    z-index:11;
}

.costume_loading{
    position:absolute;
    top:0;
    height: 220px;
    width: 155px;
    float: left;
    background:rgba(0,0,0,.5);
    z-index:11;
}
.costumedetail_loading{
    position:absolute;
    height: 524px;
    width: 270px;
    float: left;
    top:100px;
    //background:rgba(0,0,0,.5);
    z-index:11;
}
.selected_costume_loading{
    position:absolute;
    height: 227px;
    width: 190px;
    float: left;
    background:rgba(0,0,0,.5);
    z-index:11;
}

.calender_loading{
    position:fixed;
    position:absolute;
    top:682px;
    left:364px;
    height: 70px;
    width: 296px;
    float: left;
    background:rgba(0,0,0,.5);
    z-index:11;
    border-radius: 10px;
}
.multicalender_loading{
    display:none;
    position:absolute;
    top:0;
    left:0;
    width: 90px;
    height: 60px;
    background:rgba(0,0,0,.5);
    z-index:11;
}
.calender_selectbtn_loading{
    display:none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 300px;
    height: 70px;
    background: rgba(0,0,0,.5);
    z-index: 11;
    border-radius: 10px;
}
.costumeselection_loading {
    position: absolute;
    float: left;
    width: 280px;
    height: 330px;
    background: rgba(0,0,0,.5);
    border-radius: 10px;
    z-index: 11;
}

#wrapper.displayCostumeModalOnly #container {
    height: 100%;
}

#wrapper.displayCostumeModalOnly #zoomImg {
    margin-top: 70px;
    display: block;
}

#wrapper.displayCostumeModalOnly #zoomImg .zoomImg {
    height: 698px;
}

#wrapper.displayCostumeModalOnly .mobileHeader {
    height: 50px;
}

.mobileHeader .displayCostumeCloseBtn{
    zoom: 85%;
}

#wrapper.displayCostumeModalOnly .overlayHeader {
    top: 60px;
}

.normal_loading_icon{
    width: 70px;
    height: 70px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    border: 8px solid #FFFFFF;
    border-right-color: transparent;
    animation: spin 1s linear infinite;
    z-index:12;
}
.minimum_loading_icon{
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    border: 8px solid #FFFFFF;
    border-right-color: transparent;
    animation: spin 1s linear infinite;
    z-index:12;
}

.gray_loading_icon{
    border: 8px solid #808080;
    border-right-color: transparent;
}

/* ふりホ 共通 */
#wrapperFrisode {
    width: 100%;
    height: 100%;
    position: relative;
    background:#ffffff;
    overflow: scroll;
    min-width: 1024px;
}

#wrapperFrisode header{
    position:fixed;
    width:100%;
    z-index: 10;
}

#wrapperFrisode header nav{
    position: relative;
    height: 80px;
    background-color: #ffffff;
    border-bottom: solid 2px #e7346e;
}

#wrapperFrisode main{
    width: 100%;
    min-height: calc(100% - 80px);
    margin-top: 80px;
    padding-bottom: 16px;
}

#wrapperFrisode main section{
    width: 1024px;
    min-height: calc(100% - 80px);
    padding: 8px;
    margin: 0 auto;
}
.borderBottomNone{
    border-bottom: none !important;
}

#logoutBtn, #backBtnForMypage {
    position: absolute;
    top: 20px;
    right: 16px;
    width: 145px;
    height: 40px;
    line-height: 40px;
    background-color: #fcb41c;
    color: white;
   border-radius: 6px;
    border: none;
    text-align: center;
    font-size: 16px;
    cursor: pointer;
}
#loginBackBtn{
    display: block;
    width: 200px;
    height: 50px;
    color: #ffffff;
    background: #e7346e;
    border: 1px solid #ffffff;
    font-size: 17px;
    text-align: center;
    border-radius: 6px;
    line-height: 50px;
    cursor: pointer;
    outline: none;
    margin: 16px auto;
}
#catalogBackBtn{
    display: block;
    width: 300px;
    height: 50px;
    color: #e7346e;
    background: #ffffff;
    border: 1px solid #e7346e;
    font-size: 1.8rem;
    text-align: center;
    border-radius: 6px;
    line-height: 50px;
    cursor: pointer;
    outline: none;
    margin: 16px auto;
}
#backShopSelectBtn{
    display: block;
    width: 300px;
    height: 50px;
    color: #e7346e;
    background: #ffffff;
    border: 1px solid #e7346e;
    font-size: 1.8rem;
    text-align: center;
    border-radius: 6px;
    line-height: 50px;
    cursor: pointer;
    outline: none;
    margin: 16px auto;
}
#inputProfileBackBtn, #inputProfileCheckBackBtn, #mypageBackBtn{
    display: block;
    width: 300px;
    height: 50px;
    color: #333;
    background: #f2f0e9;
    border: 1px solid #ffffff;
    font-size: 1.8rem;
    text-align: center;
    border-radius: 50px;
    line-height: 50px;
    cursor: pointer;
    outline: none;
    margin: 16px auto;
}
#mypageBtn{
    display: block;
    width: 200px;
    height: 50px;
    color: #ffffff;
    background: #e7346e;
    border: 1px solid #ffffff;
    font-size: 17px;
    text-align: center;
    border-radius: 6px;
    line-height: 50px;
    cursor: pointer;
    outline: none;
    margin: 16px auto;
}

.formLabel {
    display: inline-block;
    width: 220px;
    text-align: right;
}

div.submitBtn {
    text-align: center;
}

.resultMsgBlock {
    font-size: 16px;
    text-align: center;
    margin: 32px 0;
}
.msgLink{
    border-bottom: 1px solid #337ab7;
}

/* ふりホ マイページログイン */
.loginContents {
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #C89F61;
    width: 600px;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    padding: 10px 30px;
}

.loginTitle {
    text-align: center;
    background: #fff;
    color: #e7346e;
    border: none;
    border-bottom: 1px solid #e7346e;
    border-radius: 0;
    font-size: 28px;
    padding: 20px;
    margin: 15px 0 0;
}

.msgContent {
    border-radius: 20px;
    border: 1px solid #C89F61;
    text-align: center;
    padding: 5px 0;
    margin: 10px 20px 0;
}

.errorMsg {
    color: #ff0000;
    background-color: #fffae0;
    margin-bottom: 10px;
}

.normalMsg {
    background-color: #ffffff;
    margin-bottom: 10px;
}

.loginForm {
    text-align: center;
    margin-bottom: 10px;
}

.loginForm input {
    margin-top: 20px;
    width: 100%;
    padding: 5px 10px;
}

.loginForm input[type="submit"] {
    border-radius: 10px;
    color: #ffffff;
    width: 200px;
    height: 40px;
    background: #e7346e;
    border: solid 3px #C89F61;
}

.resetLink {
    margin: 0 0 10px;
}

/* ふりホ マイページ */
h1.pageTitle {
    position: absolute;
    top: 20px;
    left: 16px;
    color: #e7346e;
    margin: 0;
}
h3.sectionTitle{
    color: #e7346e;
}
h3.inputprofileSectionTitle{
    line-height: 1.5;
    border-bottom: 1px solid black;
    font-size: 23px;
}


.reservationContents{
    padding:0 16px;
    margin-bottom: 32px;
}
.reservationCostumeImage .mainImage{
    position: relative;
    width: 80%;
    min-height: 480px;
    padding: 24px 0;
    margin: 0 auto;
    text-align: center;
}
.reservationCostumeImage .mainImage img{
    max-height: 400px;
    max-width: 400px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);

}
.reservationCostumeImage .listImages .listImage img{
    width: 75px;
}
.reservationCostumeImage .listImages{
    padding: 16px 0;
    text-align: center;
}
.reservationCostumeImage .listImages .listImage{
    display:inline-block;
    margin:8px;
}

table.reservationTable{
    width:100%;
    font-size:1.8rem;
    border:none;
    margin:0px auto 32px;
}
table.inputProfileCheckTable{
    width: 100%;
    font-size: 1.8rem;
    border: none;
    margin: 0px auto 32px;
    border-spacing: 0px 1px;
    border-collapse: separate;
}

div.authPhoneNumberCaution, div.reservationKigenCaution{
    font-size:13px;
    color:#777777;
    margin: -10px 0px 10px 0px;
}
.pcBr{
    display: block;
}

div.reservationPossibleCaution{
    font-size: 2rem;
    color:#777777;
}

table.reservationTable tr{
    padding: 4px 8px;
}
table.reservationTable th, table.reservationTable td{ 
    padding:8px 30px;
    color:#777777;
    border:none;
}
table.reservationTable th{ 
    width:30%;
}
table.reservationTable td{
    color: gray;
    font-size: 2rem;
}

table.inputProfileCheckTable tr{
    padding: 4px 8px;
    background-color: #f7f5ed;
}
table.inputProfileCheckTable th, table.inputProfileCheckTable td{ 
    width:50%;
    padding:8px 30px;
    color:#777777;
    border:none;
}

@media screen and (max-width:640px) {
    table.inputProfileCheckTable th, table.inputProfileCheckTable td{
        padding:8px 10px;
    }
}
table.inputProfileCheckTable td{
    color: gray;
}

span.yoyakuStatusCaution{
    font-size:1.4rem;
}
span.reservationChecklist{
    font-size:1.4rem;
}

.reservationNoticeMsg{
    color: #e7346e;
    font-size: 1.2rem;
}

.inputItemFrame{
    background-color: #f7f5ed;
    padding: 10px 10px;
    border: lightgray solid 1px;
    margin: 10px 5px;
    font-size: 1.6rem;
}

.inputItemName{
    color: gray;
    font-size: 1.8rem;
}
.inputItemTextBoxArea{
    width: 40rem;
    position: relative;
}
.inputItemTextBoxArea2{
    width: 24rem;
    position: relative;
}
.inputItemTextBoxArea3{
    width: 16rem;
    display: inline-block;
    margin: 0 25px 0 0;
}
.inputItemTextBoxArea4{
    display: inline-block;
    margin: 0 6px 0 0;
}
.inputItemTextBoxArea5{
    display: inline-block;
    margin: 0 15px 0 0;
}
.inputItemTextBoxArea6{
    width: 80rem;
}
#searchAddressBtn {
    font-size: 1.6rem;
    width: 100px;
    height: 36px;
    color: whitesmoke;
    background-color: #f25388;
    text-align : center;
    line-height: 36px;
    border-radius: 50px;
    border-style: none;
}

.tabiItems{
    display: inline-block;
    margin: 10px 0 0 0;
}
.inputCharacterCount{
    color: gray;
    font-size: 1.4rem;
    right: 0;
    bottom: 0;
    position: absolute;
}
.inputItemTextBox{
     width: 100%;
     font-size: 1.8rem;
     font-family:'メイリオ', 'Meiryo', sans-serif; 
     padding: 5px;
     border: lightgray solid 1px;
     margin: 0 0 5px 0;
}

.inputItemTextBoxTabiColor{
    width: 100%;
    font-size: 1.7rem;
    font-family:'メイリオ', 'Meiryo', sans-serif; 
    padding: 9px;
}
.checkboxRadioItems {
    margin: 5px 0px 0px 0px;
}
.checkboxRadioItems > input{
    margin: 0 5px 0 10px;
}
.checkboxRadioItems > span{
    margin: 0 10px 0 0;
}
.space{
    margin: 30px 0 0 0;
}
.privacy, .terms{
    display: block;
    width: 27%;
    height: 32px;
    color: gray;
    background-color: #f7f5ed;
    font-size: 1rem;
    text-align: center;
    border-radius: 6px;
    line-height: normal;
    cursor: pointer;
    outline: none;
    margin: 15px auto;
    padding: 10px 20px;
    text-decoration: none;
    position: relative;
}

.privacy span::after, .terms span::after{
    content: "";
    width: 10px;
    height: 10px;
    border-bottom: 4px solid #e7346e;
    border-right: 4px solid #e7346e;
    position: absolute;
    top: 48%;
    right: 12px;
    transform: translateY(-50%) rotate(-45deg);
}

#cancelConfirm {
    display: none;
}

.cancelConfirmContents {
    background-color: #F3F0E9;
    height: 310px;
    width: 520px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border: #996633 solid 3px;
    padding-top: 90px;
}

.cancelConfirmText {
    width: 420px;
    font-size: 17px;
    margin: 0 auto;
    text-align: left;
}

.cancelConfirmContents .no {
    background-color: #9c27b0;
    left: 40px;
}

.cancelConfirmContents .yes {
    background-color: #ec455f;
    border: #ec455f;
    right: 40px;
}

.cancelConfirmBtn {
    height: 60px;
    width: 170px;
    position: absolute;
    bottom: 30px;
    cursor: pointer;
    font-size: 20px;
    color: #ffffff;
    line-height: 60px;
}

.reservationProfile {
    float: left;
    width:50%;
}

.reservationIsyo {
    float: left;
    width:50%;
}

.changeContents {
    text-align: center;
    margin-bottom:32px;
}
.changeContents div, .changeContents form{
    display:inline-block;
}

@media screen and (min-width:641px) {
    .changeContents .transitionBtn {
        width: 200px;
        height: 50px;
        font-size: 17px;
        line-height: 50px;
    }
}

.changeContents .transitionBtn {
        margin: 8px;
        color: #e7346e;
        background: #ffffff;
        border: 1px solid #e7346e;
        text-align: center;
        border-radius: 6px;
        cursor: pointer;
        outline: none /*ボタン押したときの黒枠を非表示*/
}

.changeContents .transitionBtn:hover, .changeContents .transitionBtn:focus{
    color: #ffffff;
    background: #e7346e;
}
.changeContents .reservationCancel.transitionBtn{
    color: #9c27b0;
    border: 1px solid #9c27b0;
}
.changeContents .reservationCancel.transitionBtn:hover, .changeContents .reservationCancel.transitionBtn:focus{
    color: #ffffff;
    background: #9c27b0;
}


/* ふりホ ログインIDリセット、パスワードリセット */
.inquiryContents {
    margin: 0 15px;
}
.inquiryTable {
    width: 100%;
    margin:0 auto 32px;
    table-layout: fixed;
    border:none;
}
.inquiryTable th, .inquiryTable td{
    padding:8px;
    color:#777777;
    border:none;
 
}
.inquiryTable td {
    color:#333333;
}
table.inquiryTable tr:first-child{
    border-top:1px solid #ccc;
}
table.inquiryTable tr{
    border-bottom:1px solid #ccc;
    padding: 4px 8px;
 }
.inquiryForm input[type="submit"] {
    width: 300px;
    height: 50px;
    font-size: 1.8rem;
    border-radius: 50px;
    background-color: #f25388;
    color: whitesmoke;
    text-align: center;
    border-style: none;
    cursor: pointer;
    outline: none /*ボタン押したときの黒枠を非表示*/;
}


/* 仮予約 */
form.sharpShopAreaSelect {
    width: 100%;
}

.area {
    margin-bottom: 20px;
}

.area > div {
    display: flex;
    flex-wrap: wrap;
}

.area dl {
    width: calc((100% - 40px) / 4); /*padding分 8px*5=40pxを減算*/
    margin: 0 8px 50px 0;
}

.area dl dt {
    background: #f7f5ed;
    font-size: 20px;
    font-weight: normal;
    padding: 18px 20px;
    margin-bottom: 20px;
}

.area dl dd {
    padding: 0 20px;
    display: block;
    height: auto;
}

.area dl dd ul {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
}

ol, ul {
    list-style: none;
}

.area dl dd ul li {
    width: 50%;
}

.area dl dd ul li:nth-child(n+3) {
    margin-top: 20px;
}

.area dl dd ul li span {
    position: relative;
    font-size: 16px;
    color: #333;
    text-decoration: none;
    padding-right: 17px;
    cursor: pointer;
}

.area dl dd ul li span::after {
    content: "";
    width: 7px;
    height: 7px;
    border-bottom: 2px solid #ccc;
    border-right: 2px solid #ccc;
    position: absolute;
    top: 48%;
    right: 0;
    transform: translateY(-50%) rotate(-45deg);
}

form.sharpShopIdSelect {
  width: 100%;
  text-align : center;
}

select.sharpShopIdSelect {
  font-size: 20px;
  height: 40px;
	width: 20%;
}

div.shopAreaCaution{
    font-size: 17px;
    text-align: center;
    color: red;
}

table.shopSelectTable{
    width:70%;
    font-size:16px;
    border:none;
    margin:0 auto 64px;
}

table.shopSelectTable tr:first-child{
    border-top:1px solid #ccc;
}
table.shopSelectTable tr{
    border-bottom:1px solid #ccc;
    padding: 4px 8px;
}
table.shopSelectTable th,table.shopSelectTable td{
    padding:16px;
    color:#777777;
    border:none;
}
table.shopSelectTable th div{
    color:#777777;
}

table.shopSelectTable td{
    text-align:right;
    color:#333333;
}

div.sharpShopIdSubmitBtn{
    width: 250px;
    text-align:center;
    position: relative;
    margin: 0 auto;
}
@media screen and (max-width:640px) {
    div.sharpShopIdSubmitBtn{
        width: 100%;
    }
}    
div.sharpShopIdSubmitBtn::after{
    content: "";
    width: 10px;
    height: 10px;
    border-bottom: 4px solid whitesmoke;
    border-right: 4px solid whitesmoke;
    position: absolute;
    top: 48%;
    right: 20px;
    transform: translateY(-50%) rotate(-45deg);
}
input.sharpShopIdSubmitBtn{
    font-size: 1.8rem;
    width: 250px;
	height: 50px;
    color: whitesmoke;
    background-color: #f25388;
    text-align : center;
    border-radius: 50px;
    border-style: none;
}

/*注意事項画面*/
h4.sectionTitle{
    color: #e7346e;
}
#wrapperFrisode .simpleData{
    padding: 16px;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}
#wrapperFrisode .simpleData table{
    width: 100%;
    font-size: 16px;
    margin: 0 auto;
}
#wrapperFrisode .simpleData table td{
    width: 50%;
    padding: 8px 0;
}
#wrapperFrisode .simpleData table tr td:nth-of-type(2){
    font-size: 17px;
    font-weight: bolder;
}

div.furisodeMethodImg{
    text-align:center;
}
.furisodeSelectingImg, .furisodeMeasuringImg{
    width: calc(50% - 16px);
    margin: 16px 8px;
    float:left;
    cursor: pointer;
}
#wrapperFrisode .agreearea table{
    width: 100%;
    font-size:16px;
    margin: 0 auto;
}
#wrapperFrisode .agreearea p{
    color: red;
    font-size:16px;
}
#wrapperFrisode .agreearea label{
    font-weight:normal;
    cursor: pointer;
}
#wrapperFrisode .agreearea .aggreCheckBox{
    margin-right: 8px !important;
}
div.cautionSubmitBtn{
    width: 300px;
    text-align:center;
    margin: 32px 0;
    position: relative;
    margin: 20px auto;
}
div.cautionSubmitBtn::after{
    content: "";
    width: 10px;
    height: 10px;
    border-bottom: 4px solid whitesmoke;
    border-right: 4px solid whitesmoke;
    position: absolute;
    top: 48%;
    right: 20px;
    transform: translateY(-50%) rotate(-45deg);
}
@media screen and (min-width:641px) {
    input.cautionSubmitBtn{
        font-size: 1.8rem;
        width: 300px;
        height: 50px;
    }
}
input.cautionSubmitBtn{
    font-size: 1.8rem;
    width: 300px;
	height: 50px;
    color: whitesmoke;
    background-color: #f25388;
    text-align : center;
    border-radius: 50px;
    border-style: none;
}

.furisodeDialog{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index:11;
}
.furisodeDialog .overlay{
    width: 100%;
    height: 100%;
    background: #333;
    opacity: 0.8;
}
.furisodeDialog img{
    position: absolute;
    width: 80%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
}

form.inputProfile {
    width: 100%;
}
form.inputProfileCheck{
    width: 100%;
}
.inputProfileCaution{
    display: block;
    text-align:center;
    margin: 16px auto;
    width: 300px;
}
.inputProfileCautionText{
    display: inline-block;
    text-align:left;
    color: red;
    font-size: 12px;
}
div.representativeName {
  margin-left: auto;
  margin-right: auto;
  font-size: 20px;
  width: 100%;
  text-align : left;
}

div.representativeNameKana {
  margin-left: auto;
  margin-right: auto;
  font-size: 20px;
  width: 100%;
  text-align : left;
}

div.childName {
  margin-left: auto;
  margin-right: auto;
  font-size: 20px;
  width: 100%;
  text-align : left;
}

div.childNameKana {
  margin-left: auto;
  margin-right: auto;
  font-size: 20px;
  width: 100%;
  text-align : left;
}
select.childBirthGengou{
    width: 10rem;
    font-size: 1.6rem;
}
input#contactWeekdayAllSelectBtn, input#contactTimeAllSelectBtn{
    height: 30px;
    color: white;
    background: #4472c4;
    border: solid;
    border-color: #4472c4;
    border-radius: 5px;
    font-size: 14px;    
    margin: 5px 15px 5px 0;
}
.birthLabel{
    display: inline-block;
}
input.childBirthYear, select.childBirthMonth, select.childBirthDay{
    width: 6rem;
    text-align: right;
}
input.height{
    width: 16rem;
}

input.address{
    width:100%;
}

div.inputProfileSubmitBtn ,div.inputProfileCheckSubmitBtn, div.smsAuthSubmitBtn {
    width: 300px;
    text-align : center;
    position: relative;
    margin: 0 auto;
}
div.inputProfileSubmitBtn:after, div.inputProfileCheckSubmitBtn::after, div.smsAuthSubmitBtn::after {
    content: "";
    width: 10px;
    height: 10px;
    border-bottom: 4px solid whitesmoke;
    border-right: 4px solid whitesmoke;
    position: absolute;
    top: 48%;
    right: 20px;
    transform: translateY(-50%) rotate(-45deg);
}
    
input.inputProfileSubmitBtn, input.inputProfileCheckSubmitBtn, input.smsAuthSubmitBtn {
    font-size: 1.8rem;
    width: 300px;
	height: 50px;
    color: whitesmoke;
    background-color: #f25388;
    text-align : center;
    border-radius: 50px;
    border-style: none;
}

/* ▼入力チェック結果の表示ボックスの装飾 */
.alertarea {
   color: red;                             /* 文字色(赤色) */
   background-color: #fee;                 /* 背景色(淡い赤色) */
   background-image: url("alerticon.png"); /* 背景画像(警告アイコンを表示) */
   background-repeat: no-repeat;           /* 背景画像の繰り返しをナシに */
   background-position: 0.35em center;     /* 背景画像の掲載位置(左端から0.35em・上下方向の中央) */
   display: inherit;
   border-radius: 0.5em;                   /* 角丸(半径0.5文字分) */
   margin-left: 0.5em;                     /* 外側左端の余白(0.5文字分) */
}
/* ▼入力チェック結果でエラーがない場合は非表示にする */
.alertarea:empty { display: none; }
.alertMsg{
    color:red;
    font-weight:bold;
}
.noticeMsg{
    color:red;
}

div.kariyoyakucaution {
    margin:32px auto;
    width: 65%;
    font-weight: bold;
    font-size: 32px;
    color: #ff0000;/*文字色*/
    border-top: solid 3px #ff0000;/*線*/
    border-bottom: solid 3px #ff0000;/*線*/
    text-align: center;
}
/*???*/
.kariyoyakucaution p {
    margin: 0; 
    padding: 0;
}

div.smsAuthMessage {
	width: 100%;
    padding:16px;
    font-size: 20px;
    text-align : center;
}
div.smsAuthNoticeMessage{
    color: red;
    font-size: 16px;
    text-align: center;
    padding: 16px;
}

div.smsAuthForm {
    width: 100%;
    padding:32px;
    text-align : center;
}

input.smsAuthForm {
  font-size: 20px;
	width: 50%;
  text-align : center;
}

div.smsAuthRetransmissionBtn {
    width: 300px;
    height: 50px;
    text-align : center;
    margin: 20px auto;
}

input.smsAuthRetransmissionBtn {
    width: 100%;
    height: 100%;
    color: #333;
    background-color: #f2f0e9;
    border-radius: 50px;
    border-style: none;
    font-size: 1.8rem;
}

.smsMsg{
    padding:8px;
    color:red;
}
div.reservationMessage, div.browserCloseMessage{
    width: 100%;
    padding: 16px;
    font-size: 20px;
    text-align: center;
}
/* スマートフォン画面用 640px以下*/
@media screen and (max-width:640px) {
    /*汎用スタイル*/
    .responsiveBlock{
        display: block;
    }
    .responsiveNone{
        display: none;
    }

	body {
		height:100%;
	}
	.catalogHeader{
		display: none;
	}
    .spNone{
		display: none;
	}
    #container{
        width:100vw;
    }
	
	/* イベントトップ */
	div.eventTopBase{
		margin-top:50px;
	}
	div.eventTopBase img {
		height: 100%;
	}
	div.favoriteBtn {
		position: initial;
	}
	div.favoriteDeleteBtn {
		position: initial;
	}
	div.otherBtn {
        position:absolute;
        top:13px;
        left:10px;
        right:auto;
	}
    div.otherBtn img {
        width:30px;
        height:24px;
    }
	div.topBtn {
		position: initial;
	}
	div.multipleModeBtn{
		position: initial;
		text-align: initial;
	}
	div.costumesReserveListBtn{
		position: initial;
	}
	div.hairCatalogBtn{
		position: initial;
	}
	div.eventTopList img {
		height: 100%;
		width:100%;
	}
    div.eventTopList2 img {
		height: 100%;
        width:100%;
    }
    div.eventmenu_loading{
        width:100%;
        height:100%;
    }

    div.eventTopScroll{
        height:100%;
        overflow:auto;
    }

    /*サブイベントトップ*/

    div.subEventTopScroll{
        margin-top: 50px;
        height:100%;
    }

    div.sub_eventmenu_loading{
        width: 100%;
        height: 100%;
    }

	/* 衣装一覧トップ */
	div.searchBtn {
		position: initial;
	}
	div.searchBtn img {
		width: 30vw;
        max-width:115px;
		height: 9vw;
		margin: 25px 0px 0px 5px;
		object-fit:contain;
	}
    div.searchBtnWeb {
		position: initial;
	}
	div.searchBtnWeb img {
		width: 30vw;
        max-width:115px;
		height: 9vw;
		margin: 25px 0px 0px 5px;
		object-fit:contain;
	}
	div.costumeIcon {
		width: 27vw;
		height: auto;
	}
	div.costumeIcon img {
		width: 27vw;
		height: auto;
	}
	div.costumeTopTitle {
        margin-top: 0px;
		position: relative;
		border-top-style: initial;
		border-width: initial;
		border-color: initial;
	}
	div.costumeTopTitleIcon{
        margin-top: 50px;
		height: 85px;
        text-align:right;
	}
	div.costumeTopTitleIcon img {
		height: 14vw;
		margin: 12px 0px 0 0;
		position:relative;
	}
	div.hairCatalogTitleIcon img {
		width: 60%;
		height: auto;
		margin: 30px 0px;
	}
    div.center_scroll {
        width: 100%;
        height:calc(100vh - 135px); 
    }
    div.scroll {
        height: 100%;
    }
	div.scroll.hairCatalogScroll{
		height:calc(100vh - 90px);
	}
    .costume_loading{
        top: 0;
        height: 160px;
        width: 27vw;
    }

    div.getCostumeFailedMsg{
        position: relative;
        top: 55vw;
        font-size: 5vw;
        text-align: center;
    }
    
    .outOfStockDisplay, .outOfStockDisplayForSelectedcostume, div.passcordInputModalContent, div.outOfStockTop {
        display: none;
    }
		
	/* ページ全体 */
	#wrapper {
		background-color: #FFF;
	}
	
	/* サイドメニュー */
    div#hairCatalog div.sideMenuObject{
        height:calc(100vh - 90px);
    }
	div.sideMenuObject{
		height: 100vh;
	}
	div.side-menu {
		position: absolute;
        top:0;
        /* サイドメニュー表示時のスクロール領域 (50pxは、メニュー） */
		height: calc(100% - 50px);
		margin-top:50px;
		z-index: 15;
        overflow-y:auto;
	}
    div.topside-menu {
        position: absolute;
        top:0;
        height: 92vh;
        margin-top:50px;
        z-index: 15;
        overflow-y:auto;
        transform: translate(100%, 0px);
    }

	/* サイドメニュー以外の部分 */
	div.sideMenuTitle {
		height: 90px;
	}
	div.sideMenuCloseBtn img {
        position: absolute;
        width: 20%;
        height: 30px;
        margin: 10px 4px 1px 0;
        top: 18px;
        right: 0;
	}

    div.sideMenuCloseTopBtn {
        position: absolute;
        width:54vw;
        height: 8vw;
        font-size:2vw;
        font-weight: normal;
        line-height: 8vw;
        margin: 10px 15px 1px 0;
        top: 17px;
        right: 0;
    }

    div.sideMenuAllCloseBtn div.selectCostumeBtn {
        width: 40%;
        height: 30px;
        margin: 10px 7px 1px 0;
        position: absolute;
        right: 20%;
        top: 18px;
        font-weight: normal;
        font-size: 2vw;
        line-height: 30px;
    }
    
	div.hairSideMenuCloseBtn {
		position: absolute;
		right:0;
		cursor: pointer;
	}
	div.hairSideMenuCloseBtn img {
		margin: 4px 4px 0 0;
		float: right;
		width: 24%;
		height: auto;
	}
	
	
	
	div.sideMenuTitleText {
        position: absolute;
		font-size: 11px;
        float:left;
        left: 40%;
        margin-top: 50px;
        transform: translateY(-50%) translateX(-106%);
        -webkit- transform: translateY(-50%) translateX(-106%);
        width: 35%;
	}

	div.selectCostume{
		width: auto;
		height: auto;
        min-height:0px;
        margin-bottom:16px;
	}
	div.selectCostume img.selectCostumeIcon{
		height: 60px;
	}
	div.selectCostume div.selectCostumeBtn{
		width: 78.5vw; 
        height: 11.5vw;
		margin: 16px 0 0;
        font-weight: normal;
        font-size: 4vw;
        line-height: 11.5vw;
	}
	div.selectCostume img.selectCostumeBrandBtn{
		width: calc(50vw - 27px);
		height: auto;
		object-fit: contain;
	}
	div.selectCostume img.selectNewCostumeBrandBtn{
                width: calc(50vw - 27px);
                height: auto;
                object-fit: contain;
        }

	/*追加分*/
	.selectCostumeNonBrandBtn{
		width: calc(50vw - 27px);
		height: auto;
		background: initial;
		border-radius: initial;
		color:  initial;
		font-size: initial;
		font-weight: initial;
		text-align: initial;
		display: initial;
	}
	div.selectColor img.selectColorIcon{
		height: 15px;
	}
    img.selectCategoryIcon{
    	height: 23px;
    	margin: 20px 8px 8px;
    }
	div.selectColorListItem {
		margin: 20px 0 0 0;
	}
	div.selectColorBtn img {
        width:70vw;
		height: auto;
        margin-right:10px;
	}
    div.selectColorBtn div.conditionsSearchImg {
        height: 12vw;
        width: 70vw;
    }
    div.loadingCatalog{
        position:absolute;
        right:20%;
        height: 30px;
        width:40%;
        margin: 28px 7px 1px 0;
    }
    div.loadingAll{
        position:absolute;
        top:0;
        left:0;
        width:100%;
        margin:16px 0 0;
    }
    div.loadingBrand{
        position:absolute;
        top:20px;
        left:15px !important;
        width:calc(50vw - 27px);
    }
    div.loadingNonBrand {
        position:absolute;
        top:20px;
        left:calc((50vw - 27px) + 29px)!important;
        width:calc(50vw - 27px);
    }
    div.loadingColor{
        position:absolute;
        top:30px;
        left:62px;
    }
    div.selected_costume_loading{
        position:absolute;
        width:25vw;
        height: 100%;
    }
	div.popBase {
		width: 90vw;
		height: 50vh;
		top:18vh;
        left:20px;
	}
	div.popCloseBtn img {
		height: 35px;
	}	
	div.popText {
		font-size: 14px;
		margin-top:15vh;
		margin-left:5vw;
	}
    div.popDoneText {
        margin-top:15vh;
        margin-left:5vw;
        font-size: 14px;
        text-align:center;
    }
	div.popYesBtn img {
        width:30vw;
		height:unset;
		margin-top:40px;
		margin-left:10vw;
	}
	div.popNoBtn img {
        width:30vw;
		height:unset;
		margin-top:40px;
		margin-right:10vw;
	}
    div.popCloseDoneBtn img {
        height: 40px;
        margin-top: 60px;
    }
		
	/* 衣装詳細 */
	div.detailTitle {
		margin-top: 50px;
		font-size: 11px;
		border-top-style: initial;
		border-width: initial;
		border-color: initial;
	}
	div.detailTitle img {
		margin: -5px 7px 0 10px;
	}
	div.detailNewIcon img {
		float: left;
        height:12px;
	}
	div.detailRecomIcon img {
        float:left;
        height:12px;
	}
    div.favoriteAddBlock{
        position: absolute;
        top: 0;
        left: 0;
        width:100%;
        max-height:60px;
        padding:10px;
        border-top: 1px solid #ccc;
        background:#f8f8f8;
    }
    div.favoriteAddBtn{
        float:right;
    }
    div.favoriteAddBtn img{
        max-width:40vw;
        padding:0;
        margin:0;
    }
    div.favoriteAddDescription{
        width:45vw;
        color: #555;
        font-size:7pt;
    }
	div.detailImgBase {
		/*width:345px;*/
		width:90vw;
	}
	div.detailImg{
		height: auto;
        text-align: center;
	}
	div.detailImg img {
		width:70vw;
		height: auto;
	}
	div.detailImgPrevBtn img {
		top: 130px;
	}
	div.detailImgNextBtn img {
		top: 130px;
	}
	div.detailZoomImgPrevBtn img {
		top: 70vh;
		width: 40px;
	}
	div.detailZoomImgNextBtn img {
		top: 70vh;
		width: 40px;
	}
	div.detailObject{
		position:relative;
		height:calc(100vh - 88px);
		overflow: auto;
		display: block;
	}
	div.detailLeft{
        max-width:100%;
        padding: 1em;
        margin:55px 0 0;
    }
	div.detailCenter{
		float: left;
		width:100%;
        padding:0;
	}
	div.detailRight{
		position:relative;
		width:100%;
        padding:10px;
	}
	div.calenderDesc{
		position: static;
        margin:10px;
	}
	div.caution {
		width:100%;
		text-align:center;
	}
    div.detaildescription{
        width:90vw;
        font-size:13px;
    }
    div.detailitemlist{
        padding:5px 0 0;

    }
    div.detailitemlist ul{
        font-size:10px;
    }
	li.itemname{
        margin-right:20px;
		font-size:13px;
	}

    .costumedetail_loading{
        height:410px;
        top:70px;
        left:calc((100vw - 270px) / 2);
    }
	
	/* モーダルの画像のスタイル */
	.zoomImg {
		width:100vw;
		height:100vh;
	}
	.zoomImg img {
		max-width:100vw;
        max-height:100vh;
        margin:auto 0;
	}
	
	/* モーダルの閉じるボタンのスタイル */
	.closeBtn img {
		height: 40px;
	}
	
	/* カレンダー（画面） */
	div.calenderTitleImg img {
		height: 30px;
		margin: 30px 20px 0 0;
	}
	
	/* お気に入り一覧 */
	div.favoriteTitle {
		margin-top: 50px;
		height: initial;
	}
	div.favoriteTitleImg {
		height: 80px;
		width: 100%;
		position: relative;
	}
	div.favoriteTitleImg img {
		height: 4vh;
		position: absolute;
		top: 0;
		right: 4vh;
		bottom: 0;
		margin: auto;
	}
	div.favoriteObject{
		width: 200px;
		height: 62vh;
        min-height:330px;
		background-color: #FFFFFF;
		overflow: hidden;
		display: flex;
		justify-content: space-between;
		margin-left: -115px;
		border-left: 2px solid #F5F5F5;
	}
	div.favoriteObjectBase{
		width: 100vw;
		height: calc(100vh - 130px);
		background-color: #FFFFFF;
	}
	div.favoriteImgBase {
		position: relative;
		width: 200px;
		height: 100%;
        min-height:330px;
	}
	div.favoriteImg {
		height: 40vh;
		width: 40vw;
		background-color: #FFFFFF;
		margin-top: 100px;
		position: relative;
	}
	div.favoriteImg img {
		height: auto;
		width: 40vw;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		margin: auto;
	}
	div.favoriteRecomIcon img {
		position: absolute;
		height: 12px;
		left: 10px;
		top: 16vh;
	}
	div.favoriteNewIcon img {
		position: absolute;
		height: 12px;
		left: 10px;
		top: 19vh;
	}
	div.favoriteDetailBtn img {
		position: absolute;
		left: 26vw;
		top: 15vh;
		width: 50px;
	}
	div.favoriteBottomObject{
		top: 30px;
	}
	div.favoriteLeftObject{
		position: absolute;
		float: left;
        width:40vw;
		margin: initial;
		top: 1vh;
		left: 10px;
		border: solid 2px #bcac9e;
		padding: 4px 10px;
		font-size: 12px;
		border-radius: 10px;
		background-color: #f2f0e9;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
	}
	div.favoriteLeftObject::before,
	div.favoriteLeftObject::after {
		position: absolute;
		top: 100%;
		left: 15px;
		content: '';
		height: 0;
		width: 0;
		border: 10px solid transparent;
	}
	div.favoriteLeftObject::before {
		border-top: 15px solid #bcac9e;
	}
	div.favoriteLeftObject::after {
		margin-top: -4px;
		border-top: 15px solid #f2f0e9;
	}
	div.favoriteRightObject{
		position: absolute;
		float: left;
		bottom: 1vh;
	}
	div.favoriteRightObject img{
		height: 38px;
		margin: 0 0 0 10px;
	}
	
	/* 絞り込み衣装一覧 */
	.swiper-pagination{
		position:static;
	}
	div.selectedCostumeTitle {
		margin-top: 50px;
		border-top-style: initial;
		border-top-width: initial;
		border-bottom-style: initial;
		border-bottom-width: initial;
		border-color: initial;
	}
	div.selectedCostumeTitleText {
		font-size: 11px;
		margin: 12px 0 0 10px;
	}
	div.selectedCostumeBlock{
        height: calc(100vh - 90px);
        width: 100%;
		background:#fff;
	}
	div.selectedCostumeSubObject{
		height: 80px;
	}
	div.selectedCostumeObject{
		height: 58vh;
        min-height:350px;
	}
	div.selectedCostumeObjectBase{
		padding-top: initial;
        min-height:58vh;
	}
	div.selectedCostumeImgBase {
		height: auto;
		width: 30vw;
	}
	div.selectedCostumeImg {
        position:relative;
		width: 25vw;
		height: auto;
		margin-top: 15px;
		object-fit: contain;
	}
	div.selectedCostumeImg img {
		width: 25vw;
		height: auto;
		object-fit: contain;
	}
	div.selectedCostumeRecomIcon img {
		width: 50px;
		height: auto;
		object-fit: contain;
	}
	div.selectedCostumeNewIcon img {
		width: 40px;
		height: auto;
		top: 18px;
		object-fit: contain;
	}
	div.selectedCostumeDetailBtn img {
		top: 45%;
		bottom:50px;
		width: 10vw;
	}
	div.selectedCostumeLeftObject{
        width:25vw;
		font-size:2vw;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
	}
	.selectedCostumePagerText {
		margin: auto;
		padding: 0;
		font-size: 11px;
	}
	.selectedCostumeCaution {
		font-size: 10px;
		margin: initial;
		padding:20px;
	}
	div.slideCostumeImg{
		max-width: 100%;
	}
	
	/*オフライン実装につき、追加分*/
	div.detailRightCalender{
		margin:auto;
	}
	.limitedTimeMessage{
        width: 100%;
		margin: 20px auto;
        text-align: center;
        font-size: 11px;
    }

	/*スマホ画面対応追加分*/
	.mobileHeader{
		height: 50px;
		width: 100%;
		background-color: #bcac9e;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		/*z-index:10;*/
		z-index:20;
		text-align: right;
		/*border-bottom: medium solid #BC8F8F;*/
	}
	
	#menu {
		position: fixed;
		top: 50px;
		/*right: -340px;*/
		right: -640px;
		/*width: 270px;*/
		width: 100%;
		height: 100%;
		/*padding:10px  20px;*/
		transition: left .5s, right .5s; /* アニメーション */
		background-color: rgba(86, 86, 86, .8);
		overflow-y: auto;
	}
	#menu ul{ 
		margin: 0; 
		padding: 0; 
		list-style: none; 
	}
	#menu li{ 
		display: inline; 
		padding: 0; 
		margin: 0; 
	}
    #menu li a,#menu li div{
		display: block; 
        border-bottom:1px solid #ccc;
        background-color: #fff;
        padding:10px;
        text-decoration: none;
        color: #555;
        width: 100%;
        margin: 4px 0px;
		/*text-align: left;*/
        text-align:center;
		font-size: 15px;
		box-sizing: border-box;
    }
	#menu li a.favorite{
		border-left: 15px solid #ff6dc1;
	}
	#menu li a.favoriteDelete{
		border-left: 15px solid #bdaa9d;
	}
	#menu li div.hairCatalog{
		border-left: 15px solid #00c54f;
		cursor:pointer;
	}
	#menu li a.top{
		border-left: 15px solid #0094c6;
	}
	#open {
		display: none;
	}
	#open:checked + #menu {
		right: 0;
	}
	
	.menuTriggerBtn,
	.menuTriggerBtn span {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
	}
	.menuTriggerBtn {
		position: relative;
		width: 20px;
		height: 15px;
		top: 8px;
		right: 35px;
		margin-top:5px;
	}
	.menuTriggerBtn span {
		position: absolute;
		left: 0;
		width: 20px;
		height: 3px;
		background-color: #fff;
		border-radius: 4px;
	}
	.menuTriggerBtn span:nth-of-type(1) {
		top: 0;
	}
	.menuTriggerBtn span:nth-of-type(2) {
		top: 6px;
	}
	.menuTriggerBtn span:nth-of-type(3) {
		bottom: 0;
	}
	.menuTriggerBtn::after {
		position: absolute;
		bottom: -18px;
		left:-6px;
		content: 'MENU';
		display: block;
		width: 100%;
		color: #fff;
		font-size: 11px;
		text-decoration: none;
		text-align: center;
		white-space: nowrap;
		transition: all .4s;
		font-style: normal;
	}
	.menuTriggerBtn.active::after {
		content: 'CLOSE';
		bottom: -20px;
		left:-9px;
	}
	.menuTriggerBtn.active span:nth-of-type(1) {
		-webkit-transform: translateY(15px) rotate(-45deg);
		transform: translateY(6px) rotate(-45deg);
	}
	.menuTriggerBtn.active span:nth-of-type(2) {
		opacity: 0;
	}
	.menuTriggerBtn.active span:nth-of-type(3) {
		-webkit-transform: translateY(-15px) rotate(45deg);
		transform: translateY(-6px) rotate(45deg);
	}
	.menuTriggerOverlay{
		position:absolute;
		width:100%;
		height:100%;
		top:0;
		left:0;
		z-index:1
	}
	.menuNav{
		position:relative;
		width:90vw;
	    padding:20px 0 10px;
        margin:15vh auto 0;
		background:#fff;
        border-radius:10px;
        text-align:center;
		z-index:2;
	}
	div#hairCatalog.side-menu {
        height:100%;
		margin:0;
		z-index: 30;
	}
    label{
        width:0;
    }
    .headerIcon{
        display:inline-block;
        margin-bottom:10px;
    }
    .headerIcon img{
        width:40vw;
    }
    
    /*ふりホ 共通 */
    #wrapperFrisode {
        min-width: initial;
    }
    #wrapperFrisode header nav {
        height:65px;
    }
    #wrapperFrisode main{
        min-height: calc( 100% - 65px );
        margin-top:65px;
    }
    #wrapperFrisode main section{
        width:100%;
    }
    h1.pageTitle {
        font-size: 20px;
    }
    h3.sectionTitle{
        font-size:16px;
    }
    
    #logoutBtn, #backBtnForMypage {
        width: 30vw;
        height: 9vw;
        line-height: 9vw;
        position: absolute;
        right: 15px;
        top: 12px;
        font-size: 1.2rem;
    }
    #loginBackBtn, #mypageBtn, input.inputProfileCheckSubmitBtn, input.cautionSubmitBtn{
		width: 300px;
    	height: 50px;
    	font-size: 1.8rem;
        border-radius: 50px;
        background-color: #f25388;
	}
    #inputProfileBackBtn, #inputProfileCheckBackBtn, #mypageBackBtn {
		width: 300px;
    	height: 50px;
    	font-size: 1.8rem;
        border-radius: 50px;
        background-color: #f2f0e9;
    }
    .break-sp { /* スマホ表示の折り返しに使用 */
        display: block;
    }
    .resultMsgBlock ,div.browserCloseMessage, div.reservationMessage{
        font-size: 4vw;
    }
    .reservationMessage{
        font-size:1.6rem;
    }

    
    /* ふりホ マイページログイン */
    .loginContents {
        width: 90vw;
        height: auto;
        padding: 10px 20px;
    }
    
    .loginTitle {
        font-size: 2.0rem;
    }

    .loginForm input {
        height: 10vw;
        font-size: 1.2rem;
    }

    .loginForm input[type="submit"] {
        height: 12vw;
        font-size:1.2rem;
    }

    .resetLink {
        margin-top: 4vw;
        font-size:1.2rem;
        text-align:center;
    }
    .inquiryTable {
        font-size: 16px;
    }
    
    .inquiryForm input[type="submit"] {
        width:60vw;
        height: 8vw;
        font-size:1.2rem;
    }
    .inquiryForm input[type="password"], .inquiryForm input[type="text"] {
        width: 32vw;
    }

    /* ふりホ マイページ */
    .reservationContents{
        margin-bottom:24px;
    }
    .reservationCaution{
        font-size: 12px;
    }
    table.reservationTable{
        font-size: 16px;
        margin:0 auto 24px;
    }
    div.authPhoneNumberCaution, div.reservationKigenCaution{
        font-size:0.9rem;
        width: 92%;
    }
    .pcBr {
        display: none;
     }
    div.reservationPossibleCaution{
        font-size: 1.3rem;
        font-weight: bold;
    }    
    table.reservationTable th{
        width: 23%;
    }
    table.reservationTable td {
        width: 50%;
    }
    table.reservationTable th, table.reservationTable td {
        padding: 8px 0px 8px 16px;
        color: #777777;
        border: none;
    }
    span.yoyakuStatusCaution{
    font-size:1.2rem;
    }
    span.reservationChecklist{
        font-size:1.2rem;
    }
    .inputItemTextBoxArea, .inputItemTextBoxArea2{
        width: 80%;
        position: relative;
    }
    .inputItemTextBoxArea3{
        width: 14rem;
        display: inline-block;
        margin: 0 10px 0 0;
    }
    .inputItemTextBoxArea4{
        display: inline-block;
        margin: 0 6px 5px 0;
    }
    .inputItemTextBoxArea5{
        display: inline-block;
        margin: 0 15px 0 0;
    }
    .inputItemTextBoxArea6{
        width: 100%;
    }
    select.childBirthGengou, input.childBirthYear, select.childBirthMonth, select.childBirthDay{
        width: 12rem;
    }
    .checkboxRadioItems.week{
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
    }
    .checkboxRadioItems input{
        margin: 0 5px 0 10px;
    }
    .checkboxRadioItems span{
        margin: 0;
        line-height: 30px;
    }
    .privacy, .terms{
        width: 250px;
    }
    .reservationCostumeImage .mainImage{
        min-height:80vw;
    }
    .reservationCostumeImage .mainImage img{
        height:80vw;
    }
    .reservationCostumeImage .listImages .listImage img{
        width:75px;
    }
    .reservationIsyoName{
        font-size:1.2rem;
    }
    .changeContents .transitionBtn{
        width: 64vw;
        height: 3.2rem;
        font-size: 1.2rem;
        line-height: 3.2rem;
    }
    .cancelConfirmContents {
        height: 56vw;
        width: 88vw;
        padding-top: 12vw;
    }

    .cancelConfirmText {
        width: 70vw;
        font-size: 1.2rem;
        font-weight: bold;
        margin: 0 auto;
        text-align: left;
    }

    .cancelConfirmContents .no {
        left: 8vw;
    }

    .cancelConfirmContents .yes {
        right: 8vw;
    }
    
    .cancelConfirmBtn {
        height: 8vw;
        width: 30vw;
        position: absolute;
        bottom: 8vw;
        font-size: 1.2rem;
        line-height: 8vw;
    }
    
    .reservationProfile, .reservationIsyo {
        float: initial;
        margin-top: 2vw;
        width:100%;
    }
    
    .changeContents {
        clear: initial;
        position: initial;
        top: initial;
        margin-top: 2vw;
    }
    
    .errorMsg {
        padding: 1.5vw;
    }

    /*予約情報確認*/
    div.kariyoyakucaution{
        width:100%;
        font-size: 5vw;
    }
   /*SMS認証*/
    div.smsAuthMessage{
        font-size:1.6rem;
        padding: 0 8px;
    }
    input.smsAuthForm{
        width:100%;
        font-size:1.6rem;
    }
    input.smsAuthSubmitBtn, input.smsAuthRetransmissionBtn{
        font-size: 1.8rem;
    }
    div.smsAuthRetransmissionBtn{
        padding:0;
    }

    /*店舗*/
    .area dl {
        width: 100%;
        margin: 0 8px 0 0;
    }
    .area dl dt {
        position: relative;
        background: #f7f5ed;
        font-size: 16px;
        padding: 20px;
        margin-top: -1px;
        position: relative;
        margin-bottom: 4px;
    }
    .area dl dt::after {
        content: "";
        width: 12px;
        height: 12px;
        border-bottom: 3px solid #333;
        border-right: 3px solid #333;
        position: absolute;
        top: calc(50% - 3px);
        right: 20px;
        transform: translateY(-50%) rotate(45deg);
    }
    .area dl dt.open::after {
        top: calc(50% + 4px);
        transform: translateY(-50%) rotate(-135deg);
    }
    .area dl dd{
        padding: 0;
    }
    .area dl dd ul {
        margin-bottom: 0px;
    }
    .area dl dd ul li {
        border-bottom: 1px solid #ddd;
    }
    .area dl dd ul li:nth-child(odd)
    {
        border-right: 1px solid #ddd;
    }
    .area dl dd ul li:nth-child(n+3) {
        margin: 0;
    }
    .area dl dd ul li span {
        position: relative;
        padding: 15px 20px;
        display: block;
        line-height: 30px;
        font-size: 14px;
    }
    .area dl dd ul li span::after {
        content: "";
        width: 7px;
        height: 7px;
        border-bottom: 2px solid #ccc;
        border-right: 2px solid #ccc;
        position: absolute;
        top: 48%;
        right: 20px;
        transform: translateY(-50%) rotate(-45deg);
    }
    .area dl dd {
        display: none;
    }
    .area dl dd.open {
        display: block;
    }

    table.shopSelectTable{
        width:100%;
        margin-bottom: 32px;
    }
    div.shopAreaCaution{
        font-size: 1.2rem;
        text-align: center;
        color: red;
        
    }
    input.sharpShopIdSubmitBtn{
        font-size: 1.4rem;
        width: 60vw;
        width:100%;
        height: 8vw;
        line-height: 4vw;
    }

    /*注意事項画面*/
    h4.sectionTitle{
        font-size: 14px;
    }
    #wrapperFrisode .simpleData{
        padding:8px 16px;
    }
    #wrapperFrisode .simpleData table{
        font-size: 14px;
    }
    .furisodeSelectingImg, .furisodeMeasuringImg{
        width: 100%;
        margin: 16px 0px;
        float: left;
    }
    #wrapperFrisode .agreearea p{
        color: red;
        font-size:14px;
    }
    #wrapperFrisode .agreearea table{
        font-size:14px;
    }
    #wrapperFrisode .agreearea td{
        display:block;
        text-align:center;
    }
    #wrapperFrisode .agreearea td label{
        width: 100%;
    }
    .furisodeDialog img{
        width:100%;
    }
    div.costumeSearchModalContent {
        background-color: #ffffff;
        height: 370px;
        width: 370px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        border: #996633 solid 3px;
        padding-top: 100px;
    }
    div.cancelBtn {
        background-color: #9c27b0;
        left: 10px;
    }
    div.applyBtn {
        background-color: #5cb85c;
        right: 10px;
    }
    div.furisodeModalBtn {
        border-radius: 5px;
        height: 53px;
        width: 150px;
        position: absolute;
        bottom: 70px;
        cursor: pointer;
        color: #ffffff;
        font-size: 20px;
        line-height: 60px;
    }
    .loadingIsyoIdSearch{
        position: absolute;
        top: 0px;
        width: 150px;
        height: 25px;
        background: rgba(0,0,0,.5);
        z-index: 11;
        border-radius: 7px;
    }
    .selectedCostumePagerBase {
        min-height: auto;
    }
}

@media screen and (max-width:768px) {
    #wrapperFrisode {
        min-width: initial;
    }

    .reservationProfile, .reservationIsyo {
        float: initial;
        margin-top: 2vw;
    }

    .changeContents {
        clear: initial;
        position: initial;
        top: initial;
        margin-top: 2vw;
    }

    .errorMsg {
        padding: 1.5vw;
    }

    /* 画像表示 */
    #wrapper.displayCostumeModalOnly #zoomImg {
        margin-top: 50px;
    }
}

/* スマートフォン画面以外 */
@media screen and (min-width:641px) {
	.mobileHeader{
		display: none;
	}
    .searchBtnWeb{
        display: none;
    }
    .pcNone{
        display: none;
    }
    
}

/* ヘルプ */
#helpBtn {
    position: absolute;
    color: #333;

    background-repeat: no-repeat;
    background-color :  #fff;

    border-radius: 100px;
    box-sizing: border-box;
    display: block;
    text-decoration: none !important;
    cursor: pointer;
}

/* よくある質問 */
#faqBtn {
    position: absolute;
    color: #333;

    background-repeat: no-repeat;
    background-color: #f2f0e9;

    border-radius: 100px;
    box-sizing: border-box;
    display: block;
    text-decoration: none !important;
    cursor: pointer;
}

/* スマートフォン画面用 640px以下*/
@media screen and (max-width:640px) {
    #helpBtn {
        right: 100px;
        top: 20px;    
        width: 73px;
        height: 20px;
        padding: 1px 0 1px 27px;
        font-size: 75%;

        background-position: 17%;
        background-size: 13px;
    
        border: 2px solid #f2f0e9;
    }
    #faqBtn {
        right: 5px;
        top: 20px;    
        width: 90px;
        height: 20px;
        padding: 1px 5px 1px 5px;
        font-size: 75%; 

        background-position: 91%;
        background-size: 6px;

        border: 2px solid #f2f0e9;
    }
}
/* PC画面用 641px以上*/
@media screen and (min-width:641px){
    #helpBtn {
        right: 150px;
        top: 25px;    
        width: 88px;
        height: 30px;
        padding: 5px 0 5px 35px;
        font-size: 86%;

        background-position: 20%;
        background-size: 18px;

        border: 3px solid #f2f0e9;
    }
    #faqBtn {
        right: 20px;
        top: 25px;    
        width: 110px;
        height: 30px;
        padding: 5px 10px 5px 10px;
        font-size: 86%;

        background-position: 91%;
        background-size: 8px;

        border: 3px solid #f2f0e9;
    }  
}

/* -----------------------------------------------------------------------------

	ヘルプ
  
----------------------------------------------------------------------------- */
.helpModal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
    display: none;
    background-size: 450px;
}
.help .inner {
    position: absolute;
	top: 50%;
    left: 50%;
    width: 900px;
    height: 585px;
	margin: -325px 0 0 -440px;
	background: #fff;
	padding: 30px 40px 40px 40px;
    font-weight : bold ;
    font-size : 110% ;
}

.help .scroll { 
	width: 100%;
	height: 450px;
    overflow-y: scroll;
}

.help section {
	background: #f7f5ed;
    padding : 20px ;
	margin-top: 40px;
    position: relative;
}

.help section:before {
	content: "";
	position: absolute;
	bottom: -30px;
	left: 65px;
	width: 10px;
	height: 46px;
}
.help section:last-child:before {
    background: none;
	height: 0;
} 

.help section:first-child {
	margin-top: 0;
}

.help dl dt {
	font-size: 200%;
	margin-bottom: 12px;
}

.help dl dt img {
	display: block;
	margin-bottom: 15px;
}

.help .scroll p img {
    width : 428px ;
}

.help dl {
	width: 290px;
	float: left;
}

.help dl dt span {
	font-size: 64%;
}

.help dl p {
    width: 300px ;
	float: right;
}

.help dl dd {
    line-height: 1.6;
    margin: 0px 20px 0 0 ;
}

.help dl dd span {
    color : red ;
	display: block;
	font-weight: bold;
}
.help .inner > p:first-child {
	text-align: center;
	margin-bottom: 10px;
}

/* クローズアイコン ↓*/
.help p.close {
	position: absolute;
	width: 30px;
	height: 30px;
	top: 20px;
	right: 20px;
    cursor: pointer;
    opacity:0.8;
}
.help p.close:hover {
	opacity:1;
	filter:alpha(opacity=100);
	-ms-filter:"alpha( opacity=100 )";
}
.help p.close img {
	width: 100%;
	height: auto;
}
/* クローズアイコン ↑*/

/* step5  ふりホ衣装予約の確認 の幅、改行の調整*/
.help section:nth-child(5) dl dt{
    width: 85%;
}

/* step5 メッセージ欄の改行の調整 */
.help section:nth-child(5) dl dd{
    width: 100%;
}

/* 最後のsection (step6)*/
.help section:last-child {
    height: 220px;  
    padding-top: 5px;
} 

.help section:last-child dl {
	width: auto;
	float: none;
}

.help section:last-child dl dt{
    width: 250px;
	float: left;
	margin: 10px 20px 0 0 ;
}
.help section:last-child dl dd {
	float: right;
    width: 438px;
}

.help section:last-child dd {   
    margin-top: 30px;
}

/* スマートフォン画面用 640px以下*/
@media screen and (max-width:640px) {
    .helpModal {
        background-size: 100px;
    }

    .help img {
        width: 100%;
    }

    .help .inner {
        position: fixed;
        top: 0;
        left: 0;
        background: #fff;
        padding: 15px 18px;
        margin: 12px 5px 5px 5px ;
        width: 97%;
        height: 97%;
    }

    .help .scroll {
        width: 105%;
        height: 93%;
        overflow-y: scroll;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch ;
        padding : 0 10px ;
    }

    .help .scroll::-webkit-scrollbar {
        width: 10px;
    }

    .help .scroll p img {
        width : 100% ;
    }

    .help section {
        left : 0px ;
        padding: 15px;
        margin-top: 35px;
    }

    .help section:before {
        left: 38px;
        width: 8px;
        height: 37px;
    }

    .help p.close {
        width: 22px;
        height: 22px;
        top: 10px;
        right: 10px;
    }

    .helpModal p.close img {
        width: 100%;
        height: auto;
    }

    .help .inner > p:first-child {
        text-align: center;
        margin: 0 auto 15px;
        width: 80%;
    }
    .help .inner > p:first-child img {
        width: 100%;
        height: auto;
    }
    .help dl + p {
        margin-top: 10px;
    }
    .help dl dt {
        font-size: 121%;
        margin-bottom: 6px;
        font-weight: bold;
    }
    .help dl dt span {
        font-size: 64%;
    }
    .help dl dt img {
        width: 50px;
        height: auto;
        display: block;
        margin: 0 15px 0 0;
        float: left;
    }
    .help dl dd {
        width: 95% ;
        line-height: 1.4;
        padding-left: 65px;
        font-size: 85%;
    }
    .help dl dd span {
        color : red ;
        display: block;
        font-weight: bold;
    }
    
    /* step5  ふりホ衣装予約の確認 の幅、改行の調整*/
    .help section:nth-child(5) dl dt{
        width: 100%;
    }

    /* step5 メッセージ欄の改行の調整 */
    .help section:nth-child(5) dl dd{
        width: 95% ;
    }

    /* 最後のsection (step6) */
     .help section:last-child {
        height: 220px;  
        padding-top: 5px;   
    } 
    
    .help section:last-child dl {
        width: auto;
        float: none;
    }
    
    .help section:last-child dl dt{
        float: left;
        margin: 10px 20px 10px 0 ;
        width : 106% ;
    }
    .help section:last-child dl dd {
        float: right;
        width: 438px;
    }
    
    .help section:last-child dd {  
        width: 104%; 
        margin-top: 30px;
        font-size: 86%;
        padding: 0;
        line-height: 1.5;
    }

    .help section:last-child dl dt img {
        margin: 0 8px 0 0;
    }
}

/* -----------------------------------------------------------------------------

	よくある質問
  
----------------------------------------------------------------------------- */
.faqModal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
    display: none;
    background-size: 450px;
}
.faq .inner {
    position: absolute;
	width: 900px;
	height: 620px;
	top: 50%;
	left: 50%;
	margin: -325px 0 0 -440px;
	background: #fff;
	padding: 30px 40px 40px 40px;
}
.faq .scroll {
    width: 100%;
	height: 420px;
    overflow-y: scroll;
}

.faq .inner > p:first-child {
    text-align: center;
	margin-bottom: 10px;
}

.faq .inner {
    font-weight : bold ;
    font-size : 110% ;
}

/* FAQよくある質問 */
.faq .inner > p:nth-child(2) {
	text-align: left ;
    margin-left: 40px ;
    margin-bottom: 0 ;
}

.faq .inner > p:nth-child(2) span {
    font-size: 300%;
    color : red ;
}

/* クローズアイコン ↓*/
.faq p.close {
	position: absolute;
	width: 30px;
	height: 30px;
	top: 20px;
	right: 20px;
    cursor: pointer;
    opacity:0.8;
}
.faq p.close:hover {
	opacity:1;
	filter:alpha(opacity=100);
	-ms-filter:"alpha( opacity=100 )";
}
.faq p.close img {
	width: 100%;
	height: auto;
}
/* クローズアイコン ↑*/

.faq dl dt {
	padding: 15px 55px 15px 50px;
	line-height: 1.4;
	position: relative;
	margin: 0 0 20px 0;
    background: #f0f0f0;
	background-size: 22px;
}

/* Questionアイコン */
.faq dl dt:after {
	content: "";
	width: 23px;
	height: 22px;
	position: absolute;
	left: 12px;
	top: 50%;
    background-size: 22px;
    margin-top: -11px;
}

.faq dl dd {
	padding: 0 20px 20px 50px;
	line-height: 1.6;
	position: relative;
}

/* Anserアイコン */
.faq dl dd:after {
	content: "";
	width: 23px;
	height: 22px;
	position: absolute;
	left: 12px;
    top: 0;
}

.faq dl dd a {
	text-decoration: underline;
}

.faq dl dd a:hover {
	text-decoration: none;
}

.faq dl dd ul {
	margin: 20px 0;
}

.faq dl dd ul li {
	margin-bottom: 10px;
}

.faq dl dd .font-size-up {
    font-size: 120%;
}

/* スマートフォン画面用 640px以下*/
@media screen and (max-width:640px) {
    .faqModal {
        background-size: 100px;                     
    }        

    .faq img {
        width: 100%;
    }

    .faq .inner {
        position: fixed;
        top: 0;
        left: 0;
        background: #fff;
        padding: 15px 18px;
        margin: 12px 5px 5px 5px ;
        width: 97%;
        height: 97%;
    }

    .faq .scroll {
        width: 105%;
        height: 88%;
        overflow-y: scroll;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch ;
        padding : 0 10px ;
    }

    .faq .scroll::-webkit-scrollbar {
        width: 10px;
    }

    /* FAQよくある質問 */
    .faq .inner > p:nth-child(2) {
        margin-left: 20px ;
    }

    .faq .inner > p:nth-child(2) span {
        font-size: 200%;
        color : red ;
    }

    /* Anserアイコン */
    .faq dl dd:after {
        top: 10px ;
    }

    .faq dl dt {
        padding: 10px 20px 10px 50px;
        margin: 0 0 5px 0;
        font-size : 85% ;
    }        

    .faq dl dd {
        padding: 5px 20px 10px 50px;
        font-size : 85% ;
    }

    .faq p.close {
        width: 22px;
        height: 22px;
        top: 10px;
        right: 10px;
    }

    .faqModal p.close img {
        width: 100%;
        height: auto;
    }

    .faq dl dd .font-size-up {
        font-size: 110%;
        font-weight: 900;
    }

}

/* -----------------------------------------------------------------------------

	利用規約
  
----------------------------------------------------------------------------- */
h1.termsTitle {
    position: relative ;
    text-align: center ;
    left : auto ;
}

h2.style01 {
    background-position: 6px 11px;
    padding: 0px 0 25px 40px;
    font-size: 228%;
    font-weight: normal;
    color: #f25388;
    line-height: 1.4;
}

#wrapper-terms p.lead {
    line-height: 1.6;
    margin-bottom: 40px;
    font-size: 14px ;
    padding-left : 40px ;
}

#term-contents > div > section {
    margin-left : 40px ;
    padding : 0 ;
    width: calc(100% - 40px);
}

#wrapper-terms section dl {
    margin-bottom: 40px;
}

#wrapper-terms section dl dt {
    margin-bottom: 10px;
    font-weight: bold;
}

#wrapper-terms section dl dd {
    line-height: 1.6;
}

#wrapper-terms section p.code {
    text-align: right;
}

#wrapper-terms section p.code span {
    font-weight: bold;
}

/* liタグを(1)の形式で表示 */
.list-style-paren {
    margin-left: 1.5em; 
	list-style-type: none;
    counter-increment: cnt;
    position: relative;
}

.list-style-paren::before {
    content: "(" counter(cnt) ").";
	display: inline-block;
	margin-left: -3em; 
	width: 3em; 
	text-align: right;
	position: absolute;
	top: 0;
    left: 0;
}

.list-style-ol-paren{
    padding-left : 0 ;
}

.list-style-nakamaru {
    margin-left: 0.2em; 
    list-style-type: none;
    padding-left : 10px ;
    position: relative;
}

.list-style-nakamaru::before {
    content:"・";
    display: inline-block;
	margin-left: -0.2em; 
	width: 0.2em; 
	text-align: right;
	position: absolute;
	top: 0;
    left: 0;
}

.list-style-ul-nakamaru{
    padding-left: 0px;
}

/* スマートフォン画面用 640px以下*/
@media screen and (max-width:640px) {
	#wrapper-terms {
		height: 100%;
		background-color: #FFF;
    }

    #wrapper-terms p.lead {
        padding-left: 5px;
        margin-bottom: 20px;
    }

    h2.style01 {
        letter-spacing: 0.05em;
        padding: 0px 0 15px 5px;
        font-size: 155%;
    }

    #term-contents > div > section {
        margin-left: 5px;
        padding: 0;
        width: calc(100% - 5px);
    }

    #wrapper-terms section dl dt {
        font-size: 110%;
    }

    #term-contents section > dl > dd > ol {
        padding-left: 15px;
    }

    #wrapper-terms section dl {
        margin-bottom: 20px;
    }

    .list-style-ul-nakamaru{
        padding-left: 10px;
    }

}

/* 
    スマートフォン画面用 640px以下
    IE11 にのみ適用される
*/
@media screen and (max-width:640px) and (-ms-high-contrast: none) {
    *::-ms-backdrop, #term-contents > div > p {
        width: 365px ;
    }

    *::-ms-backdrop, #term-contents > div > section > dl > dd {
        width: 350px ;
    }
    
    *::-ms-backdrop, #term-contents > div > section > dl > dd > ol > li {
        width: 335px ;
    }

    *::-ms-backdrop, #wrapper-terms section p.code {
        width: 355px ;
    }

}

/* 
   IEのみ適用
   IEでボタンの文字サイズが小さくなるため追加
   @media screen and (max-width:640px)より後ろにする必要があります。
   @media screen and (max-width:640px)のfont-sizeに影響を受けるため
*/
@media all and (-ms-high-contrast: none){
    /* マイページ 「予約情報変更」ボタン*/
    .changeContents .transitionBtn {
        font-family:'メイリオ', 'Meiryo', sans-serif; 
        font-size: 17px;
    }

    /* 店舗選択 【この店舗で予約する】ボタン */
    input.sharpShopIdSubmitBtn {
        font-family:'メイリオ', 'Meiryo', sans-serif; 
        font-size: 16px;
    }

    /* 注意事項画面 【予約する】ボタン */
    input.cautionSubmitBtn{
        font-family:'メイリオ', 'Meiryo', sans-serif; 
        font-size: 16px;
    }

    /* 予約情報確認画面 【完了する】ボタン */
    input.inputProfileCheckSubmitBtn {
        font-family:'メイリオ', 'Meiryo', sans-serif; 
        font-size: 16px;
    }

    /* SMS認証画面【認証する】ボタン */
    input.smsAuthSubmitBtn {
        font-family:'メイリオ', 'Meiryo', sans-serif; 
        font-size: 16px;
    }

    /* SMS認証画面【コードを再送信する】ボタン */
    input.smsAuthRetransmissionBtn {
        font-family:'メイリオ', 'Meiryo', sans-serif; 
        font-size: 16px;
    }
    
    /* ログイン画面【ログイン】ボタン */
    .loginForm input[type="submit"] {
        font-family:'メイリオ', 'Meiryo', sans-serif; 
        font-size: 14px;
    }
    
    /* 【ログインID問い合わせ】、【パスワードリセット】、【パスワード変更】ボタン */
    .inquiryForm input[type="submit"] {
        font-family:'メイリオ', 'Meiryo', sans-serif; 
        font-size: 16px;
    }
}

/* *************************************************************** */
/* フッター ふりホ、Wedカタログ*/
/* *************************************************************** */
/* 共通フッター */
.commonFooter {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}
.commonFooter a {
    display: inline-block;
    margin-top: 10px;
    margin-right: 80px;
}
.commonFooter a:last-child {
    margin-right: 0;
}
.commonFooter a:before {
    content: "\25A0";   // ■を表示
    margin-right: 5px;
}


footer {
    background-color:#f7f5f5;
    box-shadow: 5px 5px 5px 2px #CCC;
    justify-content: center;
    align-items: center;
}

footer a{
    color:#888888;
}

.footer-section-title{
    color:#666686;
}



/* スマートフォン画面用 640px以下*/
@media screen and (max-width:640px) {
    .commonFooter a {
        flex-basis: calc(50% - 20px); /* 幅の50%で2列に */
        margin-left: 0px;
        margin-right: 0px;
    }
    .commonFooter a:before {
        content: "\25A0";   // ■を表示
        margin-right: 1px;
    }

    /* サブイベントトップのスクロール */
    /* 通常はhiddenだが、visibleにする事で共通フッターが表示されるためvisibleにしている */
    #wrapper.subeventtopWrapper {
        overflow: visible;
    }

}

/* カテゴリ、イメージ、色 */
.footer-container {
    display: flex;
    justify-content: space-between;
}

.footer-section {
    flex: 1;
    padding: 10px;
}

.footer-section-title {
    font-weight: bold;
    margin-bottom: 5px;
}

/* スマートフォン画面用 640px以下*/
@media screen and (max-width:640px) {
    .footer-container {
        flex-direction: column; /* 縦並びにする */
    }

    .footer-section {
        flex: none; /* 横幅を自動調整しない（100%になる） */
        padding: 10px;
        margin-left: 10px;
    }
}

/* *************************************************************** */
/* パンくず                                                        */
/* *************************************************************** */

/*ヘッダ フッタまわり*/
.breadcrumbs{
    width:100%;
    margin-top:2px;
}

.breadcrumbs{
    background-color:#F3F0E9;
    margin-bottom:0px;
    padding-top:0px;
    padding-bottom:0px;
    font-size:9pt;
    color: black;
}

.breadcrumbs.pc.subEventTop{
    position: absolute;
    top: 55px;
}

.breadcrumbs ol{
margin-bottom:5px;
padding-inline-start:8px;
}

.breadcrumbsShadow{
box-shadow: 0 0 3px 2px #f7f5f5;
}

.breadcrumbrow li{
    display:inline-block;
}

/* パンくずの「＞」で繋ぐ */
.breadcrumbrow>li+li:before {
    font-weight: bold;
    content: " > ";
}


/* *************************************************************** */
/* 衣装の属性　例）ピンク Disney かわいい                          */
/* *************************************************************** */
.costume-attribute{
    color:#888;
    font-size:7pt;
}

/* スマートフォン画面用 640px以下 */
@media screen and (max-width:640px) {
    breadcrumbrow{
        overflow:auto;
    }




    .breadcrumbs{
        margin-top:0;
        font-size:7pt;
    }
    .breadcrumbs ol{
        margin-bottom:0;
    }

    .breadcrumbs.costumedetail{
        margin-top:60px;
    }

    .breadcrumbs.selectedCostume{
        margin-top:0px;
    }


    .breadcrumbs.sp{
        font-size:2vw;
    }
}
textarea.costumeDescription{
    width: 680px;
    height: 200px;
}
textarea.searchTagDescription {
    width: 680px;
    height: 200px;
}
@media screen and (min-width:640px) {
    /* 画像透明化用 */
    .imgDnone img {
        display: none;
    }
}