@charset "utf-8";

[data-id="model-140:model"] {
  display: none;
}

[data-display="visible_100vh"] {
  height: 100vh;
  opacity: 1;
}
[data-display="visible"] {
  overflow: visible;
  opacity: 1;
}
[data-display="opacity_0"] {
  opacity: 0;
}
[data-display="hidden"] {
  height: 0;
  overflow: hidden;
  opacity: 0;
}

#settingBOX[data-display="hidden_slide"] { right: -34.285vw; }
#settingBOX[data-display="visible_slide"] { right: 34.285vw; }
#settingBOX[data-display="visible2_slide"] { right: 68.57vw; }
@media screen and (min-width:1400px) {
#settingBOX[data-display="hidden_slide"] { right: -480px; }
#settingBOX[data-display="visible_slide"] { right: 480px; }
#settingBOX[data-display="visible2_slide"] { right: 960px; }
}
#settingBOX[data-display="visible0_slide"] { right: 0; }

#detailBOX[data-display="hidden_slide"] { right: -34.285vw; }
#detailBOX[data-display="visible_slide"] { right: 34.285vw; }
@media screen and (min-width:1400px) {
#detailBOX[data-display="hidden_slide"] { right: -480px; }
#detailBOX[data-display="visible_slide"] { right: 480px; }
}
#detailBOX[data-display="visible0_slide"] { right: 0; }



#sub_detailBOX[data-display="hidden_slide"] { right: -34.285vw; }
@media screen and (min-width:1400px) {
#sub_detailBOX[data-display="hidden_slide"] { right: -480px; }
}
#sub_detailBOX[data-display="visible0_slide"] { right: 0; }



#setImgBOX[data-display="wide"] { width: 92.857vw; } /* 850px */
@media screen and (min-width:1400px) {
#setImgBOX[data-display="wide"] { width: calc(100vw - 48px - 48px) } /* 850px */  
}

div[data-aff_display="model-140_visible"],
div[data-aff_display="model-6000_visible"]
{
  height: auto;
  overflow: visible;
}

div[data-aff_display="model-140_hidden"],
div[data-aff_display="model-6000_hidden"]
{
  height: 0;
  overflow: hidden;
}


/*==========================================
 firstScreen
===========================================*/
#firstScreen {
  position: relative;
  overflow: hidden;
  transition: opacity 300ms ease;
}

#firstScreenBack {
  height: calc(100vh - 90px);
  background: url("../img/index/first_backImg.png") center no-repeat;
  background-size: cover;
  position: relative;
  margin: 20px 20px 0px 20px;
}

#catchphrase {
  width: 225px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

#firstBtn {
  height: 300px;
  display: block;
  position: absolute;
  top: 0;
  bottom: -502px;
  left: 0;
  right: 0;
  margin: auto;
}

#firstBtn img {
  width: 53px;
  height: 53px;
  position: absolute;
  top:0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
  margin: auto;
  animation: bound-anim 1500ms infinite;
}

@keyframes bound-anim {
  /*
  0% {top: 0;transform: scale(1.05 , 0.97);}
  30% {top: -20%; transform: scale(1);}
  60% {transform: scale(1);}
  98% {top: 0;transform: scale(1.1 , 0.95);}
  100% {top: 0;transform: scale(1.05 , 0.97);}
  */
  0% {top: 0;transform: scale(1);}
  30% {top: -20%; transform: scale(1);}
  100% {top: 0;transform: scale(1);}
}

#btn_shadow {
  width: 32px;
  height: 8px;
  background: #000;
  border-radius: 50%;  
  position: absolute;
  top: 0;
  bottom: -55px;
  left: 0;
  right: 0;
  margin: auto;  
  filter: blur(4px);
  opacity: 0.9;
  animation: shadow-anim 1500ms infinite;
}

@keyframes shadow-anim {
  0% {transform: scale(1);filter: blur(3px);}
  30% {transform: scale(1.6 , 1);filter: blur(6px);}
  100% {transform: scale(1);filter: blur(2px);}
}

/*
#firstScreen a {
  width: 53px;
  height: 53px;
  display: block;
  position: absolute;
  top: 0;
  bottom: -502px;
  left: 0;
  right: 0;
  margin: auto;
}
*/

#firstScreen .flexBOX {
  width: 100%;
  height: 70px;
  position: absolute;
  align-items: flex-start;
  padding-left: 50px;
}

#firstScreen .flexBOX img:nth-of-type(1) {
  width: 108px;
  margin-top: 24px;
}

#firstScreen .flexBOX img:nth-of-type(2) {
  width: 499px;
  margin: 15px 0 0 36px;
}


