@charset "UTF-8";

/*============================================

order.css

============================================*/

/* 選択中のプラン */
.status_ttl {
  font-size: 1.6rem;
  margin-bottom: 0.8rem;
}
.status_box {
  background-color: #f8f8f8;
  border-radius: 6px;
  border-style: solid;
  border-width: 1px 1px 1px 5px;
  padding: 3px;
}
.logo_status_box { border-color: #ddd #ddd #ddd #f5be00; }
.brush_status_box { border-color: #ddd #ddd #ddd #449cce; }
.chara_status_box { border-color: #ddd #ddd #ddd #00c686; }
.trade_status_box { border-color: #ddd #ddd #ddd #3cb4c8; }

.status_box .inner {
  background-color: #fff;
  box-sizing: border-box;
  display: table;
  padding: 1.6rem 2% 1.6rem 0;
  width: 100%;
}
.status_img {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  width: 20%;
}
.status_info {
  display: table-cell;
  vertical-align: middle;
  width: 80%;
}
.status_box_ttl .name {
  display: inline-block;
  font-size: 2rem;
  margin-right: 10px;
  vertical-align: middle;
}
.status_box_ttl .remark {
  border-radius: 3px;
  color: #fff;
  display: inline-block;
  font-size: 1.2rem;
  font-weight: bold;
  padding: 0.2rem 1rem;
  background: #666;
}
.status_box_ttl .logo_remark  {
  background: #f94747;
}
.status_box_ttl {
  border-bottom: 1px solid #ddd;
  margin-bottom: 1rem;
  padding-bottom: 1rem;
}
.status_detail dl {
  display: inline-block;
  font-size: 1.4rem;
}
.status_detail dt {
  display: inline-block;
  font-weight: bold;
  margin-right: 1rem;
  padding-left: 1.8rem;
  position: relative;
}
.status_detail dd {
  display: inline-block;
  margin-right: 2rem;
}
.status_detail dt::before {
  background-color: #fff;
  border: 3px solid #000;
  border-radius: 6px;
  content: "";
  height: 6px;
  left: 0;
  position: absolute;
  top: 0.4rem;
  width: 6px;
}

.logo_status_box .status_detail dt::before { border: 3px solid #f5be00; }
.brush_status_box .status_detail dt::before { border: 3px solid #449cce; }
.chara_status_box .status_detail dt::before { border: 3px solid #00c686; }
.trade_status_box .status_detail dt::before { border: 3px solid #3cb4c8; }

.status_block {
  margin-bottom: 3rem;
}
.status_detail dd span {
  color: #999;
  padding-left: 1rem;
}



.campaign_bnr {
  margin: 0 0 20px;
}
.order #header header {
  padding: 22px 0
}
/* ご注意ください */
.please_note_ttl {
  padding: 8px 0;
  font-size: 1.6rem;
  color: #fff;
  text-align: center;
  border-radius: 3px 3px 0px 0px;
  background: #f99e00;
}
.p_note_main {
  padding: 20px 30px;
  border-radius: 0px 0px 3px 3px;
  border-right: 2px solid #ded8b3;
  border-bottom: 2px solid #ded8b3;
  border-left: 2px solid #ded8b3;
}
.p_note_col {
  display: table;
}
.pn_free {
  float: left;
  width: 440px;
}
.pn_limit {
  float: right;
  width: 440px;
}
.pn_col_ttl {
  border-radius: 3px;
  color: #fff;
  display: table-cell;
  font-size: 1.5rem;
  height: 108px;
  text-align: center;
  vertical-align: middle;
  width: 93px;
}
.pn_free .pn_col_ttl {
  background: #3bb2c6;
}
.pn_limit .pn_col_ttl {
  background: #fa3637
}
.pn_col_txt {
  float: right;
  width: 330px;
  font-size: 1.2rem;
}
/* 赤 */
.pn_col_txt .pn_b {
  color: #fa3637;
  font-weight: bold;
}
/* 黒 */
.pn_col_txt .pn_s {
  font-weight: bold;
}

/* フォーム共通
------------------------------------------- */
.form_description {
  margin: 0 0 10px;
}
.form_description .atc {
  color: #fa3637;
}
.order #main,
.order_sample #main {
  float: none;
  width: 980px;
}
.form_lead_txt {
  margin: 0 0 30px;
}
.order_table th {
  width: 300px;
}
.order_table td {
  padding: 15px 30px;
}
.heading_label {
  float: left;
  margin: 0 12px 0 0;
  border-radius: 3px;
  color: #fff;
  display: inline-block;
  font-size: 1.2rem;
  padding: 0 5px;
}
.any {
  background: #999
}
.req {
  background: #fa3637;
}
.hide {
  display: none;
}
.tips_help {
  float: right;
}
.tips_detail {
  display: inline-block;
  cursor: pointer;
  margin-top: 12px;
  padding: 2px 10px;
  border-radius: 3px;
  border: 1px solid #ccc;
  background-color: #fff;
}
.option_remodal {
  text-align: left;
}
.option_remodal .clip {
  margin-bottom: 15px;
}
.option_remodal .std_ttl {
  margin-bottom: 10px;
}
.tips_detail .web_c_arw {
  background: url(../../../_common/pc/img/web_c_arw.png) no-repeat scroll 100% 50%;
  padding: 0 16px 0 0;
}

.order_table .size_xs { width: 88px; }
.order_table .size_s { width: 200px; }
.order_table .size_m { width: 300px; }
.order_table .size_l { width: 560px; }

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder { color: #999; }
input:-moz-placeholder,
textarea:-moz-placeholder { color: #999; opacity: 1; }
input::-moz-placeholder,
textarea::-moz-placeholder { color: #999; opacity: 1; }
input:-ms-input-placeholder,
textarea:-ms-input-placeholder { color: #999; }

input:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder,
textarea:focus:-moz-placeholder { color:transparent; }
input:focus::-moz-placeholder,
textarea:focus::-moz-placeholder { color:transparent; }
input:focus:-ms-input-placeholder,
textarea:focus:-ms-input-placeholder { color: #999; }

.order_table input[type="number"]::-webkit-outer-spin-button, 
.order_table input[type="number"]::-webkit-inner-spin-button,
.order_table input[type="number"] {
  -webkit-appearance: none;
  margin: 0;
  -moz-appearance:textfield;
}


.member_select li {
  display: inline-block;
  margin: 0 20px;
  vertical-align: top;
}
.tel_select button {
  background: #f84747;
}
.web_select button {
  background: #5fba3b;
}
.member_select button {
  color: #fff;
  font-size: 2.2rem;
  padding: 1rem 7rem;
}
.member_select button .select_term {
  display: block;
  font-size: 1.2rem;
}
.member_select .tel_detail {
  display: block;
  padding-top: .5rem;
  font-size: 1.2rem;
}
.member_select .tel_detail a {
  text-decoration: underline;
}
.operate {
  margin: 0 0 4rem;
  text-align: center;
}
.ope_before {
  margin: 0 0 2rem;
}
.ope_after {
  margin: 15px 0 0;
}
.agree_check {
  line-height: 1.5;
  text-align: center;
}
.agree_check .heading_label {
  font-weight: bold;
  float: none;
}
.agree_check input[name="agree"] {
  appearance: auto;
  width: 1em;
  height: 1em;
  position: relative;
  top: -0.15em;
}
.agree_check .text__line {
  text-decoration: underline;
}
input[type="submit"] {
  color: #fff;
  font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
  border: none;
  border-radius: 3px;
  cursor: pointer;
}
.tel_select .form_next_btn input {
  padding: 10px 60px;
  font-size: 1.8rem;
  background: #f84747;
}
.web_select .form_next_btn input {
  padding: 10px 60px;
  font-size: 1.8rem;
  background: #5fba3b;
}
.form_edit_btn input {
  padding: 10px 15px;
  font-size: 1.8rem;
  background: #bcbcbc;
}
.form_edit_btn button {
  padding: 10px 15px;
  font-size: 1.8rem;
  background: #bcbcbc;
}

/* button */
button {
  color: #fff;
  border: none;
  border-radius: 3px;
  cursor: pointer;
}
.tel_select .form_next_btn button {
  padding: 10px 60px;
  font-size: 1.8rem;
  background: #f84747;
}
.web_select .form_next_btn button {
  padding: 10px 60px;
  font-size: 1.8rem;
  background: #5fba3b;
}
.button_term {
  display: block;
  font-size: 1.4rem;
}
.rows_btn li {
  display: inline-block;
  margin: 0 10px;
  vertical-align: top;
}
.rows_btn .form_next_btn input {
  padding: 10px 80px;
}
.read_term {
  margin: 0 0 40px;
}
.read_term_ttl {
  margin: 0 0 6px;
  font-size: 1.4rem;
  font-weight: bold;
}
.read_pp {
}
.read_term_box {
  padding: 15px;
  margin: 0 0 10px;
  height: 100px;
  overflow-y: scroll;
  border: 1px solid #ddd;
  font-size: 1.2rem;
  background: #fafafa;
}
.pp_ttl {
  font-weight: bold;
  margin-bottom: 8px;
}
.pp_lead {
  margin-bottom: 20px;
}
.pp p {
  margin-bottom: 20px;
}
.pp ul {
  margin-bottom: 20px;
  padding-left: 15px;
}
.pp ul li {
  list-style-type: disc;
  margin-bottom: 5px;
}
.sub_heading {
  margin: 10px 0 0;
}
.sub_heading  span {
  font-weight: normal;
}
.sub_heading .atc {
  color: #d94266;
}
 #support_btn {
  cursor: pointer;
  bottom: 0;
  position: fixed;
  right: 2%;
  z-index: 99999999;
}
#support_box {
  cursor: pointer;
  bottom: -144px;
  position: fixed;
  left: 50%;
  margin-left: -490px;
  z-index: 99999999;
}
.remodal-wrapper{
  text-align: center;
}
.switch-order{
  margin:0 auto;
}

.likeon_modal_btn,
.likeoff_modal_btn {
  margin-top: 2rem;
}
.likeon_modal_closebtn,
.likeoff_modal_closebtn,
.likeon_modal_addbtn,
.likeoff_modal_delbtn,
.select_on_modal_addbtn,
.select_off_modal_delbtn {
  background: #333;
  color: #fff;
  cursor: pointer;
  float: left;
  font-size: 1.6rem;
  padding: 8px 0;
  text-align: center;
  width: 65%;
}
.likeon_modal_closebtn,
.likeoff_modal_closebtn {
  background-color: #999;
  margin-right: 3%;
  width: 32%;
}
.likeon_modal_closebtn .icon_close_w,
.likeoff_modal_closebtn .icon_close_w {
  background-image: url(../../../_common/sp/img/icon_close_w.png);
  background-repeat: no-repeat;
  background-position: 0 50%;
  background-size: 1em 1em;
  padding-left: 1.2em;
}

.likeoff_modal_delbtn {
  background-color: #f93637
}

.order-switch-btn{
  position:fixed;
  bottom:0;
  right:3rem;
  width:150px;
  height:100px;

}
.order-switch-btn a{
  border-radius:5px 5px 0 0;
  display:flex;
  align-items: center;
  width:150px;
  height:100px;
  background:#ecd200;
  border:2px solid #e0cc26;
  font-size:16px;
  text-align: center;
  box-sizing: border-box;
  padding:20px 20px 10px;
}
.order-switch-btn a i{
  display:block;
  font-size:120%;
}
.order-switch-btn a:hover{
  opacity: .8;
}


/* 仮登録
------------------------------------------- */
.refister_cover {
  margin: 0 0 30px;
}

/* ロゴデザインヒアリング
------------------------------------------- */
#basic_info {
  margin: 0 0 30px;
}
.hearing_info {
  margin: 0 0 80px;
}
.hearing_info.hearing_info_first,
.hearing_info.hearing_info_first .order_table {
  margin: 0;
}
.hearing_info.hearing_info_second .order_table{
  border-top: none;
}
.hearing_logo_ttl {
  padding: 2px 0 2px 36px;
  font-size: 1.8rem;
  font-weight: bold;
  background: url(../../../_common/pc/img/i_hand.png) no-repeat 0 50%;
}
.regist_done_txt {
  padding: 10px 17px;
  margin: 0 0 30px;
  font-weight: bold;
  border: 2px solid #ff6f64;
}
.regist_done_txt p {
  padding: 0 0 0 28px;
  background: url(../../../_common/pc/img/i_regist_done.png) no-repeat 0 50%;
}
.hearing_logo_ttl {
  margin: 0 0 35px;
}
#main_plan {
  padding: 0 29px;
  margin: 0 0 40px;
}
#main_plan .sbox {
  float: left;
  width: 205px;
}
#main_plan .sbox:not(:last-child) {
  margin: 0 34px 0 0;
}
.sbox .inner {
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-radius: 0px 0px 6px 6px;
}
.sbox .line_in {
  border-right: 3px solid #f8f8f8;
  border-bottom: 3px solid #f8f8f8;
  border-left: 3px solid #f8f8f8;
  border-radius: 0px 0px 6px 6px;
}
.sbox_ttl_block {
  display: table;
  height: 55px;
  width: 100%;
}
.sbox_ttl {
  border-radius: 6px 6px 0 0;
  color: #fff;
  display: table-cell;
  font-size: 1.7rem;
  line-height: 1.2;
  padding: 8px 0;
  text-align: center;
  vertical-align: middle;
}
.sbox_ttl span {
  display: block;
  font-size: 1.4rem;
}
/* campaign */
.sbox_ttl .cam_sbox_ttl {
  background: #f84747;
  display: inline-block;
  font-size: 1.2rem;
  padding: 3px 8px;
}
.sbox dd .normal_p {
  color: #333;
  font-size: 1.2rem;
  text-decoration: line-through;
}
.sbox dd .campaign_p {
  color: #f84747;
  font-size: 1.3rem;
  font-weight: bold;
}
#sbox_design .sbox_ttl {
  background: #f5be00;
}
#sbox_fude .sbox_ttl {
  background: #449cce;
}
#sbox_chara .sbox_ttl {
  background: #00c686;
}
#sbox_trademark .sbox_ttl {
  background: #3cb4c8;
}

.sbox .thumb {
  padding: 10px 0;
  text-align: center;
}
.sbox .price {
  background: #f8f8f8;
}
.sbox dl {
  clear: both;
  color: #262626;
  height: 1%;
  overflow: hidden;
  padding: 10px;
}
.sbox dt {
  clear: left;
  float: left;
  font-weight: bold;
  padding-left: 20px;
  width: 70px;
}
.sbox dd {
  float: left;
  line-height: 1.2;
  width: 80px;
}
.sbox .tm {
  text-align: center;
  width: 100%;
}
.sbox dd span {
  color: #999;
  font-size: 77%;
}
#main_plan #sbox_design dt.pro {
  background: url(../../../_common/pc/img/circle_logo.png) no-repeat scroll 0 50%;
}
#main_plan #sbox_fude dt.pro {
  background: url(../../../_common/pc/img/circle_brush.png) no-repeat scroll 0 50%;
}
#main_plan #sbox_chara dt.pro {
  background: url(../../../_common/pc/img/circle_chara.png) no-repeat scroll 0 50%;
}
#main_plan #sbox_trademark dt.pro {
  background: url(../../../_common/pc/img/circle_trade.png) no-repeat scroll 0 50%;
}
#main_plan .sbox .reg {
  text-align: center;
  font-weight: bold;
  padding: 8px 0;
  background: #f8f8f8;
}
#main_plan .sbox {
  -webkit-transform: scale(1);
     -moz-transform: scale(1);
       -o-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}
