@charset "UTF-8";
/* module
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td, th {
  vertical-align: middle;
}

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

a:focus {
  outline: none;
}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
  display: block;
}

audio, canvas, video {
  display: inline-block;
}

img {
  border: 0;
  -ms-interpolation-mode: bicubic;
}

hr {
  display: block;
  margin: 0;
  border: none;
  border-top: 1px solid;
}

address {
  font-style: normal;
}

@font-face {
  font-family: 'icomoon_new';
  src: url("../fonts/icomoon.eot?jbh01z");
  src: url("../fonts/icomoon.eot?jbh01z#iefix") format("embedded-opentype"), url("../fonts/icomoon.ttf?jbh01z") format("truetype"), url("../fonts/icomoon.woff?jbh01z") format("woff"), url("../fonts/icomoon.svg?jbh01z#icomoon") format("svg");
  font-display: block;
}

[class^="new_icon-"]:before, [class*=" new_icon-"]:before {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon_new' !important;
  speak: none;
  font-weight: normal !important;
  font-style: normal !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.new_icon-search:before {
  content: "\e90b";
}

.new_icon-arrow:before {
  content: "\e900";
}

.new_icon-mail:before {
  content: "\e901";
}

.new_icon-build:before {
  content: "\e902";
}

.new_icon-walk:before {
  content: "\e903";
}

.new_icon-group:before {
  content: "\e904";
}

.new_icon-home:before {
  content: "\e905";
}

.new_icon-tag:before {
  content: "\e906";
}

.new_icon-pin:before {
  content: "\e907";
}

.new_icon-refresh:before {
  content: "\e908";
}

.new_icon-store:before {
  content: "\e909";
}

.new_icon-train:before {
  content: "\e90a";
}

.new_icon-magnifying-glass:before {
  content: "\e90c";
}

/* layout
-------------------------------------------------------------- */
/* setting
-------------------------------------------------------------- */
* {
  box-sizing: border-box;
}

.invisible {
  visibility: hidden;
}

html, body {
  height: 100%;
}

html {
  font-size: 62.5%;
}

body {
  line-height: 1.5;
  background: #fcfaf1;
  color: #3d332a;
  font-size: 16px;
  font-feature-settings: "pkna";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: 'Noto Sans JP','游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic','ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-overflow-scrolling: touch;
}

h1, h2, h3, h4, h5, h6 {
  word-break: break-all;
  font-family: 'Noto Sans JP','游ゴシック体', YuGothic, '游ゴシック', 'Yu Gothic','ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  font-weight: bold;
}

a {
  color: #3d332a;
  cursor: pointer;
  transition: all 0.3s ease;
  text-decoration: none;
}

a img {
  display: block;
}

a:hover img {
  opacity: .8;
}

b, strong {
  font-weight: bold;
}

img {
  display: inline-block;
  transition: all 0.3s ease;
}

::placeholder {
  /* Others */
  color: #797070;
}

/* layout
-------------------------------------------------------------- */
body {
  min-width: 1000px;
  margin: 0 auto;
}

#container {
  position: relative;
  width: 100%;
  min-height: 100%;
  height: auto !important;
  height: 100%;
  background: url("../images/ptn_wrapper.png");
}

.inner {
  margin: 0 auto;
  width: 980px;
  position: relative;
}

.inner .wrap_white,
.inner .slider_box {
  min-width: inherit;
}

.column {
  display: flex;
  justify-content: space-between;
  margin-bottom: 70px;
  padding-top: 25px;
}

.column .side_contents {
  width: 230px;
}

.column .main_contents {
  width: 730px;
}

.column .main_contents .inner {
  width: auto;
}

.slider_box {
  padding: 18px 25px;
}

.slider_box .bukken_slider {
  padding: 0;
}