/*==========================================
 secondScreen
===========================================*/
#secondScreen {
  position: relative;
  overflow: hidden;
  transition: opacity 300ms ease;
}

/* --- contentsBOX --- */
#contentsBOX {
  justify-content: space-between;
  position: relative;
  z-index: 10;
  transition: opacity 200ms ease;
}

/* --- setImgBOX --- */
/*
#setImgBOX {
  width: 60.714vw; 850px
  min-width: 656px;
  margin: 2.428vw 0 0 3.571vw;
}
*/
#setImgBOX {
  width: 60.714vw; /* 850px */
  /* min-width: 656px; */
  min-width: 595px;
  height: calc(100vh - 15vw);
  max-height: 45.71429vw;
  background: #fff;
  border: #dcdddd solid 1px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin: 2.428vw 0 0 3.571vw;
  padding: 0 25px;
}
@media screen and (min-width:1400px) {
#setImgBOX {
  width: calc(100vw - 48px - 480px - 20px);
  margin-left: 48px;
}
}

#setImgBOX h2 {
  background: #dcdddd;
  font-size: 1.6rem;
  font-weight: bold;
  visibility: hidden;
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  padding: 13px 24px;  
}

#setImgBOX #img_area {
  /*width: 1080px;*/
  position: relative;
  margin: auto;
  transition: transform 300ms ease;
  /*transform: scale(0.5);*/
}

#setImgBOX #img_area .flexBOX {
  display: none;
  justify-content: center;
  align-items: flex-end;
  flex-direction: row-reverse;
}

#setImgBOX #img_area span {
  /*height: 251px;*/
  display: block;
  position: relative;
  
  display: none;
  /*padding-top: 23.24%;*/
}
#setImgBOX #img_area span img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  visibility: hidden;
}


.layout_R3-1 { order: -31; } .layout_R3-2 { order: -32; } .layout_R3-3 { order: -33; } .layout_R3-4 { order: -34; } .layout_R3-5 { order: -35; } .layout_R3-6 { order: -36; } .layout_R3-7 { order: -37; } .layout_R3-8 { order: -38; } .layout_R3-9 { order: -39; }
.layout_R2-1 { order: -21; } .layout_R2-2 { order: -22; } .layout_R2-3 { order: -23; } .layout_R2-4 { order: -24; } .layout_R2-5 { order: -25; } .layout_R2-6 { order: -26; } .layout_R2-7 { order: -27; } .layout_R2-8 { order: -28; } .layout_R2-9 { order: -29; }
.layout_R1-1 { order: -11; } .layout_R1-2 { order: -12; } .layout_R1-3 { order: -13; } .layout_R1-4 { order: -14; } .layout_R1-5 { order: -15; } .layout_R1-6 { order: -16; } .layout_R1-7 { order: -17; } .layout_R1-8 { order: -18; } .layout_R1-9 { order: -19; }
.layout_R0-1 { order: -1; } .layout_R0-2 { order: -2; } .layout_R0-3 { order: -3; } .layout_R0-4 { order: -4; } .layout_R0-5 { order: -5; } .layout_R0-6 { order: -6; } .layout_R0-7 { order: -7; } .layout_R0-8 { order: -8; } .layout_R0-9 { order: -9; }
.layout_main { order: 0; }
.layout_L0-1 { order: 1; } .layout_L0-2 { order: 2; } .layout_L0-3 { order: 3; } .layout_L0-4 { order: 4; } .layout_L0-5 { order: 5; } .layout_L0-6 { order: 6; } .layout_L0-7 { order: 7; } .layout_L0-8 { order: 8; } .layout_L0-9 { order: 9; }
.layout_L1-1 { order: 11; } .layout_L1-2 { order: 12; } .layout_L1-3 { order: 13; } .layout_L1-4 { order: 14; } .layout_L1-5 { order: 15; } .layout_L1-6 { order: 16; } .layout_L1-7 { order: 17; } .layout_L1-8 { order: 18; } .layout_L1-9 { order: 19; }
.layout_L2-1 { order: 21; } .layout_L2-2 { order: 22; } .layout_L2-3 { order: 23; } .layout_L2-4 { order: 24; } .layout_L2-5 { order: 25; } .layout_L2-6 { order: 26; } .layout_L2-7 { order: 17; } .layout_L2-8 { order: 28; } .layout_L2-9 { order: 29; }
.layout_L3-1 { order: 31; } .layout_L3-2 { order: 32; } .layout_L3-3 { order: 33; } .layout_L3-4 { order: 34; } .layout_L3-5 { order: 35; } .layout_L3-6 { order: 36; } .layout_L3-7 { order: 37; } .layout_L3-8 { order: 38; } .layout_L3-9 { order: 39; }
.layout_L4-1 { order: 41; } .layout_L4-2 { order: 42; } .layout_L4-3 { order: 43; } .layout_L4-4 { order: 44; } .layout_L4-5 { order: 45; } .layout_L4-6 { order: 46; } .layout_L4-7 { order: 47; } .layout_L4-8 { order: 48; } .layout_L4-9 { order: 49; }
.layout_L5-1 { order: 51; } .layout_L5-2 { order: 52; } .layout_L5-3 { order: 53; } .layout_L5-4 { order: 54; } .layout_L5-5 { order: 55; } .layout_L5-6 { order: 56; } .layout_L5-7 { order: 57; } .layout_L5-8 { order: 58; } .layout_L5-9 { order: 59; }
.layout_L6-1 { order: 61; } .layout_L6-2 { order: 62; } .layout_L6-3 { order: 63; } .layout_L6-4 { order: 64; } .layout_L6-5 { order: 65; } .layout_L6-6 { order: 66; } .layout_L6-7 { order: 67; } .layout_L6-8 { order: 68; } .layout_L6-9 { order: 69; }
.layout_L7-1 { order: 71; } .layout_L7-2 { order: 72; } .layout_L7-3 { order: 73; } .layout_L7-4 { order: 74; } .layout_L7-5 { order: 75; } .layout_L7-6 { order: 76; } .layout_L7-7 { order: 77; } .layout_L7-8 { order: 78; } .layout_L7-9 { order: 79; }
.layout_L8-1 { order: 81; } .layout_L8-2 { order: 82; } .layout_L8-3 { order: 83; } .layout_L8-4 { order: 84; } .layout_L8-5 { order: 85; } .layout_L8-6 { order: 86; } .layout_L8-7 { order: 87; } .layout_L8-8 { order: 88; } .layout_L8-9 { order: 89; }