#main_plan .presse,
#main_plan .sbox:hover {
  -webkit-transform: scale(1.1);
     -moz-transform: scale(1.1);
       -o-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
  -webkit-transition: all 0.2s linear;
     -moz-transition: all 0.2s linear;
       -o-transition: all 0.2s linear;
      -ms-transition: all 0.2s linear;
           transition: all 0.2s linear;
}
.sbox_btn {
  padding: 10px 14px;
  text-align: center;
}
#main_plan .sbox label {
  display: block;
  cursor: pointer;
  padding: 8px 0;
  color: #fff;
  font-size: 1.4rem;
  border-radius: 3px;
}
#main_plan .sbox input {
  display: none;
}
.sbox .plan_btn {
  background: #999;
}
#main_plan .sbox input[type=radio]:checked + .plan_btn {
  background: #f84747;
}


.radio_btn input {
  display: none;
}
.radio_btn label{
  display: block;
  float: left;
  cursor: pointer;
  margin: 0 10px 0 0;
  padding: 10px 32px;
  border: 1px solid #d3d1d1;
  background: #fafafa;
  text-align: center;
  line-height: 1;
  border-radius: 3px;
}
.radio_btn input[type="radio"]:checked + .switch {
  border: 1px solid #4ea6cb;
  background-color: #4ea6cb;
  color: #fff;
}
.radio_btn input[type="radio"]:checked + .switch span {
  position: relative;
}
.radio_btn input[type="radio"]:checked + .switch span::after {
  position: absolute;
  content: "";
  top: 2px;
  left: -22px;
  width: 15px;
  height: 15px;
  background-image: url(../../../_common/pc/img/radio_checked.png);
  background-repeat: no-repeat;
  background-size: 15px 15px;
}
#records_toggle {
  margin: 0 0 17px;
  text-align: right;
}
#records_toggle p {
  float: right;
  width: 306px;
  height: 36px;
  cursor: pointer;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  background: url(../img/order/records_toggle_btn.png) no-repeat 0 0;
}
#records_toggle .active {
  width: 190px;
  background: url(../img/order/records_toggle_btn.png) no-repeat -116px -36px;
}
.rec_acc_open .hearing_info.hearing_info_first td.rec_just_before {
  background: url(../img/order/reco_arrow.png) no-repeat 83% 101%;
}