.osusume_box {
  min-width: inherit;
  padding: 8px;
}
.osusume_box .inner {
  padding: 25px;
  border: 1px solid #be9c6d;
}
.osusume_box .c-title {
  border-bottom: 1px solid #be9c6d;
}
.osusume_box ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: space-between;
  line-height: 1;
}
.osusume_box li {
  width: 33%;
  padding-left: 24px;
  position: relative;
  margin: 4px 0px;
}
.osusume_box .new_icon-tag:before {
  position: absolute;
  top: 12px;
  left: 6px;
}
.osusume_box li a {
  height: 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

/* background
-------------------------------*/
.wrap-white {
  background-color: #fff;
}

/* color
-------------------------------*/
.clr-orange {
  color: #ff6f00;
}

.clr-red {
  color: #b71c1c;
}

/* brd
-------------------------------*/
.brd {
  border: 1px solid #d1d1d1;
}

/* font
-------------------------------*/
.en {
  font-family: 'Noto Serif JP',"游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}

/* title
-------------------------------*/
.c-header {
  display: flex;
  align-items: center;
  padding: 14px 20px;
  background: url("../images/ttl_bg.png");
}

.c-header .title {
  padding-left: 8px;
  line-height: 1.1;
  border-left: 6px solid #fff;
  color: #fff;
  font-size: 20px;
  font-weight: normal;
}

.c-header span {
  margin-left: 13px;
  color: #be9c6d;
  font-size: 12px;
}

.c-title {
  position: relative;
  display: flex;
  align-items: center;
  padding-bottom: 12px;
  margin-bottom: 15px;
  border-bottom: 1px solid #3d332a;
}

.c-title .title {
  font-size: 20px;
  font-weight: normal;
}

.c-title .btn {
  margin-left: auto;
}

.page-title {
  position: relative;
  padding: 3px;
  margin-bottom: 20px;
  background: url("../images/ptn_check-darkGreen.png");
}

.page-title .title {
  padding: 8px 15px;
  border: 1px solid #be9c6d;
  color: #fff;
  font-size: 24px;
  font-weight: normal;
}

.page-title .btn {
  margin-left: auto;
}

/* table
-------------------------------------------------------------- */
table {
  width: 100%;
  border-top: 1px solid #e9e9e9;
}

table th, table td {
  border-bottom: 1px solid #e9e9e9;
}

table th {
  padding: 10px 8px;
  background: #fafafa;
  font-size: 12px;
  text-align: left;
  vertical-align: middle;
}

table td {
  padding: 10px;
  background: #fff;
  font-size: 14px;
}

/* Header
-------------------------------------------------------------- */
#site_header .inner {
  display: flex;
  align-items: center;
}

#site_header a {
  text-decoration: none;
}

.topbar {
  padding: 5px 0;
  background: #1d3431;
}

.topbar .inner {
  justify-content: space-between;
}

.topbar_desc {
  color: #bdbdbd;
  font-size: 12px;
  font-weight: normal;
}

.topbar_box {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.topbar_box .btn-gold {
  justify-content: space-between;
  width: 110px;
  height: 32px;
  margin-right: 4px;
  padding: 4px;
  font-size: 12px;
  font-weight: normal;
}

.topbar_box .btn-gold .btn_text {
  margin-left: 5px;
}

.topbar_box .btn-gold .count {
  display: block;
  min-width: 32px;
  height: 21px;
  line-height: 20px;
  background: #fff;
  border-radius: 6px;
  color: #ff6f00;
  font-size: 16px;
  text-align: center;
}

.topbar_box .btn-gold .count-zero {
  color: #3d332a;
}

.topbar_box .search_box {
  margin-left: 4px;
}

.header {
  position: relative;
  z-index: 20;
  background: #244440;
  color: #fff;
}

.header .inner {
  padding: 8px 0;
}

.header_data {
  line-height: 1.2;
  padding: 8px 12px;
  margin-left: 13px;
  background: #1d3431;
  border-radius: 5px;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
}

.header_data dl {
  display: flex;
  align-items: center;
}

.header_data dt {
  width: 70px;
}

.header_data dd {
  width: 55%;
  text-align: right;
}

.header_data b {
  margin-right: 3px;
  color: #ff6f00;
  font-size: 16px;
}

.header_tel {
  margin-left: auto;
}

.header_tel .tel_no {
  margin-left: 3px;
  line-height: 1.1;
  font-size: 24px;
  font-weight: bold;
}

.header_tel .tel_text {
  font-size: 12px;
}

.header .btn-red {
  width: 196px;
  height: 46px;
  margin-left: 10px;
}

/* navigation */
.header_navigation {
  margin-left: auto;
  background: #000;
}

.header_navigation .inner {
  justify-content: space-between;
}

.header_navigation_left, .header_navigation_right {
  display: flex;
  align-items: center;
}

.header_navigation_left li, .header_navigation_right li {
  position: relative;
}

.header_navigation .menu_item {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  color: #fff;
  font-weight: 500;
  font-feature-settings: "palt";
}

.header_navigation .menu_item:hover {
  background: #292929;
  color: #be9c6d;
}

.header_navigation .menu_item i {
  margin-right: 5px;
  font-weight: normal;
}

.header_navigation_left {
  padding: 6px 0;
}

.header_navigation_left .menu_item {
  min-width: 210px;
  height: 46px;
  margin-right: 5px;
  padding: 0 15px;
  border: 1px solid #353535;
  border-radius: 100px;
  font-size: 22px;
  font-weight: 500;
  font-feature-settings: "palt";
}

.header_navigation_left .menu_item i {
  color: #be9c6d;
  font-size: 24px;
}

.header_navigation_left .menu_item span {
  display: inline-block;
  margin-top: 8px;
  font-size: 16px;
}

.header_navigation_right {
  margin-left: auto;
}

.header_navigation_right .menu_item {
  height: 60px;
  padding: 0 10px;
  font-size: 16px;
}

.header_navigation_right .menu_item i {
  font-size: 20px;
}

.header_navigation_right .menu_item.navi_menu {
  position: relative;
}

.header_navigation_right .menu_item.navi_menu .menu_toggle {
  padding-right: 0;
  font-size: 14px;
}

.header_navigation_right .menu_item.navi_menu .menu_toggle i {
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  background: #e3d7c5;
  border-radius: 100%;
  margin-left: 3px;
  color: #3d332a;
  font-size: 10px;
  transform: rotate(90deg) scale(0.8);
}

.header_navigation .sub_menu {
  display: none;
  position: absolute;
  top: 60px;
  right: 0;
  min-width: 109px;
  background: #244440;
  z-index: 100;
}

.header_navigation .sub_menu li {
  border-top: 1px solid #3c635e;
  border-bottom: 1px solid #1d3431;
}

.header_navigation .sub_menu li:last-of-type {
  border-bottom: none;
}

.header_navigation .sub_menu li:first-of-type {
  border-top: none;
}

.header_navigation .sub_menu a {
  position: relative;
  display: block;
  padding: 6px;
  font-size: 14px;
  color: #fff;
  font-weight: normal;
  text-align: center;
}

.header_navigation .sub_menu a:hover {
  background: rgba(255, 255, 255, 0.1);
}

/* Footer
-------------------------------------------------------------- */
#site_footer .inner {
  padding: 19px 0;
}

