@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;}

#block-form .f_goods{display:flex;gap:20px 14px;flex-wrap:wrap;}
#block-form .f_goods > li{width:calc((100% - 14px) / 2);position:relative;text-align:center;}
#block-form .f_goods > li a{width:100%;height:100%;display:flex;flex-direction:column;text-decoration:none;}
#block-form .f_goods > li a:hover{opacity:0.8;}
#block-form .f_goods > li .label span{display:inline-block;background:#9a9630;color:#fff;border-radius:100px;font-size:1.4rem;font-weight:bold;padding:3px 15px;position:relative;z-index:1;text-shadow:0 0 4px rgba(95,93,29);}
#block-form .f_goods > li .ttl{font-size:2.6rem;padding:20px 10px 15px;border-top:3px solid #bdb777;background:url(/img/top/product_back.jpg) repeat #894a43;color:#fff;letter-spacing:0.075em;font-weight:500;line-height:1.3;margin-top:-15px;position:relative;font-feature-settings:"palt";-webkit-font-feature-settings:"palt";}
#block-form .f_goods > li .ttl::before{content:"";display:block;width: 0;height: 0;border-style: solid;border-width: 16px 16px 0px 0px;border-color: #fff transparent transparent transparent;position:absolute;left:0;top:-4px;z-index:2;}
#block-form .f_goods > li .ttl::after{content:"";display:block;width: 0;height: 0;border-style: solid;border-width: 0px 16px 16px 0px;border-color: transparent #fff transparent transparent;position:absolute;right:0;top:-4px;z-index:2;}
#block-form .f_goods > li .ttl span::before{content:"";display:block;width: 0;height: 0;border-style: solid;border-width: 16px 16px 0px 0px;border-color: #bdb777 transparent transparent transparent;position:absolute;left:0;top:0;z-index:1;}
#block-form .f_goods > li .ttl span::after{content:"";display:block;width: 0;height: 0;border-style: solid;border-width: 0px 16px 16px 0px;border-color: transparent #bdb777 transparent transparent;position:absolute;right:0;top:0;z-index:1;}
#block-form .f_goods > li .inner{padding:10px 5px 18px;background:#ede7e2;flex:1;position:relative;}
#block-form .f_goods > li .inner::before{content:"";display:block;width:0;height:0;border-style:solid;border-width:16px 0px 0px 16px;border-color:transparent transparent transparent #fff;position:absolute;left:0;bottom:0;}
#block-form .f_goods > li .inner::after{content:"";display:block;width:0;height:0;border-style:solid;border-width:0px 0px 16px 16px;border-color:transparent transparent #fff transparent ;position:absolute;right:0;bottom:0;}
#block-form .f_goods > li .txt{font-size:1.3rem;color:#000;min-height:3em;font-feature-settings:"palt";-webkit-font-feature-settings:"palt";}
#block-form .f_goods > li .img{margin:10px auto 15px;}
#block-form .f_goods > li .btn span{display:inline-block;font-size:1.4rem;font-weight:bold;padding:2px 8px;background:#fff;border-radius:2px;}
#block-form .f_goods > li .btn span::before{content:"";display:inline-block;width:12px;height:12px;background:url(/img/top/products_arrow.png) no-repeat;background-size:contain;margin-right:5px;}


/* ======================================================================================================================= */
/* 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;}

  #block-form .f_goods{display:block;}
  #block-form .f_goods > li{width:100%;}
  #block-form .f_goods > li + li{margin-top:10px;}
  #block-form .f_goods > li .ttl{font-size:2.8rem;padding:18px 10px 10px;font-weight:700;}
  #block-form .f_goods > li .inner{padding:10px 5px 12px;}
  #block-form .f_goods > li .img{margin:5px auto 10px;}
  #block-form .f_goods > li .img img{width:260px;}
  #block-form .f_goods > li .btn span{font-size:1.2rem;}
}