/* チェックボックス */
.check_select li {
  float: left;
  margin-bottom: 10px;
  width: 140px;
}
.check_select.small li {
  width: 60px;
}
.check_select li:not(:nth-child(4n)) {
  margin-right: 10px;
}
.check_select.small li:nth-child(4n) {
  margin-right: 10px;
}
.check_select input {
  display: none;
}
.check_label {
  box-sizing: border-box;
  position: relative;
  display: inline-block;
  border-radius: 3px;
  padding: 6px 0;
  width: 100%;
  height: 35px;
  border: 1px solid #ddd;
  background-color: #f6f7f8;
  background-repeat: no-repeat;
  background-position: 15px 50%;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
}
.check_label:before {
  box-sizing: border-box;
  position: absolute;
  top: -2px;
  left: -2px;
  display: block;
  padding: 6px 15px;
  border-radius: 3px;
  border: 2px solid #f5be00;
  content: '';
  opacity: 0;
  width: calc(100% + 4px);
  height: 36px;
}
.check_select input[type=checkbox]:checked + .check_label:before {
  opacity: 1;
}

.check_label .palette {
  margin-right: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
}
label[for$="color10"] .palette {
  border: 1px solid #ddd;
}

/* ulなしver */
.check_selects {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 8px 4%;
}
.check_selects input {
  display: none;
}
.check_selects input:checked + label::before {
  opacity: 1;
}
.check_selects label {
  background-color: #f6f7f8;
  border: 1px solid #ddd;
  border-radius: 3px;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 6px 15px;
  text-align: center;
  width: 48%;
  position: relative;
  z-index: 0;
}
.check_selects label::before {
  content: "";
  display: block;
  position: absolute;
  border: 2px solid #f5be00;
  border-radius: 3px;
  top: -1px;
  left: -1px;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  box-sizing: border-box;
  z-index: 0;
  pointer-events: none;
  opacity: 0;
}
@media screen and (min-width: 990px) {
  .check_selects {
    gap: 8px 3.5%;
  }
  .check_selects label {
    width: 31%;
  }
}