.footer_description {
  line-height: 24px;
  background: #244440;
  color: #fff;
  font-size: 14px;
}

.footer_search {
  background: #000;
}

.footer_search dl {
  display: table;
  width: 100%;
}

.footer_search dl + dl {
  margin-top: 18px;
}

.footer_search dt, .footer_search dd {
  display: table-cell;
  vertical-align: top;
}

.footer_search dt {
  width: 19%;
  color: #fff;
  font-size: 16px;
}

.footer_search dt [class^="new_icon-"] {
  display: inline-block;
  margin-right: 10px;
  font-size: 17px;
}

.footer_search dd {
  width: 81%;
}

.footer_search ul {
  display: flex;
  flex-wrap: wrap;
}

.footer_search li {
  margin-right: 14px;
}

.footer_search a {
  color: #fff;
  font-size: 12px;
  text-decoration: none;
}

.footer_search a:hover {
  text-decoration: underline;
}

.footer_link {
  background: #000;
  border-top: 1px solid #424242;
}

.footer_link .inner {
  padding-top: 10px !important;
}

.footer_link ul {
  display: flex;
  flex-wrap: wrap;
  width: 50%;
}

.footer_link li {
  margin-right: 14px;
  margin-bottom: 8px;
}

.footer_link a {
  color: #fff;
  line-height: 22px;
  font-size: 14px;
  text-decoration: none;
  white-space: nowrap;
}

.footer_link a:hover {
  text-decoration: underline;
}

/* copyright
-------------------------------------------------------------- */
#copyright {
  padding: 25px 0;
  background: #fff;
  color: #757575;
  font-size: 12px;
}

/* side_contents
-------------------------------------------------------------- */
.side_contents > [class^="side_"] {
  margin-bottom: 12px;
}

.side_contents .side_title + .brd {
  background: #fff;
  border-color: #c1ba9a;
  border-top: none;
}

.side_title {
  padding: 8px;
  background: #3d332a;
}

.side_title .title {
  padding-left: 6px;
  line-height: 1.3;
  border-left: 6px solid #be9c6d;
  color: #fff;
  font-size: 14px;
}

/* キーワードで検索 */
.side_keyword {
  margin-top: 20px;
}

.side_keyword .side_search {
  padding: 10px 10px 15px;
  background: #f3f1e6;
}

.side_keyword .side_list li + li {
  border-top: 1px solid #eee;
}

.side_keyword .side_list li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 10px;
  font-size: 13px;
}

.side_keyword .side_list li a:hover {
  background: rgba(255, 255, 255, 0.5);
  color: #ff6f00;
}

.side_keyword .side_list li .new_icon-arrow {
  font-size: 10px;
}

/* おしらせ */
.side_topics li:nth-child(even) {
  background: #f5f5f5;
}

