:root {
  --PageR-PraHolder: "コメントを入力できます。位置は編集時に調整します"; /* テキスト入力エリアの表示コメント */
  --body-width-max: 750px;
  --pre-content-scale: 0.3;
  --body-height-max: 800px;
  --bookArea-Width: 350px; /*calc(var(--page-Width) + "20px");*/
  --area01-titlelabel-height: 50px;
  --PhotoC-Btn01-Size: 1.5;
  --body-FontSize: 17px;
  --Photo-FontSize-Scale1: 200%;
  --Photo-FontSize-Scale2: 200%;
  --Photo-FontSize-Scale3: 3;
  --Photo-FontSize-Content-Btn: 200%;
  --Content-FontSize-Scale1: 2;
  --Photo-FDirection: column;
  --PhoCre-ContentWidth: 750px;
  --body-ScaleSize: 0.45;
  --pre-ScaleSize: 0.6; /* プレビューエリアの拡大倍率 */
  --BookData_BookType: 0; /* ブックタイプ　変更はブックデータ用に記載し、上書き */
  --Content-01-max-width: 750px;
  --Order-Digital-Show: 0; /* デジタル版ボタンの表示の有無 */
  --Movie-Select: "0"; /* 動画の選択 */
  --BookType-Select: "0"; /* ブックの種類 */
  --BookTyoe-Select-O: "0"; /* ブック種類2 */
}
@media screen and (min-width: 540px) {
  :root {
    --pre-content-scale: 0.35;
    --body-width-max: auto;
    --PhotoC-Btn01-Size: 1.5;
    --Content-FontSize-Scale1: 1.5;
    --Photo-FontSize-Scale1: 200%;
    --Photo-FontSize-Scale2: 200%;
    --Photo-FontSize-Scale3: 2.1;
    --Photo-FontSize-Content-Btn: 150%;
    --body-ScaleSize: 0.7;
    --body-ScaleMove: 0px;
    --Photo-FDirection: row;
    --pre-ScaleSize: 0.95; /* プレビューエリアの拡大倍率 */
  }
}
@media screen and (min-width: 770px) {
  :root {
    --pre-content-scale: 1;
    --body-width-max: auto;
    --PhoCre-ContentWidth: auto;
    --PhotoC-Btn01-Size: 1;
    --Content-FontSize-Scale1: 1;
    --Photo-FontSize-Scale1: 300%;
    --Photo-FontSize-Scale2: 200%;
    --Photo-FontSize-Scale3: 1;
    --Photo-FontSize-Content-Btn: 100%;
    --body-ScaleSize: 1;
    --body-ScaleMove: 0px;
    --pre-ScaleSize: 2.0; /* プレビューエリアの拡大倍率 */
  }
}
.ContentScale {
  width: var(--PhoCre-ContentWidth);
  overflow: hidden;
  transform-origin: left top;
  transform: scale(var(--body-ScaleSize));
}
.ContentScale2 {
  width: var(--PhoCre-ContentWidth);
  overflow: hidden;
  transform-origin: left top;
  transform: scale(var(--pre-content-scale));
}
.Content_MaxWidth01 {
  max-width: var(--Content-01-max-width);
}
.Content_FontSize01 {
  font-size: calc(var(--body-FontSize) * var(--Content-FontSize-Scale1));
}
.Content_FontSize02 {
  font-size: calc(var(--body-FontSize) * var(--Photo-FontSize-Scale3));
}
.tabBox {
  width: var(--PhoCre-ContentWidth);
}
/* 列内横並べ要素の枠 */
.FlexDivBox01 {
  width: auto;
  height: auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
/* 列内横並べ要素の枠 */
.FlexDivBox01_NoW {
  width: auto;
  height: auto;
  display: flex;
  flex-wrap: nowrap;
}
/* 列内縦並べ要素の枠 */
.FlexDivBox02 {
  width: auto;
  height: auto;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}
/* 列内縦並べ要素の枠 */
.FlexDivBox02_NoW {
  width: auto;
  height: auto;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
}
/* 列内縦並べ要素の枠 */
.FlexDivBox03 {
  width: auto;
  height: auto;
  display: flex;
  flex-direction: var(--Photo-FDirection);
  flex-wrap: wrap;
}
.FlexCenterBox01 {
  display: flex;
  justify-content: center;
  position: absolute;
  position: relative;
}
.AddHidden {
  overflow: hidden;
}
.WidthMax {
  width: 100%;
}
.FRight {
  float: right;
}
.font_tabContent_Btn01 {
  font-size: calc(var(--Photo-FontSize-Scale1) * var(--body-FontSize));
}
/* 全体 */
.AllWidth01 {
  width: var(--body-width-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: 10px;
  font-size: var(--body-FontSize);
  position: absolute;
  top: 0px;
  left: 0px;
}
/* 全体 */
.AllWidth02 {
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 1000;
  pointer-events: none;
}
.AllWidth_Back01 {
  background-color: #8be4f0;
  background-image:
    linear-gradient(-90deg, #80deea 50%, transparent 50%, transparent);
  background-size: 14px 14px;
}
/*　ヘッダーエリア */
.TitleText1 {
  font-size: var(--Photo-FontSize-Scale1);
}
/*　フォトブック操作エリア */
.CreateArea01 {
  min-width: 520px;
}
.ImageBox {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  background-color: white;
}
.BookArea {
  display: flex;
  width: var(--bookArea-Width); /*var(--bookArea-Width);*/
  flex-direction: column;
  flex-wrap: nowrap;
}
.BookArea2 {
  display: flex;
  width: 80%;
  flex-direction: column;
  flex-direction: row;
  flex-wrap: wrap;
}
.BookArea_PhotoSelect {
  display: flex;
  width: 100%;
  flex-direction: column;
  flex-direction: row;
  flex-wrap: wrap;
}
.BookArea_Title {
  list-style: inline-block;
  background: rgb(255, 255, 255, 0.3);
  width: 100%;
  /*height: 50px;*/
  justify-content: center;
  align-items: center;
}
.BookArea_TitleFont {
  font-size: var(--Photo-FontSize-Scale2);
}
.PhotoArea_Title {
  list-style: inline-block;
  background: rgb(255, 255, 255, 0.3);
  width: 280px;
  /*height: 50px;*/
  justify-content: center;
  align-items: center;
}
.BookSet2 {
  display: inline-block;
  width: 100%;
  height: calc(var(--body-height-max) - var(--area01-titlelabel-height));
  overflow: scroll;
}
.PageArea1 {
  display: inline-block;
  list-style: block;
  width: auto;
  height: calc(var(--body-height-max) - var(--area01-titlelabel-height));
  overflow: scroll;
}
/* 手順書エリア用 */
.ProcessArea1 {
  display: inline-block;
  vertical-align: top;
  /*max-width: var(--Content-01-max-width);*/
  width: var(--PhoCre-ContentWidth);
  background-color: navajowhite padding-right: 5px;
}
.ProcessCaseAuto {
  display: inline-block;
  width: auto;
  height: auto;
}
.ProcessCaseW1 {
  width: 100%;
  height: 100%;
}
.ProcessCaseN_1 {
  border-left: solid 10px #FFC483;
  background-color: #ffdead;
}
.ProcessCaseN_2 {
  border-left: solid 10px #FFd493;
  background-color: #ffeebd;
}
.ProcessCase1L {
  width: 10%;
}
.ProcessCaseB1 {
  display: inline-block;
  width: 100%;
  height: 35px;
}
.Process_YT1 {
  width: auto;
  max-width: calc(var(--Content-01-max-width) - 40px);
  margin: 5px;
}
.IBLabel {
  background: #333333;
  color: #fff;
  cursor: pointer;
  padding: 5px 5px;
  margin: 5px 5px 5px 5px;
  display: inline-block;
  border-radius: 10px;
}
.IBInput {
  display: none;
  margin: 2px 2px 2px 2px;
}
.ALL_UnderArea01 {
  width: 100%;
  text-align: left;
}
.Preview_Scale1 {
  transform-origin: left top;
  transform: scale(var(--pre-ScaleSize));
}
.PreView_InfoArea {
  display: inline-block;
  width: auto;
  height: auto;
}
.PreAreaFrame_Page1 {
  display: flex;
  flex-direction: column;
  width: auto;
  height: auto;
  margin-left: 1px;
  margin-right: 1px;
  position: relative;
}
.PreArea_Center_Back {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: white;
  z-index: 0;
}
.PreFont_01 {
  font-family: 'Noto Sans JP', sans-serif;
}
.PreFont_Selecter {
  display: inline-block;
  width: 80px;
}
/* 丸ゴシック */
.SelectFont_01 {
  font-family: 'M PLUS Rounded 1c', sans-serif;
}
.PrePageInfo_BackColorL {
  border-left: solid 10px #FFd493;
  background-color: #ffeebd;
}
.PrePageInfo_BackColorR {
  border-left: solid 10px #FFC483;
  background-color: #ffdead;
}
.PrePageInfo_BackColorC {
  background-color: #ffdead;
}
.PreView_OptionArea01 {
  width: auto;
  height: auto;
  margin: 1px;
}
.PreView_InfoAreaL {
  display: inline-block;
  width: auto;
  height: auto;
  background: #00fff0;
}
.PreView_InfoAreaR {
  display: inline-block;
  width: auto;
  height: auto;
  background: #00ff0f;
}
.PreView_InfoAreaC {
  display: inline-block;
  width: auto;
  height: auto;
  background: #00ff0f;
  z-index: 1;
}
.Pre_BlockCenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.Pre_Page2 {
  display: inline-block;
  overflow: hidden;
}
.Pre_Page1 {
  display: inline-block;
  z-index: 1;
}
.Pre_Page_Center {
  display: inline-block;
  overflow: hidden;
  z-index: 2;
}
.Pre_PSTextInfo {
  width: auto;
  height: auto;
  text-align: center;
}
.Pre_PSTextB {
  width: calc(45px * var(--PhotoC-Btn01-Size));
  height: calc(30px * var(--PhotoC-Btn01-Size));
  /* font-size: 20px; */
  text-align: center;
}
.Pre_PSText01 {
  width: 100%;
  height: calc(25px * var(--Content-FontSize-Scale1));
  text-align: left;
  /* font-size: calc(var(--body-FontSize) * var(--Content-FontSize-Scale1) * 0.8); */
}
/* フォント */
.font_small1{
	font-size:13px;
}

/* ボタン */
.btn01 {
  position: relative;
  display: inline-block;
  font-weight: bold;
  padding: 8px 10px 5px 10px;
	margin-left: 5px;
  text-decoration: none;
  color: #101010;
  background: #FFA500; /*#fff1da;*/
  border-bottom: solid 4px #FF8000;
  border-radius: 15px 15px 15px 15px;
  transition: .4s;
  /*font-size: var(--Photo-FontSize-Content-Btn);*/
}
.btn01:hover {
  background: #ffc25c;
  color: #EEE;
}
.btn02 {
  position: relative;
  display: inline-block;
  font-weight: bold;
  padding: 8px 10px 5px 10px;
  text-decoration: none;
  color: #101010;
  background: #FFA500; /*#fff1da;*/
  border-bottom: solid 4px #FF8000;
  border-radius: 15px 15px 15px 15px;
  transition: .4s;
  margin-right: 2px;
  margin-top: 2px;
}
.btn02:hover {
  background: #ffB000;
  color: #EEE;
}
.btn03 {
  width: 30px;
  position: relative;
  display: inline-block;
  font-weight: bold;
  padding: 8px 10px 5px 10px;
  text-decoration: none;
  color: #101010;
  background: #FFA500; /*#fff1da;*/
  border-bottom: solid 4px #FF8000;
  border-radius: 15px 15px 15px 15px;
  transition: .4s;
  margin-right: 2px;
  margin-top: 2px;
  text-align: center;
}
.btn03:hover {
  background: #ffB000;
  color: #EEE;
}