.agree_check .check_label {
  position: static; display: inline; border-radius: 0; padding: 0; width: auto; height: auto; border: 0; background-color: transparent;
}
.agree_check .check_label::before { display: none; }

/* ロゴに使用したい色  */
.color_select .check_label {
  padding: 6px 10px 6px 32px;
  text-align: left;
  display: flex;
  align-items: center;
}
.color_blue { background-image: url(../img/order/color_blue.png);}
.color_green { background-image: url(../img/order/color_green.png);}
.color_yellow { background-image: url(../img/order/color_yellow.png);}
.color_orange { background-image: url(../img/order/color_orange.png);}
.color_red { background-image: url(../img/order/color_red.png);}
.color_pink { background-image: url(../img/order/color_pink.png);}
.color_purple { background-image: url(../img/order/color_purple.png);}
.color_brown { background-image: url(../img/order/color_brown.png);}
.color_black { background-image: url(../img/order/color_black.png);}
.color_gray { background-image: url(../img/order/color_gray.png);}
.color_white { background-image: url(../img/order/color_white.png);}
.color_gold { background-image: url(../img/order/color_gold.png);}
.color_silver { background-image: url(../img/order/color_silver.png);}
.color_select .color_etc { padding: 6px 10px 6px 15px;}

/* 他に検討している制作物 */
.card_label {
  font-size: 1.1rem;
}
/* LOGO市を選んだ理由 */
.reason_select li {
  width: 290px;
}
.reason_select .check_label {
  width: 288px;
}
.reason_select li:not(:nth-child(4n)) {
  margin-right: 0;
}
.reason_select li:not(:nth-child(2n)) {
  margin-right: 10px;
}
.reason_select .check_label:before {
  width: 290px;
}

.upload_logo_image li {
  float: left;
  width: 190px;
}
.upload_logo_image li:not(:last-child) {
  margin: 0 10px 0 0;
}
.upload_thumb {
  margin: 0 0 10px;
  width: 190;
  height: 100px;
}
.upload_thumb_inner {
  display: table-cell;
  vertical-align: middle;
  width: 190px;
  height: 100px;
  border: 1px solid #ddd;
}
.upload_thumb_inner.upload_none {
  background: #f9f9f9;
  border: none;
}
.upload_thumb_inner img {
  display: block;
  margin: 0 auto;
  max-width: 190px;
  max-height: 100px;
  width: auto;
}
.upload_delete {
  text-align: center;
}
.upload_delete span {
  display: inline-block;
  padding: 0 0 0 20px;
  font-weight: bold;
  cursor: pointer;
  background: url(../img/order/i_trush.png) no-repeat 0 50%;
}
.upload_btn {
  background-color: #83b0b6;
  border-radius: 3px;
  color: #fff;
  display: block;
  margin: 0 0 10px;
  overflow: hidden;
  padding: 8px 0;
  position: relative;
  text-align: center;
  width: 100%;
}

.upload_btn input[type="file"] {
  opacity: 0;
  filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  position: absolute;
  right: 0;
  top: 0;
  margin: 0;
  font-size: 100px;
  cursor: pointer;
}


/* アコーディオン開 */
.rec_acc_open .hearing_info.hearing_info_first .rec_just_before {
  border-bottom: none;
}
.rec_acc_open .hearing_info.hearing_info_second .order_table {
  border-top: none;
}
.rec_acc_open .hearing_info.hearing_info_second .rec_just_after {
  padding: 30px 15px 20px;
}
.order_rec_block {
  background: #434343;
}
.order_rec_block .wrap {
  position: relative;
  padding: 20px;
  width: 940px;
}
.order_rec_main {
  float: left;
  width: 750px;
  background: #fff;
}
.order_rec_sub {
  float: right;
  width: 175px;
  background: #fff;
}
.order_rec_inner {
  padding: 20px;
}

.order_rec_sub .order_rec_inner {
  padding: 20px 25px;
}
.order_rec_filter_ttl {
  padding: 0 0 0 30px;
  margin: 0 0 10px;
  font-size: 1.6rem;
  background: url(../../../_common/pc/img/icon_search.png) no-repeat 0 50%;
}
.order_rec_search {
  display: table;
  margin: 0 0 15px;
}
.or_search_item {
  display: table-cell;
  font-size: 1.2rem;
}
.or_search_item select {
  margin: 0 10px 0 0;
}
.or_logo_motif { width: 180px;}
.or_logo_aspect { width: 145px;}
.or_logo_color { width: 125px;}
.or_logo_industry { width: 120px;}
.or_search_item .sort_btn {
  padding: 6px 33px;
  font-size: 1.4rem;
}
.records_list_count {
  float: left;
  width: 185px;
}
.order_rec_page .records_list_count {
  padding: 0.5rem 0 0;
  font-size: 1.3rem;
}
.order_rec_pager {
  float: left;
}
#btw_records .records_list_num {
  padding-right: 0.2em;
}
.order_rec_pager .pager_num_item {
  font-size: 1.2rem;
}
.order_rec_pager .pager_area {
  margin: 0;
}
.order_rec_pager .pager_prev {
  margin-left: 5px;
}
.order_rec_pager .pager_next {
  margin-left: 5px;
}
.order_rec_pager .pager_last {
  margin-left: 5px;
}
.order_rec_pager .pager_top,
.order_rec_pager .pager_prev,
.order_rec_pager .pager_next,
.order_rec_pager .pager_last,
.order_rec_pager .pager_num_item {
  width: 33px;
  height: 30px;
  padding: 6px 0;
}
.order_rec_page {
  margin: 0 0 20px;
}
.order_rec_pager .pager_num {
  margin-left: 5px;
}
.order_rec_like_col {
  float: right;
}
.order_rec_like a {
  display: block;
  padding: 5px 8px;
  border: 1px solid #ddd;
  cursor: pointer;
  background: #f8f8f8;
}
.order_rec_like.rec_like_on .icon_like {
  padding: 0 0 0 16px;
  background: url(../../../_common/pc/img/icon_like.png) no-repeat 0 50%;
}
.order_rec_like.rec_like_on a {
  color: #fff;
  border: 1px solid #fe81a1;
  background: #fe81a1;
}
.order_rec_like.rec_back_all a {
  color: #fff;
  border: 1px solid #424242;
  background: #424242;
}
.order_rec_like.rec_back_all .icon_back_all {
  padding: 0 0 0 25px;
  background: url(../../../_common/pc/img/icon_back_all.png) no-repeat 0 50%;
}
/* 点滅 */
.blinking {
  -webkit-animation: blink 1s ease-in-out infinite alternate;
     -moz-animation: blink 1s ease-in-out infinite alternate;
          animation: blink 1s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
  0% {opacity:.7;}
  100% {opacity:1;}
}
@-moz-keyframes blink{
  0% {opacity:.7;}
  100% {opacity:1;}
}
@keyframes blink{
  0% {opacity:.7;}
  100% {opacity:1;}
}