.side_topics li a {
  display: block;
  padding: 10px;
  font-size: 12px;
  line-height: 1.4;
}

.side_topics li a:hover {
  background: rgba(255, 255, 255, 0.5);
  color: #ff6f00;
}

.side_topics li time {
  font-weight: bold;
}

.side_topics li .badge_new {
  padding: 0 3px;
  margin-left: 8px;
  background: #b71c1c;
  color: #fff;
  font-size: 10px;
}

/* 現在選択中のエリア */
.choice_current {
  padding: 5px;
}

.choice_current_title {
  font-size: 12px;
  font-weight: bold;
}

.choice_current_box {
  font-size: 14px;
  margin: 6px 0;
  padding: 8px 10px;
  background: #fff;
  border-radius: 6px;
}

.choice_current .btn {
  padding: 0 5px;
  font-size: 13px;
}

.choice_current .btn i {
  margin-top: 2px;
  margin-right: 10px;
  font-size: 24px;
}

/* 検索条件 */
.side_choice_title {
  display: flex;
  align-items: center;
  padding: 6px 8px;
  background: #74b5af;
  color: #fff;
  font-size: 14px;
}

.side_choice_title:before {
  content: "●";
  margin-right: 3px;
  font-size: 11px;
}

.side_choice_title + .brd {
  padding: 4px;
  background: #efede2;
  border-color: #c1ba9a;
  border-top: none;
}

.side_choice .choice_set {
  margin-bottom: 4px;
  padding: 1px;
  background: #fff;
  border: 1px solid #d9d8b4;
}

.side_choice .choice_set dt {
  padding: 6px 8px;
  background: #f6f6f6;
  font-size: 13px;
  font-weight: bold;
}

.side_choice .choice_set dd {
  line-height: 1;
  padding: 8px 4px;
  font-size: 14px;
}

.side_choice input[type="radio"],
.side_choice input[type="checkbox"] {
  left: 5px;
}

.side_choice label {
  padding-left: 23px;
  font-size: 14px;
}

.side_choice_list li + li {
  margin-top: 1px;
}

.side_choice .select {
  padding: 5px 0 5px 5px;
  white-space: nowrap;
}

/* 検索結果 */
.side_total {
  padding: 10px;
  border: 2px solid #fff;
  background: #e6dec6;
}

.side_total .total_count {
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: normal;
  text-align: center;
}

.side_total .total_count b {
  line-height: 1;
  font-size: 22px;
}

.side_total .btn {
  justify-content: center;
  width: 100%;
  height: 42px;
  font-size: 16px;
}

.side_total .btn .new_icon-search {
  position: relative !important;
  left: inherit !important;
  top: inherit !important;
  transform: inherit !important;
  margin-right: 5px;
  font-size: 14px;
}

/* ボタンリスト */
.side_button li + li {
  margin-top: 7px;
}

.side_button .btn {
  height: 42px;
  font-size: 14px;
}

/* バナー */
.side_banner a {
  display: block;
  line-height: 1;
}

.side_banner a img {
  display: block;
}

.side_banner a:hover {
  opacity: .8;
}

.side_banner a + a {
  margin-top: 10px;
}

.side_banner a.bnr_brd {
  border: 5px solid #fff;
}

.side_banner a.bnr_brd img {
  display: block;
  width: 100%;
}

/* お問い合わせ店舗 */
.side_contact {
  position: relative;
  padding: 10px;
  background: url("../images/side_contact_bg.jpg");
}

.side_contact_title {
  line-height: 1.33;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
}

.side_contact_box {
  margin-top: 20px;
  margin-bottom: 6px;
  background: #f3f1e6;
  border-radius: 10px;
  overflow: hidden;
}

.side_contact_box .side_logo {
  padding: 10px 0;
  background: #fff;
}

.side_contact_box .side_logo img {
  display: block;
  margin: 0 auto;
}

.side_contact_box .btn-red {
  height: 36px;
  margin: 10px 10px 8px;
}

.side_contact_box .side_company {
  margin: 0 10px;
  font-size: 12px;
  font-weight: bold;
}

.side_contact_box .side_tel {
  margin: 0 10px 10px;
  line-height: 1.3;
}

.side_contact_box .side_tel .tel_no {
  font-size: 22px;
  font-weight: bold;
}

.side_contact_box .side_tel .tel_text {
  font-size: 12px;
}

.side_contact .side_button .btn {
  margin-top: 4px;
  font-size: 13px;
}

/* タブリスト */
.side_tab .tabs li a {
  height: 30px;
  font-size: 13px;
}

.side_tab.brd {
  border-color: #c1ba9a;
}