.layout_R3-1,.layout_R3-2,.layout_R3-3,.layout_R3-4,.layout_R3-5,.layout_R3-6,.layout_R3-7,.layout_R3-8,.layout_R3-9 { z-index: 5; }
.layout_R2-1,.layout_R2-2,.layout_R2-3,.layout_R2-4,.layout_R2-5,.layout_R2-6,.layout_R2-7,.layout_R2-8,.layout_R2-9 { z-index: 4; }
.layout_R1-1,.layout_R1-2,.layout_R1-3,.layout_R1-4,.layout_R1-5,.layout_R1-6,.layout_R1-7,.layout_R1-8,.layout_R1-9 { z-index: 3; }
.layout_R0-1,.layout_R0-2,.layout_R0-3,.layout_R0-4,.layout_R0-5,.layout_R0-6,.layout_R0-7,.layout_R0-8,.layout_R0-9 { z-index: 2; }
.layout_main { z-index: 1; }
.layout_L0-1,.layout_L0-2,.layout_L0-3,.layout_L0-4,.layout_L0-5,.layout_L0-6,.layout_L0-7,.layout_L0-8,.layout_L0-9 { z-index: 2; }
.layout_L1-1,.layout_L1-2,.layout_L1-3,.layout_L1-4,.layout_L1-5,.layout_L1-6,.layout_L1-7,.layout_L1-8,.layout_L1-9 { z-index: 3; }
.layout_L2-1,.layout_L2-2,.layout_L2-3,.layout_L2-4,.layout_L2-5,.layout_L2-6,.layout_L2-7,.layout_L2-8,.layout_L2-9 { z-index: 4; }
.layout_L3-1,.layout_L3-2,.layout_L3-3,.layout_L3-4,.layout_L3-5,.layout_L3-6,.layout_L3-7,.layout_L3-8,.layout_L3-9 { z-index: 5; }
.layout_L4-1,.layout_L4-2,.layout_L4-3,.layout_L4-4,.layout_L4-5,.layout_L4-6,.layout_L4-7,.layout_L4-8,.layout_L4-9 { z-index: 6; }
.layout_L5-1,.layout_L5-2,.layout_L5-3,.layout_L5-4,.layout_L5-5,.layout_L5-6,.layout_L5-7,.layout_L5-8,.layout_L5-9 { z-index: 7; }
.layout_L6-1,.layout_L6-2,.layout_L6-3,.layout_L6-4,.layout_L6-5,.layout_L6-6,.layout_L6-7,.layout_L6-8,.layout_L6-9 { z-index: 8; }
.layout_L7-1,.layout_L7-2,.layout_L7-3,.layout_L7-4,.layout_L7-5,.layout_L7-6,.layout_L7-7,.layout_L7-8,.layout_L7-9 { z-index: 9; }
.layout_L8-1,.layout_L8-2,.layout_L8-3,.layout_L8-4,.layout_L8-5,.layout_L8-6,.layout_L8-7,.layout_L8-8,.layout_L8-9 { z-index: 10; }