.order_rec_main .records_list_area {
  margin: 0 0 10px;
  border-top: 1px solid #e2e2e2;
}
.order_rec_main .records_list_item {
  border-right: #e2e2e2 1px solid;
  border-bottom: #e2e2e2 1px solid;
  box-sizing: border-box;
  float: left;
  overflow: hidden;
  width: 25%;
}
.order_rec_main .records_list_item:nth-of-type(1),
.order_rec_main .records_list_item:nth-of-type(4n+1) {
  border-left: #e2e2e2 1px solid;
}
.order_rec_main .records_col3 {
  width: 177px;
  height: 117px;
}
.order_rec_main .records_col4:nth-of-type(1),
.order_rec_main .records_col4:nth-of-type(4n+1) {
  width: 25%;
}
.order_rec_main .records_list_thumb_logo {
  width: 161px;
  height: auto;
}
#btw_records .records_list_item .height_fix {
  min-height: 100px;
}
.order_rec_main .records_list_anchor {
  border: #fff 2px solid;
  box-sizing: border-box;
  display: block;
  padding: 6px;
  position: relative;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.order_rec_main .records_list_anchor:hover {
  border: #f5be00 2px solid;
}
.order_rec_main .records_list_anchor.selected {
  border: #f5be00 2px solid;
}
.order_rec_main .records_list_anchor.liked:before {
  content: "";
  height: 36px;
  left: -2px;
  position: absolute;
  top: -2px;
  width: 36px;
  background: url(../../../_common/pc/img/liked.png) no-repeat 0 0 / 36px 36px;
}
.remaining {
  padding: 15px 0;
  margin: 0 0 14px;
  color: #fff;
  font-size: 1.4rem;
  text-align: center;
  background:  #6f969d;
}
.remaining span {
  font-size: 2.2rem;
}
.select_logo_view {
  margin: 0 0 20px;
}
.select_logo_view li {
  float: left;
  width: 110px;
}
.select_logo_view li:not(:last-child) {
  margin: 0 10px 0 0;
}
.select_logo_item {
  display: block;
  cursor: pointer;
}
.item_thumb {
  width: 100%;
}
.select_logo_view .selected_logo {
  border: 1px solid #ddd;
}
.select_logo_view .default_logo {
  border: 1px dashed #999;
}
.sub_select_logo .select_logo_view li {
  position: relative;
  float: left;
  width: 122px;
}
.sub_select_logo .select_logo_view li:not(:last-child) {
  margin: 0 0 16px;
}
.select_logo_cross {
  position: absolute;
  top: 0;
  right: 5px;
  cursor: pointer;
}
.color_cfm li {
  float: left;
  width: 95px;
  padding: 0 0 0 20px;
  margin: 0 0 10px;
  background-repeat: no-repeat;
  background-position: 0 50%;
}
.multi_answer li {
  margin: 0 0 8px;
}
.read_term_use {
  text-align: center;
}
.rules_contents {
  margin-bottom: 17px;
}
.rules_contents p {
  margin-bottom: 7px;
}
.rules_contents p.rules_h {
  font-weight: bold;
}
.term_pdf a {
  padding: 0 0 0 18px;
  text-decoration: underline;
  background: url(../../../_common/pc/img/i_pdf.png) no-repeat 0 50%;
}
.select_logo_number {
  margin: 0 0 5px;
}
.select_logo_number li {
  float: left;
  width: 110px;
  color: #999;
  font-size: 1.6rem;
  text-align: center;
}
.select_logo_number li:not(:last-child) {
  margin: 0 10px 0 0;
}

/* pager */
.transit_prev {
  float: left;
}
.transit_next {
  float: right;
  text-align: right;
}
.transit_btn a {
  padding: 8px 40px;
}
.transit_btn a span {
  display: inline-block;
  line-height: 16px;
}
.transit_next .next_icon {
  padding: 0 24px 0 0;
  background: url(../../../_common/pc/img/pager_next_arw.png) no-repeat 100% 50% / auto 16px;
}
.transit_prev .prev_icon {
  padding: 0 0 0 24px;
  background: url(../../../_common/pc/img/pager_prev_arw.png) no-repeat 0 50% / auto 16px;
}

/* チュートリアル */
#logo_navigator {
  position: absolute;
}
.overlay {
  background-color: rgba(0, 0, 0, 0.7);
  left: 0;
  min-height: 100%;
  min-width: 100%;
  top: 0;
  z-index: 9999;
}
#logo_navi_main {
  position: relative;
}
.logo_navi_main .balloon {
  position: absolute;
}