.side_tab_content {
  background: #fff;
}

/* ナビゲーション */
.side_navigation {
  border: 1px solid #bfb692;
  background-image: url("../images/side_navigation_bg.png");
}

.side_navigation_list {
  padding: 8px;
  border: 1px solid #eae8dc;
}

.side_navigation li {
  border: 1px solid #fff;
}

.side_navigation li + li {
  border-top: none;
}

.side_navigation a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 50px;
  padding-left: 13px;
  background: #fff;
  background-image: linear-gradient(#ffffff, #e7e4d3);
  font-weight: bold;
  text-decoration: none;
}

.side_navigation a:hover {
  color: #ae5828;
}

.side_navigation a:hover .new_icon-arrow {
  background: #ae5828;
}

.side_navigation a .new_icon-arrow {
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  height: 50px;
  width: 16px;
  background: #3d332a;
  color: #fff;
  margin-left: auto;
  font-size: 11px;
  transition: all 0.3s ease;
}

.side_navigation .on a {
  color: #ae5828;
}

.side_navigation .on a .new_icon-arrow {
  background: #ae5828;
}

/* lib */
/* badge
-------------------------------------------------------------- */
[class^="badge_"] {
  display: inline-block;
  min-width: 32px;
  height: 14px;
  line-height: 14px;
  margin-left: 5px;
  color: #fff;
  font-size: 10px;
  font-weight: bold;
  text-align: center;
  vertical-align: 1px;
}

.badge_new {
  background: #b71c1c;
}

.badge_update {
  background: #be9c6d;
}

/* breadcrumb
-------------------------------------------------------------- */
.breadcrumb {
  margin-bottom: 4rem;
  padding: 1.3rem 0;
  background: #244440;
}

.breadcrumb ol {
  display: flex;
  align-items: center;
}

.breadcrumb li {
  font-size: 1.2rem;
  line-height: 1;
  margin-right: .5rem;
  color: #fff;
  font-weight: bold;
}

.breadcrumb li i {
  margin-right: .5rem;
  display: inline-block;
  color: #fff;
}

.breadcrumb .new_icon-home {
  font-size: 1.6rem;
  vertical-align: -1px;
}

.breadcrumb .new_icon-arw {
  font-size: 1rem;
  transform: scale(0.8);
}

.breadcrumb a {
  display: inline-block;
  color: #fff;
  font-weight: normal;
  text-decoration: none;
}

.breadcrumb a:hover {
  text-decoration: underline;
}

/* button
-------------------------------------------------------------- */
.btn {
  position: relative;
  display: flex;
  align-items: center;
  line-height: 1;
  text-decoration: none;
  border-radius: 5px;
  cursor: pointer;
  font-weight: bold;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0.1);
  tap-highlight-color: rgba(255, 255, 255, 0.1);
  transition: all 0.3s ease;
}

.btn:hover {
  box-shadow: none;
  text-decoration: none;
  opacity: .8;
}

