@charset "utf-8";

/* -------------------------------------------------- */
/* #block-form */
/* -------------------------------------------------- */
#block-form .strong{font-weight:bold;font-size:1.4rem;}
#block-form .text12_red{color:#ff0000;}
#block-form .f_informaiton{display:flex;align-items:center;border:1px solid #ccc;padding:10px 15px;margin:20px auto;}
#block-form .f_informaiton > img{width:68%;}
#block-form .f_informaiton > a{width:32%;}
#block-form .f_informaiton a:hover{opacity:0.7;}
#block-form .f_ttl_top{padding:14px 15px;margin-bottom:20px;text-align:left;color:#333;font-size:1.4rem;background:#dedcd2;}
#block-form .f_ttl{padding:14px 15px;margin-bottom:20px;text-align:left;color:#333;font-size:1.4rem;background:#dedcd2;margin-top:20px;position:relative;}
#block-form .f_ttl img,
#block-form .f_ttl_top img{vertical-align:middle;margin-right:5px;}
#block-form .f_goods{display:flex;flex-wrap:wrap;gap:20px;padding:0 10px;margin-bottom:30px;font-size:1.4rem;}
#block-form .f_goods > li{width:calc((100% - 20px) / 2);text-align:center;position:relative;}
#block-form .f_goods > li input{position:absolute;bottom:6%;left:50%;transform:translateX(-50%) translateY(50%);}
#block-form .f_size{display:flex;flex-wrap:wrap;gap:15px 10px;padding:0 15px;margin-bottom:20px;font-size:1.4rem;}
#block-form .f_size > li{width:calc((100% - 20px) / 3);}
#block-form .f_size > li .inner{border:1px solid #aaa;padding:10px;margin-bottom:8px;}
#block-form .f_size > li .name{font-weight:bold;font-size:1.4rem;	font-feature-settings:"palt";-webkit-font-feature-settings:"palt";color:#8c4f5e;}
#block-form .f_size > li .icon{margin-top:2px;display:flex;gap:2px;flex-wrap:wrap;}
#block-form .f_size > li .img{margin-top:3px;}
#block-form .f_size > li .bottom{display:flex;align-items:flex-start;gap:2px;}
#block-form .f_size > li .bottom input{margin-top:5px;}
#block-form .f_size > li .bottom label{flex:1;}
#block-form .f_color{display:flex;flex-wrap:wrap;gap:15px 10px;padding:0 15px;margin-bottom:20px;font-size:1.4rem;font-feature-settings:"palt";-webkit-font-feature-settings:"palt";}
#block-form .f_color > li{width:calc((100% - 30px) / 4);}
#block-form .f_color > li img{margin-bottom:8px;}
#block-form .f_option{display:flex;flex-wrap:wrap;gap:15px 10px;padding:0 15px;margin-bottom:20px;font-size:1.4rem;}
#block-form .f_option > li{width:calc((100% - 20px) / 3);}
#block-form .f_option > li img{margin-bottom:8px;}
#block-form .f_md{padding:20px 0 8px 15px;position:relative;margin-top:20px;}
#block-form .text11_red{font-size:1.1rem;color:#ff0000;line-height:1.4;}
#block-form .f_input input[type="radio"]{margin:0 5px 0 0;}
#block-form .table-info{width:100%;font-size:1.2rem;}
#block-form .table-info th,
#block-form .table-info td{border:1px solid #ccc;vertical-align:middle;padding:6px 10px;}
#block-form .table-info .iconR{float:right;}
#block-form .table-info .table_form-c{background:#EFEDE5;}
#block-form .table-info input{max-width:50vw;}
#block-form .table-info input[type="radio"]{margin:0 5px 0 0;}
#block-form .table-info input[type="button"]{margin:5px;}
#block-form #scroll{width:100%;border:1px solid #d6d6d6;margin-top:30px;padding:15px;overflow-y:auto;max-height:130px;}
#block-form #scroll .p_title{font-weight:bold;text-align:center;margin-bottom:10px;font-size:1.6rem;}
#block-form #scroll .p_stitle{color:#666600;font-weight:bold;padding-top:10px;}
#block-form #scroll .text10_red{font-size:1rem;color:#FF0000;line-height:140%;}
#block-form #scroll ol{margin:0;padding-left:0;counter-reset:item;list-style-type:none;}
#block-form #scroll ol li::before{counter-increment:item;content:counter(item) ' :';}
#block-form .f_btn{text-align:center;margin-top:30px;font-size:1rem;}
#block-form .f_btn input{margin-top:5px;}
#block-form .f_cau{border:1px solid #d6d6d6;padding:15px;margin-top:30px;}
#block-form .f_cau p:first-child{text-align:center;font-weight:bold;margin-bottom:5px;}
#block-form #SelectedTypeName{position: absolute;top:50%;right:40px;text-align: center;font-weight: bold;font-size:2rem;color: #ff0000;transform:translateY(-50%);}

#block-form .block-error{text-align:center;margin-bottom:20px;}

#block-form .block-confirm table{margin:20px auto;text-align:left;}
#block-form .block-confirm table th,
#block-form .block-confirm table td{border:1px solid #ccc;padding:6px 10px;vertical-align:middle;font-weight:normal;}
#block-form .block-confirm table .form_php_td_left{background:#EFEDE5;width:25%;white-space:nowrap;}
#block-form .block-confirm .box-btn{display:flex;justify-content:center;gap:10px;}

/* ======================================================================================================================= */
/* for sp */
/* ======================================================================================================================= */
@media screen and (min-width:1px) and (max-width:799px){
  #block-form .f_informaiton{display:block;text-align:center;padding:5px 15px 15px;}
  #block-form .f_informaiton > img{width:auto;}
  #block-form .f_informaiton > a{width:auto;}

}
@media screen and (min-width:1px) and (max-width:569px){
  #block-form .f_goods{display:block;padding:0;}
  #block-form .f_goods > li{width:100%;}
  #block-form .f_goods > li + li{margin-top:15px;}
  #block-form .f_size{padding:0;font-size:1.2rem;}
  #block-form .f_size > li{width:calc((100% - 10px) / 2);}
  #block-form .f_size > li .name{font-size:1.2rem;}
  #block-form .f_size > li .icon img{width:auto;height:15px;}

  #block-form .f_color{padding:0;font-size:1.2rem;}
  #block-form .f_color > li{width:calc((100% - 10px) / 2);}
  #block-form .f_md{padding:25px 0 8px 0!important;margin-top:5px;}
  #block-form .f_option{padding:0;font-size:1.2rem;margin-bottom:0;}
  #block-form .f_option > li{width:calc((100% - 10px) / 2);height:auto!important;}
  #block-form #SelectedTypeName{display:block;position:static;transform:none;padding:0;margin-top:5px;font-size:1.8rem;}

  #block-form .table-info,
  #block-form .table-info tbody,
  #block-form .table-info tr,
  #block-form .table-info th,
  #block-form .table-info td{display:block;width:100%;}
  #block-form .table-info{border-top:1px solid #ccc;}
  #block-form .table-info th,
  #block-form .table-info td{border-top:0;}
  #block-form .table-info input[type="text"]{width:100%;max-width:100%;}
  #block-form .table-info input[name="郵便番号"]{width:100px;}

}