.logo_nav_filter {
  top: 58px;
  left: 430px;
}
.logo_nav_paging{
  left: 190px;
  top: 150px;
}
.logo_nav_selected {
  right: 140px;
  top: 160px;
}
.logo_navi_main .box {
  position: relative;
  display: inline-block;
  padding: 10px 30px;
  width: auto;
  min-width: 115px;
  color: #fff;
  text-align: center;
  background: #6f969d;
  z-index: 0;
}
.logo_navi_main .box:after {
  content: "";
  position: absolute;
  display: block;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 10px 0 10px 10px;
  border-color: transparent transparent transparent #6f969d;
}
.logo_navi_main .arw_right:after {
  top: 50%;
  right: -10px;
  margin-top: -10px;
  border-width: 10px 0 10px 10px;
  border-color: transparent transparent transparent #6f969d;
}
.logo_navi_main .arw_top:after {
  top: -10px;
  left: 50%;
  margin-left: -10px;
  border-width: 0 10px 10px 10px;
  border-color: transparent transparent #6f969d transparent;
}
.logo_nav_guidance {
  padding: 260px 60px 0;
  color: #fff;
  text-align: center;
}
.logo_nav_guidance .inner {
  padding: 30px 60px;
  border: 2px solid #fff;
}
.guidance_desc {
  margin: 0 0 16px;
  font-size: 1.8rem;
}
.guidance_btn {
  padding: 16px 0;
  margin: 0 0 16px;
  cursor: pointer;
  font-size: 2rem;
  background: #5fba3b;
}
.guidance_btn:hover {
  background: #6aca43;
}
.guidance_btn span {
  display: inline-block;
  padding: 0 0 0 50px;
  line-height: 44px;
  background: url(../img/order/click_mouse.png) no-repeat 0 50% / auto 44px;
}


.radio_thumb li input  {
  display: none;
}
.radio_thumb_btn {
  border: 1px solid #ddd;
  border-radius: 3px;
  box-sizing: border-box;
  cursor: pointer;
  display: block;
  padding: 15px;
  position: relative;
  text-align: center;
  vertical-align: middle;
  background-color: #fafafa;
  background-repeat: no-repeat;
}
.radio_thumb_btn::before {
  border: 2px solid #f5be00;
  border-radius: 3px;
  box-sizing: border-box;
  content: "";
  display: block;
  left: -2px;
  opacity: 0;
  padding: 15px;
  position: absolute;
  top: -2px;
}
.radio_thumb input[type="radio"]:checked + .radio_thumb_btn::before {
  opacity: 1;
}

/* ロゴ以外フォーム
------------------------------------------- */
.form_info {
  margin: 0 0 30px;
}
#main_plan.couple_plan {
  margin: 0 0 40px;
  padding: 0 170px;
}
#main_plan.couple_plan .sbox {
  width: 290px;
}
#main_plan.couple_plan .sbox:not(:last-child) {
    margin: 0 60px 0 0;
}
#main_plan.couple_plan .sbox dd {
  width: 170px;
}
.logo_having label {
  display: block;
  margin: 0 0 10px;
}
.full_radio_btn label {
  margin: 0 0 12px;
  width: 500px;
}
.necessity {
  margin-bottom: 10px;
}

/* 名刺 */
#sbox_nc_design .sbox_ttl {
  background: #03a9f4;
}
#sbox_nc_set .sbox_ttl {
  background: #fd5a88;
}
#main_plan #sbox_nc_design dt.pro {
  background: url(../../../_common/pc/img/circle_nc.png) no-repeat scroll 0 50%;
}
#main_plan #sbox_nc_set dt.pro {
  background: url(../../../_common/pc/img/circle_set.png) no-repeat scroll 0 50%;
}
.xy_sample {
  width: 320px;
}
.xy_sample td {
  padding: 10px 0;
  text-align: center;
  border: none;
}
.xy_sample .sample_thumb {
  vertical-align: bottom;
}
.xy_sample .sample_thumb img {
  cursor: pointer;
}
.nc_area {
  display: none;
}
.nc_area.view {
  display: block;
}

/* 封筒 */
#sbox_en_design .sbox_ttl {
  background: #96d228;
}
#sbox_en_set .sbox_ttl {
  background: #fd5a88;
}
#main_plan #sbox_en_design dt.pro {
  background: url(../../../_common/pc/img/circle_en.png) no-repeat scroll 0 50%;
}
#main_plan #sbox_en_set dt.pro {
  background: url(../../../_common/pc/img/circle_set.png) no-repeat scroll 0 50%;
}
.envelope_area_desc {
  margin: 0 0 20px;
}
.en_select_desc {
  margin: 0 0 10px;
  font-size: 1.4rem;
}
.en_type_table {
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  margin: 0 0 30px;
  text-align: center;
  width: 100%;
  background: #fdfdfd;
}
.en_type_table td {
  padding: 20px 12px 10px;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
  padding: 10px 15px;
}
.en_type_table .size_img {
  margin: 0 0 20px;
}
.en_type_table .en_type_name {
  margin: 0 0 10px;
  font-size: 1.6rem;
}
.en_type_table .en_type_name span {
  padding: 0 5px 0 0;
  color: #74a617;
}
.en_type_table .info {
  font-size: 85%;
  margin: 0 0 20px;
}
.en_type_table .wdh {
  font-weight: bold;
  margin: 0 0 5px;
  color: #666;
}
.en_type_table select {
  border: 3px solid #96d228;
}
.en_area {
  display: none;
}
.en_area.view {
  display: block;
}

/* パンフレット */
.pam_type_table {
  width: 100%;
}
.pam_type_table th,
.pam_type_table td {
  border: none;
  text-align: center;
  background: #fff;
}
.pam_type_table th {
  padding: 10px 0 5px;
}
.pam_type_table td {
  padding: 0 0 20px;
}
.pam_type_table th label {
  cursor: pointer;
}
.pam_type_table th img {
  margin: 0 0 10px;
}
.pam_type_table th span {
  display: block;
}
.pam_type_thumb {
  height: 110px;
}