.order_1 { order: 1; } .order_2 { order: 2; } .order_3 { order: 3; } .order_4 { order: 4; } .order_5 { order: 5; } .order_6 { order: 6; } .order_7 { order: 7; } .order_8 { order: 8; } .order_9 { order: 9; } .order_10 { order: 10; } .order_11 { order: 11; } .order_12 { order: 12; } .order_13 { order: 13; } .order_14 { order: 14; } .order_15 { order: 15; } .order_16 { order: 16; } .order_17 { order: 17; } .order_18 { order: 18; } .order_19 { order: 19; } .order_20 { order: 20; } .order_21 { order: 21; } .order_22 { order: 22; } .order_23 { order: 23; } .order_24 { order: 24; } .order_25 { order: 25; } .order_26 { order: 26; } .order_27 { order: 27; } .order_28 { order: 28; } .order_29 { order: 29; } .order_30 { order: 30; }

span.outputTray-140 { z-index: 0; }

span.outputTray-140 img {
  position: relative;
  margin-bottom: 220%;
  margin-right: -11%;
}

#setImgBOX #img_area span img.vP140-light {
  width: 2.2%;
  display: none;
  margin-top: 2px;
  margin-left: 2%; /* 4px */
  margin-bottom: -34%; /* -72px */
}

/*#setImgBOX img.vP140-coverY3 { display: none; }*/


#setImgBOX #img_area span img.CF50 {
  display: none;
}

#setImgBOX #img_area span img.BLM5X0 {
  width: 69.7%;
  display: none;
  position: absolute;
  z-index: 10;
  bottom: 0;
  right: -2.7%;
}

#m_lens {
  /* width: jsで制御 */
  /* height: jsで制御 */
  background: #f57716;
  display: none;
  position: absolute;
  z-index: 100;  
  opacity: 0.3;
}
#img_area:hover #m_lens { display: block; }

#zoomBOX {
  width: 480px;
  height: 300px;
  background: #fff;
  border: 1px solid #ccc;
  display: none;
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 9999;
  overflow: hidden;
  
  width: calc(34.285vw - 20px); /* 480px */
}
#zoomBOX.active { display: block; }
  
#zoomBOX .flexBOX {
  /* width: jsで制御 */
  justify-content: center;
  align-items: flex-end;
  transform-origin: top left;
  flex-direction: row-reverse;
}

#zoomBOX .flexBOX span { display: none; }

#zoomBOX .flexBOX span .vP140-light {
  width: 2.2%;
  display: none;
  margin-top: 2px;
  margin-left: 2%; /* 4px */
  margin-bottom: -34%; /* -72px */
}

#zoomBOX .flexBOX span img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

/* --- settingBOX --- */
#settingBOX {
  width: 34.285vw; /* 480px */
  /* min-width: 370px; */
  min-width: 336px;
  max-width: 480px;
  background: #fff;
  border-right: #dcdddd solid 1px;
  border-left: #dcdddd solid 1px;
  position: absolute;
  z-index: 500;
  /* padding: 12px 2.142%; */
  transition: right 500ms ease;
}

#settingBOX #selectBOX,
#settingBOX #sizeBOX {
  transition: opacity 300ms ease;
}

#settingBOX #modelBOX,
#settingBOX #accessoriesBOX,
#settingBOX #cotrollerBOX {
  transition: opacity 300ms ease;
}

#settingBOX #model-140BOX,
#settingBOX #model-6000BOX {
  /*
  height: 0;
  overflow: hidden;
  opacity: 0;
  */
  transition: opacity 200ms ease;
}

#setting_btnBOX {
  position: absolute;
  top: 0;
  left: -50px;
}

#setting_btnBOX a {
  width: 50px;
  height: 50px;
  display: block;
  margin-top: 10px;
}

#settingBOX_inner {
  width: 100%;
  height: calc(100vh - 120px - 12px);
  height: calc(100vh - 120px);
  overflow-y: scroll;
  padding: 12px 2.142%;
  padding: 12px 6.276%;
}

#settingBOX_inner h2 {
  border-top: #000 solid 1px;
  border-bottom: #000 solid 1px;
  font-size: 1.8rem;
  font-weight: bold;
  margin: 0;
  padding: 16px 20px;
}

#settingBOX_inner #modelBOX h3 {
  background: #dcdddd;
  font-size: 1.6rem;
  margin: 32px 0 0 0;
  padding: 13px 20px;
}

