@charset "utf-8";
/* CSS Document */

/* header */
header { position:fixed; top:0; width:100%; background-color:#fff; background-image:url(../img/head_bg1.png); background-repeat:no-repeat; background-position:center bottom; height:80px; padding:10px 0 8px; z-index:9999; }
.head_bg { background-image:url(../img/head_bg2.png); background-repeat:no-repeat; background-position:top center; height:469px; margin-top:80px; padding-top:40px; }
header .logo { max-width:139px; float:left; }
header.type_ec .logo { max-width:175px; }
.nav_box { float:right; margin-top:10px; }
#gnav .nav li:nth-child(n+2) { margin-left:20px; }
#gnav .nav li a.active { border-bottom:1px solid #1f3331; }
#gnav .nav li a.active:before { display:none; }

#pagettl { max-height:300px; background-repeat:no-repeat; background-size:cover; padding:5% 0 8% 30px; }
#pagettl .txt { display:block; max-width:1100px; width:100%; margin:0 auto; font-size:50px; font-family:"Hannari","游明朝体", "Yu Mincho", YuMincho,"ヒラギノ明朝 ProN W6", "HiraMinProN-W6","HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝"; font-weight:normal; text-shadow: 0 0 5px rgba(255,255,255,.7); }

#products .conttl5, #member .conttl5 { margin-bottom:30px; }

#pankuzu { text-align:right; max-width:1100px; margin-top:20px; margin-left:auto; margin-right:50px; }
#pankuzu li { display:inline-block; font-size:13px; color:#fff; }
#pankuzu li a { color:#fff; }
#pankuzu li:not(:last-child):after { content:"＞"; margin-left:1em; margin-right:1em; }

#contents.shopping { margin-top:120px; }

/*shopping header*/
#shopping.head_bg { height:auto; padding-top:0; background:none; position:relative; }
#shopping.head_bg .pagettl2 { max-width:1100px; margin:0 auto; height:100px; text-indent:15px; font-size:1.5em; }
#shopping.head_bg .shipping_msg .free { color:#931432; }
#shopping.head_bg .btn_shopping { position:fixed; text-align:center; }
#shopping.head_bg .btn_shopping > a {
  display:block; padding:7px; background:#931432; }
#shopping.head_bg .btn_shopping img { width:36px; }
#shopping.head_bg .btn_shopping span { display:block; color:#fff; font-size:.9em }

.sidenav { width:15%; }
.sidenav .conttl5 { border-bottom:1px solid #1f3331; padding-bottom:5px; display:block; }
.sidenav .conttl5 .jp { font-size:18px; }
.sidenav .conttl5 .en { top:-20px; left:-20px; }
.sidenav .bnr_mihon { margin:20px 0 40px; }
.sidenav > ul, .side_member > ul { margin:10px 0 40px; }
.sidenav li, .side_member li>a{ position:relative; margin-bottom:5px; padding-left:1.4em; transition:all 0.3s; line-height:2; }
.sidenav .category li { width:100%; }
.side_member li a {position:relative;}
.sidenav li:hover, .side_member li>a:hover { padding-left:1.9em; }
.sidenav li:before, .side_member li>a:before { position:absolute; content:""; border-color:#fff; border-top:1px solid; border-right:1px solid; width:7px; height:7px; transform:rotate(45deg); top:0; bottom:0; margin: auto; left:0; transition:all 0.3s; }
.sidenav li:hover:before, .side_member li>a:hover:before{ left:0.5em; }

.sidenav li ul { display:none; }
.sidenav li a { display:block; }
.sidenav li.active ul { display:block; }
.sidenav li.cat { color:#fff; background:#1f3331; }
.sidenav li.cat a { color:#fff; }

.sidenav .search_box { margin-bottom:30px; }
.sidenav .search_box input[type="text"] { width:80%; }
.sidenav .search_box .btn_search { position:relative; width:17%; font-size:1em; text-indent:-9999px; border:none; background:#ddd; cursor:pointer;
  -webkit-transition:all .3s; transition:all .3s; }
.sidenav .search_box .btn_search:before { content:""; position:absolute; top:0; left:0; right:0; bottom:0; width:.8em; height:.8em; margin:auto; background:url(../img/i_search.svg) no-repeat center / 100%; }
.sidenav .search_box .btn_search:hover { background:#ccc; }
.sidenav .search_box .btn_search:focus { outline:none; }
.sidenav .login_nav>.btn2>a { margin: 0 0 1rem; padding: .4rem 2rem; text-align: left; line-height: 1.6rem;}

.contactBox { margin: 100px auto; }
.contactBox .btn_line { display: block; margin: 40px auto 0; max-width: 350px; }
.contact_box,.login_box { max-width:740px; width:100%; margin:50px auto 0; padding:20px 40px 30px; border:4px double #324947; }
.contact_box .conttl2{ margin:0 0 10px; }
.contact_box .conttl2:after{ bottom:10px; }
.contact_box .txt2 { text-align:center; margin-bottom:15px; }
.contact_box .name { width:100%; font-size:18px; }
.contact_box .flex { align-items:center; -webkit-align-items:center; line-height:2.2; }
.contact_box .txt3 { width:65%; }
.contact_box .btn2 { width:32%; }

.login_box .ttl,.login_box .txt{ margin: 0 0 1rem;}

/*ページ送り*/
.pagination{ clear:both; margin:30px 0 0; text-align:center; }
.pagination a, .pagination span { display:inline-block; margin:3px; padding:8px 10px; line-height:1; }
.pagination a{ color:#FFF; text-decoration:none; background:#1f3331; border:1px solid #1f3331; }
.pagination a:hover{ color:#1f3331; background-color:#FFF; }
.pagination span.current{ background-color:#b28850; border:1px solid #b28850; }
.pagination span.disabled { border:1px solid #FFF; color:#CCC; }

/*----- 宮原紬について -----*/
#about #pagettl { background-image:url(../img/about/pagettl_bg.jpg); }
#about .concept .flex { margin-top:50px; }
#about .concept .flex .img_box { width:50%; }
#about .concept .flex .img { position:relative; text-align:right; z-index:-1; }
#about .concept .flex .img2 { position:relative; margin-top:-90px; z-index:10; }
#about .concept .flex .txt { width:45%; margin-top:100px; }
#about .comment { margin:200px 0; }
#about .comment .txt_box { width:60%; padding-bottom:100px; }
#about .comment .txt_box .conttl2 { font-size:35px; }
#about .comment .img01 { position:absolute; top:-110px; right:0; }
#about .original { margin-top:150px; margin-bottom: 120px;}
#about .original > div { position:relative; padding:4% 0 5%; background-repeat:no-repeat; }
#about .original .txt_box { width:100%; margin-bottom:50px; }
#about .original .name { font-size:48px; letter-spacing:7px; line-height:1.3; margin-bottom:30px; }
#about .original .lead { font-size:25px; margin-top:0; line-height:2; letter-spacing:3px; }
#about .original .kaitoumen { background-image:url(../img/about/img_kaitoumen.jpg); background-position:right bottom; }
#about .original .kaitoumen .name { color:#33466b; margin-top:50px; }
#about .original .kaitoumen .img1 { position:absolute; bottom:-35px; left:460px; width:400px; z-index:1; }
#about .original .kaitoumen .img2 { position:relative; z-index:2; }
#about .original .hanaito { background-image:url(../img/about/img_hanaito.jpg); background-position:left bottom; }
#about .original .hanaito .txt_box { margin-left:auto; margin-right:0; text-align:right; }
#about .original .hanaito .box { margin-top:25px; }
#about .original .hanaito .name { color:#92333e; }
#about .original .hanaito .img { text-align:right; }
#about .hanbaikai { margin:200px 0; padding:30px 0; }
#about .hanbaikai .img01 { position:absolute; top:-155px; right:0; z-index:10; }
#about .hanbaikai .img02 { position:absolute; bottom:-150px; right:180px; z-index:10; }
#about .hanbaikai .btn1 { display:block; margin-top:40px; text-align:center; }
#about .hanbaikai .btn1 a { display:inline-block; max-width:250px; text-align:left; }

/*----- 紬とは -----*/
#tsumugi #pagettl { background-image:url(../img/tsumugi/pagettl_bg.jpg); }
#tsumugi .about .txt { margin-top:30px; }
#tsumugi .about .somekata { margin-top:40px; }
#tsumugi .about .somekata .somemono { width:42%; }
#tsumugi .about .somekata .somemono .img { padding-top:10.8%; }
#tsumugi .about .somekata .orimono { width:50%; }
#tsumugi .about .somekata .name { text-align:center; font-size:25px; }
#tsumugi .famous { margin:200px 0 0; }
#tsumugi .famous .conttl5 { position:relative; left:25%; transform:translateX(0); }
#tsumugi .famous .conttl5:before { position:absolute; content:""; border-bottom:1px solid #fff; width:80px; bottom:-10px; left:50%; transform:translateX(-50%); }
#tsumugi .famous .flex { align-items:flex-end; -webkit-align-items:flex-end; margin-top:-160px; }
#tsumugi .famous .name { font-size:23px; letter-spacing:2px; }
#tsumugi .famous .oshima { width:58%; }
#tsumugi .famous .oshima .name { text-align:right; }
#tsumugi .famous .yuki { width:35%; }
#tsumugi .famous .yuki .txt { margin-bottom:60px; }
#tsumugi .h_c .conttl5 { margin-bottom:1.5em; }
#tsumugi .h_c .conttl5 .jp { font-size:50px; }
#tsumugi .h_c .conttl5 .en { top:30px; }
#tsumugi .h_c section { padding:10% 0 7%; background-repeat:no-repeat; background-size:contain; }
#tsumugi .h_c .txt_box { max-width:620px; width:100%; }
#tsumugi .h_c .txt p { margin-bottom:1em; }
#tsumugi .h_c .history { background-image:url(../img/tsumugi/img_history.jpg); background-position:right top; }
#tsumugi .h_c .charm { padding-top:7%; background-image:url(../img/tsumugi/img_charm.jpg); background-position:left top; }
#tsumugi .h_c .charm .txt_box { margin-left:auto; margin-right:0; }

/*----- 商品のご案内 -----*/
.bnr_ryukyu { padding: 20px 0 60px; }
.bnr_ryukyu img { border: 2px solid #a0a0a0; }

.map_area .map_ttl { margin-bottom:1em; }
#products #pagettl { background-image:url(../img/products/pagettl_bg.jpg); }
#products .japan { position:relative; height:780px; }
#products .japan > figure { position:absolute; width:100%; top:0; }
#products .japan .jp1 { max-width:842px; right:40px; }
#products .japan .jp2 { max-width:539px; left:0; }
#products .japan ul li:nth-child(n+2) { margin-top:5px; }
#products .japan ul li a { border:1px solid #b28850; background-color:#b28850; color:#fff; display:block; padding:0 3px 0 12px; min-width:160px; line-height:2; }
#products .japan ul li a:hover { color:#b28850; background-color:#fff; }
#products .japan ul li a .pref { font-size:12px; }
#products .japan ul li a .pref:before { content:"【"; }
#products .japan ul li a .pref:after { content:"】"; }
#products .main { width:80%; }

.tabNav { position:relative; margin-bottom:60px; border-bottom:1px solid #a0a0a0; }
.tabNav:before { content:""; position:absolute; left:0; right:0; bottom:-4px; width:100%; height:1px; background:#a0a0a0; }
.tabNav li { float:left; margin-right:.8em; }
.tabNav li:last-child { margin-right:0; }
.tabNav li a { display:block; min-width:13em; padding:.2em 2em; text-align:center; border:1px solid #a0a0a0; border-bottom:none; }
.tabNav li a:hover { background:#eee; }
.tabNav li.current a { color:#fff; background:#a0a0a0; }

/*カテゴリリスト*/
.cat_list > li > a { display:block; padding:1em 0; text-align:center; border:1px solid #a0a0a0; }
.cat_list > li > a:hover { background:#e8f1f0; }

/*商品リスト*/
.con_list li { position:relative; width:29%; margin-left:6.5%; }
.con_list li .img { position:relative; overflow:hidden; width:100%; margin-bottom:.5em; padding-top:100%; -webkit-transition:all .5s; transition:all .5s; }
.con_list li .img img { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
.con_list li.bunkazai a:before { position:absolute; content:"重要無形文化財"; color:#fff; font-size:11px; background-color:#b25050; z-index:100; top:0; right:0; -ms-writing-mode:tb-rl; writing-mode:vertical-rl; -webkit-writing-mode:vertical-rl; margin-left:0; margin-right:0; line-height:2; padding:5px 0; }
.con_list li.kokuho a:before { position:absolute; content:"人間国宝"; color:#fff; font-size:12px; background-color:#b25050; z-index:100; top:0; right:0; -ms-writing-mode:tb-rl; writing-mode:vertical-rl; -webkit-writing-mode:vertical-rl; margin-left:0; margin-right:0; line-height:2; padding:8px 0; }
.con_list li .name { margin:0 0 .5em; font-size:1.3em; line-height:1.7; font-family:"Hannari","游明朝体", "Yu Mincho", YuMincho,"ヒラギノ明朝 ProN W6", "HiraMinProN-W6","HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝"; font-weight:normal; }
.con_list li .label { display:inline-block; padding:.1em .5em 0; color:#fff; background:#b28850; }
.con_list li .name .label { margin-right:.8em; font-size:.7em; vertical-align:text-bottom; }
.con_list li .price { text-align:right; line-height:1; }
.con_list li .txt { margin-top:.5em; line-height:2; }
.con_list li .btn2 { margin-top:.8em; }
.con_list li:hover .img { opacity:.5; }
.chihou_box { margin-bottom:100px; }
.con_list li .artist { margin-top:15px; padding-bottom:.2em; padding-left:.6em; line-height:1.5; border-left:3px solid #ddd; }

.con_list .img .cat {
  position:absolute; top:0; left:0; padding:5px 8px 7px; line-height:1;
  font-size:.8em; color:#FFF; background-color:#325d58; }
.con_list.item li > a { display:block; height:100%; padding-bottom:2em; position:relative; }
.con_list.item li .code { margin:0; font-size:.9em; line-height:1.8; }
.con_list.item li .code .label { margin-right:.8em; margin-bottom:.5em; }
.con_list.item li .code .iblock { max-width:100%; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.con_list.item li .name { min-height:42px; font-size:1em !important; line-height:1.4; }
.con_list.item li .price { position:absolute; bottom:0; width:100%; }

.con_list.artist li .img { margin-bottom:1em; padding-top:100%; border-radius:50%; }
.con_list.artist li .img img { position:absolute; top:50%; left:50%; max-width:150%; transform:translate(-50%, -50%); }
.con_list.artist li { position:relative; text-align:center; }
.con_list.artist li .name { margin-top:0; font-size:1.2em; }
.con_list.artist li .label { display:inline-block; padding:.15em .8em .2em; font-size:.95em; line-height:1.6; }

.con_list.cat + .btn2 { max-width:200px; margin:20px 0 0 auto; }

.con_list .sold_out { position:absolute; bottom:-20px; width:100%; margin-top:30px; border:1px solid #e0afaf; line-height:2.2; color:#c30000; text-align:center; }


.favorite .con_list.item li > a { display:block; height:100%; padding-bottom:6em; position:relative; }
.favorite .con_list.item li .name { min-height: auto;}
.favorite .con_list.item li .price {position: static; padding: .5em 0;}
.favorite .con_list.item li .btn_box {position: absolute; bottom: 0;width: 100%;}
.favorite .con_list.item li .btn_box>.btn { text-align: center; margin: .2em 0; padding: 0;  -webkit-transition: all .5s; transition: all .5s;}
.favorite .con_list.item li .btn_box>.btn_delete { background: #ccc; }
.favorite .con_list.item li .btn_box>.btn:hover{ opacity:.7; }

/* 詳細ページ */
#products.detail .conttl4 { margin-bottom:1.8em; }
#products #slider { width:100%; margin:0 auto 10px; overflow:hidden; }
.slide-item img { max-height:400px; margin:0 auto;}
.slide-item { position:relative; text-align:center; }
.thumbnail-item img { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }
#thumbnail-list{ width:100%; margin:0 auto; display:flex; justify-content:pace-between; flex-wrap:wrap; }
.thumbnail-item{ position:relative; flex:0 1 23%; margin-bottom:10px; overflow:hidden; padding-top:17%; box-sizing:border-box; }
  .thumbnail-item:after{ content:''; background-color:rgba(0,0,0,0.5); position:absolute; display:block; top:0; left:0; width:100%; height:100%; opacity:1; transition:.3s opacity linear; }
  .thumbnail-item.thumbnail-current:after{ opacity:0; }
  .thumbnail-item img{ width:100%; margin:0 auto; }

.thumbnail-item:not(:nth-child(4n+1)) { margin-left:2.6%; }
#products.detail .detail_box { margin-bottom:65px; }
#products.detail .img_box { width:45%; }
#products.detail .txt_box { width:52%; }
#products.detail .txt_box .btn1,
#products.detail .txt_box .favo { margin-top:20px; }
#products.detail .txt_box .txt1 { text-align:right; }
#products.detail .txt_box .txt1 span { line-height:2; display:inline-block; color:#fff; font-size:13px; padding:0 5px; }
#products.detail .txt_box .txt1 .area { background-color:#b28850; }
#products.detail .txt_box .txt1 .bunkazai,
#products.detail .txt_box .txt1 .kokuho { background-color:#b25050; margin-left:10px; }

#products.detail .price { margin-bottom:1em; font-size:1.2em; }
#products.detail .price > em { font-size:1.5em; }


/*買い物フォーム*/
#products .detail_box  form { margin:1em 0; padding:1.5em; line-height:1.6; background:#f9f9f9; }
#products .detail_box  form dt { font-weight:bold; }
#products .detail_box  form dd { padding:.5em 0 1em 1em; }
#products .detail_box  form dd + dd { margin-top:-1em; }
#products .detail_box  form button { width:100%; padding:.5em; font-family:inherit; font-size:1.1em; text-align:center; border:0; color:#FFF; background-color:#1f3331; cursor:pointer; }

#products .detail_box .sold_out {
  padding:15px 10px; border:1px solid #e0afaf; line-height:1.6; color:#c30000; text-align:center;
}
#products .detail_box .sold_out em { font-size:1.4em; }


#products.detail .main { position:relative; margin-bottom:130px; }
#products.detail .conttl4 .label { margin-right:.8em; padding:0 .5em .25em; color:#fff; font-size:.85em; line-height:1; vertical-align:baseline; background-color:#b28850; }
#products.detail .artist_name, #products.detail .fabric_name { position:absolute; top:1em; right:1em; }

#products.detail .conttl4 .kana {margin-left:1em;  font-size:.8em; }
#products.detail .conttl4 .kokuho { display:inline-block; margin-left:1.5em; padding:0 .5em .15em; color:#fff; font-size:.65em; line-height:1.8; background:#b25050; }

#products.detail .fabric_dtl .tbl { border-spacing:0 10px; }
#products.detail .fabric_dtl .tbl th { width:25%; padding:5px 10px; font-size:14px; }
#products.detail .fabric_dtl .tbl td { padding-left:20px; }
#products.detail .fabric_dtl .ttl { font-size:18px; }
.notice_txt { text-indent:-1em; padding-left:1em; }
.notice_txt::before { content:"※"; }
.notice_li > li { text-indent:-1em; padding-left:1em; line-height:1.7; }
.notice_li > li::before { content:"※"; }
.notice_li > li + li { padding-top:.5em; }
#products.detail .fabric_dtl .notice_li { margin:20px 0 30px; font-size:14px; }
#products.detail .fabric_dtl .btn1 a { border:0; color:#FFF; background-color:#1f3331; }
#products.detail .fabric_dtl .btn1 a:after { border-color:#FFF; }

.favo { font-weight: bold; }
.favo a { display: block; position: relative; padding:4px 3px 3px; text-align: center; color: #1f3331; border: 1px solid #1f3331;}
.favo a:hover {color: #ce4545; border: 1px solid #ce4545;}
.favo a::before { content: ''; display: inline-block; width: 1.2em; height: 1.2em; margin-right: .5rem; background: url(/img/i_heart.svg) center no-repeat; background-size:contain; vertical-align: text-top; }
#products.detail .box>.favo {display: inline-block; }
#products.detail .box>.favo a{ box-sizing: border-box; width: 100%; min-width: 250px; margin: 0 4px 4px 0; transition: all 0.2s;}
#products.detail .box>.favo a:hover { margin: 4px 0 0 4px; }
#products.detail .box>.favo a::after { position: absolute; content: ""; border: 1px solid #a0a0a0; border-width: 0 1px 1px 0; top: 5px; left: 5px; right: -5px; bottom: -5px; }
#products.detail .box>.favo a:hover::after { border:none }

.sp_only>.favo a{ margin-top: 1rem; padding:2px 0 0; }


.btn_about { font-size: 17px; margin-bottom:1.5em; }
.btn_about a { padding:1.5em; border:1px solid #ddd; }
.btn_about a:hover { background:#eee; }
.btn_about .img { width:126px; margin-right:2em; }
.btn_about .img figure { position:relative; overflow:hidden; width:100%; padding-top:100%; border-radius:50%; }
.btn_about .img img { position:absolute; top:50%; left:50%; max-width:150%; transform:translate(-50%, -50%); }
.btn_about .summary { position:relative; -webkit-flex:1; flex:1; }
.btn_about .name { font-size:1.25em; line-height:1.5; letter-spacing:.1em; }
.btn_about .name em { font-size:1.5em; font-weight:normal; }
.btn_about .btn2 { position:absolute; right:0; bottom:0; display:inline-block; min-width:200px; line-height:2.2; }

.btn_about.artist .summary .ttl { position:relative; overflow:hidden; margin:0 0 .5em; line-height:1.8; font-size:1.125em; font-weight:normal; letter-spacing:.1em; }
.btn_about.artist .summary .ttl span { position:relative; padding-right:1em; }
.btn_about.artist .summary .ttl span:before { content:""; position:absolute; top:0; bottom:0; left:100%; width:700px; height:1px; margin:auto 0; background:#888; }
.btn_about.artist .kokuho { display:inline-block; padding:0 .5em .15em; color:#fff; font-size:.9em; line-height:1.8; background:#b25050; }
.btn_about.artist .name em { margin-right:1em; }

.btn_about.fabric .img figure { border-radius:5px; }
.btn_about.fabric .name { margin-top:2em; }
.btn_about.fabric .name em { margin-right:.2em; }

.con_list + .btn_about.fabric { margin-top:75px; }

/*----- 会員ページ -----*/
#member #contents { margin-bottom: 5rem; }

/*----- 会社情報 -----*/
#company #pagettl { background-image:url(../img/company/pagettl_bg.jpg); }
#company #contents { background-image:url(../img/company/bg_profile.png); background-repeat:no-repeat; background-position:right top; }
#company .access .top_box .txt_box { width:36%; }
#company .access .top_box .img01_pc { width:32%; margin-left:5%; margin-right:3%; }
#company .access .top_box .img02_pc { width:24%; margin-top:90px; }
#company .access .top_box .img01_sp, #company .access .top_box .img02_sp { display:none; }
#company .access .name { font-size:20px; font-weight:500; }
#company .access .name .logo { width:139px; display:inline-block; margin-right:15px; }
#company .access .address { margin:20px 0; }
#company .access .circle_list li { line-height:2; }
#company .access .btn_map { margin-top:40px; }
#company .access .gmap { width:100%; margin:70px 0 150px; }

#company .btn_list { margin-top: 40px; }
#company .btn_list li + li { margin-left: 20px; }

/*----- 採用情報 -----*/
#recruit #pagettl { background-image:url(../img/recruit/pagettl_bg.jpg); }
#recruit #contents { background-image:url(../img/recruit/bg_recruit.png); background-repeat:no-repeat; background-position:right top; }

/*----- 販売会のお知らせ -----*/
#sales-event #pagettl { background-image:url(../img/sales-event/pagettl_bg.jpg); }
#sales-event .news_box { margin-bottom:100px; }
#sales-event .news_box p { padding:40px 0; border-bottom:1px solid #1f3331; }

/*----- お知らせ -----*/
#news #pagettl { background-image:url(../img/news/pagettl_bg.jpg?20190517); }

/*----- プライバシーポリシー -----*/
#policy #pagettl { background-image:url(../img/policy/pagettl_bg.jpg); }
#policy .conttl4 { margin:40px 0 10px; }

/*----- お問合わせ -----*/
#contact #pagettl { background-image:url(../img/contact/pagettl_bg.jpg); }
#contact .tbl { margin-bottom:30px; }
#contact .submit { margin-bottom:100px; }
#contact .submit2 { max-width:500px; margin:0 auto 100px; flex-direction:row-reverse; -webkit-flex-direction:row-reverse; }
#contact .txt_box { max-width:750px; width:100%; border:4px double #a0a0a0; margin:0 auto 20px; padding:20px 25px; }
#contact.thanks .txt1 { font-size:25px; margin-bottom:20px; line-height:1.8; text-align:center; }
#contact.thanks .txt_box { margin-bottom:100px; }
#contact .btn_line { display: block; margin: 40px auto; max-width: 350px; text-align: center; }

.box_process { padding:1em 1.5em; line-height:1.7; background:#f9f9f9; }

/*----- 特定商取引法 -----*/
.tbl_dl > div + div { margin-top: 1em; }
.tbl_dl dt { padding: 0 .5em; background: #e9ebeb; }
.tbl_dl dd { line-height: 1.8; margin-top: .5em; }

.tbl2 { margin-top: 1em; }
.tbl2 tr { border: 1px solid #a0a0a0; }
.tbl2 tr th { background: #e9ebeb; }
.tbl2 tr > td:nth-child(2) { border-left: 1px solid #a0a0a0; }
.tbl2 tr > td { width: 48%; padding: 0 1em; text-align: right; }

.tbl3 { width: 100%; margin: 0 auto; }
.tbl3 tr,.tbl3 th,.tbl3 td { border: 1px solid #a0a0a0; }
.tbl3 tr th { padding: 0 2%;background: #e9ebeb; }
.tbl3 tr > td { padding: 0 1.5%; text-align: right; line-height: 1.5;}
.border_box{width:33%; margin: 1em auto; padding:10px; border: 1px solid #a0a0a0; text-align: center; line-height:1.7; font-size: 15.5px;}
#postage .atten{width: 50%;margin: auto; text-align: center;}
#postage p.bold{font-size:1.1em; }

.furikomi { display: block; max-width: 350px; margin-top: 1em; padding: 1em; background: #e9ebeb; line-height: 1.8; }
.furikomi > p + p { margin-top: .5em; }
.furikomi .ttl { padding-bottom: .2em; margin-bottom: .5em; border-bottom: 1px solid #bcbcbc; }
.furikomi .s_ttl { margin-top: .5em; margin-bottom: 0; font-weight: normal; }
.furikomi .s_ttl::before { content: "●"; padding-right: .2em; }

#policy .credit_more { margin-top: 10px; }
#policy .credit_more a { text-decoration: underline; }
#policy #contents .tbl .btn2 { width: 260px;}

/*----- ご購入を希望されるお客様 -----*/
.flow { margin-top: 60px; }
#flow #contents { background-image:url(../img/recruit/bg_recruit.png); background-repeat:no-repeat; background-position:right top 220px; }
#flow .conttl4 { margin: 40px 0 10px; }
#flow #pagettl { background-image: url("../img/customer/pagettl_bg.jpg"); }
.flow_list { margin-top: 40px; counter-reset: num; }
.flow_list li { padding: 1.875em 0 1.875em 1.75em; border-left: 4px double #233b38; z-index: 1; position: relative; }
.flow_list li::before { content: ""; position: absolute; top: 0; left: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 60px 450px 0 0;
border-color: #eaeceb transparent transparent transparent;
	z-index: -1;
}
.flow_list li + li { margin-top: 20px; }
.flow_list li .ttl { padding-left: 65px; font-size: 1.563em; font-weight: normal; position: relative; }
.flow_list li .ttl::before { counter-increment: num; content: "0" counter(num); position: absolute; top: -30px; left: 0; color: #cacaca; font-size: 1.92em;
font-weight: normal; }
.flow_list li .btn2 { max-width: 260px; margin-top: 20px; }
.flow_list li .btn3 { max-width: 290px; }

.shitate { margin-top: 60px; padding: 60px 0; background: #f6f6f6; }
.shitate .conttl2 { font-size: 35px; }

.henpin_box { margin-top: 4em; padding: 2em 2.5em; background: #fff5f5; }
.henpin_box .ttl { font-size: 1.563em; font-weight: normal; }
.henpin_box .txt em { font-size: 1.2em; color: #c30000; }
.henpin_box .txt_link { font-size: 1.2em; text-decoration: underline; }


/* カート追加 */
.white-popup { width:auto; max-width:500px; margin:20px auto; padding:20px; background:#FFF; position:relative; }

.addCartBox .done { margin-bottom:10px; text-align:center; }
.addCartBox li { width:48%; }
.addCartBox li a { display:block; margin:0; text-align:center; }
.addCartBox .btn_cart_add::before { left:20%; }
.addCartBox li .btn_close { padding:.5em 2em; }

.btn_close { color:#1f3331; font-size:.88em; border:1px solid #dcdcdc; cursor:pointer; }

p.center>.btn_close{ padding: .2em; }

.btn_cart {
  -webkit-box-flex:1; flex:1; display:inline-block; width:100%; padding:5px 10px; text-align:center; color:#FFF; background-color:#1f3331;
}

.head_btn2 { margin-bottom:20px; }
.head_btn2 .btn2 a { padding:8px 5px 3px; font-size:.8em; line-height:1.6; }
.head_btn2 .btn2 a:after { display:none; }

@media screen and (min-width: 1001px) {
  #shopping.head_bg .shipping_msg {
    position:absolute; top:30px; left:50%; width:500px; margin-left:-535px; font-size:1.5em; }
  #shopping.head_bg .btn_shopping { z-index:999; top:80px; right:0; }

  #gnav li.btn_line { display: none; }

  .cat_list > li { width:15%; margin-left:2%; }
  .cat_list > li:nth-child(6n+1) { margin-left:0; }

  .con_list.item li { width:23.5%; margin-left:2%; }
  .con_list.item li:nth-child(4n+1) { margin-left:0; }
  .con_list.item li:nth-child(n+5) { margin-top:70px; }

  .con_list.fabric li:nth-child(3n+1) { margin-left:0; }
  .con_list.fabric li:nth-child(n+4) { margin-top:70px; }

  .con_list.artist li { width:20%; margin-left:6.5%; }
  .con_list.artist li:nth-child(4n+1) { margin-left:0; }
  .con_list.artist li:nth-child(n+5) { margin-top:70px; }
  .tbl3 tr > td{width: 8%;}
}

@media screen and (max-width: 1000px) (min-width: 801px) {
.con_list.artist li:nth-child(3n+1) { margin-left:0; }
.con_list.artist li:nth-child(n+4) { margin-top:60px; }
}

@media screen and (max-width: 1200px) {

  #pankuzu { margin-right:30px; }

  #about .hanbaikai .img01 { right:30px; }
  #about .hanbaikai .img02 { right:30px; }
  #about .comment .img01 { width:33%; right:30px; }

  .con_list li { width:31%; margin-left:3.5%; }
  .nav_chihou li { width:31%; }
  .nav_chihou li:not(:last-child) { margin-right:3.5%; }
  .nav_chihou li:nth-child(3n+3) { margin-right:0; }
  .nav_chihou li:nth-child(n+4) { margin-top:20px; }
}

@media screen and (max-width: 1100px) {
  #products .japan { height:auto; }
  #products .japan > figure { position:static; margin:0 auto; }
  #products .japan .jp2 { margin-bottom:50px; }
}

@media screen and (max-width: 1200px) and (min-width: 1001px) {

/*gnav段落ち対処*/
 header .nav_box { margin-top: -10px; }
 #gnav .gbtn {position: absolute; right: 20px; bottom: -5px;}
/*gnav段落ち対処*/

  #tsumugi .h_c .history { background-position:right -20vw top 0; }
  #tsumugi .h_c .charm { background-position:left -20vw top 0; }
}

@media screen and (max-width: 1000px) {
  header { padding:10px 0; background-size:1600px auto; background-position:-200px bottom; }
  header.shrink.open { padding:0; }
  header .inner_s { padding:0; }
  header .logo { margin-left:20px; }
  header.open { padding-top: 0; }
  .head_bg { background-size:1600px auto; background-position:-200px top; height:330px; }
  .nav_box { float:none; width:100%; }
  #nav-toggle { right:30px; }
  #gnav .nav { width:100%; margin-right:0; }
  #gnav .nav li:nth-child(n+2) { margin-left:0; }
	#gnav .nav li.btn_line { margin-left: auto; }
  #gnav .nav li a.active { border-bottom:1px solid #fff; }
  #pankuzu { display:none; }
  #pagettl .txt { font-size:40px; }
  .sidenav { width:25%; }

  header.open #nav-toggle { top: 3px; }

  /*shopping header*/
  #shopping.head_bg .pagettl2 { height:70px; }
  #shopping.head_bg .shipping_msg { position:fixed; top:15px; right:130px; font-size:1.2em;  z-index:9999; }
  #shopping.head_bg .btn_shopping { position:fixed; top:15px; right:80px; text-align:center; z-index:9999; }
  #shopping.head_bg .btn_shopping > a { width:44px; height:44px; padding-top:10px; }
  #shopping.head_bg .btn_shopping img { width:80%; vertical-align:top; }
  #shopping.head_bg .btn_shopping span { display:none; }



  #about .concept .flex .img_box { width:100%; }
  #about .concept .flex .img { width:58%; text-align:left; }
  #about .concept .flex .img2 { width:50%; text-align:right; margin:-210px 0 0 auto; }
  #about .concept .flex .txt { width:100%; margin-top:30px; }
  #about .original > div { padding:0; }
  #about .original .inner_s { padding-bottom:7%; }
  #about .original .kaitoumen .img1 { left:inherit; right:50px; top:0; bottom:inherit; width:35%; }

  #about .comment { margin-bottom:150px; }
  #about .hanbaikai { margin:230px 0 120px; }
  #about .hanbaikai .img01 { top:-230px; }
  #about .hanbaikai .img02 { display:none; }
  #about .hanbaikai .conbox { width:100%; }

  #tsumugi .about .somekata .name { font-size:22px; }
  #tsumugi .famous { margin-top:100px 0; }
  #tsumugi .h_c .conttl5 .jp { font-size:40px; }
  #tsumugi .h_c section { padding:0; background-size:auto; }
  #tsumugi .h_c .txt_box { width:100%; max-width:100%; }
  #tsumugi .h_c .conttl5 { left:50%; }
  #tsumugi .h_c .inner_s { padding-top:15%; padding-bottom:10%; background-color:rgba(255,255,255,0.8); }
  #tsumugi .h_c .charm { padding-top:0; }
  #tsumugi .h_c .charm .inner_s { padding-top:10%; }

  .cat_list > li { width:32%; margin-left:2%; }
  .cat_list > li:nth-child(3n+1) { margin-left:0; }
  .cat_list > li:nth-child(n+4) { margin-top:2%; }

  .con_list.item li:nth-child(3n+1) { margin-left:0; }
  .con_list.item li:nth-child(n+4) { margin-top:50px; }

  .con_list.fabric li:nth-child(n+4) { margin-top:50px; }

  .con_list.cat li:nth-child(n+4) { display:none; }

  .con_list li.bunkazai .img:before { right:10px; }
  #products .main { width:70%; }
  #products.detail .img_box { width:100%; }
  #products.detail .txt_box { width:100%; margin-top:20px; }

  .btn_about .name { font-size:1.1em; }

  #company .contact_box { margin-bottom:100px; }
  #company .access .top_box .txt_box { width:45%; }
  #company .access .top_box .img01_pc { width:30%; margin-left:3%; margin-right:2%; }
  #company .access .top_box .img02_pc { width:20%; }

  .border_box{width: 50%;}
}

@media screen and (max-width: 800px) {
  .sidenav .conttl5 .jp { font-size:15px; }
	#company .contact_box { margin: 0 15px; }
  .contact_box { width:auto; }
  .contact_box .txt3 { width:100%; }
  .contact_box .btn2 { width:250px; margin:10px auto 0; }

  #about .concept .flex .img2 { margin-top:-150px; }
  #about .comment .txt_box { width:100%;  padding-bottom:50px; }
  #about .comment .txt_box .conttl2 { font-size:25px; max-width:230px; }
  #about .comment .img01 { width:25%; right:30px; top:-150px; top:-17vw; }
  #about .original .kaitoumen .img1 { position:static; width:100%; margin-bottom:15px; }

  #tsumugi .famous .conttl5 { left:15%; }
  #tsumugi .famous .oshima { width:55%; }
  #tsumugi .famous .yuki { width:40%; }

  #products.detail .conttl4 { margin-bottom:1em; }
  #products.detail .artist_name, #products.detail .fabric_name  {
    position:static; margin-bottom:1em; }
  #products.detail .artist_name:before { content:"工房・作家名："; margin-right:.5em; }

  .btn_about a { padding:1em; }
  .btn_about .img { width:25%; margin-right:1.5em; }
  .btn_about .name { font-size:.85em; }
  .btn_about .btn2 { display:none; }

  .btn_about.artist .summary .ttl { margin-bottom:.2em; font-size:1em; }
  .btn_about.artist .kokuho { font-size:.8em; }
  .btn_about.artist .name em { margin-right:.5em; }

  .btn_about.fabric .name { font-size:.85em; }

  .con_list.fabric li:nth-child(3n+1) { margin-left:4%; }
  .con_list.fabric li { width:48%; margin-left:4%; }
  .con_list.fabric li:nth-child(2n+1) { margin-left:0; }
  .con_list.fabric li:nth-child(n+3) { margin-top:50px; }

  .con_list li .name { font-size:18px; }
  .con_list li .name .pref { padding:0 10px; display:block; line-height:1.8; margin-right:0; }

  .con_list.artist li { width:45%; margin-left:10%; }
  .con_list.artist li:nth-child(2n+1) { margin-left:0; }
  .con_list.artist li:nth-child(n+3) { margin-top:50px; }
  .con_list.artist li .name { margin-top:.5em; font-size:1em; }

  #company .access .top_box .txt_box { width:100%; }
  #company .access .top_box .img01_sp { display:inline-block; width:56%; margin:15px 2% 0 0; }
  #company .access .top_box .img02_sp { display:inline-block; width:40%; }
  #company .access .top_box .img01_pc, #company .access .top_box .img02_pc { display:none; }
  #company .access .gmap { margin:40px 0 100px; height:300px !important; }

  #contact .submit .btn1 { margin:0 auto; max-width:200px; }

  #company #contents, #recruit #contents { background-size:50%; }

}

@media screen and (max-width: 700px) {
  #products.detail .box>.favo { display:block; max-width:280px; }
}

@media screen and (max-width: 599px) {
  #products.detail .box>.favo { max-width:300px; }

  header { background-size:900px auto; background-position:left bottom; height:70px; }
  header .logo { width:100px; margin-top:0; }
  .head_bg { background-size:900px auto; background-position:left top; height:200px; margin-top:70px; padding-top:20px; }
  header.type_ec .logo { width:160px; }

  /*shopping header*/
  #shopping.head_bg .pagettl2 { height:50px; }
  #shopping.head_bg .shipping_msg { top:18px; right:123px; font-size:.9em; line-height:1.2; }
  #shopping.head_bg .shipping_msg .free { display:block; }
  #shopping.head_bg .btn_shopping { right:67px; }

  #contents.shopping { margin-top:35px; }
  .head_btn { margin-top:90px; margin-left:15px; }
  .head_btn .btn2 { max-width:300px; }
  .head_btn .btn2 a { padding:3px 3px 3px 0; }

  .f_mihon,.login_nav { margin-bottom:40px; }


  #nav-toggle { top:0; right:20px; }
  #pagettl .txt { font-size:28px; }
  .sidenav { width:100%; }
  .sidenav .category li { width:48%; }
  .sidenav .conttl5 { text-align:center; }
  .sidenav .conttl5 .en { top:-23px; left:36%; transform:rotate(-15deg) translateX(-50%); }

	.contactBox { margin: 50px auto 80px; }
  .contact_box { padding:15px 20px 20px; }
  .contact_box .conttl4 { margin-top:20px; }
  .contact_box .flex { padding:0; }

  .con_list.cat + .btn2 { margin-top:30px; }
  .con_list .sold_out { bottom:-13px; padding-top:1px; line-height:1.8; }

  #about .concept .flex { margin-top:30px; }
  #about .concept .flex .img2 { margin-top:-100px; }
  #about .original { margin-top:100px; }
  #about .original > div { max-height:none; }
  #about .original .inner_s { padding-top:20px; padding-bottom:0; }
  #about .original .name { font-size:25px; }
  #about .original .box { width:100%; margin-top:10px !important; }
  #about .original .lead { font-size:18px; margin-top:20px; margin-bottom:20px; }
  #about .original .img { margin-top:20px; }
  #about .original > div { background-image:none !important; }
  #about .original .kaitoumen { margin-top:30px; }
  #about .original .kaitoumen .name { margin-top:0; }
  #about .original .hanaito { margin:60px 0 0; }
  #about .original .hanaito .txt_box { text-align:left; }
  #about .comment { margin:100px 0 70px; }
  #about .comment .conttl2 { margin-bottom:30px; }
  #about .comment .txt_box .conttl2 { max-width:none; }
  #about .comment .img01 { display:none; }
  #about .hanbaikai { margin-top:200px; padding:50px 0 30px; }
  #about .hanbaikai .img01 { width:60%; top:-210px; }
  #about .hanbaikai .btn1 a { min-width:inherit; }

  #tsumugi .about .somekata .somemono,   #tsumugi .about .somekata .orimono { width:100%; }
  #tsumugi .about .somekata .somemono .img { padding-top:0; }
  #tsumugi .about .somekata .orimono { margin-top:20px; }
  #tsumugi .about .somekata .name { font-size:18px; }
  #tsumugi .famous { margin-top:70px; }
  #tsumugi .famous .conttl5 { left:50%; transform:translateX(-50%); margin-top:20px; }
  #tsumugi .famous .flex { margin-top:50px; }
  #tsumugi .famous .flex > div { margin-left:auto; margin-right:auto; }
  #tsumugi .famous .oshima { width:100%; }
  #tsumugi .famous .oshima .name { text-align:left; }
  #tsumugi .famous .yuki { width:100%; margin-top:20px; }
  #tsumugi .famous .yuki .img { max-height:250px; overflow:hidden; }
  #tsumugi .famous .yuki .txt { line-height:2; margin-bottom:30px; }
  #tsumugi .famous .yuki .txt br { display:none; }
  #tsumugi .famous .name { font-size:20px; line-height:2; }
  #tsumugi .h_c .conttl5 .jp { font-size:30px; }
  #tsumugi .h_c .conttl5 .en { font-size:14px; top:20px; left:-30px; }

  #tsumugi .h_c .history { background-position:0 top; }
  #tsumugi .h_c .charm { padding-top:0; background-position:80% top; }
  #tsumugi .h_c .charm .inner_s { padding-top:10%; }
  
  .bnr_ryukyu { padding:0 0 40px; }
  #products .map_area { display:none; }
  #products .nav_chihou li:not(:last-child) { margin-right:4%; }
  #products .nav_chihou li:nth-child(3n+3) { margin-right:4%; }
  #products .nav_chihou li { width:48%; margin-right:4%; }
  #products .nav_chihou li:nth-child(2n+2) { margin-right:0; }
  #products .nav_chihou li:nth-child(n+3) { margin-top:10px; }
  #products .nav_chihou li a { font-size:15px; }
  #products .main { width:100%; }
  #products.detail .txt_box { margin-top:10px; }
  #products.detail .txt_box .btn1 { max-width: 300px; }
  #products.detail .main { margin-bottom:50px; }
  #products.detail .txt_box .txt2 { margin-top:10px; }
  #products.detail .sidenav { -webkit-order:2; order:2; }
  #products.detail .detail_box { margin-bottom:30px; }
  .slide-item img { max-height:300px; }

  #products.detail .fabric_dtl .tbl th,
  #products.detail .fabric_dtl .tbl td {
    display:table-cell;
  }
  #products.detail .fabric_dtl .tbl th { width:45%; }

  #products .detail_box .sold_out em { font-size:1.2em; }
  .con_list.item li .name { min-height:38px; }

  .sidenav .fold::after {
    content:"▼"; position:absolute; top:7px; right:5px; font-size:.8em; color:#1f3331;
  }
  .con_list.item li { font-size:14px; }
  .con_list.item li .code { margin-top:.5em; }
  .con_list li .artist { font-size:.85em; }

  .btn_about { margin-bottom:1em; }

  .tabNav { margin-bottom:30px; }
  .tabNav li { margin-right:.3em; }
  .tabNav li a { min-width:0; padding-left:1em; padding-right:1em; }

  #company .contact_box { margin-bottom:50px; }
  #company .access .gmap { margin-bottom:50px; height:200px !important; }
  #company #contents, #recruit #contents { background:none; }
  #recruit .tbl { margin-bottom:50px; }

	#company .btn_list li + li { margin-left: 0; margin-top: 20px; }

  #contact .tbl { margin-bottom:0; }
  #contact .submit2 { max-width:200px; }
  #contact .submit2 .btn1:first-child { margin-bottom:10px; }
  #contact input.m { width:100% !important; }
  #contact.thanks .txt1 { font-size:18px; }
  #contact.thanks .txt_box { margin-bottom:50px; }


	.tbl_dl { margin-top: .5em; }

	.tbl2 { width: 100%; }
	.tbl2 th,
	.tbl2 td { width: auto; display: table-cell; }
	.tbl2 tr > td { padding: 0 .5em 0 0; font-size: .9em; }

  .tbl3 { width: 660px; }
  .tbl3 th,
  .tbl3 td { width: auto; display: table-cell; }
  .tbl3 tr > td { width: 9%; padding: 0 .4em; font-size: .9em; }
  .scrollWrap { width: 100%; overflow-x: scroll; -webkit-overflow-scrolling: touch;}
  .border_box{width: 100%;}
  #postage th.left { width: 33%;}
  #postage .atten{width: 100%;}
  #postage p.bold{font-size:1em; }

	/* ご購入をご希望の方へ */
	#flow #contents { background-image: none; }
	.flow_list li::before { border-width: 50px 250px 0 0; }
	.flow_list li .ttl { padding-left: 45px; font-size: 1.1em; }
	.flow_list li .ttl::before { top: -18px; }
	.flow_list li p { margin-top: 10px; }

	.shitate { margin-top: 50px; padding: 30px 0; }
	.shitate .conttl2 { font-size: 20px; }

	.henpin_box { width: auto; margin: 4em 15px; padding: 2em; }
	.henpin_box .ttl { line-height: 1.3; }
	.henpin_box .txt { margin-top: 20px; }


}

@media screen and (max-width: 400px) {
  .head_bg { height:160px; }
  #contact.thanks .txt1 { text-align:left; }
  #about .hanbaikai .img01 { top:-180px; }
}

@media screen and (max-width: 350px) {
  #shopping.head_bg .shipping_msg { font-size:.8em; right:118px; }
  .sidenav ul li { width:100%; }
  .sidenav ul li:nth-child(2n+2) { margin-left:0; }
  .con_list.item li:nth-child(3n+1) { margin-left:0; }
  .con_list.item li { width:100%; margin-left:0; }
  .con_list.item li:nth-child(2n+1) { margin-left:0; }
  .con_list.item li:nth-child(n+2) { margin-top:30px !important; }
  .con_list.item li .name { font-size:15px; }
  .btn_about.artist .name em { display:block; }
  .btn_about.fabric .name { margin-top:1em; }
}