/* モーションロゴ */
.motion_sbox_ttl {
  background-color: #6bbf2e;
}
.motion_sbox dl {
  font-size: 93%;
}
.motion_sbox .fill {
  background-color: #f8f8f8;
}
.motion_sbox dl dt {
  padding-left: 18px;
  background-image: url(../../../motion/pc/img/common/motion_circle.png);
  background-repeat: no-repeat;
  background-position: 0 50%;
}
.sbox_price {
  padding: .5em 0;
  text-align: center;
  font-size: 1.8rem;
}
.sbox_price .num {
  font-size: 3rem;
}
.bgm_list li {
  float: left;
  margin-bottom: 25px;
  width: 188px;
}
.bgm_list li:not(:nth-child(3n)) {
  margin-right: 13px;
}
.bgm_list li iframe {
  margin-bottom: 5px;
}
.bgm_list .radio_btn label {
  margin: 0;
  padding: 10px 0;
  width: 100%;
}
.bgm_hero {
  margin-top: 20px;
}
.bgm_hero .ttl {
  position: relative;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 5px;
  padding-left: 1.3em;
}
.bgm_hero .ttl::before {
  position: absolute;
  top: .2em;
  left: 0;
  content: "";
  height: 8px;
  width: 8px;
  border-radius: 8px;
  border: 4px solid #6bbf2e;
}
.bgm_hero .atc {
  color: #d94266;
  margin-bottom: 10px;
}
.sp_radio_btn input[type="radio"]:checked + .switch {
  padding: 10px 10px 10px 28px;
}
.sp_radio_btn label  {
  padding: 10px;
}
.bgm_atc {
  padding: 1em;
  font-size: 85%;
  border: 1px solid #ff6f64;
  background-color: #f5f5f5;
  box-sizing: border-box;
}
.bgm_atc_h {
  display: block;
  font-size: 1.3rem;
  padding-left: 2em;
  margin-bottom: 5px;
  background-image: url(../../../_common/pc/img/i_attention.png);
  background-repeat: no-repeat;
  background-position: 0 50%;
}
.bgm_hero .textarea {
  margin-bottom: 10px;
}
.om_ptn_2 {
  display: none;
}
.om_ptn_2.view {
  display: block;
}
.ct_ptn_2 {
  display: none;
}
.ct_ptn_2.view {
  display: block;
}
.td_atc {
  margin-top: 15px;
  color: #d94266;
}

/* ウェブサイト */
.web_sbox_ttl {
  background-color: #fa3296;
}
.web_sbox dl {
  font-size: 93%;
}
.web_sbox .fill {
  background-color: #f8f8f8;
}
.web_sbox dl dt {
  padding-left: 18px;
  background-image: url(../../../web/pc/img/common/web_circle.png);
  background-repeat: no-repeat;
  background-position: 0 50%;
}

.estimate.sbox_price {
  font-size: 1.6rem;
  font-weight: bold;
}
.row_def {
  display: table;
  width: 100%;
}
.row_def:not(:last-child) {
  margin-bottom: 1em;
}
.row_def dt,
.row_def dd {
  display: table-cell;
}
.row_def dt {
  width: 8em;
}

.option_heading {
  margin-bottom: 10px;
}
.option_heading .price {
  font-size: 1.5rem;
  font-weight: bold;
}
.design_atc {
  font-size: 1.2rem;
}
.option_row {
  margin-bottom: 10px;
}
.option_col {
  display: inline-block;
}
.option_col:nth-child(n + 3) {
  margin-top: 6px;
}

.size_selectton {
  display: none;
  margin-top: 20px;
}
.size_selectton.view {
  display: block;
}
.add_size_etc {
  display: none;
}
.add_size_etc.view {
  display: block;
}
.add_size_num {
  margin: 0 0.6em;
  width: 80px;
}
.shipping_address {
  display: none;
}
.shipping_address.view {
  display: block;
}

.om_item,
.ct_item {
  display: none;
}
.om_item.view,
.ct_item.view {
  display: table-cell;
}


/* サンプル名刺台紙請求フォーム
------------------------------------------- */
.register_login {
  padding: 0 200px;
  margin: 40px 0;
}
.register_login .block {
  border: 2px solid #ddd;
  padding: 18px 30px;
}
.register_login_txt {
  float: left;
  width: 300px;
}
.register_login_btn {
  float: right;
  width: 172px;
}
.register_login_btn .login_btn a {
  font-size: 1.3rem;
  text-align: center;
}
.sample_note {
  background: #ffefef;
  border: 1px solid #ddd;
  font-weight: bold;
  margin: 0 0 40px;
  padding: 20px 35px;
  text-align: center;
}
.sample_note .statement {
  color: #e33764;
}
.form_desc {
  font-size: 1.4rem;
  margin: 0 0 30px;
}

/* web こだわりデザインプラン
------------------------------------------- */
.web_sbox .desc {
  padding: 10px;
  font-size: 1.2rem;
}
.web_sbox .desc .em {
  font-weight: bold;
  color: #d1237a;
  font-size: 108%;
}
.custom_area {
  padding: 24px;
  border: 4px double #fa3296;
  background-color: #ffe4f2;
}
.custom_area .desc p:not(:last-child) {
  margin-bottom: 10px;
}
.custom_area .desc .em {
  color: #d1237a;
  font-weight: bold;
}

/* 追加増刷
------------------------------------------- */
.notification.repeat {
  color: #3bb2c6;
  font-size: 1.4rem;
  font-weight: bold;
  border: 1px solid #ccc;
  background-color: #f7feff;
}
.notification.data {
  color: #ff4344;
  font-size: 1.4rem;
  font-weight: bold;
  border: 1px solid #ccc;
  background-color: #fff7f7;
}

.progressbar {
  margin-bottom: 30px;
  counter-reset: step;
}
.progressbar.repeat {
  margin-right: auto;
  margin-left: auto;
  width: 460px;
}
.progressbar.repeat li {
  width: 33.333%;
}
.progressbar.data li {
  width: 20%;
}
.progressbar.data_update_only li {
  width: 25%;
}
.progressbar li {
  position: relative;
  float: left;
  color: #c1c1c1;
  font-size: 1.4rem;
  font-weight: bold;
  text-align: center;
}
.progressbar li:before {
  display: block;
  margin: 0 auto 10px auto;
  width: 40px;
  height: 40px;
  color: #fff;
  content: counter(step);
  counter-increment: step;
  font-family: 'Montserrat', sans-serif;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 40px;
  text-align: center;
  border: 3px solid #c1c1c1;
  border-radius: 50%;
  background-color: #c1c1c1;
}
.progressbar li:after {
  position: absolute;
  content: '';
  top: 22px;
  left: -50%;
  width: 100%;
  height: 3px;
  background-color: #c1c1c1;
  z-index: -1;
}
.progressbar li:first-child:after {
  content: none;
}
.progressbar li.active {
  color: #333;
}
.progressbar li.active:before {
  color: #5fba3b;
  border-color: #5fba3b;
  background-color: #fff;
}
.re_mb15 { margin-bottom: 15px;}
.re_mb30 { margin-bottom: 30px;}