#settingBOX_inner #accessoriesBOX h3,
#settingBOX_inner #cotrollerBOX h3 {
  border-left: #000 solid 10px;
  font-size: 1.6rem;
  margin: 24px 0 12px 0;
  padding:0 10px;
}

#settingBOX_inner h4 {
  margin: 16px 0 -8px 0;
  padding: 0;
}

#settingBOX_inner ul {
  list-style: none;
  justify-content: space-between;
  margin: 0;
  padding: 0;
}
#settingBOX_inner ul.column3 { justify-content: start; }

#settingBOX_inner li {
  width: 14.285vw;
  width: 47.846%;
  /* min-width: 154px; */
  min-width: 140px;
  border: #dcdddd solid 1px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  cursor: pointer;
  margin: 12px 0 0;
  padding: 13px 8px;
}

#settingBOX_inner .withImage li {
  padding: 22px 0 38px 0;
  display: inline;
}
#settingBOX_inner .column3 li { width: 9.285vw; width: 31.1%; min-width: 100px; }
#settingBOX_inner .column3 li:nth-of-type(2) { margin-right: 3.28%; margin-left: 3.28%; }


#settingBOX_inner li.item_selected::after {
  content: "";
  width: 20px;
  height: 20px;
  background: url("../img/index//selected.png") no-repeat;
  background-size: 20px;
  position: absolute;
  top: 0;
  right: 0;
}

#settingBOX_inner li.item_selected::before {
  content: "";
  width: 100%;
  height: 100%;
  border: #c30d23 solid 5px;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
}

#settingBOX_inner li.item_required { cursor: default; }
#settingBOX_inner li.item_required::before {
  content: "";
  width: 100%;
  height: 100%;
  border: #c30d23 solid 5px;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
}

#settingBOX_inner li.meshing { cursor: auto; }
/* #settingBOX_inner #modelBOX li.meshing { cursor: pointer; } */
#settingBOX_inner li.meshing::after {
  content: "";
  width: 100%;
  height: 100%;
  background-image: linear-gradient(
    45deg,
    #003060 25%,
    #ffffff 25%,
    #ffffff 50%,
    #003060 50%,
    #003060 75%,
    #ffffff 75%,
    #ffffff
  );
  background-size: 30px 30px;
  /* background-attachment: fixed; */ 
  position: absolute;
  top: 0;
  right: 0;
  opacity: 0.3;
}

#settingBOX_inner li div {
  width: calc(100% - 20px);
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 10px auto 0;
}

#settingBOX_inner li div img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  flex-shrink: 0;
}

/*
#settingBOX_inner li img {
  width: auto;
  max-width: 150px;
  max-width: 100%;
  max-height: 100px;
  padding: 16px;
  padding-bottom: 0;
}
*/

#settingBOX_inner li a {
  width: 20px;
  height: 20px;
  display: block;
  position: absolute;
  bottom: 10px;
  right: 10px;
}
#settingBOX_inner li a img {
  width: 20px;
  height: 20px;
  padding: 0;
}

#settingBOX_inner li a[data-id="childBtn"] {
  display: none;
  right: 40px;
}

#settingBOX_inner ul[data-id="model-6000:model"] li a[data-id="childBtn"] { right: 10px; }

#settingBOX_inner p {
  color: #9fa0a0;
  font-weight: bold;
  margin: 0;
  padding: 0 8px;
}
#settingBOX_inner li.item_selected p,
#settingBOX_inner li.item_required p { color: #000; }


#settingBOX_inner h2 + p {
  font-size: 1.6rem;
  font-weight: normal;
  line-height: 2.4rem;
  margin: calc( 0px + ( 16px - 24px ) /2 ) 0;
  padding: 26px 20px 32px;
}

#settingBOX_inner .withImage p {
  width: 100%;
  height: 2em;
  word-wrap: break-word;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
}

/*
#settingBOX_inner [data-id="model-140:options"] [data-css_id="order_1"] { order: 1; }
#settingBOX_inner [data-id="model-140:options"] [data-css_id="order_2"] { order: 2; }
#settingBOX_inner [data-id="model-140:options"] [data-css_id="order_3"] { order: 3; }
#settingBOX_inner [data-id="model-140:options"] [data-css_id="order_4"] { order: 4; }
*/

/* 6000シリーズのバグのひとまず対策用 */
#settingBOX_inner dl { display: none; }





/*
#settingBOX_inner .withImage p {
  font-weight: bold;
  text-align: center;
  padding-top: 38px;
}
*/

