/* CSS Document */

.con_nav2 { max-width:800px; margin-top:20px; margin-bottom:30px !important; }
.con_nav2 li { width:31%; }
.con_nav2 li span { font-size:15px; }
.btn_price { margin-bottom:50px; width:100%; text-align:center; }
.btn_price a { max-width:400px; color:#fff; padding:10px 20px; display:inline-block; line-height:1.4; }

.noReserve { opacity: 1 !important; }
.noReserve span { border:1px solid #cc6161 !important; background-color: #fcfcfc !important; color: #c5c5c5 !important; }

#deco .flow_list { padding:0; list-style-type:none; }

#deco .flow_list li { position:relative; }
#deco .flow_list li .flow { line-height:1.5; }
#deco .flow_list li::before {
  content:""; display:block; position:absolute;
  width:50px; height:50px; background:no-repeat 50% 50% / contain;
  }
#deco .flow_list li:nth-child(1)::before { background-image:url(../image/ico_flow1.png); }
#deco .flow_list li:nth-child(2)::before { background-image:url(../image/ico_flow2.png); }
#deco .flow_list li:nth-child(3)::before { background-image:url(../image/ico_flow3.png); }
#deco .flow_list li:nth-child(4)::before { background-image:url(../image/ico_flow4.png); }

#deco .flow_list li:not(:last-child) .flow::after {
  content: ""; position: absolute; top:0; right:0; z-index:1;
  }

#deco .flow_list li .note { margin-top:15px; padding:15px 18px; line-height:1.5; background:#fff; border:2px solid #fca75a; position:relative; }
#deco .flow_list li .note::before, #deco .flow_list li .note::after {
  content:""; width:0; height:0; position:absolute; left:50%;
  }
#deco .flow_list li .note::before {
  top:-28px; margin-left:-9px;
  border:14px solid transparent; border-bottom-color:#fca75a; }
#deco .flow_list li .note::after  {
  top:-20px; margin-left:-5px;
  border:10px solid transparent; border-bottom-color:#fff; }

#deco .box_be { margin:30px 0; }
/*
#deco .con_nav2 li { width:32%; margin-left:2%; }
#deco .con_nav2 li:not(:nth-child(3n+1)) { margin-left:0;}
*/
/*form*/
#deco .form { margin-top:30px; margin-bottom:50px; }
form #step { padding:0; list-style-type:none; }
form #step .disable { color:#ccc; }
form #step > li { padding:10px 15px 15px; line-height:1.5; position:relative; }
form #step > li + li { margin-top:60px; }
form #step > li:nth-child(n + 2)::before {
  content:""; display:block; width:38px; height:16px;
  position:absolute; top:-38px; left:50%; margin-left:-19px;
  background:url(../image/arrow_down.svg) no-repeat 50% 0 / contain;
  }
form #step h4 { margin-bottom:8px; color:#471509; font-size:1.3em; }
form #step .en { margin-right:.5em; font-size:1.4em; font-family: 'Dancing Script', cursive; }
form #step h5 { padding:10px; color:#471509; }
form #step .q { padding:10px; background:#fff; }
form #step dl.q { padding:0; }
form #step dl.q > * { padding:10px; }
form #step dl.q > *:nth-child(n + 3) { border-top:1px dotted #be6f5d; }
form #step dl.q select { margin:0; padding:3px; }
form #step dl.q dt { width:160px; background:#feedde; }
form #step dl.q dd { width:calc(100% - 160px); }
#deco #step .btn1 { display:block; text-align:center; margin-top:15px; }
#deco #step .btn1 a { display:inline-block; }

form #step .q.line label { margin-right:1em; }

form #step .candle_num dl.q dt { width:6%; text-align:center; }
form #step .candle_num dl.q dd { width:14%; }
form #step .candle_num dl.q > *:nth-child(-n + 10) { border-top:none; }

form #step .q .notice { margin-left:1em; font-size:.85em; }

form #step .note { padding:15px; background:rgba(255,255,255,.8); }
form #step .symbol { margin:5px 0; padding:8px; color:#fff; background:#c32f2f; }

#deco .cancel_msg { margin:40px 0; padding:10px; color:#c32f2f; font-weight:bold; text-align:center; background:#f9e7e7; border:1px solid #c32f2f; }
#deco .cancel_msg p + p { margin-top: 1em;}

