@charset "UTF-8";

* { box-sizing: border-box;}

html { height: 100%; font-size: 62.5%;}
html, body { height: 100%;}
body { margin: 0; padding: 0; font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif; font-weight: 500; font-size: 1.4rem; line-height: 1.8em; font-feature-settings: "palt"; text-align: justify; color: #333; background: #FFF;}
img { width: 100%; height: auto;}
p { margin: 0 0 15px; letter-spacing: 0.08em;}
a,a:hover { text-decoration: none;}
h2,h3,h4{ color: #333;}

.delivery_container{ width: 100%; max-width: 1200px; margin: 115px auto 0; display: grid;}
.delivery_contents{ margin: 0 0 100px;}
@media screen and (max-width: 991px) {
  .delivery_container{ max-width: 750px;}
}
@media screen and (max-width: 767px) {
  .delivery_container{ margin: 65px auto 0;}
}

.onlypc { display: block;}
.onlysmp { display: none;}
@media screen and (max-width: 767px) {
.onlypc { display: none;}
.onlysmp { display: block;}
}

.center{ text-align: center;}
a.alink{ color: #2563eb;}
a.alink:hover{ color: #2563eb; text-decoration: underline;}

/* pc版クリアランス */
.cl_mb100 { margin-bottom: 100px !important;}
.cl_mb70 { margin-bottom: 70px !important;}
.cl_mb50 { margin-bottom: 50px !important;}
.cl_mb40 { margin-bottom: 40px !important;}
.cl_mb30 { margin-bottom: 30px !important;}
.cl_mb20 { margin-bottom: 30px !important;}

@media screen and (max-width: 767px) {
  .cl_mb100 { margin-bottom: 70px !important;}
  .cl_mb70 { margin-bottom: 50px !important;}
  .cl_mb50 { margin-bottom: 40px !important;}
  .cl_mb40 { margin-bottom: 30px !important;}
  .cl_mb30 { margin-bottom: 20px !important;}
  .cl_mb20 { margin-bottom: 15px !important;}
}

/*ヘッダー*/
header{ border-top: 10px solid #AC0000; box-shadow: 0px 0px 10px rgb(0 0 0 / 40%); position: fixed; top: 0; left: 0; z-index: 9999; width: 100vw; background: #FFF;}
header .delivery_header{ display: flex; align-items: center; justify-content: space-between; width: 100%; max-width: 1200px; margin: 0 auto; padding: 10px 30px;}
header .header_logo{ display: contents;}
header .header_logo img{ width: 160px;}
header .header_top{ margin: 0 30px 0 auto; color: #333; display: flex; align-items: center;}
header .header_top:hover{ text-decoration: none; color: #AC0000;}
header .header_top p{ margin: 0; line-height: 1.1; padding: 0;}
header a.contact_btn { letter-spacing: 0.08em; background-color: #2d8c3c; border-radius: 4px; padding: 10px 15px; color: #FFF; display: flex; align-items: center;}
header a.contact_btn:link { color: #FFF; text-decoration: none;}
header a.contact_btn:hover { background: #3D984B;}
header i.contact { display: inline-block; width: 20px; height: 15px; background: url("../images/icon_contact.svg") no-repeat; margin-right: 5px;}
@media screen and (max-width: 991px) {
  header .header_logo img{ width: 140px;}
}
@media screen and (max-width: 767px) {
  header .delivery_header{ padding: 6px 15px;}
  header .header_top{ display: none;}
  header a.contact_btn{ flex-direction: column; font-size: x-small; font-weight: bold; line-height: 1; padding: 6px 10px 4px;}
  header i.contact{ margin: 0; width: 28px; height: 23px;}
}
@media screen and (max-width: 450px) {
  header .header_logo img{ width: 120px;}
}

/* ヘッダーメニュー */
nav.delivery_nav{ background: #CE9D00; border: 1px solid #E3AD00;}
nav .delivery_menu{ display: flex; width: 100%; max-width: 1200px; padding: 0 30px; margin: 0 auto;}
nav .delivery_menu li{ width: calc(100% / 5); border-right: 1px solid #E3AD00; min-width: fit-content; color: #FFF;}
nav .delivery_menu li:hover{ background: #B18700;}
nav .delivery_menu li a{ color: #FFF; text-decoration: none; display: flex; align-items: center; justify-content: center; padding: 0 10px; height: 38px; width: 100%;}
nav .delivery_menu li:hover a{ color: #FFF;}
nav .delivery_menu .menu_top{ display: none;}
nav .menu_tab{ padding: 0 10px;}
nav .menu_tab input{ display: none;}
@media screen and (min-width: 768px) {
  nav .delivery_menu li:first-of-type{ border-left: 1px solid #E3AD00}
  nav .menu_tab{ position: relative; display: flex; align-items: center; justify-content: center;}
  nav .menu_tab:hover{ color: #FFF;}
  nav .menu_tab ul{ display: none;}
  nav .menu_tab:hover ul{ display: block; position: absolute; width: 100%; left: 0; top: 39px; background: #B18700;}
  nav .menu_tab ul li{ width: 100%; border-bottom: 1px solid #E3AD00; border-left: 1px solid #E3AD00;}
  nav .menu_tab ul li:hover{ background: #937000;}
  nav .menu_tab:hover ul li a{ color: #FFF; line-height: 17px; padding: 10px 5px; display: table; text-align: center;}
}
@media screen and (max-width: 767px) {
  header{ display: flex;}
  nav.delivery_nav{ right: -250px; margin: 55px 0 0; position: absolute; transition: 0.5s; border: none; height: calc(100vh - 65px);}
  nav .delivery_menu{ flex-direction: column; padding: 0; width: 250px;}
  nav .delivery_menu li{ width: 100%; height: 50px; border: none; border-bottom: 1px solid #E3AD00; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}
  nav .delivery_menu li a{ color: #FFF;}
  nav .delivery_menu .menu_top{ display: flex; background: #AC0000;}
  nav .delivery_menu .menu_top:hover{ background: #4c4c4c;}
  nav .menu_tab{ height: 100%!important; width: 100%; padding: 0;}
  nav .menu_tab label { height: 50px; display: flex; align-items: center; justify-content: center;}
  nav .menu_tab ul { width: 100%;}
  nav .menu_tab ul li{ height: 0; width: 100%; overflow: hidden; border: none; background: #B18700;}
  nav .menu_tab:hover ul li:hover{ background: #937000;}
  nav .menu_tab ul li:hover{ background: #B18700;}

  #menu_bar01:checked ~ #links01 li{ height: 50px; border-top: 1px solid #E3AD00; transition: all 0.5s;}
}

/* トグルボタン（PC時非表示） */
#navToggle { display: none; width:34px; cursor:pointer; z-index: 14;}
#navToggle div {position:relative}
#navToggle span { display:block; position:absolute; width:32px; border-bottom:solid 3px #333; -webkit-transition: .35s ease-in-out; -moz-transition: .35s ease-in-out; transition: .35s ease-in-out}
#navToggle span:nth-child(1) {top:0}
#navToggle span:nth-child(2) {top:9px}
#navToggle span:nth-child(3) {top:18px}
#navToggle p { top: 37px; font-size: 10px; font-weight: bold; line-height: 1; padding: 0; position: absolute; right: 12px;}

@media screen and (max-width: 767px) {
  /* トグルボタン表示 */
  #navToggle { display: block; margin: 12px 15px 0 0;}
  .openNav #navToggle span:nth-child(1) { top: 11px; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); transform:rotate(-45deg)}
  .openNav #navToggle span:nth-child(2),
  .openNav #navToggle span:nth-child(3) { top: 11px; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); transform:rotate(45deg)}
  .openNav nav { -moz-transform: translateX(-250px); -webkit-transform: translateX(-250px); transform: translateX(-250px);}
}

/*サイドメニュー*/
.sidebar .side_ttl{ background-color: #AC0000; padding: 10px ; margin: 20px 0 10px; color: #FFF;}
.sidebar p { font-size: 1.4rem; margin: 0; position: relative; padding: 0;}
.sidebar dt { position: relative;}
.sidebar dt.sidebar_category::after { position: absolute; content:"\f107"; font-family: FontAwesome; top: 0; right: 10px; bottom: 0; margin: auto; display: inline-table; transition: .3s all;}
.sidebar dt.open.sidebar_category::after { transform: rotate(180deg);}
.sidebar dt p,
.sidebar dt a { background-color: #FFFAEA; padding: 10px 30px 10px 10%; margin-bottom: 5px; font-weight: bold; cursor: pointer; line-height: 1; min-height: 45px; display: flex; align-items: center; transition: .3s all;}
.sidebar dt a:hover { opacity: .5;}
.sidebar dd { margin: 5px 0 10px; display: none;}
.sidebar dd.open { display: block;}
.sidebar dd ul li:first-of-type { font-weight: bold;}
.sidebar dd ul li a{ display: block; padding: 10px 0 10px 10%; border-bottom: 1px solid #aaa; line-height: 1; transition: .3s all;}
.sidebar dd ul li:not(:first-of-type) a{ padding: 10px 0 10px 0; margin: 0 0 0 10%;}
.sidebar a:link { color: #333;}
.sidebar a:visited { color: #333;}
.sidebar a:hover { opacity: .5;}
.sidebar img { margin-bottom: 16px;}

/* ページ先頭に戻るボタン */
#btnTop { display: table; width: 40px; height: 40px; background-color: rgba(28,28,21,0.8); text-align: center; color: #FFF; position: fixed; bottom: -70px; right: 40px; z-index: 1; border-radius: 4px;
  -webkit-transition:1.0s ease-in-out; -moz-transition:1.0s ease-in-out; -o-transition:1.0s ease-in-out; transition:1.0s ease-in-out; }
#btnTop a:hover { text-decoration: none !important;}
#btnTop i { display: table-cell; vertical-align: middle; font-size: 14px; padding: 30px 13px 10px; position: relative; letter-spacing: 1.3px;}
#btnTop i::before { font-size: 30px; top: 2px; left: 0; right: 0; margin: auto; position: absolute;}
#btnTop.disp { bottom: 90px; z-index: 6; position: sticky; margin: 0 0 20px auto; right: 40px;}
@media screen and (max-width: 767px) {
  #btnTop { right: 20px;}
  #btnTop.disp { bottom: 90px; right: 20px;}
  #btnTop i{ font-size: 12px; padding: 22px 8px 5px;}
  #btnTop i::before { font-size: 24px; top: 0;}
}

/*フッター*/
footer { width: 100%;  padding: 40px 0; background: #AC0000; color: #FFF;}
footer h2 { font-size: 1.2rem; color: #FFF; margin: 0 0 20px;}
footer .foot_con{ display: flex; justify-content: space-between; align-items: flex-end;}
footer .foot_bnr{ display: flex; justify-content: space-between; align-items: flex-end;}
footer .foot_bnr a{ width: 30%; margin: 0 20px 0 0; max-width: 200px;}
footer p.copyright { font-size: 1.2rem; margin: 0; padding: 0; color: #FFF; text-align: right; /*white-space: nowrap;*/}
footer a:link { color: #FFF;}
footer a:visited { color: #FFF;}
footer a:hover { opacity: .7; text-decoration: underline;}
footer a:active { color: #FFF;}
@media screen and (max-width: 991px) {
  footer .foot_con { flex-direction: column; align-items: stretch;}
  footer .foot_bnr { justify-content: center; margin: 0 0 20px;}
  footer .foot_bnr a{ width: 170px; margin: 0 10px;}
}
@media screen and (max-width: 767px) {
  footer { padding: 20px 0 40px;}
}
@media screen and (max-width: 600px) {
  footer h2 { margin: 0 0 10px;}
  footer .foot_bnr { align-items: center; flex-direction: column; margin: 0 0 10px; }
  footer .foot_bnr a{ width: 100%; margin: 10px 0; max-width: fit-content;}
}

/* パンクズ */
ul.breadcrumb_list { margin: 10px 0; padding: 0; list-style-type: none; display: flex; flex-wrap: wrap;}
ul.breadcrumb_list li { display: inline-block; margin-right: 16px; position: relative;}
ul.breadcrumb_list li:after { content:"\f105"; font-family: FontAwesome; position: absolute; right: -14px;}
ul.breadcrumb_list li:last-child:after { content: "";}
ul.breadcrumb_list li a { color: #AC0000;}
ul.breadcrumb_list li a:hover { color: #333;}

/* 宅配買取キットボタン */
.delivery-kit{ background: transparent linear-gradient(169deg, #F4C448 0%, #D99A14 100%) 0% 0% no-repeat padding-box; box-shadow: 0px 3px 0px #A7760E; border-radius: 15px; margin: 20px auto 40px; display: flex; width: fit-content; align-items: center; padding: 20px 40px; position: relative;}
.delivery-kit:hover{ background: #F4C448;}
.delivery-kit::after{ position: absolute; content: '▶︎'; font-size: 20px; color: #FFF; filter: drop-shadow(0px 3px 6px #00000029); right: 20px; display: table; top: 5px; bottom: 0; margin: auto;}
.delivery-kit img{ width: 39px; margin: 0 10px 0 auto; filter: drop-shadow(0px 3px 6px #00000029);}
.delivery-kit p{ padding: 0; text-align: center; color: #FFF; text-shadow: 0px 3px 6px #00000029; font-size: 23px; margin: 0 15px 0 0; letter-spacing: 0.08em;}
.delivery-kit p span{ font-size: 30px; margin: 5px 0 0; display: inline-block;}
.delivery-kit .text_dec{font-weight: bold;}
.delivery-kit p br{ display: none;}
@media screen and (max-width: 991px) {
  .delivery-kit img { width: 33px;}
  .delivery-kit p{ font-size: 18px;}
  .delivery-kit p span{ font-size: 27px;}
}
@media screen and (max-width: 560px) {
  .delivery-kit{ padding: 10px 30px;}
  .delivery-kit::after{ font-size: 16px; top: 10px; right: 10px;}
  .delivery-kit p span{ font-size: 23px;}
  .delivery-kit p br{ display: block;}
}
@media screen and (max-width: 330px) {
  .delivery-kit { padding: 10px 20px 10px 30px;}
  .delivery-kit img { display: none;}
}

/* 宅配買取トップ */
.top_img{ margin: 0 0 40px;}

.delivery_bnr{ display: flex; justify-content: space-around; flex-wrap: wrap;}
.delivery_bnr img{ width: 48%!important; margin: 0 0 20px;}
@media screen and (max-width: 550px) {
  .delivery_bnr img{ max-width: 350px; width: 100%!important;}
}

.obi_ttl{ background: #FFF; padding: 15px 40px 13px; line-height: 1.2; display: table; margin: auto; position: relative; font-size: 20px; letter-spacing: 1px; font-weight: bold; text-align: center;}
.obi_ttl::after,
.obi_ttl::before{ position: absolute; content: ''; width: 100%; height: 3px; left: 0; background: transparent linear-gradient(90deg, #6B4718 0%, #ECCF46 50%, #6B4718 100%) 0% 0% no-repeat padding-box;}
.obi_ttl::after{ top: 0;}
.obi_ttl::before{ bottom: 0;}
.obi_ttl .br{ display: none;}
@media screen and (max-width: 767px) {
  .obi_ttl{ width: 90%; padding: 15px 10px 13px;}
}
@media screen and (max-width: 540px) {
  .obi_ttl .br{ display: block;}
}
@media screen and (max-width: 400px) {
  .obi_ttl{ width: 100%; font-size: 16px;}
}

.h2_ttl { line-height: 1.2; font-size: 20px; color: #FFF; padding: 12px 10px; letter-spacing: 0.1em; background-color: #AC0000; text-align: center;}
.h3_ttl { width: fit-content; min-width: 70%; background: #FFFAEA; padding: 10px 15px; font-size: 17px; font-weight: bold; border-bottom: 2px solid #F2C022; border-top: 2px solid #F2C022; margin-right: auto; margin-left: auto; text-align: center;}
.h4_ttl {
  font-size: 16px; font-weight: bold;
  padding: 5px 10px 5px 45px; position: relative;
}
.h4_ttl::before { position: absolute; content: '';
  width: 28px; height: 28px; top: 0; left: 0;
  background: #E3AD00;
}
.h4_ttl::after { position: absolute; content: '';
  width: 20px; height: 20px; top: 14px; left: 14px;
  background: #F8D874;
}

.btn-decoration{ display: flex; align-items: center; margin: 0 auto; background-color: #AC0000; text-align: center; box-shadow: 1px 1px 2px #aaa; border: 1px solid #AC0000; font-size: 18px; color: #AC0000; transition: .3s; max-width: 400px;}
.btn-decoration span{ background-color: #FFF; padding: 10px 20px; width: 100%;}
.btn-decoration i{ color: #FFF; width: 60px;}
.btn-decoration:hover{ opacity: .5;}
@media screen and (max-width: 767px) {
  .btn-decoration{ font-size: 14px;}
}

.point_contents{ display: flex; justify-content: space-between; flex-wrap: wrap; counter-reset: point 0;}
.point_box{ background: #FFFAEA; border: 2px solid #E3AD00; padding: 25px 10px 15px; position: relative; width: 31.5%; display: flex; align-items: center; justify-content: center;}
.point_box::after{ position: absolute; counter-increment: point 1; content: "point" counter(point); background: #E3AD00; border-radius: 15px; color: #FFF; padding: 0 30px; letter-spacing: 0.1em; font-weight: bold; top: -10px; right: 0; left: 0; margin: auto; display: table;}
.point_text{ text-align: center; font-weight: bold; margin: 0; line-height: 1.5;}
@media screen and (max-width: 991px) {
  .point_contents{ justify-content: space-around;}
  .point_box{ width: 48%; margin: 10px 0;}
}
@media screen and (max-width: 767px) {
  .point_box{ width: 90%; max-width: 330px;}
}

.flow_contents{ counter-reset: flow 0; max-width: 700px; margin: 0 auto;}
.flow_box{ display: flex; background: #FFFAEA; margin: 0 0 20px;}
.flow_box img{ width: 25%; object-fit: cover;}
.flow_text{ width: 75%; padding: 20px 20px 10px 30px;}
.flow_ttl{ position: relative; color: #AC0000; font-weight: bold; padding: 2px 0 0 90px; margin: 0 0 15px; font-size: 17px;}
.flow_ttl::before{ position: absolute; counter-increment: flow 1; content: "STEP" counter(flow); font-size: 14px; color: #FFF; top: 0; left: 0; background: #E3AD00; padding: 1px 5px 0; height: 26px; width: 71px; line-height: 1; display: flex; align-items: center; justify-content: flex-end; letter-spacing: 0.1em;}
.flow_ttl::after{ position: absolute; content: ''; border-left: 10px solid #E3AD00; border-top: 13px solid transparent; border-bottom: 13px solid transparent; top: 0; left: 70px;}
.flow_contents a:hover{text-decoration: underline;}
@media screen and (max-width: 550px) {
  .flow_contents{ display: flex; flex-wrap: wrap; justify-content: space-between;}
  .flow_box { flex-direction: column; width: 48%;}
  .flow_box img{ width: 100%; height: 100px;}
  .flow_text{width: 100%; padding: 20px 10px 0;}
  .flow_ttl{padding: 35px 0 5px 0; border-bottom: 1px solid #333;}
}
@media screen and (max-width: 450px) {
  .flow_contents{ flex-direction: column;}
  .flow_box {width: 100%;}
}

.results_list{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.results_item{ width: 22%;}
.results_name{ line-height: 1.2; letter-spacing: 0; text-align: left; font-size: 12px;}
@media screen and (max-width: 991px) {
  .results_item{ width: 31%;}
  .results_item:last-of-type{ margin: 0 auto 0 3.5%;}
}
@media screen and (max-width: 550px) {
  .results_item{ width: 48%;}
  .results_item:last-of-type{ margin: unset;}
}

.purchase_list{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.purchase_item{ width: 15%;}
.purchase_name{ font-size: 12px; letter-spacing: 0; text-align: center; white-space: nowrap; line-height: 1.2;}
.purchase_text{ background: #F7F1E8; padding: 20px 20px 5px;}
.purchase_ttl{ font-weight: bold; border-bottom: 2px solid #E3AD00; display: inline-block; padding: 0 3px;}
@media screen and (max-width: 991px) {
  .purchase_item{ width: 22%;}
  .purchase_item:last-of-type{ margin: 0 auto 0 4%;}
}
@media screen and (max-width: 450px) {
  .purchase_item{ width: 30%;}
  .purchase_item:last-of-type{ margin: unset;}
}

.no_purchase_ttl{ text-align: center; font-weight: bold; font-size: 18px;}
.no_purchase_item{ display: flex; justify-content: center;}
.no_purchase_img{ max-width: 220px; position: relative; margin: 0 1%;}
.no_purchase_img::after{ position: absolute; content: ''; background: url(../images/delivery/no_purchase_icon.png) no-repeat; background-size: contain; width: 28%; height: 28%; top: 0; left: 0;}

.scratch_list{ display: flex; flex-wrap: wrap; justify-content: space-between;}
.scratch_item{ width: 30%;}
.scratch_ttl{ color: #E3AD00; background: #FFFAEA; border-top: 2px solid #E3AD00; border-bottom: 2px solid #E3AD00; text-align: center; line-height: 1.2; padding: 10px 10px 8px; margin: 0 0 10px;}
@media screen and (max-width: 991px) {
  .scratch_item{ width: 47%;}
  .scratch_item:last-of-type{ margin: 0 auto;}
}
@media screen and (max-width: 450px) {
  .scratch_item{ width: 90%; max-width: 250px; margin: 0 auto;}
}

/* よくある質問 */
dl.faq_container dt { display: block; position: relative; margin: 0; padding: 15px 50px 15px 35px; cursor: pointer; font-size: 1.7rem; border-top: 1px solid #aaa; transition: .3s;}
dl.faq_container { border-bottom: 1px solid #aaa;}
dl.faq_container dt:hover,
dl.faq_container dt:active,
.content-entry.open dl.faq_container dt { background-color: #FFFAEA;}
dl.faq_container dt::before { content: "Q"; position: absolute; color: #AC0000; font-weight: bold; left: 15px;}
dl.faq_container dt::after { content: ""; position: absolute; right: 25px; top: 38%; transition: all 0.2s ease-in-out; display: block; width: 10px; height: 10px; border-top: solid 2px #333; border-right: solid 2px #333; -webkit-transform: rotate(135deg); transform: rotate(135deg);}
dl.faq_container dt.open::after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); top: 45%;}
dl.faq_container dd { display: none; background-color: #F7F1E8; margin: 10px 5px 20px; padding: 10px 20px 10px 40px; position: relative; text-align: left;}
dl.faq_container dd::before { position: absolute; content: "A"; font-weight: bold; font-size: 1.8rem; color: #4c4c4c; left: 20px;}
dl.faq_container dd a{ padding: 0 3px; text-decoration: underline; color: blue;}
dl.faq_container dd a:hover{ color: #337ab7;}

/* 下層ページ */
.ttl_area{ background: url(../images/delivery/ttl_bg.png) no-repeat; background-size: cover; background-position: center; width: calc(100% - 30px); height: 130px; margin: 0 15px; display: flex; align-items: center; justify-content: center;}
.ttl_area h1{ font-family: 'Heisei Mincho Std',serif; color: #FFF; text-shadow: 0px 3px 6px #0000006E; font-weight: bold; font-size: 35px; margin: 0;}
.ttl_area p{ font-family: 'Heisei Mincho Std',serif; color: #FFF; text-shadow: 0px 3px 6px #0000006E; font-weight: bold; font-size: 35px; margin: 0;}
@media screen and (max-width: 767px) {
  .ttl_area{ height: 90px;}
  .ttl_area h1{ font-size: 22px;}
  .ttl_area p{ font-size: 22px;}
}

/* 宅配買取の流れ */
.flow_page{ counter-reset: flow 0;}
.flow_box_p{ position: relative; display: flex; align-items: flex-start; background: #FFFAEA; margin: 0 0 60px;}
.flow_box_p:last-of-type{ margin: 0;}
.flow_box_p::after{ position: absolute; content: ''; border-top: 20px solid #F2C022; border-left: 20px solid transparent; border-right: 20px solid transparent; bottom: -40px; right: 0; left: 0; margin: auto; display: table;}
.flow_box_p:last-of-type::after{display: none;}
.flow_box_p img{ width: 30%; object-fit: cover; margin: 20px 10px;}
.flow_text_p{ width: 70%; padding: 20px; letter-spacing: 0; font-size: 13px;}
.flow_text_p p{ margin: 0; line-height: 23px;}
.flow_ttl_p{ position: relative; color: #AC0000; font-weight: bold; padding: 2px 0 0 40px; margin: 0 0 15px; font-size: 17px;}
.flow_box_p:nth-of-type(2n) .flow_ttl_p{ padding: 2px 0 0 0;}
.flow_ttl_p::before{ position: absolute; content: "STEP"; font-size: 14px; color: #FFF; top: -30px; left: -30px; background: #F2C022; height: 60px; width: 60px; border-radius: 50%; line-height: 1; display: flex; align-items: center; justify-content: center; letter-spacing: 0.1em; padding: 7px 0 25px;}
.flow_ttl_p::after{ position: absolute; counter-increment: flow 1; content: counter(flow); font-size: 25px; top: -30px; left: -30px; height: 60px; width: 60px; display: flex; align-items: center; justify-content: center; padding: 22px 0 0; color: #FFF;}
.flow_box_p:nth-of-type(2n) .flow_ttl_p::after,
.flow_box_p:nth-of-type(2n) .flow_ttl_p::before{ top: -30px; left: auto; right: -30px; margin: auto;}
.flow_page a:hover{text-decoration: underline;}
.folw_link{ display: flex; justify-content: center;}
.folw_link a{ color: #FFF; background: #937000; margin: 10px 5px; line-height: 32px; padding: 0 15px;}
.folw_link a:hover{ text-decoration: none; background: #B18700;}
@media screen and (max-width: 991px) {
  .flow_box_p { flex-direction: column; align-items: stretch;}
  .flow_box_p img{ width: auto; height: 200px; margin: 30px 30px 0; order: 1;}
  .flow_text_p{ width: 100%; order: 2; padding: 30px;}
  .flow_ttl_p{ border-bottom: 1px solid #333; padding: 2px 0 0 0;}
  .flow_ttl_p::before,
  .flow_ttl_p::after{ top: -270px; left: -40px; width: 80px; height: 80px;}
  .flow_box_p:nth-of-type(2n) .flow_ttl_p::after,
  .flow_box_p:nth-of-type(2n) .flow_ttl_p::before{ top: -270px; right: -40px;}
}
@media screen and (max-width: 767px) {
  .flow_box_p { flex-direction: row; align-items: flex-start;}
  .flow_box_p img{ width: 30%; height: auto; margin: 20px 10px; order: unset;}
  .flow_text_p{ padding: 30px; order: unset; padding: 20px;}
  .folw_link{ position: absolute; right: 0; left: 0; bottom: 10px;}
  .link_pb{ padding-bottom: 50px;}
  .flow_ttl_p,
  .flow_box_p:nth-of-type(2n) .flow_ttl_p{ padding: 15px 0 0 10px; margin: 0 0 20px 60px;}
  .flow_ttl_p::before,
  .flow_ttl_p::after,
  .flow_box_p:nth-of-type(2n) .flow_ttl_p::after,
  .flow_box_p:nth-of-type(2n) .flow_ttl_p::before{ top: -5px; left: -65px; right: auto; width: 60px; height: 60px;}
}
@media screen and (max-width: 560px) {
  .flow_box_p { flex-direction: column; align-items: stretch;}
  .flow_box_p img{ width: auto; height: 130px; margin: 10px 10px 0; order: 1;}
  .flow_text_p{ order: 2; padding: 10px;}
  .folw_link{ position: unset; flex-direction: column; align-items: center; margin: 10px 0 0;}
  .folw_link a{ margin: 10px 0 0;}
  .link_pb{ padding-bottom: 0;}
  .flow_ttl_p,
  .flow_box_p:nth-of-type(2n) .flow_ttl_p{ padding: 0; margin: 0 0 20px 0;}
  .flow_ttl_p::before,
  .flow_ttl_p::after,
  .flow_box_p:nth-of-type(2n) .flow_ttl_p::after,
  .flow_box_p:nth-of-type(2n) .flow_ttl_p::before{ top: -160px; left: -20px;}
}

/* サイズや梱包例 */
.check_list,
.check_list2{ background: #F7F1E8; display: flex; flex-wrap: wrap; padding: 0 20px 20px; width: fit-content; margin-left: auto; margin-right: auto;}
.check_list li,
.check_list2 li{ position: relative; font-size: 16px; margin: 20px 20px 0; padding: 0 0 0 20px; font-weight: bold;}
.check_list li::after{ position: absolute; content: '✔'; color: #AC0000; font-size: 18px; left: 0;}
.check_list2 li::after{ position: absolute; content: ''; width: 15px; height: 15px; background: #333; left: 0; top: 4px;}
@media screen and (max-width: 767px) {
  .check_list,
  .check_list2{padding: 0 15px 15px;}
  .check_list li,
  .check_list2 li{margin: 15px 15px 0;}
}

.packing_ex{ display: flex; align-items: flex-start; width: fit-content; margin: 0 auto 20px;}
.packing_ex img{ max-width: 360px; margin: 0 50px 0 0;}
.packing_ex_ttl{ position: relative; font-weight: bold; font-size: 20px; padding: 0 0 0 25px; margin: 0 0 10px;}
.packing_ex_ttl::after{ position: absolute; content: '◀︎'; color: #F2C022; left: 0;}
.packing_ex_list{ background: #FFF; border: 2px solid #F2C022; width: 250px; padding: 30px; box-sizing: border-box;}
.packing_ex_list li{ font-size: 16px; font-weight: bold; list-style: inside;}
@media screen and (max-width: 991px) {
  .packing_ex img{ width: 250px; margin: 0 20px 0 0;}
  .packing_ex_list{ width: 230px; padding: 20px 10px 20px 25px;}
}
@media screen and (max-width: 550px) {
  .packing_ex{ flex-direction: column; align-items: stretch;}
  .packing_ex img{ width: 100%; margin: 0 0 20px;}
  .packing_ex_ttl::after{ content: '▲';}
  .packing_ex_list{ width: 100%; padding: 20px 10px 20px 25px;}
}

.cardboard_packing{ counter-reset: pack 0;}
.cardboard_pk_flow{ display: flex; justify-content: space-between; align-items: center;}
.cardboard_pk_box{ width: 70%;}
.cardboard_pk_flow img{ width: 28%; height: 150px; object-fit: contain;}
.cardboard_pk_ttl{ position: relative; font-size: 18px; font-weight: bold; padding: 15px 20px 15px 70px; background: #F8D874; margin: 0; line-height: 21px;}
.cardboard_pk_ttl::after{ position: absolute; counter-increment: pack 1; content: counter(pack); background: #E3AD00; color: #FFF; font-size: 23px; font-weight: bold; display: flex; justify-content: center; align-items: center; width: 50px; height: 100%; top: 0; left: 0;}
.cardboard_pk_text{ background: #FFFAEA; padding: 30px 20px; border: 1px solid #F8D874; margin: 0;}
@media screen and (max-width: 991px) {
  .cardboard_pk_ttl{ padding: 13px 15px 12px 65px;}
  .cardboard_pk_text{ padding: 20px;}
}
@media screen and (max-width: 550px) {
  .cardboard_pk_flow{ flex-direction: column;}
  .cardboard_pk_box{ width: 100%; order: 2;}
  .cardboard_pk_flow img{ width: 100%; order: 1; margin: 0 0 20px;}
  .cardboard_pk_ttl{ padding: 13px 15px 12px 55px;}
  .cardboard_pk_ttl::after{ width: 40px;}
}

/* 必要なもの・注意点 */
.good_bad_ttl{ font-size: 16px; border-bottom: 1px solid #AC0000; padding: 0 10px 7px 20px; position: relative; color: #AC0000;}
.good_bad_ttl::before{ position: absolute; content: ''; width: 10px; height: 10px; background: #AC0000; transform: rotate(45deg); left: 5px; top: 6px;}
.good_bad_ex{ display: flex; justify-content: space-evenly; flex-wrap: wrap;}
.gb_area{ text-align: center; width: fit-content; display: flex; flex-direction: column; margin: 0 0 20px; align-items: center;}
.gb_area p{ margin: 0;}
.gb_area img{ width: 90%; max-width: 330px;}
@media screen and (max-width: 991px) {
  .gb_area{ width: 100%;}
}

.simple_list{ padding: 20px 30px 10px; background: #F7F1E8; margin-left: auto; margin-right: auto;}
.simple_list li{ margin: 0 0 10px; font-weight: bold;}

/* 私たちの特徴 */
.num_card_list{ counter-reset: num 0; padding: 0 50px 0 0; display: block; box-sizing: border-box;}
.num_card{ background: #FFF; border: 1px solid #E3AD00; padding: 20px; position: relative; width: 90%; margin: 0 auto 0 0; box-sizing: border-box;}
.num_card::before{ position: absolute; content: ''; width: 100%; height: 100%; background: #F7F1E8; top: 10px; left: 50px; z-index: -1;}
.num_card:nth-of-type(2n){ margin: 0 0 0 auto;}
.num_card_ttl{ font-weight: bold; font-size: 25px; padding: 5px 10px 5px 60px; position: relative; text-align: left;}
.num_card_ttl::before{ position: absolute; counter-increment: num 1; content: counter(num,decimal-leading-zero); font-weight: bold; font-size: 35px; letter-spacing: 0; color: #E3AD00; left: 0;}
.num_card_txt{ margin: 0 0 5px;}
@media screen and (max-width: 991px) {
  .num_card_list{ padding: 0 20px 0 0;}
  .num_card::before{ left: 20px;}
  .num_card_ttl{ font-size: 23px; padding: 5px 10px 5px 50px;}
  .num_card_ttl::before{ font-size: 32px;}
}
@media screen and (max-width: 767px) {
  .num_card_list{ padding: 0 10px 0 0;}
  .num_card{ padding: 10px; width: 100%;}
  .num_card::before{ left: 15px;}
  .num_card_ttl{ font-size: 18px; padding: 5px 10px 5px 45px; margin: 5px 0;}
  .num_card_ttl::before{ font-size: 27px;}
}
@media screen and (max-width: 450px) {
  .num_card_ttl{ padding: 25px 0 2px; text-align: center;}
  .num_card_ttl::before{ top: 0; right: 0; margin: auto;}
}

.vice_card{ background: #FFF; padding: 20px; border: 1px solid #aaa;}
.vice_card_ttl{ font-weight: bold; font-size: 16px; padding: 0 10px 5px 40px; margin: 0 0 10px; border-bottom: 1px solid #333; position: relative; letter-spacing: 0; line-height: 21px;}
.vice_card_ttl::before{ position: absolute; content: ''; background: url(../images/icon_bubble.svg) no-repeat; width: 26px; height: 22px; background-size: contain; left: 5px; top: -3px;}
.vice_card_content{ display: flex; align-items: flex-start;}
.vice_card_content img{ width: 23%; margin: 0 3% 0 0;}
.vice_card_txt span{ font-weight: bold; display: block;}
.vice_card_txt{ margin: 0;}
@media screen and (max-width: 767px) {
  .vice_card{ padding: 15px 10px;}
}
@media screen and (max-width: 450px) {
  .vice_card_content{ align-items: center; flex-direction: column;}
  .vice_card_content img{ margin: 0 0 5px; min-width: 100px;}
  .vice_card_txt span{ text-align: center; margin: 0 0 5px;}
}

/* お問い合わせフォーム */
table.form { width: 100%; margin: 0; border-collapse: collapse;}
table.form tbody tr { display: flex; margin: 15px auto 0; align-items: flex-start;}
.confirm table.form tbody tr { align-items: normal; margin: 0;}
table.form tbody th { width: 30%; text-align: center; vertical-align: middle;}
table.form tbody td { width: 65%; vertical-align: middle; line-height: 17px;}
table.form tbody th span { vertical-align: baseline;}
table.form tbody td span { font-size: 12px;}
.contact_h3 { margin-top: -26px;}
.contact_title_text p{ line-height: 1.0; width: auto; margin: 0 auto;}
.title_text_confirm p { width: 500px;}
.mw_wp_form_confirm .input_show { display: none;}
.mw_wp_form_input .confirm_show { display: none;}
.mw_wp_form_confirm th { border-bottom: #d6d6d6 1px solid; border-right: #d6d6d6 1px solid; padding: 10px;}
.mw_wp_form_confirm table.form { width: 80%; margin: 0 auto; overflow-wrap: anywhere;}
.mw_wp_form_confirm table.form tbody { border-top: #d6d6d6 1px solid; border-right: #d6d6d6 1px solid; border-left: #d6d6d6 1px solid;}
.mw_wp_form_confirm table.form tbody td { border-bottom: #d6d6d6 1px solid; line-height: 25px; padding: 10px; width: 70%;}
.mw_wp_form_confirm table.form tbody tr { display: flex; align-items: stretch; margin: 0 auto;}
.contact_submitbtn { background-color: #AC0000; border: none; color: #FFF; border-radius: .25em; padding: 10px; width: 100%; max-width: 350px; font-size: 20px;}
.contact_back { padding: 10px 20px; font-size: 18px; border: #5f5f5f 1px solid; margin-bottom: 4px; border-radius: .25em;}
.backbtn_left { font-size: 16px; margin-bottom: 4px;}
.privacy_checkbox { text-align: center;}
.privacy_checkbox a { font-weight: 600; color: #AC0000;}
.privacy_checkbox .error { font-size: 16px;}
input[type="checkbox"] { transform: scale(1.5);margin-right: 6px;}
.thankspage { padding: 0 0 0 0; width: auto; margin: 0 auto;}
.thanks_tel { padding: 0 6px 0 0;}
.thanks_tel a { border-bottom: 1px solid;}
.st_ad { display: inline;}
.thankspage a.thanks_link { color: #2563EB; text-decoration: underline;}
.thankspage a.thanks_link:hover { color: #6eb2e8;}
@media screen and (max-width: 767px) {
  table.form { border: none;}
  table.form tbody tr { flex-direction: column; margin: 10px auto 0;}
  table.form tbody th { text-align: left; width: 100%;}
  table.form tbody td { width: 100%;}
  .form-control { height: 30px; font-size: 12px;}
  .contact_title_text p{ line-height: 1.2; width: auto; margin: auto; padding-bottom: 10px;}
  .st_ad { display: block;}
  .mw_wp_form_confirm th { border-bottom: none; border-right: none;}
  .mw_wp_form_confirm table.form tbody td { padding: 5px 10px 10px; font-size: 16px; width: 100%;}
  .mw_wp_form_confirm table.form tbody tr { flex-direction: column; margin: 0 auto;}
}
.wpcf7 .wpcf7-response-output { padding: 15px; margin-bottom: 20px; border: 1px solid transparent; border-radius: 4px;}
.wpcf7 .wpcf7-validation-errors { color: #00a6ac; background-color: #94dde0; border-color: #00a6ac;}
.wpcf7 .wpcf7-mail-sent-ok { color: #31708f; background-color: #94dde0; border-color: #00a6ac;}
.req { font-size: 12px; font-weight: normal; margin-left: 5px; vertical-align: text-top; background: #AC0000;}
.wpcf7 input.input_r { height: 34px; padding: 6px 12px; font-size: 1.4rem; border: 1px solid #ccc; border-radius: 4px;}
.input_r:focus { border: 1px solid #6eb2e8; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);}
.wpcf7 input[type="confirm"] { padding: 10px 20px; margin: 40px auto 0 auto; background: #00a6ac; color: #FFF; border-radius: 4px; border: none !important; cursor: pointer;}
.wpcf7 input[type="submit"] { padding: 10px 20px; margin: 40px auto 0 auto; background: #00a6ac; color: #FFF; border-radius: 4px; border: none !important; cursor: pointer;}
.wpcf7 input.back { padding: 10px 20px; margin: 40px auto 0 auto; background: #aaa; color: #FFF; border-radius: 4px; border: none !important; cursor: pointer;}
.wpcf7 label { white-space: nowrap;}