.back-nextBOX {
  height: 50px;
  visibility: hidden;
  position: relative;
  z-index: 9999;
  margin: 20px 0 48px;
}

#settingBOX_inner .back-nextBOX a {
  background: url("../img/index/icon_arrow.png") 20px 17px no-repeat #000;
  background-size: 9px;
  color: #fff;
  font-size: 1.28vw;
  font-weight: bold;
  text-align: left;
  display: inline-block;
  position: absolute;
  top: 0;
  white-space: nowrap;
  margin: 0;
  transition: background 300ms ease;
}
#settingBOX_inner .back-nextBOX a:hover { background-color: #2c2c2c; }

@media screen and (min-width:1400px) {
#settingBOX_inner .back-nextBOX a { font-size: 1.8rem; }
}


#settingBOX_inner .back-nextBOX .backBtn {
  background: url("../img/index/icon_arrow.png") center left 20px no-repeat #000;
  background-size: 9px;
  left: 0;
  padding: 16px 30px 16px 40px;
}

#settingBOX_inner .back-nextBOX .nextBtn {
  background: url("../img/index/icon_arrow.png") center right 20px no-repeat #000;
  background-size: 9px;
  right: 0;
  padding: 16px 40px 16px 30px;
}

#settingBOX_inner .back-nextBOX span {
  vertical-align: top;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  transition: width 300ms ease;
}

/* --- detailBOX --- */
#detailBOX,
#sub_detailBOX {
  width: 34.285vw; /* 480px */
  /*height: calc(100vh - 120px);*/
  background: #fff;
  position: absolute;
  z-index: 10;
  padding: 32px 50px 48px;
  padding: 32px 50px 0;
  padding: 0px 50px 0;
  /*overflow-y: scroll;*/
}
#sub_detailBOX { border-left: #dcdddd solid 1px; }

@media screen and (min-width:1400px) {
 #detailBOX,
 #sub_detailBOX { width: 480px; }
}

#detailBOX_inner,
#sub_detailBOX_inner {
  width: 100%;
  height: calc(100vh - 120px);
  overflow-y: scroll;
  padding-bottom: 48px;
  padding-bottom: 96px;
}

#detail_btnBOX,
#sub_detail_btnBOX {
  position: absolute;
  top: 0;
  left: 0;
}

#detail_btnBOX a,
#sub_detail_btnBOX a {
  width: 50px;
  height: 50px;
  display: block;
  margin-top: 10px;
}

#detailBOX h2,
#sub_detailBOX h2 {
  font-size: 1.8rem;
  margin: 32px 0 0 0;
  padding: 0;
}

#detailBOX p,
#sub_detailBOX p {
  border-bottom: #dcdddd solid 1px;
  line-height: 2rem;
  margin: calc( 16px + ( 14px - 20px ) / 2 ) 0  calc( 0px + ( 14px - 20px ) / 2 );
  padding: 0 0 85px 0;
}
#sub_detailBOX p img { margin-top: 32px; }
#detailBOX p span, #sub_detailBOX p span { color: #c30d23; }

/*
#detailBOX dl,
#sub_detailBOX dl {
  align-items: center;
  margin: 6px 0 0 0;
  padding: 0;
}

#detailBOX dl dt,
#sub_detailBOX dl dt {
  width: 26%;
  font-weight: bold;
  margin: 18px 0 0 0;
  padding: 0;
}

#detailBOX dl dd,
#sub_detailBOX dl dd {
  width: 74%;
  margin: 18px 0 0 0;
  padding: 0;
}

#detailBOX dl img,
#sub_detailBOX dl img {
  width: auto;
  height: 40px;
}
*/

.powerSupply_list {
  width: 100%;
  border-collapse: collapse;
  margin-top: 24px;
}

.powerSupply_list th,
.powerSupply_list td {
  border: #dcdddd solid 1px;
  font-size: 1.4rem;
  text-align: center;
}

.powerSupply_list th {
  height: 40px;
  background: #f2f2f2;
}

.powerSupply_list th:first-of-type { width: 75%; }
.powerSupply_list th:last-of-type { width: 25%; }

.powerSupply_list td {
  border: #dcdddd solid 1px;
  padding: 8px;
}

.powerSupply_list img {
  width: auto;
  height: 100px;
}

#detailBOX #add_btn,
#detailBOX #pats_btn,
#sub_detailBOX #sub_add_btn {
  width: 160px;
  background: #000;
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  display: block;
  margin-top: 24px;
  padding: 16px 0;
  transition: background 300ms ease;
  
  display: none;
}
#detailBOX #add_btn:hover,
#detailBOX #pats_btn:hover,
#sub_detailBOX #sub_add_btn:hover, { background: #2c2c2c; }