.rep_item_block {
  margin-bottom: 40px;
}
.rep_item_box {
  position: relative;
  float: left;
  margin-bottom: 30px;
  width: 22%;
  box-sizing: border-box;
  border: 1px solid #ccc;
}
.rep_item_box:not(:nth-child(4n)) {
  margin-right: 4%;
}
.rep_item_box.over {
  box-shadow: 0px 0px 4px rgba(0, 0, 0, .2);
}
.rep_item_box .item a {
  position: relative;
  display: block;
}
.rep_item_box .item a::after {
  position: absolute;
  content: "";
  width: 18px;
  height: 18px;
  right: 6px;
  bottom: 6px;
  background-image: url(../../../namecard/pc/img/order/zoom.png);
}
.rep_item_box .item img {
  width: 100%;
  height: auto;
}
.rep_item_box .contents {
  padding: 15px;
  text-align: center;
  cursor: pointer;
  border-top: 1px solid #ccc;
  background-color: #f8f8f8;
}
.rep_item_box .contents .name {
  font-size: 1.4rem;
  font-weight: bold;
}
.rep_item_box .contents .name .inner {
  position: relative;
  display: inline-block;
}
.rep_item_box .contents .name .inner::before {
  position: absolute;
  content: "";
  top: .1em;
  left: -24px;
  width: 16px;
  height: 16px;
  background-image: url(../../../namecard/pc/img/order/check_off.png);
}
.rep_item_box .contents input[type="number"] {
  margin-top: 8px;
  width: 100px;
  vertical-align: bottom;
}
.rep_item_box .contents .select-wrap {
  margin-top: 5px;
}
.rep_item_box .contents .select-wrap select {
  width: 100%;
  font-size: 1.4rem;
}
.rep_item_box.selected {
  border: 3px solid #3bb2c6;
}
.rep_item_box .contents .sheets {
  margin-top: 5px;
  font-size: 1.4rem;
}
.new_tab {
  padding-right: 20px;
  padding-left: 4px;
  position: relative;
  border-bottom: 1px solid #2e86b4;
  color: #2e86b4;
}
.new_tab::before {
  position: absolute;
  content: "";
  width: 6px;
  height: 6px;
  border: 2px solid #2e86b4;
  top: 6px;
  right: 8px;
}
.new_tab::after {
  position: absolute;
  content: "";
  width: 6px;
  height: 6px;
  border: 2px solid #2e86b4;
  right: 4px;
  top: 2px;
  background-color: #fff;
}

.rep_item_box .input_radio {
  display: none;
}
.rep_item_label {
  position: relative;
  display: block;
}
.rep_item_label::after {
  position: absolute;
  content: "";
  top: -8px;
  right: -8px;
  width: 30px;
  height: 30px;
  z-index: 1000;
}
.rep_item_box .input_radio:checked + .rep_item_label::before {
  position: absolute;
  content: "";
  top: -1px;
  left: -1px;
  cursor: pointer;
  width: calc(100% - 3px);
  height: calc(100% - 3px);
  z-index: 1;
  border: 3px solid #3bb2c6;
}
.rep_item_box .input_radio:checked + .rep_item_label .name .inner::before {
  background-image: url(../../../namecard/pc/img/order/check_on.png);
}

.rep_item_frame:not(:last-child) {
  margin-bottom: 30px;
}
.rep_item_frame {
  padding: 4px;
  border: 1px solid #ccc;
  border-radius: 3px;
  background-color: #f0f0f0;
}
.rep_item_frame .inside {
  padding: 30px;
  background-color: #fff;
}
.rep_item_frame .rep_item_box {
  margin: 0;
  width: 224px;
}
.rep_item_frame .rep_item_sub {
  float: right;
  width: 646px;
}
.rep_item_frame .rep_item_sub .heading {
  margin-bottom: 10px;
  font-size: 1.4rem;
  font-weight: bold;
}
.rep_textarea {
  box-sizing: border-box;
  width: 100%;
  resize: vertical;
  background-color: #fbfbfb;
}

.rep_mention_frame:not(:last-child) {
  margin-bottom: 30px;
}
.rep_mention_frame .frame_ttl {
  padding: .9em 1.2em;
  color: #fff;
  line-height: 1;
  font-size: 1.6rem;
  border-radius: 3px 3px 0 0;
  background-color: #3bb2c6;
}
.rep_mention_frame .frame_main {
  padding: 0 4px 4px 4px;
  border-radius: 0 0 3px 3px;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-left: 1px solid #ccc;
  background-color: #f0f0f0;
}
.rep_mention_frame .frame_main .inside {
  padding: 30px;
  background-color: #fff;
}
.rep_mention_frame .heading {
  margin-bottom: 10px;
  font-size: 1.4rem;
  font-weight: bold;
}
.rep_mention_left {
  float: left;
  width: 500px;
}
.rep_mention_right {
  float: right;
  width: 360px;
}
.rep_mention_right select {
  width: 190px;
  background-color: #fbfbfb;
}

.rep_add_btn {
  margin: 30px 0;
  text-align: center;
}
.rep_add_btn a {
  display: inline-block;
  padding: 12px 60px;
  color: #fff;
  font-weight: bold;
  font-size: 1.8rem;
  border-radius: 3px;
  background-color: #3bb2c6;
}
.rep_add_btn .plus {
  display: inline-block;
  padding-left: 24px;
  background-image: url(../../../namecard/pc/img/order/plus.png);
  background-repeat: no-repeat;
  background-position: 0 50%;
}
.register_contents {
  line-height: 1.8;
}

.web-step .ttl {
  font-size: 1.8rem;
}
.web-step ol {
  display: flex;
  justify-content: space-between;
}
.web-step ol li {
  position: relative;
  width: 30%;
  border: 2px solid #fa3296;
}
.web-step ol li .heading {
  padding: .6em;
  font-size: 1.6rem;
  color: #fff;
  background-color: #fa3296;
}
.web-step ol li .detail {
  padding: 1em;
}
.web-step ol li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -32px;
  margin-top: -16px;
  display: block;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 16px 0 16px 16px;
  border-color: transparent transparent transparent #fa3296;
}

@media (max-width:990px){
  .wrap{
    width:100%;
    padding:10px 1em;
    box-sizing:border-box;
  }
.order_table,.order_table tbody,.order_table tr,.order_table th,.order_table td {
  display:block;
  width:100%;
  box-sizing: border-box;
}
  
  #order.form-sec {
  padding: 4em 1em;
}
  .form_edit_btn{
    margin-bottom:20px;
  }
}