.btn [class*="new_icon-"]:not(.new_icon-refresh) {
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.btn .new_icon-arrow {
  right: 7px;
  font-size: 12px;
}

.btn .new_icon-mail {
  left: 10px;
  font-size: 24px;
}

.btn .new_icon-search {
  left: 10px;
  font-size: 19px;
}

/* 汎用ゴールド */
.btn-gold {
  height: 50px;
  border: 1px solid #936826;
  background: #be9c6d;
  background-image: linear-gradient(#be9c6d, #a18150);
  border-radius: 5px;
  color: #fff;
  font-size: 18px;
}

/* 汎用オレンジ */
.btn-orange {
  justify-content: center;
  height: 40px;
  padding-left: 5px;
  border: 1px solid #d7570d;
  background: #ee780f;
  background-image: linear-gradient(#ee780f, #e65808);
  border-radius: 7px;
  color: #fff;
  font-size: 18px;
}

/* 汎用白 */
.btn-wh {
  justify-content: flex-start;
  height: 36px;
  padding-right: 27px;
  padding-left: 12px;
  border: 1px solid #d1d1d1;
  box-shadow: inset 0 0 0 1px #fff;
  background: #fff;
  background-image: linear-gradient(#fff, #f3f3f3);
  border-radius: 5px;
  color: #4e4848;
  font-size: 13px;
  font-weight: normal;
}

/* 汎用赤 */
.btn-red {
  justify-content: center;
  padding: 0 10px;
  border: 1px solid #91250d;
  box-shadow: inset 0 0 0 1px #d04233;
  background: #bf382b;
  background-image: linear-gradient(#bf382b, #920e08);
  border-radius: 6px;
  color: #fff;
}

/* category
-------------------------------------------------------------- */
.category {
  display: flex;
  flex-wrap: wrap;
}

[class^="cat_"] {
  display: inline-block;
  line-height: 1;
  padding: 4px 5px;
  margin-right: 3px;
  margin-bottom: 3px;
  border-radius: 3px;
  color: #fff;
  font-size: 10px;
  font-weight: bold;
  text-align: center;
}

.cat_l {
  padding: 14px 0 18px;
}

.cat_l [class^="cat_"] {
  padding: 4px 5px;
  margin-bottom: 0px;
  color: #fff;
  font-size: 12px;
}

.cat_new {
  background: #b71c1c;
}

.cat_reikin {
  background: #be9c6d;
}

.cat_bathroom {
  background: #8d6e63;
}

.cat_pet {
  background: #a68664;
}

.cat_bunjo {
  background: #e48a8a;
}

.cat_autolock {
  background: #8481d1;
}

.cat_parcelbox {
  background: #8bc34a;
}

/* contact
-------------------------------------------------------------- */
.contact {
  padding: 8px;
  background: url("../images/ptn_wrapper_contact.png");
}

.contact .inner {
  padding: 15px;
  border: 1px solid #fff;
}

.contact_text {
  margin-bottom: 13px;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
}

.contact_box {
  display: flex;
  justify-content: space-between;
  padding: 16px 20px;
  background: #fff;
  border-radius: 10px;
}

.contact_box .btn-red {
  width: 310px;
  height: 60px;
  font-size: 20px;
}

.contact_tel .tel_head {
  margin-bottom: 5px;
  font-size: 14px;
}

.contact_tel .tel_head span {
  margin-left: 10px;
  font-size: 12px;
}

.contact_tel .tel_no {
  line-height: 1;
  font-size: 30px;
  font-weight: bold;
}

#pagetop {
  display: none;
  position: fixed;
  bottom: 90px;
  right: 10px;
  z-index: 9999;
}

.btn-pagetop {
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  background: #232323;
  border-radius: 50%;
  line-height: 1;
  cursor: pointer;
  transition: all 0.3s ease;
}

.btn-pagetop img {
  display: inline-block;
}

.btn-pagetop:hover {
  opacity: .8;
}

/* search_box */
.search_box {
  width: 210px;
  overflow: hidden;
  background: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 6px;
}

.search_box form {
  display: flex;
  align-items: center;
  width: 100%;
}

.search_box button {
  border: none;
  width: 30px;
  height: 30px;
  line-height: 1;
  padding: 0;
  background: none;
  color: #3d332a;
  font-size: 20px;
  text-align: center;
  outline: none;
}
.search_box button {
  cursor: pointer;
}

.search_box .search_word {
  width: calc(100% - 30px);
  height: 30px;
  padding: 0 10px;
  background: none;
  border: none;
  font-size: 12px;
  outline: none;
}

/* tag
-------------------------------------------------------------- */
.tag {
  display: inline-block;
  line-height: 1;
  padding: 4px 10px;
  margin-right: 4px;
  margin-bottom: 4px;
  background: #000;
  border: 1px solid #3a3a3a;
  border-radius: 20px;
  color: #fff;
  font-size: 12px;
  text-align: center;
}

.tag:hover {
  background: #292929;
  color: #be9c6d;
}

.tag i {
  margin-right: 5px;
  color: #be9c6d;
  font-size: 14px;
}

/* tab
-------------------------------------------------------------- */
.tabs_list {
  display: flex;
  flex-wrap: inherit;
  align-items: center;
}

.tabs li {
  width: 100%;
  text-align: center;
}

.tabs li + li {
  border-left: 1px solid #fff;
}

.tabs li a {
  position: relative;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  height: 50px;
  line-height: 1;
  background: url(../images/tab_off.png);
  color: #3d332a;
  font-weight: bold;
  text-decoration: none;
}

.tabs li a:hover {
  background: rgba(174, 88, 40, 0.8);
  color: #fff;
}

.tabs li a i {
  margin-right: 5px;
  font-size: 24px;
}

.tabs .tab_current a {
  background: #ae5828;
  color: #fff !important;
}

.tabs .tab_current a:hover {
  background: #ae5828;
}

.main_contents .tabs .tab_current a:before {
  content: "";
  position: absolute;
  bottom: -7px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 8px 0 8px;
  border-color: #ae5828 transparent transparent transparent;
  z-index: 10;
}

/* tab content 
-------------------------------------------------------------- */
.tab_content {
  display: none;
  background: #fff;
}

.tab_content .tab_desc {
  display: flex;
  justify-content: space-between;
  padding: 20px 10px;
}

.tab_content .tab_desc .subtext {
  width: calc(100% - 250px);
  padding: 0 10px;
  line-height: 1.4;
  color: #616161;
}

.tab_content .tab_desc .btn {
  width: 240px;
  font-weight: normal;
}

.tab_content .bukken_list {
  padding: 18px 25px 8px;
}

/* utility
-------------------------------------------------------------- */
/* font */
.bold {
  font-weight: bold;
}

/* text-align */
.center {
  text-align: center;
}

.right {
  text-align: right;
}

.left {
  text-align: left;
}

/* margin */
.mb-10 {
  margin-bottom: 10px;
}

.mb-15 {
  margin-bottom: 15px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mb-25 {
  margin-bottom: 25px;
}

.mb-30 {
  margin-bottom: 30px;
}

.mb-35 {
  margin-bottom: 35px;
}

.mb-40 {
  margin-bottom: 40px;
}

.mb-45 {
  margin-bottom: 45px;
}

.mb-50 {
  margin-bottom: 50px;
}

.mb-55 {
  margin-bottom: 55px;
}

.mb-60 {
  margin-bottom: 60px;
}

.mb-65 {
  margin-bottom: 65px;
}

.mb-70 {
  margin-bottom: 70px;
}

/* padding */
.pb-10 {
  padding-bottom: 10px;
}

.pb-20 {
  padding-bottom: 20px;
}

.pb-30 {
  padding-bottom: 30px;
}

.pb-40 {
  padding-bottom: 40px;
}

.pb-50 {
  padding-bottom: 50px;
}

.pa-5 {
  padding: 5px;
}

.pa-10 {
  padding: 10px;
}

.pa-15 {
  padding: 15px;
}

.pa-20 {
  padding: 20px;
}

/* parts */
.banner {
  position: relative;
  padding: 20px 0;
  background: url("../images/ptn_wrapper_bnr.png");
}

.banner .banner_list {
  display: flex;
}

.banner .banner_list li {
  margin-right: 17px;
}

.banner .banner_list li img {
  width: 100%;
  height: auto;
}

/* recommend
-------------------------------------------------------------- */
.recommend_title {
  position: relative;
  margin-bottom: 30px;
  text-align: center;
}

.recommend_title:before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  display: block;
  width: 100%;
  height: 5px;
  border-top: 1px solid #2b1909;
  border-bottom: 1px solid #2b1909;
  z-index: 1;
}

.recommend_title .title {
  position: relative;
  display: inline-block;
  padding: 0 30px;
  line-height: 1;
  background: url("../images/ptn_wrapper.png");
  font-size: 22px;
  font-weight: normal;
  z-index: 2;
}

.recommend_list {
  display: flex;
  flex-wrap: wrap;
}

.recommend_list li {
  width: 175px;
  margin-right: 10px;
  margin-bottom: 10px;
}

.recommend_list li:nth-of-type(4n) {
  margin-right: 0;
}

.recommend_list li:nth-of-type(1) {
  animation-delay: 0.1s;
}

.recommend_list li:nth-of-type(2) {
  animation-delay: 0.15s;
}

.recommend_list li:nth-of-type(3) {
  animation-delay: 0.2s;
}

.recommend_list li:nth-of-type(4) {
  animation-delay: 0.25s;
}

.recommend_list li:nth-of-type(5) {
  animation-delay: 0.3s;
}

.recommend_list li:nth-of-type(6) {
  animation-delay: 0.35s;
}

.recommend_list li:nth-of-type(7) {
  animation-delay: 0.4s;
}

.recommend_list li:nth-of-type(8) {
  animation-delay: 0.45s;
}

.recommend_list a {
  display: block;
}

.recommend_list a:hover img {
  opacity: .7;
}

.recommend_item {
  position: relative;
  background: #000;
  border-radius: 16px;
  overflow: hidden;
}

.recommend_item img {
  opacity: .5;
  display: block;
}

.recommend_text {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
  color: #fff;
  font-weight: bold;
  text-align: center;
  z-index: 2;
}

.label {
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  background: #212121;
  line-height: 1;
  font-size: 12px;
  text-align: center;
}

.label span {
  display: block;
  padding: 2px 3px 3px;
  color: #fff;
}

.label_new .date {
  background: #b71c1c;
}

.label_update .date {
  background: #be9c6d;
}

.bukken_result {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 24px;
  line-height: 1;
  background: #f6f6f6;
  font-size: 14px;
}

.bukken_result .data .clr-orange {
  font-size: 24px;
}

.bukken_slider {
  padding: 9px 20px 16px;
}

.bukken_slider .slick-next {
  right: -34px;
}

.bukken_slider .slick-prev {
  left: -34px;
}

.bukken_list li {
  position: relative;
  background: #fbfaf5;
  border: 1px solid #d9d8b4;
  transition: all 0.3s ease;
}

.bukken_list li:hover {
  opacity: .8;
}

.bukken_list a {
  display: block;
  text-decoration: none;
}

.bukken_list img {
  display: block;
  width: 100%;
}

.bukken_list .category {
  padding: 0 5px 8px;
}

.bukken_item {
  position: relative;
  background: #f6f6f6;
}

.bukken_item .label {
  position: absolute;
  right: 1px;
  top: 1px;
  z-index: 10;
}

.bukken_pht {
  border: 1px solid #fff;
}

.bukken_name {
  line-height: 1;
  padding: 8px;
  background: #e6dec6;
  font-size: 14px;
  font-weight: bold;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bukken_text {
  padding: 5px 10px 8px;
  line-height: 16px;
  font-size: 12px;
}

.list_horizon {
  display: flex;
  flex-wrap: wrap;
  position: relative;
}

.list_vertical li + li {
  margin-top: 3px;
}

.side_contents .bukken_list {
  padding: 4px;
}

.side_contents .bukken_list li {
  width: 100%;
  margin-right: 0;
}

.side_contents .list_more {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 4px;
  padding: 8px 5px 8px 10px;
  background: #f6f6f6;
  font-size: 14px;
  font-weight: 500;
}

.side_contents .list_more:hover {
  color: #ff6f00;
}

.main_contents .bukken_list li {
  width: 220px;
  margin-right: 10px;
  margin-bottom: 10px;
}

.main_contents .tab_content .bukken_list li:nth-of-type(3n) {
  margin-right: 0;
}

/* animation
-------------------------------------------------------------- */
/*!
 * animate.css -https://daneden.github.io/animate.css/
 * Version - 3.7.2
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2019 Daniel Eden
 */
.visible {
  opacity: 0;
  transition: opacity 0.5s ease;
}

@keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translate3d(0, 0, 0);
  }
  40%,
  43% {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    transform: translate3d(0, -30px, 0);
  }
  70% {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    transform: translate3d(0, -15px, 0);
  }
  90% {
    transform: translate3d(0, -4px, 0);
  }
}

.bounce {
  animation-name: bounce;
  transform-origin: center bottom;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  20% {
    transform: scale3d(1.1, 1.1, 1.1);
  }
  40% {
    transform: scale3d(0.9, 0.9, 0.9);
  }
  60% {
    opacity: 1;
    transform: scale3d(1.03, 1.03, 1.03);
  }
  80% {
    transform: scale3d(0.97, 0.97, 0.97);
  }
  to {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  animation-duration: 0.75s;
  animation-name: bounceIn;
}

@keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  75% {
    transform: translate3d(0, 10px, 0);
  }
  90% {
    transform: translate3d(0, -5px, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}

.bounceInUp {
  animation-name: bounceInUp;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.fadeIn {
  animation-name: fadeIn;
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.fadeInDown {
  animation-name: fadeInDown;
}

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.fadeInDownBig {
  animation-name: fadeInDownBig;
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeft {
  animation-name: fadeInLeft;
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.fadeInRight {
  animation-name: fadeInRight;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUp {
  animation-name: fadeInUp;
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

.fadeOut {
  animation-name: fadeOut;
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }
}

.fadeOutDown {
  animation-name: fadeOutDown;
}

@keyframes flipInX {
  from {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  to {
    transform: perspective(400px);
  }
}

.flipInX {
  backface-visibility: visible !important;
  animation-name: flipInX;
}

@keyframes flipInY {
  from {
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }
  to {
    transform: perspective(400px);
  }
}

.flipInY {
  backface-visibility: visible !important;
  animation-name: flipInY;
}

@keyframes zoomIn {
  from {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}

.zoomIn {
  animation-name: zoomIn;
}

@keyframes slideInDown {
  from {
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}

.slideInDown {
  animation-name: slideInDown;
}

.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

.animated.infinite {
  animation-iteration-count: infinite;
}

.animated.delay-1s {
  animation-delay: 1s;
}

.animated.delay-2s {
  animation-delay: 2s;
}

.animated.delay-3s {
  animation-delay: 3s;
}

.animated.delay-4s {
  animation-delay: 4s;
}

.animated.delay-5s {
  animation-delay: 5s;
}

.animated.fast {
  animation-duration: 800ms;
}

.animated.faster {
  animation-duration: 500ms;
}

.animated.slow {
  animation-duration: 2s;
}

.animated.slower {
  animation-duration: 3s;
}