#detailBOX h3,
#sub_detailBOX h3 {
  border-top: #000 solid 1px;
  border-bottom: #000 solid 1px;
  font-size: 1.8rem;
  font-weight: bold;
  margin: 0;
  padding: 16px 20px;
}







#noticeBOX {
  margin-top: 12px;
  margin-bottom: -32px;
  display: none;
}


#noticeBOX h3::before,
#patsBOX h3::before{
  content: '';
  width: 20px;
  height: 20px;
  background: url("../img/index/icon_notice.png") no-repeat;
  background-size: 20px;
  vertical-align: top;
  display: inline-block;
  margin-top: -2px;
  margin-right: 8px;
}

#noticeBOX p {
  border: none;
}


#patsBOX {
  margin-top: 12px;
  display: none;
}

#patsBOX > p {
  border: none;
  margin-bottom: 16px;
  padding-bottom: 0;
}

#patsBOX > div {
  display: none;
}

#patsBOX > div > p {
  border: none;
  margin: calc( 32px + ( 14px - 20px ) / 2 ) 0 calc( 0px + ( 14px - 20px ) / 2 );
  padding-bottom: 0;
}
#patsBOX > div > p:first-of-type {
  margin-top: calc( 16px + ( 14px - 20px ) / 2 );
}

#patsBOX ul {
  list-style: none;
  justify-content: space-between;
  margin: 0;
  padding: 0;
}

#patsBOX li {
  width: 14.285vw;
  width: 47.846%;
  /* min-width: 154px; */
  min-width: 140px;
  border: #dcdddd solid 1px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  cursor: pointer;
  margin: 12px 0 0;
  padding: 13px 8px;
}

#patsBOX .withImage li {
  padding: 22px 0 38px 0;
  display: inline;
}

#patsBOX li.item_selected::after {
  content: "";
  width: 20px;
  height: 20px;
  background: url("../img/index//selected.png") no-repeat;
  background-size: 20px;
  position: absolute;
  top: 0;
  right: 0;
}

#patsBOX li.item_selected::before,
#patsBOX li.item_required::before {
  content: "";
  width: 100%;
  height: 100%;
  border: #c30d23 solid 5px;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
}
#patsBOX li.item_required { cursor: default; }

#patsBOX li.meshing { cursor: auto; }

#patsBOX li.meshing::after {
  content: "";
  width: 100%;
  height: 100%;
  background-image: linear-gradient(
    45deg,
    #003060 25%,
    #ffffff 25%,
    #ffffff 50%,
    #003060 50%,
    #003060 75%,
    #ffffff 75%,
    #ffffff
  );
  background-size: 30px 30px;
  /* background-attachment: fixed; */ 
  position: absolute;
  top: 0;
  right: 0;
  opacity: 0.3;
}

#patsBOX li div {
  width: calc(100% - 20px);
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 10px auto 0;
}

#patsBOX li div img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  flex-shrink: 0;
}

#patsBOX li a {
  width: 20px;
  height: 20px;
  display: block;
  position: absolute;
  bottom: 10px;
  right: 10px;
}
#patsBOX li a img {
  width: 20px;
  height: 20px;
  padding: 0;
}

#patsBOX > div li p {
  border: none;
  color: #9fa0a0;
  font-weight: bold;
  margin: 0;
  padding: 0 8px;
}

#detailBOX li.item_selected p,
#detailBOX li.item_required p { color: #000; }

#patsBOX .withImage p {
  width: 100%;
  height: 2em;
  word-wrap: break-word;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
}

#arts_input_6000 li p,
#arts_output_6000 li p {
  line-height: 1.4rem;
}

#arts_input_6000 li[data-fixed_id="pim-1_1"] [data-id="detailBtn"],
#arts_input_6000 li[data-fixed_id="pim-1_2"] [data-id="detailBtn"],
#arts_input_6000 li[data-fixed_id="pim-2_1"] [data-id="detailBtn"],
#arts_input_6000 li[data-fixed_id="pim-2_2"] [data-id="detailBtn"],
#arts_input_6000 li[data-fixed_id="pim-3_1"] [data-id="detailBtn"],
#arts_input_6000 li[data-fixed_id="pim-3_2"] [data-id="detailBtn"],
#arts_input_6000 li[data-fixed_id="pim-3_3"] [data-id="detailBtn"],
#arts_input_6000 li[data-fixed_id="pim-3_4"] [data-id="detailBtn"] { display: none; }

#arts_input_6000 li[data-fixed_id="pim-3_1"],
#arts_input_6000 li[data-fixed_id="pim-3_2"],
#arts_input_6000 li[data-fixed_id="pim-3_3"],
#arts_input_6000 li[data-fixed_id="pim-3_4"] { padding-bottom: 16px; }