.notes { margin:40px 0; padding:10px 15px; background:#f9e7e7; border:1px solid #c32f2f; }
.notes .notes_list li::before { color:#c32f2f; }

#deco .agree { margin:30px 0; text-align:center; }
#deco .agree label { font-size:1.5em; font-weight:bold; }

#deco .note_img img { max-width:25px; }

/*お知らせ*/
#deco .box_be h5 { font-size: 1.1em; color: #69362a; padding-bottom: 0.4em; margin-bottom: 0.8em; border-bottom: solid 1px #fff;}
#deco .box_be h5.mt { margin-top: 1.5em; }
#deco .box_be .date { margin: 0em 0 1em; background: #fff; padding: 1em; display: inline-block;}
#deco .box_be .date span { font-size: 1.1em; font-weight: bold;}
#deco .nenmatu ul { max-width: 500px; margin: 1em auto;}

/*ケーキ選択*/
form #step .cake .q li label { display:block; }
form #step .cake .q li { width:25%; padding:5px; }
form #step .cake .q li figure { padding-top:100%; text-align:center; position:relative; }
form #step .cake .q li figure img { position:absolute; top:0; left:0; }
form #step .cake .q li .name { margin-left:1em; text-indent:-1em; }
form #step .cake .q li .price { display:inline-block; margin-left:1.5em; }

form #step #sizeList { padding:0; }
form #step #sizeList li { padding:7px 10px; }
form #step #sizeList li:nth-child(n + 2) { border-top:1px dotted #be6f5d; }
#deco #step #sizeList li span:nth-child(1) { width:12em; }
#deco #step #sizeList li span:nth-child(2) { width:8.5em; }
#deco #step #sizeList li span:nth-child(3) { width:6em; text-align:right; }
#deco #step #sizeList li *:nth-child(4) { width:auto; margin-left:1em; }

/*絵付き*/
form #step.drawing .tmpfile { display:block; }
#deco .uploaded { margin:5px 0; color:#69362a; }

/*味合いこだわり*/
form #step.flavor .plate .q label { margin-right:1em; }

/*----------------------------------------------------
PC
-----------------------------------------------------*/
@media screen and (min-width: 961px) {
  #deco .flow_list li { padding-top:17px; }
  #deco .flow_list li::before { top:0; left:calc(50% - 9px); }
  #deco .flow_list li:first-child::before { left:calc(50% - 25px); }

  #deco .flow_list li:nth-child(1) { width:20%; }
  #deco .flow_list li:nth-child(2) { width:26%; }
  #deco .flow_list li:nth-child(3) { width:34%; }
  #deco .flow_list li:nth-child(4) { width:20%; }

  #deco .flow_list li .flow { padding:40px 0 20px; height:105px; text-align:center; background-color:#fca75a; background-image:url(../image/bg_plaid.svg); }
  #deco .flow_list li:not(:first-child) .flow { padding-left:25px; }
  #deco .flow_list li:last-child .flow { padding-top:48px; }
  #deco .flow_list li:not(:last-child) .flow::after {
    width:76px; height:76px;
    border-top:5px solid #fff;
    border-right:5px solid #fff;
    -webkit-transform: rotate(45deg) translate(48%);
    transform: rotate(45deg) translate(48%);
    }
}

/*----------------------------------------------------
タブレット
-----------------------------------------------------*/
@media screen and (max-width: 960px) {
  #deco .con_nav2 li { width:49%; margin-left:0; }
  #deco .con_nav2 li:nth-child(2n+2) { margin-left:2%; }
  #deco .con_nav2 li:nth-child(n+3) { margin-top:10px; }

  #deco .flow_list li { width:100%; padding:0; background-color:#fca75a; background-image:url(../image/bg_plaid.svg); }
  #deco .flow_list li::before { top:6px; left:10px; }
  #deco .flow_list li:nth-child(3)::before { top:50%; margin-top:-25px; }
  #deco .flow_list li + li { margin-top:15px; }

  #deco .flow_list li:not(:last-child)::after {
    position:absolute; bottom:-20px; left:10%;
    content:""; width:0; height:0;
    border:10px solid transparent; border-top-color:#fca75a;
    }

  #deco .flow_list li .flow { height:auto; padding:20px 0 20px 70px; }
  #deco .flow_list li .note { margin:0 10px 10px; }

  form #step .q, form #step .note { margin-left:-5px; margin-right:-5px; }
}

/*----------------------------------------------------
スマホ
-----------------------------------------------------*/
@media screen and (max-width: 599px) {

  .con_nav li { width:48%; }

  /*form*/
  form #step { font-size:14px; }
  form #step h4 { font-size:1.1em; }
  form #step .note { padding:10px; }

  form #step dl.q > *:nth-child(n + 3) { border-top:none; }
  form #step dl.q dt { width:100%; }
  form #step dl.q dd { width:100%; }

  form #step .candle_num dl.q dt { width:15%; }
  form #step .candle_num dl.q dd { width:35%; }
  form #step .candle_num dl.q > *:nth-child(n + 5) { border-top:1px dotted #be6f5d; }

  form #step .q input.m { width:100%; }
  form #step .q .notice { display:block; margin-left:0; }

  #deco .cancel_msg { margin:30px 0; }
  #deco .cancel_msg p { text-align: left;}
  #deco .agree .txt { text-align:left; }

  #deco .con_nav2 li { width:48%; margin-left:0; }
  #deco .con_nav2 li:not(:nth-child(3n+1)) { margin-left:0; }
  #deco .con_nav2 li::nth-child(2n+2) { margin-left:4%; }

  #deco .note_img { padding-top:7px; display:inline-block; }

  /*ケーキ選択*/
  form #step .cake .q li { width:50%; }
  #deco #step #sizeList li span { width:auto !important; }
  #deco #step #sizeList li span.price { margin-left:1em; }

  /*味合いこだわり*/
  form #step.flavor .plate .q label { width:100%; margin-right:0; }
}
@media screen and (max-width: 400px) {
  .con_nav li { width:100%; }
  .con_nav li:nth-child(n+2) { margin-top:10px; }
  #deco .con_nav2 li { width:100%; margin-left:0 !important; }
}