#arts_input_6000 li[data-fixed_id="pim-3_1"] p,
#arts_input_6000 li[data-fixed_id="pim-3_2"] p,
#arts_input_6000 li[data-fixed_id="pim-3_3"] p,
#arts_input_6000 li[data-fixed_id="pim-3_4"] p { margin: 8px 0 -8px; }

#arts_output_6000 li[data-fixed_id="hcs-1_1"] [data-id="detailBtn"],
#arts_output_6000 li[data-fixed_id="hcs-1_2"] [data-id="detailBtn"],
#arts_output_6000 li[data-fixed_id="hcs-1_3"] [data-id="detailBtn"],
#arts_output_6000 li[data-fixed_id="hcs-2_1"] [data-id="detailBtn"],
#arts_output_6000 li[data-fixed_id="hcs-2_2"] [data-id="detailBtn"],
#arts_output_6000 li[data-fixed_id="hcs-2_3"] [data-id="detailBtn"] { display: none; }

#arts_output_6000 li[data-fixed_id="hcs-1_2"] p { margin: 8px 0 -8px; }
#arts_output_6000 li[data-fixed_id="hcs-1_3"] p { margin: 8px 0 -8px; }
#arts_output_6000 li[data-fixed_id="hcs-1_3"] { padding-bottom: 16px; }
#arts_output_6000 li[data-fixed_id="hcs-2_2"] p { margin: 8px 0 16px; }
#arts_output_6000 li[data-fixed_id="hcs-2_3"] p { margin: 8px 0 16px; }



























#detailContents,
#sub_detailContents {
  margin-top: 32px;
}

#detailContents div,
#sub_detailContents div {
  width: 100%;
  height: 200px;
  text-align: center;
}
#detailContents div img,
#sub_detailContents div img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

#resultBOX {
  height: 100vh;
  overflow: scroll;
  padding-bottom: 104px;
  transition: opacity 200ms ease;
}

#resultBOX .exportBtn {
  background: #dcdddd;
}

#resultBOX .exportBtn .flexBOX {
  width: 920px;
  height: 50px;
  justify-content: space-between;
  margin: 0 auto;
}

#resultBOX .exportBtn .flexBOX a {
  width: 300px;  
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  background: #000;
  text-align: center;
  display: block;
  padding: 16px;
  transition: background 300ms ease;
}
#resultBOX .exportBtn .flexBOX a:hover {
  background: #2c2c2c;
}


/*
#secondScreen header a[data-id="REVIEW"],
#cotrollerBOX .back-nextBOX .nextBtn {
  visibility: hidden;
}
*/
#secondScreen header a[data-id="REVIEW"] {
  visibility: hidden;
}


#blowingText {
  width: 300px;
  background: #dcdddd;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  padding: 10px;
}

#blowingText::after {
  content: "";
  border: 8px solid transparent;
  border-left: 16px solid #DCDDDD;
  position: absolute;
  top: 50%;
  right: -20px;
  z-index: 1;
  margin-top: -8px;
}

#blowingTextS {
  width: 200px;
  background: #dcdddd;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  padding: 10px;
}

#blowingTextS::after {
  content: "";
  border: 8px solid transparent;
  border-left: 16px solid #DCDDDD;
  position: absolute;
  top: 50%;
  right: -20px;
  z-index: 1;
  margin-top: -8px;
}

/**
 * 文書作成リクエスト
 *
 */
 #buildBox {
  position: absolute;
  width: 100%;
  z-index: 9999;
  display: none;
}

.buildBoxBody {
  position: relative;
  width: 100%;
  background-color: rgba(220, 220, 221, 1.0);
  padding: 15px 0;
}

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

.bulidComment {
  margin-top: 20px;
  text-align: center;
  width: 100%;
}

.building {
  font-weight: bold;
  font-size: 3.0rem;
  -webkit-animation: blink 1s infinite alternate;
  animation: blink 1s infinite alternate;
}

.buildingComment {
  font-weight: bold;
  font-size: 2.5rem;
}

.buildError {
  font-weight: bold;
  font-size: 3.0rem;
  color: #ff0000;
}

.buildErrorComment {
  font-weight: bold;
  font-size: 2.5rem;
  cursor: pointer;
  text-decoration:underline;
}

@-webkit-keyframes blink {
  0% {
      opacity: 0;
  }
  100% {
      opacity: 1;
  }
}

@keyframes blink {
  0% {
      opacity: 0;
  }
  100% {
      opacity: 1;
  }
}