/*--------------------------------------------------------------------------
汎用
--------------------------------------------------------------------------*/
main {display: block;}

/*clearfix*/
.cf::after {content: ""; display: block; clear: both;}

/*テーブルスクロール*/
.scroll-table {overflow: auto; white-space: nowrap;}
.scroll-table::-webkit-scrollbar {width: 5px; height: 5px;}
.scroll-table::-webkit-scrollbar-track {background: #f0f0f0;}
.scroll-table::-webkit-scrollbar-thumb {background: #e52100;}

/*--------------------------
背景がイラスト時の背景
--------------------------*/
.back-illust {position: relative;}
.back-illust:before {content: ""; position: absolute; bottom: 0; left: 0; width: 100%;}
.back-illust > .inner {background: #fff; box-sizing: border-box;}

/*--------------------------
背景がグレー時の背景
--------------------------*/
.back-gray {background: #f5f5f5;}

/*--------------------------
汎用見出し(固定ページ最上位向け)
--------------------------*/
.g-h {color: #424242; font-weight: 700; line-height: 1.5; text-align: center; border-bottom: 3px solid #e72100;}

/*--------------------------
汎用見出し(よくある質問・お役立ち情報のTOP)
--------------------------*/
.g-h2 {color: #424242; font-weight: 700; line-height: 1.25; border-left-color: #e42100; border-left-style: solid;}

/*--------------------------
パンくず
--------------------------*/
#breadcrumbs {padding: 8px 0; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; white-space: nowrap;}
#breadcrumbs ul {overflow-x: auto;}
#breadcrumbs ul li {display: inline-block; font-size: .8rem; padding-right: 1em;}
#breadcrumbs ul li a {display: inline-block;}

/*--------------------------
ページャー
--------------------------*/
#pagination ul {display: flex; justify-content: center; align-items: center;}
#pagination span,
#pagination a {display: inline-flex; justify-content: center; align-items: center; width: 16px; height: 16px; font-size: .875rem; line-height: 1; margin: 0 10px; padding: 12px; border: 1px solid #919191; opacity: 1;}
#pagination a {color: #919191; background: #fff;}
#pagination .current,
#pagination a:hover {color: #4cb3f1; border-color: #4cb3f1; text-decoration: none;}

/*--------------------------
ページ内スクロール
--------------------------*/
#scroll {position: fixed; background: #e72100; border: 2px solid #fff; border-radius: 50%; z-index: 100; transition: .3s ease; z-index: 999;}
#scroll:before,
#scroll:after {position: absolute; top: 50%; display: block; content: ""; width: 17px; height: 2px; background: #fff;}
#scroll:before {left: calc(50% - 6.5px); transform: translate(-50%,-50%) rotate(-30deg);}
#scroll:after {left: calc(50% + 6.5px); transform: translate(-50%,-50%) rotate(30deg);}
#scroll.active {transform: translate(0,0);}

/*--------------------------
ブログへのリンク
--------------------------*/
.blog-link {margin-top: auto;}
.blog-link a {display: block; border: 1px solid #c7c7c7;}
.blog-link a img {width: 100% auto;}

/*--------------------------
オーバーレイ
--------------------------*/
#overlay {position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0,0,0, .5); visibility: hidden; opacity: 0; transition: .3s ease;}
#overlay.open {visibility: visible; opacity: 1;}
#overlay.navi {z-index: 1000;}
#overlay.tel {z-index: 2000;}

/*--------------------------
車両リスト&リボン
--------------------------*/
.h-ribbon img {position: relative; margin: 0 auto; height: auto;}

.car-list .entry * {font-weight: 700;}
.car-list .entry a:hover {text-decoration: none;}
.car-list .entry .img {display: flex; justify-content: center; align-items: flex-end;}
.car-list .entry .img img {width: 100%; height: auto;}
.car-list .entry h3,
.car-list .entry p strong {color: #e72100;}
.car-list .entry .more {justify-content: center; align-items: center; max-width: 265px; padding: 14px 0;background: #e52100; border: 2px solid  #e52100;}
.car-list .entry .more span {color: #fff; font-weight: 700; line-height: 1; margin-right: 5px;}
.car-list .entry .more img,
.car-list .entry .more svg {width: 16px; height: 16px;}
.car-list .entry .more svg .st0 {fill: #fff;}
.car-list .entry .more:hover {background: #fff;}
.car-list .entry .more:hover span {color: #e72100;}
.car-list .entry .more:hover svg .st0 {fill: #e72100;}

/*--------------------------------------------------------------------------
サイドバー
--------------------------------------------------------------------------*/
#sidebar {display: flex; flex-direction: column;}
#sidebar > div {position: relative!important; padding: 50px 25px;}

#sidebar article {display: block; margin-bottom: 40px;}
#sidebar article:last-child {margin-bottom: 0;}
#sidebar h2 {color: #666; font-size: 1.25rem; font-weight: 700; margin-bottom: 10px;}

/*おすすめ*/
#sidebar .recommend-list ul {flex-wrap: wrap;}
#sidebar .recommend-list ul li {width: 46%; margin: 0 4% 20px 0;}
#sidebar .recommend-list ul li:nth-child(2n) {margin-right: 0;}
#sidebar .recommend-list ul li .entry {justify-content: flex-start; align-items: flex-start;}
#sidebar .recommend-list ul li .entry .img {display: block; position: relative; width: 100%; max-height: 140px; min-height: 140px; margin-bottom: 8px; overflow: hidden; z-index: 1;}
#sidebar .recommend-list ul li .entry .img img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50%; font-family: 'object-fit: cover; object-position: 50%;'; z-index: 2;}
#sidebar .recommend-list ul li .entry .img:hover {opacity: 1;}
#sidebar .recommend-list ul li .entry .img:hover > img {transform: scale(1.1);}
#sidebar .recommend-list ul li .entry .txt h3 {font-size: .9rem; font-weight: 700; margin: 8px 0 4px;}
#sidebar .recommend-list ul li .entry .txt a.cat,
#sidebar .recommend-list ul li .entry .txt a.area {font-size: .8rem; margin-right: 8px;}
#sidebar .recommend-list ul li .entry .txt a.cat {margin-bottom: 4px;}

@media all and (-ms-high-contrast:none) {
	#sidebar .recommend-list ul li .entry .img:hover {opacity: .7;}
	#sidebar .recommend-list ul li .entry .img:hover > img {transform: scale(1);}
}

/*カテゴリーリスト*/
#sidebar .category-list div a {display: block; padding: 12px 16px; border-top: 1px solid #ccc;}
#sidebar .category-list div a:last-child {border-bottom: 1px solid #ccc;}
#sidebar .category-list div a i {margin-right: 7px; transition: .3s ease;}
#sidebar .category-list div a:hover i {margin: 0 7px;}

/*ランキング*/
#sidebar .lanking ul li {padding: 10px 3px; border-bottom: 1px solid #ccc;}
#sidebar .lanking ul li:last-child {border-bottom: none;}
#sidebar .lanking ul li .entry {justify-content: flex-start; align-items: flex-start;}
#sidebar .lanking ul li .entry .img {display: block; position: relative; max-width: 100px; min-width: 100px; max-height: 100px; min-height: 100px; margin-right: 12px; overflow: hidden; z-index: 1;}
#sidebar .lanking ul li .entry .img img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50%; font-family: 'object-fit: cover; object-position: 50%;'; z-index: 2;}
#sidebar .lanking ul li .entry .img .count {display: flex; justify-content: center; align-items: center; font-size: .8rem; position: absolute; top: 0; left: 0; width: 21px; height: 21px; color: #fff; background: #000; z-index: 3;}
#sidebar .lanking ul li .entry .img:hover {opacity: 1;}
#sidebar .lanking ul li .entry .img:hover > img {transform: scale(1.1);}
#sidebar .lanking ul li .entry .txt {width: calc(100% - 112px);}
#sidebar .lanking ul li .entry .txt h3 {font-size: .95rem; font-weight: 700; margin-bottom: 4px;}
#sidebar .lanking ul li .entry .txt a.cat,
#sidebar .lanking ul li .entry .txt a.area {font-size: .8rem; margin-right: 8px;}
#sidebar .lanking ul li .entry .txt a.cat {margin-bottom: 4px;}

@media all and (-ms-high-contrast:none) {
	#sidebar .lanking ul li .entry .img:hover {opacity: .7;}
	#sidebar .lanking ul li .entry .img:hover > img {transform: scale(1);}
}

/*バナー*/
#sidebar .banner > div {display: inline-block; max-width: 100%; line-height: 1; margin-bottom: 5px;}
#sidebar .banner > div:hover a img {opacity: .7;}

/*--------------------------------------------------------------------------
記事一覧
--------------------------------------------------------------------------*/
.post-sec {margin: 0 0 120px;}

.post-list {flex-wrap: wrap;}
.post-list .entry {width: calc((100% - 25px) / 2); margin-bottom: 40px;}
.post-list .entry:nth-child(odd) {margin-right: 25px;}

.post-list .entry .img {display: block; position: relative; width: 100%; height: 200px; margin-bottom: 12px; box-shadow: 0 0 0 2px #ccc; border-radius: 10px; overflow: hidden; z-index: 1;}
.post-list .entry .img > img {width: 100%; height: 100%; object-fit: cover; object-position: 50%; font-family: 'object-fit: cover; object-position: 50%;'; opacity: 1; transition: .5s ease;}
.post-list .entry .img .filter {display: flex; justify-content: center; align-items: center; flex-direction: column; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, .5); opacity: 0; border-radius: 10px; transition: opacity .5s ease; z-index: 2;}
.post-list .entry .img .filter img {transform: scale(0);}
.post-list .entry .img .filter span {color: #fff; font-weight: 700; margin-top: 5px;}
.post-list .entry .img .entry-new {display: block; position: absolute; left: -29px; top: 10px; color: #fff; font-size: .8rem; font-weight: 700; line-height: 1; text-align: center; width: 100px; padding: 4px 0 3px; background: #f54; transform: rotate(-45deg); z-index: 1;}
.post-list .entry .img:hover {opacity: 1;}
.post-list .entry .img:hover > img {transform: scale(1.1);}
.post-list .entry .img:hover .filter {opacity: 1;}
.post-list .entry .img:hover .filter img {transform: scale(1);}

@media all and (-ms-high-contrast:none) {.post-list .entry .img:hover > img {transform: scale(1);}}

.post-list .entry span.period {display: inline-block; color: #666; font-size: .9rem; margin: 3px 0 2px;}
.post-list .entry span.period i {margin-right: 5px;}
.post-list .entry p.content {font-size: .85rem; margin: 2px 0;}
.post-list .entry p.catch {font-size: .9rem; margin: 2px 0;}

.post-list .entry .state {align-items: center; flex-wrap: wrap; margin: 12px 0 0;}

.post-list .entry h3 {font-size: 1.1rem; font-weight: 700; margin: 4px 0;}


/*--------------------------------------------------------------------------
ヘッダー
--------------------------------------------------------------------------*/
header {width: 100%; transition: .2s ease; z-index: 1001;}
header .container {align-items: center;}

header .logo .st0 {fill: #e72100;}

header .user-info {flex-direction: column; align-items: center;}
header .user-info .img img {width: 100%; height: 100%; object-fit: cover; object-position: 50%; font-family: 'object-fit: cover; object-position: 50%;';}
header .user-info .txt {line-height: 1.5; text-align: center;}

/*--------------------------------------------------------------------------
フッター
--------------------------------------------------------------------------*/
footer {width: 100%; position: relative;}

footer {background: #e72100;}
footer * {color: #fff; font-size: .9rem;}
footer nav ul h3 {display: flex; align-items: center;}
footer nav > ul > li > a,
footer nav ul h3,
footer nav ul h3 * {font-size: .95rem;}
footer nav .icon {width: 1.15em; height: 1.15em; margin-right: .5em;}
footer nav ul .menu-2nd {padding-left: 1em;}
footer nav ul .menu-2nd li {position: relative; padding-left: 1em;}
footer nav ul .menu-2nd li:before {content: ""; position: absolute; left: 0; top: calc(50% - 1px); width: 6px; height: 1px; background: #fff;}
footer nav ul .lang ul li {padding-left: .825em;}
footer nav ul .lang ul li:before {display: none;}
footer nav ul li:last-child,
footer nav ul .menu-2nd:last-child {margin: 0;}

footer .copyright {font-size: .825rem; text-align: center; background: #b11700; padding: 10px 0;}

/*--------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
フロントページ
----------------------------------------------------------------------------
----------------------------------------------------------------------------
--------------------------------------------------------------------------*/
#front .top {background: #f0f0f0;}


#front .top .top-slider {overflow: hidden;}
#front .top .top-slider #top-slider {position: relative; margin: 0 auto; z-index: 1;}
#front .top .top-slider #top-slider .slide-arrow {position: absolute; top: 50%; transform: translate(0,-50%); transition: .4s ease; opacity: 0; z-index: 2;}
#front .top .top-slider #top-slider .slide-arrow.prev-arrow {left: -40px;}
#front .top .top-slider #top-slider .slide-arrow.next-arrow {right: -40px;}
#front .top .top-slider #top-slider .slide-arrow i {opacity: .5;}
#front .top .top-slider #top-slider:hover .slide-arrow {opacity: 1; cursor: pointer;}
#front .top .top-slider #top-slider:hover .slide-arrow.prev-arrow {transform: translate(50px,-50%);}
#front .top .top-slider #top-slider:hover .slide-arrow.next-arrow {transform: translate(-50px,-50%);}
#front .top .top-slider #top-slider .slick-list {overflow: hidden;}
#front .top .top-slider #top-slider .slick-track {display: flex; justify-content: space-between; width: 100%;}
#front .top .top-slider #top-slider li {overflow: hidden;}
#front .top .top-slider #top-slider li a {display: block; width: 100%; height: 100%;}
#front .top .top-slider #top-slider li img {display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50%; font-family: 'object-fit: cover; object-position: 50%;';}

#front .important-news {background: #f9f9f0;}
#front .important-news * {color: #e72100; line-height: 1.5;}
#front .important-news .container {align-items: flex-start; padding: 12px 15px; background: #fffde3; border: 1px solid #e72100; box-sizing: border-box;}
#front .important-news h2 {align-items: center;}
#front .important-news h2 img {width: 16px; height: 16px; margin-right: 6px;}
#front .important-news .important-news-list .entry {display: inline-block; margin-bottom: 6px;}
#front .important-news .important-news-list .entry:last-child {margin-bottom: 0;}
#front .important-news .important-news-list .entry h3 {display: inline!important; padding-right: 1.325em; background: url(../img/common/icon_arrow-circle.svg) 100% 0/1em 1em no-repeat;}

#front .recommended h2 {justify-content: center; align-items: flex-start; background: #222;}
#front .recommended h2 .mark,
#front .recommended h2 .reco .en-txt {height: auto;}
#front .recommended h2 .reco .jp-txt {display: block; color: #fff; line-height: 1; text-align: center;}

#front .about h2 span {font-weight: 700; line-height: 1;}
#front .about ul {justify-content: center; background: #ebf5f7;}
#front .about li .img {position: relative; width: 312px; height: 232px;}
#front .about li .img:before {content: ""; position: absolute; bottom: -74px; left: -100vw; width: 200vw; height: 185px; background: #d0e8da; z-index: 2;}
#front .about li .img img {position: absolute;}
#front .about li .img img.front {z-index: 3;}
#front .about li .img img.back {z-index: 1;}
#front .about li.flow .img .front {width: 283px; left: 5px; bottom: 22px;}
#front .about li.flow .img .back {width: 257px; left: 24px; top: -18px;}
#front .about li.feature .img .front {width: 280px; left: 14px; bottom: 14px;}
#front .about li.feature .img .back {width: 298px; left: 4px; top: -20px;}
#front .about li.one-box .img .front {width: 311px; left: 6px; bottom: 14px;}
#front .about li.one-box .img .back {width: 256px; left: 30px; top: -13px;}
#front .about li .more {position: relative; justify-content: center; align-items: center; width: 276px; background: #e72100; margin: 0 auto; padding: 6px 0; border: 2px solid #e72100; border-radius: 25px; z-index: 3;}
#front .about li .more span {color: #fff; font-size: 1.125rem; font-weight: 700; line-height: 1;}
#front .about li .more img,
#front .about li .more svg {width: 18px; height: 18px; margin-left: 5px;}
#front .about li .more svg .st0 {fill: #fff;}
#front .about li .more:hover {background: #fff; text-decoration: none;}
#front .about li .more:hover span {color: #e72100;}
#front .about li .more:hover svg .st0 {fill: #e72100;}

#front .useful {background: #f9f6ef;}
#front .useful h2 {justify-content: center; align-items: center;}
#front .useful h2 span {font-weight: 700; line-height: 1;}
#front .useful .useful-list li h3 {color: #424242; font-weight: 700; line-height: 1.25; margin-top: 10px; padding-left: 6px; border-left: 4px solid #e72100;}

#front .posts h2 span {font-weight: 700; line-height: 1;}
#front .posts .posts-list > li a .state {align-items: flex-start;}
#front .posts .posts-list > li a .state time {font-size: .95rem; font-weight: 700;}
#front .posts .posts-list > li a .state .cat-list {flex-wrap: wrap; align-items: center; margin-right: -5px;}
#front .posts .posts-list > li a .state .cat-list .cat {color: #fff; line-height: 1;}
#front .posts .posts-list > li a h3 {margin-top: 5px;}
#front .posts .posts-list > li a:hover {text-decoration: none;}
#front .posts .more {align-items: center; margin-top: 16px;}
#front .posts .more span {font-size: .925rem; margin-right: 2px;}
#front .posts .more img,
#front .posts .more svg {width: 14px; height: 14px;}

#front .hakolist {background: #f9f6ef;}
#front .hakolist h2,
#front .hakolist h3 {justify-content: center; align-items: center;}
#front .hakolist .hakolist-video {width: 600px; max-width: 100%; margin: 0 auto;}
#front .hakolist .hakolist-video video {width: 100%; height: auto;}
#front .hakolist h2 .hakolist-logo {width: 340px; height: auto;}
#front .hakolist h3 .insta-logo {width: 160px; height: auto;}
#front .hakolist a.link-insta {width: 17em; display: block; margin: 0 auto; padding: 0.5em 0; border: 2px solid #000; border-radius: 2em; font-weight: 700; text-align: center;}
#front .hakolist a.link-insta:hover {color: #fff; text-decoration: none; background: #000;}
#front .hakolist .hakolist-gallery {flex-wrap: wrap;}
#front .hakolist .hakolist-gallery a {display: block;}
#front .hakolist .hakolist-gallery a .img {width: 100%; height: 100%;}
#front .hakolist .hakolist-gallery a .img img {width: 100%; height: 100%; object-fit: cover; object-position: 50%; font-family: "object-fit: cover; object-position: 50%;";}

/*--------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
テンプレ＆固定ページ
----------------------------------------------------------------------------
----------------------------------------------------------------------------
--------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
車種・料金プラン (page-carclass-list.php)
--------------------------------------------------------------------------*/
#car-list .headline h1 {border-bottom: none;}
#car-list .recommended {position: static; background: #fffa00;}

/*--------------------------------------------------------------------------
車両クラス・料金詳細 (page-carclass-detail.php)
--------------------------------------------------------------------------*/
#car-detail .headline {align-items: center;}
#car-detail .headline h2 {font-weight: 700; line-height: 1.25; border-left: 4px solid #e72100;}
#car-detail .headline .option {align-items: center;}
#car-detail .headline .option li {color: #fff; font-weight: 700; line-height: 1; background: #4cb3f2;}

#car-detail .detailed-info section h2 {font-weight: 700; line-height: 1.25; border-bottom: 1px solid #000;}

#car-detail .car-detail .capacity {align-items: baseline;}
#car-detail .car-detail .capacity p {color: #424242; font-size: 1.75rem;}
#car-detail .car-detail .capacity p span {color: inherit; font-size: 2.25rem; font-weight: 700; margin-right: .175em;}

#car-detail .car-exterior {display: flex; justify-content: center; align-items: center;}
#car-detail .car-exterior img {max-width: 100%;}

#car-detail .car-detail dl dt {background: #f0f0f0;}
#car-detail .car-detail dl dd {text-align: justify;}
#car-detail .car-detail dl.luggage {align-items: center; margin-top: -5px;}
#car-detail .car-detail dl.luggage dd span {align-items: center; letter-spacing: 4px; margin-right: 24px;}
#car-detail .car-detail dl.luggage dd span img {margin-right: 4px;}
#car-detail .car-detail dl.luggage dd .suit {width: 21px; height: auto;}
#car-detail .car-detail dl.luggage dd .boston {width: 28px; height: auto;}

#car-detail .car-interior img {max-width: 100%; height: auto;}

#car-detail .car-price .price-list {margin-bottom: 10px; border: 1px solid #000;}
#car-detail .car-price .price-list table {width: 100%;}
#car-detail .car-price .price-list thead {background: #e52100;}
#car-detail .car-price .price-list thead tr th {color: #fff;}
#car-detail .car-price .price-list tbody * {font-size: 1.05rem;}
#car-detail .car-price .price-list tbody tr:nth-child(even) {background: #f0f0f0;}
#car-detail .car-price .price-list tbody tr th {text-align: center;}
#car-detail .car-price .price-list tbody tr td {text-align: right;}
#car-detail .car-price .note li {font-size: .8rem; text-align: justify; margin-bottom: 4px;}
#car-detail .car-price .note li:before {position: relative; content: "※"; color: #e52100;}

#car-detail .feature p {text-align: justify;}
#car-detail .feature p:not(:last-child) {margin-bottom: 1.5rem;}

#car-detail .equipment .equip-list {flex-wrap: wrap; margin-top: 10px;}
#car-detail .equipment .equip-list li .icon {display: flex; justify-content: center; align-items: center; width: 70px; height: 70px; margin: 0 auto; background: linear-gradient(to right, #ff9f26 0%, #ff9f26 50%, #f19623 50%, #f19623 100%); border-radius: 10px;}
#car-detail .equipment .equip-list li .icon img {max-width: 75%; max-height: 75%;}
#car-detail .equipment .equip-list li span {display: block; line-height: 1.25; text-align: center; white-space: nowrap; padding: 8px 0 10px;}

#car-detail .booking-form {border: 1px solid #797979;}
#car-detail .booking-form h2 {justify-content: center; align-items: center;}
#car-detail .booking-form h2 span {color: #606060; font-size: 1.625rem; font-weight: 700; line-height: 1.25;}

#car-detail .booking-form #searchform {align-items: center;}
#car-detail .booking-form #searchform dl dt {display: block; font-size: 1.05rem; line-height: 1;}
#car-detail .booking-form #searchform .label-control {position: relative; display: block;}
#car-detail .booking-form #searchform .label-control.select:after {content: ''; position: absolute; top: calc(50% - 3px); right: 13px; border-style: solid; border-width: 6px 6px 0 6px; border-color: #797979 transparent transparent transparent;}
#car-detail .booking-form #searchform .label-control.date:after {content: ''; position: absolute; top: 0; right: 0; width: 32px; height: 30px; background: url("../img/common/spin-btn.png") center/18px 16px no-repeat #fff; border: 1px solid #bbb; border-radius: 0 4px 4px 0; z-index: 1;}
#car-detail .booking-form #searchform input[type="date"],
#car-detail .booking-form #searchform select {width: 100%; height: 32px; font-size: .875rem; background: #fff; border: 1px solid #bbb; padding: 4px 14px; border-radius: 4px; box-sizing: border-box;}
#car-detail .booking-form #searchform input[type="date"]::-webkit-clear-button,
#car-detail .booking-form #searchform input[type="date"]::-webkit-inner-spin-button,
#car-detail .booking-form #searchform input[type="date"]::-webkit-clear-button {display: none; -moz-appearance: none; -webkit-appearance: none; appearance: none;}
#car-detail .booking-form #searchform input[type="date"]::-webkit-calendar-picker-indicator {position: absolute; right: 0; top: 0; padding: 0; width: 32px; height: 30px; background: transparent; color: transparent; cursor: pointer; z-index: 2;}
#car-detail .booking-form #searchform .search-btn {display: block; color: #fff; font-size: 1.5rem; font-weight: 700; background: #e52100; margin: 0 auto; padding: 7px 0; border: 2px solid #bbb; border-radius: 4px; transition: .2s ease;}
#car-detail .booking-form #searchform .search-btn:hover {color: #e52100; background: #fff;}

/*--------------------------------------------------------------------------
店舗詳細情報 (page-shop-detail.php)
--------------------------------------------------------------------------*/
#shop-detail .main-photo img {width: 100%; object-fit: cover; object-position: 50%; font-family: "object-fit: cover; object-position: 50%;";}

#shop-detail h2 {align-items: center;}
#shop-detail h2 .desvg {height: auto;}
#shop-detail h2 .desvg .st0 {fill: #374149;}
#shop-detail h2 span {font-weight: 700; line-height: 1.25;}

#car-detail .car-exterior img {max-width: 100%; max-height: 250px;}

#shop-detail .shop-about dl {align-items: flex-start;}
#shop-detail .shop-about dl dt {color: #fff; text-align: center; width: 82px; background: #606060; margin-right: 14px; padding: 3px 6px;}
#shop-detail .shop-about .sns {align-items: center; flex-wrap: wrap;}
#shop-detail .shop-about .sns a {width: 40px; height: 40px; margin: 0 8px;}
#shop-detail .shop-about .sns a img {width: 100%; height: auto;}
#shop-detail .shop-about .sns a.review {width: auto; height: auto; align-items: center; background: #e72100; padding: 4px 12px; border: 2px solid #e72100; border-radius: 12px;}
#shop-detail .shop-about .sns a.review .desvg {width: 21px; height: auto; margin-right: 6px;}
#shop-detail .shop-about .sns a.review .desvg .st0 {fill: #fff;}
#shop-detail .shop-about .sns a.review span {color: #fff; font-weight: 700;}
#shop-detail .shop-about .sns a.review:hover {text-decoration: none; background: #fff;}
#shop-detail .shop-about .sns a.review:hover span {color: #e72100;}
#shop-detail .shop-about .sns a.review:hover .desvg .st0 {fill: #e72100;}
#shop-detail .shop-about .contact {justify-content: center; align-items: center; width: 100%; max-width: 328px; margin: 0 auto; padding: 6px; border: 1px solid #292930; box-sizing: border-box;}
#shop-detail .shop-about .contact .desvg {width: 22px; height: 25px;}
#shop-detail .shop-about .contact .desvg .st0 {fill: #292930;}
#shop-detail .shop-about .contact span {color: #292930; font-size: 1.05rem;}
#shop-detail .shop-about .contact:hover {text-decoration: none; border-color: #e52100; background: #e52100;}
#shop-detail .shop-about .contact:hover span {color: #fff;}
#shop-detail .shop-about .contact:hover .desvg .st0 {fill: #fff;}

#shop-detail .shop-comment {background: #ffe100; box-sizing: border-box;}
#shop-detail .shop-comment .txt {background: #fff;}
#shop-detail .shop-comment .txt p {text-align: justify;}
#shop-detail .shop-comment .txt p.delegate {text-align: right; margin-top: 1.5rem;}

#shop-detail .shop-map {position: relative; width: 100%; overflow: hidden;}
#shop-detail .shop-map iframe,
#shop-detail .shop-map object,
#shop-detail .shop-map embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

#shop-detail .car-check {justify-content: center; align-items: center; background: #ff2600;}
#shop-detail .car-check span {color: #fff; font-weight: 700; line-height: 1;}
#shop-detail .car-check .desvg .st0 {fill: #fff;}
#shop-detail .car-check:hover {text-decoration: none; background: #fff;}
#shop-detail .car-check:hover span {color: #ff2600;}
#shop-detail .car-check:hover .desvg .st0 {fill: #ff2600;}

#shop-detail .shop-transfer section .txt {word-wrap: break-word;}
#shop-detail .shop-transfer section .txt h3 {color: #e42100; font-weight: 700; margin-bottom: .9em;}
#shop-detail .shop-transfer section .txt p {text-align: justify;}
#shop-detail .shop-transfer section .txt p.red {color: #e42100;}
#shop-detail .shop-transfer section .txt p:last-child {margin-bottom: 0;}
#shop-detail .shop-transfer section .map {box-sizing: border-box;}
#shop-detail .shop-transfer section .map h3 {color: #fff; font-weight: 700; text-align: center; line-height: 1; background: #4cb3f1;}

/*--------------------------------------------------------------------------
よくあるご質問 (page-faq.php)
--------------------------------------------------------------------------*/
#faq .link-list li a {display: flex; justify-content: center; align-items: center; background: #fff; border: 1px solid #bababa;}
#faq .link-list li a span {background-image: url(../img/common/icon_faq-tag.png); background-position: left center; background-repeat: no-repeat; transition: .2s ease;}
#faq .link-list li a:hover {text-decoration: none;}
#faq .link-list li a.active,
#faq .link-list li a:hover {background: #e42100;}
#faq .link-list li a.active span,
#faq .link-list li a:hover span {color: #fff; background-image: url(../img/common/icon_faq-tag-active.png);}

#faq .faq-main .inner {background: #fff; border: 1px solid #bababa;}
#faq .faq-main .qanda {border: 1px solid #e42100;}
#faq .faq-main .qanda:last-child {margin-bottom: 0;}
#faq .faq-main .qanda .question {position: relative; color: #424242; font-weight: 700; display: block; cursor: pointer; box-sizing: border-box;}
#faq .faq-main .qanda .answer {position: relative; display: none; border-top: 1px solid #919191; box-sizing: border-box;}
#faq .faq-main .qanda .answer p {margin-bottom: 1rem;}
#faq .faq-main .qanda .answer a {color: #2ca9e1;}
#faq .faq-main .qanda .question:before,
#faq .faq-main .qanda .answer:before {position: absolute; display: flex; justify-content: center; align-items: center; color: #fff; font-weight: 700; line-height: 1; border-radius: 50%;}
#faq .faq-main .qanda .question:before {content: "Q"; background: #e42100;}
#faq .faq-main .qanda .answer:before {content: "A"; background: #797979;}
#faq .faq-main .qanda .question:after {content: ""; position: absolute; background-image: url(../img/common/icon_faq-arrow.svg); transition: .2s ease;}
#faq .faq-main .qanda .question.open:after {transform: rotate3d(1,0,0,-180deg);}

/*--------------------------------------------------------------------------
お役立ち情報 (page-useful.php)
--------------------------------------------------------------------------*/
#useful .two-col {border: 1px solid #bababa;}
#useful .two-col .main-col,
#useful .two-col .side-col {box-sizing: border-box;}
#useful .two-col .main-col {background: #fff;}
#useful .two-col .side-col {background: #fffce3;}

#useful .anchor-list {flex-wrap: wrap;}
#useful .anchor-list li a {color: #424242; font-weight: 700; line-height: 1.75;}

#useful .two-col .side-col h2 {align-items: center;}
#useful .two-col .side-col h2 span {font-weight: 700;}
#useful .two-col .side-col .useful-list li h3 {color: #424242; font-weight: 700; line-height: 1.25; margin-top: 10px; padding-left: 6px; border-left: 4px solid #e72100;}

/*--------------------------
初めてご利用の方へ (first.php)
--------------------------*/
#useful .first h2.step {position: relative; align-items: center; background: linear-gradient(-4.75deg, #cc1e00 50%, #e72100 50%);}
#useful .first h2.step:before {content: ""; position: absolute; left: calc(50% - 12px); bottom: -10px; border-style: solid; border-color: #cc1e00 transparent transparent transparent; border-width: 10px 12px 0 12px;}
#useful .first h2.step span {color: #fff; font-weight: 700; line-height: 1;}

#useful .first .content h3 {color: #424242; font-weight: 700; line-height: 1.375;}
#useful .first .content h3.center {justify-content: center;}
#useful .first .content h3 .desvg {width: 21px; height: 21px; margin: 3px 6px 0 0;}
#useful .first .content strong {color: #e72100; font-size: inherit; font-weight: inherit;}
#useful .first .content em {color: inherit; font-size: inherit; font-weight: 700;}

/*楽々! クイック乗り出し*/
#useful .first .web-booking .img {display: flex; flex-direction: column; justify-content: center; align-items: center;}
#useful .first .web-booking .img img {width: 88px; height: auto;}
#useful .first .web-booking .img p {line-height: 1.375; margin-top: 10px;}
#useful .first .web-booking .txt p {font-size: .95rem;}
#useful .first .web-booking .txt .search {position: relative; justify-content: center; align-items: center; width: 100%; max-width: 240px; background: #ff9e01; padding: 10px 0; box-shadow: 0 5px 0 #a36518; border-radius: 21px; transition: 0s;}
#useful .first .web-booking .txt .search span {color: #fff; font-weight: 700;}
#useful .first .web-booking .txt .search .desvg {width: 18px; height: 18px; margin-left: 6px;}
#useful .first .web-booking .txt .search .desvg .st0 {fill: #fff;}
#useful .first .web-booking .txt .search:hover {text-decoration: none;}
#useful .first .web-booking .txt .search:active {top: 5px; box-shadow: none;}

/*最寄りの各店へお電話でもご予約いただけます｡*/
#useful .first .tel-booking .img {display: flex; flex-direction: column; justify-content: center; align-items: center;}
#useful .first .tel-booking .img img {width: 84px; height: auto;}
#useful .first .tel-booking .tel-list dl * {font-weight: 700;}
#useful .first .tel-booking .tel-list dl dd {align-items: center;}
#useful .first .tel-booking .tel-list dl dd .desvg {width: 18px; height: 18px; margin-right: 6px;}
#useful .first .tel-booking .tel-list dl dd .desvg .st0 {fill: #e72100;}

/*ご来店時にご持参いただくもの*/
#useful .first .bring ul li {align-items: center;}
#useful .first .bring ul li:last-child {margin-bottom: 0;}
#useful .first .bring ul li .license {width: 129px; height: auto;}
#useful .first .bring ul li .credit {width: 148px; height: auto;}

/*規則を守って快適ドライブを!*/
#useful .first .rule .caution {border: 3px solid #e72100; border-radius: 8px;}
#useful .first .rule .caution p {color: #e72100; font-weight: 700;}

/*ご返却時のお手続き*/
#useful .first .check .return {align-items: center;}
#useful .first .check .return img {width: 159px; height: auto;}
#useful .first .check .return ul li {font-weight: 700; margin-bottom: .375em;}

/*--------------------------
3つの安心保証 (first.php)
--------------------------*/
#useful .insurance h2 {color: #fff; font-weight: 700; background: linear-gradient(to right,#d62a18,#ff6059);}
#useful .insurance p.disp {line-height: 1.75; text-align: justify;}

/*ハコレンタカーの3つの安心補償*/
#useful .insurance .compensation-list > li {box-sizing: border-box;}
#useful .insurance .compensation-list h3 {font-size: 1.45rem; font-weight: 700; text-align: center; padding: 5px 0; border: 3px solid #747474; border-radius: 26px;}
#useful .insurance .compensation-list p.explan {color: #424242; font-size: .9rem; line-height: 1.75; margin: 20px 0;}
#useful .insurance .compensation-list ul.item {border: 3px solid #747474; margin-bottom: 12px;}
#useful .insurance .compensation-list ul.item li {font-size: 1.45rem; font-weight: 700; text-align: center; border-bottom: 3px solid #747474; padding: 10px 0;}
#useful .insurance .compensation-list ul.item li:last-of-type {border-bottom: none;}
#useful .insurance .compensation-list ul.item li.rental {color: #ec5161; background: #ffebf1;}
#useful .insurance .compensation-list ul.item li.fee {color: #12a6f0; background: #baebff;}
#useful .insurance .compensation-list ul.item li.exemption {color: #05923f; background: #c2eab5;}
#useful .insurance .compensation-list ul.item li.noc {color: #f24c08; background: #ffde6b;}
#useful .insurance .compensation-list ul.item li small {display: block; color: #424242; font-size: .9rem;}
#useful .insurance .compensation-list p.catch {font-size: 1.35rem; font-weight: 700; text-align: center; line-height: 1.275;}

#useful .insurance .compensation-list > li.standard h3 {color: #12a6f0; background: #baebff;}
#useful .insurance .compensation-list > li.immunity h3 {color: #05923f; background: #c2eab5;}
#useful .insurance .compensation-list > li.wide h3 {color: #f24c08; background: #ffde6b;}
#useful .insurance .compensation-list > li.standard p.catch {color: #12a6f0;}
#useful .insurance .compensation-list > li.immunity p.catch {color: #05923f;}
#useful .insurance .compensation-list > li.wide p.catch {color: #f46f23;}
#useful .insurance .notice {display: block; color: #424242; font-size: .9rem; margin-top: 10px;}

/*補償*/
#useful .insurance .intro h3 {font-weight: 700;}
#useful .insurance .intro h3.standard {color: #1893ec;}
#useful .insurance .intro h3.immunity {color: #138330;}
#useful .insurance .intro h3.closure {color: #ec350c;}
#useful .insurance .intro p.disp {line-height: 1.5;}

/*基本の保証リスト*/
#useful .insurance .include dl {border: 3px solid #e42100; border-radius: 12px; box-sizing: border-box;}
#useful .insurance .include dl dt {color: #fff; font-size: 1.2rem; font-weight: 700; text-align: center; background: #e42100; padding: 2px 0; box-sizing: border-box;}
#useful .insurance .include dl dd {justify-content: center; align-items: center; flex-direction: column; height: 128px;}
#useful .insurance .include dl dd p {font-size: 1.725rem; font-weight: 700; line-height: 1.25; text-align: center;}
#useful .insurance .include dl dd p strong {color: #e42100; font-size: inherit; font-weight: inherit; line-height: inherit;}
#useful .insurance .include dl dd small {font-size: .925rem;}

/*保険・補償制度が適用されない例*/
#useful .insurance .other-list {margin: 0 0 20px; border: 3px solid; border-radius: 12px;}
#useful .insurance .other-list h3 {font-weight: 700; text-align: center;}
#useful .insurance .not-apply {border-color: #4a434b;}
#useful .insurance .not-apply h3 {color: #4a434b;}
#useful .insurance .not-apply ul + * {margin-bottom: 1.5em;}
#useful .insurance .not-apply li > ul,
#useful .insurance .not-apply li > ol {margin-bottom: 1em; padding-left: 2em;}
#useful .insurance .not-apply li {text-indent: -1em; padding-left: 1em; font-weight: 700;}
#useful .insurance .not-apply ul > li:before {content: "・"; padding: 0 .2em;}
#useful .insurance .not-apply ol > li {list-style-type: decimal;}
#useful .insurance .not-apply p {font-size: .95rem;}
#useful .insurance .burden {border-color: #4cb3f1;}
#useful .insurance .burden h3 {color: #4cb3f1;}
#useful .insurance .burden ul li {font-size: .95rem;}
#useful .insurance .burden ul li:not(:last-child) {margin-bottom: 1em;}
#useful .insurance .burden ul li:before {content: "■"; color: #4cb3f1; font-size: 1.5em; line-height: 1;}

/*図*/
#useful .insurance .img-flow {justify-content: center; align-items: center; margin: 20px 0;}
#useful .insurance .img-flow.immunity .illust {width: 153px; height: auto;}
#useful .insurance .img-flow.closure .illust {width: 146px; height: auto;}
#useful .insurance .img-flow .price * {color: #626262; font-size: 1.175rem; font-weight: 700; line-height: 1.325;}
#useful .insurance .img-flow .price h4 {font-size: 1.45rem; text-align: center; margin-bottom: 16px;}
#useful .insurance .img-flow .price strong {display: inline-block; color: #e42100; font-size: 1.625rem; font-weight: inherit;}
#useful .insurance .img-flow .price dl {justify-content: center; align-items: center; margin-bottom: 12px;}
#useful .insurance .img-flow .price dl dd {display: flex; align-items: baseline;}
#useful .insurance .img-flow.immunity .price dl dt {margin-right: 4px;}
#useful .insurance .img-flow.closure .price dl {flex-direction: column;}
#useful .insurance .img-flow.closure .price dl dt {text-align: center; margin-bottom: 4px;}
#useful .insurance .img-flow .arrow {position: relative;}
#useful .insurance .img-flow .arrow:before,
#useful .insurance .img-flow .arrow:after {position: absolute; content: "";}
#useful .insurance .img-flow .arrow:before {background: #e42100;}
#useful .insurance .img-flow .menjo {font-size: 3.5rem; font-weight: 700;}

/*--------------------------
法人向けプラン (business_contact.php)
--------------------------*/
#useful .business .signup {position: relative; justify-content: center; align-items: center; width: 100%; max-width: 372px; background: #ff3f00; padding: 10px 0; box-shadow: 0 5px 0 #aa2700; border-radius: 32px; transition: 0s;}
#useful .business .signup span {color: #fff; font-size: 1.5rem; font-weight: 700;}
#useful .business .signup .desvg .st0 {fill: #fff600;}
#useful .business .signup:hover {text-decoration: none;}
#useful .business .signup:active {top: 5px; box-shadow: none;}

#useful .business .intro h2 {color: #38b8f3; font-weight: 700; text-align: center;}
#useful .business .intro .about ul li {font-weight: 700;}
#useful .business .intro .feature li h3 {position: relative; justify-content: center; align-items: center; width: 200px; height: 200px; margin: 0 auto 20px; border-radius: 50%; overflow: hidden; z-index: 1;}
#useful .business .intro .feature li h3:before {content: ""; position: absolute; top: -55px; left: -54px; width: 248px; height: 248px; border-radius: 50%; z-index: 2;}
#useful .business .intro .feature li.low-price h3 {background: #f04c39;}
#useful .business .intro .feature li.guarantee h3 {background: #ed9400;}
#useful .business .intro .feature li.burden h3 {background: #72c121;}
#useful .business .intro .feature li.low-price h3:before {background: #ff513e;}
#useful .business .intro .feature li.guarantee h3:before {background: #ffa000;}
#useful .business .intro .feature li.burden h3:before {background: #7bd024;}
#useful .business .intro .feature li h3 span {position: relative; color: #fff; font-size: 1.375rem; font-weight: 700; line-height: 1.325; text-align: center; z-index: 3;}
#useful .business .intro .feature li h3 span strong {display: block; color: #fff600; font-size: 2.25rem; font-weight: inherit; line-height: inherit; text-align: inherit;}
#useful .business .intro .feature li p {letter-spacing: 0;}

#useful .business .value h2 img {margin: 0 auto;}
#useful .business .value .graph h3 {text-align: center;}
#useful .business .value .graph h3 span {color: #ff3f00; font-size: inherit; font-weight: 900; padding-right: 4px;}
#useful .business .value .graph img {width: 100%; max-width: 512px; height: auto; margin: 0 auto;}
#useful .business .value .option .options {position: relative;}
#useful .business .value .option .options li {justify-content: center; flex-direction: column; width: 250px; height: 250px; padding: 0 16px 0 36px; border: 6px solid #eb9e2d; border-radius: 50%; box-sizing: border-box; z-index: 1;}
#useful .business .value .option .options li.etc {background: #ff8016;}
#useful .business .value .option .options li.carnavi,
#useful .business .value .option .options li.dispatch {background: #ffad31;}
#useful .business .value .option .options li h3 {margin-bottom: 10px;}
#useful .business .value .option .options li.etc h3 img {width: 178.5px;}
#useful .business .value .option .options li.carnavi h3 img {width: 151.5px;}
#useful .business .value .option .options li.dispatch h3 img {width: 104px;}
#useful .business .value .option .options li p {font-size: .875rem; font-weight: 700; line-height: 1.5; letter-spacing: 0;}
#useful .business .value .option .options .illust {width: 336px; height: auto; z-index: 2;}

/*--------------------------
ワンボックスカーの魅力 (one-box.php)
--------------------------*/
#useful .head-img,
#useful .head-img img {width: 100%; height: auto;}
#useful .head-img figcaption {color: #545454; font-weight: 700; margin-top: .5em;}

/*プロが教える*/
#useful .one-box h2.teach {justify-content: center; align-items: center;}

/*イントロ*/
#useful .one-box .intro {display: flex; align-items: center; flex-direction: column;}
#useful .one-box .intro h3 .main,
#useful .one-box .intro h3 .sub {margin: 0 auto;}
#useful .one-box .intro h3 .main {margin-bottom: 30px;}
#useful .one-box .intro h3 .sub {margin-bottom: 20px;}
#useful .one-box .intro p.disp {text-align: center;}

/*汎用*/
#useful .one-box .serial-sec h4 {color: #606060; font-weight: 700;}
#useful .one-box .serial-sec h4 span {color: #88cc54; font-size: inherit; font-weight: inherit; padding-right: .25em;}
#useful .one-box .serial-sec .img {display: flex; align-items: flex-start;}
#useful .one-box .serial-sec .img img {width: 100%; height: auto;}
#useful .one-box .serial-sec p {font-size: .725rem;}

/*point1*/
#useful .one-box .point1 .intro h3 .main {width: 145px; height: auto;}
#useful .one-box .point1 .intro h3 .sub {width: 228px; height: auto;}
#useful .one-box .point1 .intro .graph {width: 100%; max-width: 388px;}

#useful .one-box .point1 .suit h3 {justify-content: center; align-items: center;}
#useful .one-box .point1 .suit h4 {color: #5d99ff; font-weight: 700;}
#useful .one-box .point1 .suit .comparison {width: 392px; height: auto; margin: 0 auto;}
#useful .one-box .point1 .suit .posture .difference li {width: 100%; max-width: 315px;}
#useful .one-box .point1 .suit .posture .difference li .inner {position: relative; width: 100%; height: 236px; background: #999;}
#useful .one-box .point1 .suit .posture .difference li .inner h5 {position: absolute; top: 5px; left: 5px; justify-content: center; align-items: center; color: #fff; line-height: 1.375; text-align: center; width: 108px; height: 108px; padding: 8px 0 0; background: #aaa; border-radius: 50%; box-sizing: border-box; z-index: 1;}
#useful .one-box .point1 .suit .posture .difference li .inner img {position: absolute;}
#useful .one-box .point1 .suit .posture .difference li.compact .inner {background: #cdf5ff;}
#useful .one-box .point1 .suit .posture .difference li.one-box .inner {background: #fffcd6;}
#useful .one-box .point1 .suit .posture .difference li.compact .inner h5 {background: #68b8ff;}
#useful .one-box .point1 .suit .posture .difference li.one-box .inner h5 {background: #f7a126;}
#useful .one-box .point1 .suit .posture .difference li.compact .chair {width: 255px; height: auto; bottom: 15px; right: 15px;}
#useful .one-box .point1 .suit .posture .difference li.compact .photo {width: 193px; height: auto; top: -50px; right: -6px;}
#useful .one-box .point1 .suit .posture .difference li.one-box .chair {width: 280px; height: auto; bottom: 15px; right: 15px;}
#useful .one-box .point1 .suit .posture .difference li.one-box .photo {width: 204px; height: auto; top: -60px; right: 8px}
#useful .one-box .point1 .suit .posture .difference li p {font-size: .95rem; margin-top: 10px;}
#useful .one-box .point1 .suit .posture .explan p {position: relative; background: #fff58e;}
#useful .one-box .point1 .suit .posture .explan p:before {content: ""; position: absolute;}
#useful .one-box .point1 .suit .posture .explan .img {width: 267px; height: auto;}

/*point2*/
#useful .one-box .point2 {background: url(../img/useful/one-box/point2_back.png);}
#useful .one-box .point2 .intro h3 .main {width: 191px; height: auto;}
#useful .one-box .point2 .intro h3 .sub {width: 265px; height: auto;}
#useful .one-box .point2 .serial-sec .img.photo02 img {width: 248px; margin: 0 auto;}
#useful .one-box .point2 .serial-sec .img.photo03 img {width: 227px; margin: 0 auto;}

/*point3*/
#useful .one-box .point3 .intro h3 .main {width: 238px; height: auto;}
#useful .one-box .point3 .intro h3 .sub {width: 310px; height: auto;}

/*finished*/
#useful .one-box .finished h2 img {width: 100%; max-width: 468px; margin: 0 auto;}
#useful .one-box .finished .car-check {justify-content: center; align-items: center; width: 100%; max-width: 435px; background: #ff2600; padding: 16px 0; border: 2px solid #ff2600; border-radius: 10px; margin: 0 auto;}
#useful .one-box .finished .car-check span {color: #fff; font-weight: 700; line-height: 1;}
#useful .one-box .finished .car-check .desvg .st0 {fill: #fff500;}
#useful .one-box .finished .car-check:hover {text-decoration: none; background: #fff;}
#useful .one-box .finished .car-check:hover span {color: #ff2600;}
#useful .one-box .finished .car-check:hover .desvg .st0 {fill: #ff2600;}

/*--------------------------
ハコレンタカーの特徴 (feature.php)
--------------------------*/
/*detail*/
#useful .feature .detail h2 {margin: 0 8px 24px;}
#useful .feature .detail p {letter-spacing: 0;}

/*feature-sec*/
#useful .feature .feature-sec {margin: 64px 20px;}
#useful .feature h3.ribbon {position: relative; z-index: 1;}
#useful .feature h3.ribbon span {position: relative; display: block; color: #fff; font-weight: 700; text-align: center; background: #ff6601;}
#useful .feature h3.ribbon:before,
#useful .feature h3.ribbon:after,
#useful .feature h3.ribbon span:before,
#useful .feature h3.ribbon span:after {content: ""; position: absolute;}
#useful .feature h3.ribbon:before,
#useful .feature h3.ribbon:after {z-index: -2;}
#useful .feature h3.ribbon span:before,
#useful .feature h3.ribbon span:after {top: 100%; border: none; border-bottom: solid 6px transparent;}
#useful .feature h3.ribbon span:before {left: 0; border-right: solid 12px #973300;}
#useful .feature h3.ribbon span:after {right: 0; border-left: solid 12px #973300;}
#useful .feature h3.big {color: #ff6601; font-weight: 700;}
#useful .feature p.disp {font-weight: 700;}
#useful .feature p.disp strong {color: #ff6601; font-size: inherit; font-weight: inherit;}

/*ビデオ*/
#useful .feature .video {position: relative; height: 0; padding-bottom: 56.25%; overflow: hidden;}
#useful .feature .video iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

/*殺菌*/
#useful .feature .disinfection {background: repeating-linear-gradient(-45deg, #ffec5c, #ffec5c 3px,#ffdd00 3px, #ffdd00 7px);}
#useful .feature .disinfection h4 {color: #ff3f00; font-weight: 700;}
#useful .feature .disinfection p {font-weight: 700; letter-spacing: 0;}

/*サポート*/
#useful .feature .support {flex-wrap: wrap;}
#useful .feature .support li img {width: 142px; height: auto; margin: 0 auto;}
#useful .feature .support h4 {font-weight: 700; text-align: center;}

/*注意事項*/
#useful .feature .notice h4 {font-weight: 700; text-align: center;}

#useful .feature .car-check {justify-content: center; align-items: center; width: 100%; max-width: 435px; background: #ff2600; padding: 16px 0; border: 2px solid #ff2600; border-radius: 10px; margin: 0 auto;}
#useful .feature .car-check span {color: #fff; font-weight: 700; line-height: 1;}
#useful .feature .car-check .desvg .st0 {fill: #fff500;}
#useful .feature .car-check:hover {text-decoration: none; background: #fff;}
#useful .feature .car-check:hover span {color: #ff2600;}
#useful .feature .car-check:hover .desvg .st0 {fill: #ff2600;}

/*--------------------------------------------------------------------------
お問い合わせ (contact.php)
--------------------------------------------------------------------------*/
#contact h2 {font-weight: 700; border-bottom: 2px solid #333;}
#contact p.disc {text-align: center;}
#contact p.disc small {font-size: .9em;}
#contact a {color: #2ca9e1;}
#contact .notice {background: #f5f5f5; border: 1px solid #ddd; border-bottom-width: 2px; border-radius: 4px;}
#contact .qanda {border: 1px solid #c0c0c0;}
#contact .qanda dt {background: #f5feff; padding: 12px 20px; border-bottom: 1px solid #c0c0c0;}
#contact .tel-list {}
#contact .tel-list li {text-align: center;}
#contact .tel-list li h3 {padding: 8px 0; background: #d9f9fc;}
#contact .tel-list li a {display: inline-block; color: #000;}
#contact .tel-list li .all-year {color: #fff; width: 260px; margin: 0 auto; border-radius: 4px; background: #e72100;}

#contact .form dl {border: 1px solid #e6e6e6; border-bottom: none;}
#contact .form dl dt,
#contact .form dl dd {box-sizing: border-box;}
#contact .form dl dt span {color: #fff; font-size: .9rem; background: #ff2600; margin-left: 8px; padding: 4px 6px;}
#contact .form dl.agree {display: block; border: none; border-top: 1px solid #e6e6e6;}
#contact .form dl.agree dt,
#contact .form dl.agree dd {width: 100%; text-align: center; border: none;}
#contact .form dl.agree dt {padding: 32px 0 16px;}
#contact .form dl.agree dd .checkbox {margin-top: 12px;}
#contact .form dl.agree dd .checkbox .wpcf7-list-item-label {font-size: 1.1rem;}
#contact .form input[type="text"],
#contact .form input[type="email"],
#contact .form input[type="tel"],
#contact .form select,
#contact .form textarea {width: 100%; padding: 4px 12px; border: 1px solid #ccc; border-radius: 6px; resize: vertical; box-sizing: border-box;}
#contact .form input::-ms-input-placeholder,
#contact .form input::-webkit-input-placeholder,
#contact .form input::placeholder {color: #ccc;}
#contact .form .wpcf7-list-item label {display: flex; align-items: center;}
#contact .form .wpcf7-list-item label input {margin-right: 5px;}
#contact .form .wpcf7-list-item label span {line-height: 1;}
#contact .form input[type="submit"] {display: block; width: 200px; color: #fff; background: #ff2600; margin: 30px auto 0; padding: 12px 0; border: 2px solid #ff2600; border-radius: 5px; transition: .2s ease;}
#contact .form input[type="submit"]:hover {color: #ff2600; background: #fff;}

/*--------------------------------------------------------------------------
ブログ一覧ページ (blog.php)
--------------------------------------------------------------------------*/
/*タグリスト*/
.tag-list {flex-wrap: wrap; margin: auto -10px 0 0;}
.tag-list li {margin: 0 10px 6px 0;}
.tag-list li a {display: block; color: #797979; font-size: .8rem; font-weight: 700; padding: 2px 16px; background: #fff; border: 1px solid #797979; border-radius: 1.5em;}
.tag-list li a span {color: #4cb3f1; font-size: inherit; font-weight: inherit; margin-right: 3px;}
.tag-list li a:hover {color: #fff; text-decoration: none; background: #4cb3f1;}
.tag-list li a:hover span {color: #fff;}

#blog-arc .main-photo {background: url(../img/blog/blog_headline-back.jpg);}
#blog-arc .main-photo img {margin: 0 auto;}

#blog-arc .blog-list .entry {box-shadow: 5px 5px 5px rgba(0,0,0, .25); border-radius: 12px; overflow: hidden;}
#blog-arc .blog-list .entry .img {display: block; width: 100%; height: 178px;}
#blog-arc .blog-list .entry .img img {width: 100%; height: 100%; object-fit: cover; object-position: 50%;}
#blog-arc .blog-list .entry .txt {display: flex; flex-direction: column; height: calc(100% - 178px); padding: 12px; box-sizing: border-box;}
#blog-arc .blog-list .entry h3 {font-size: 1.05rem; font-weight: 700; line-height: 1.325; margin-bottom: 20px;}
#blog-arc .blog-list .entry time {display: block; color: #797979; font-size: .95rem; font-weight: 700; margin: 8px 0 4px;}
#blog-arc .blog-list .entry .cat-box {justify-content: flex-end;}
#blog-arc .blog-list .entry .cat-box * {font-size: .8rem;}
#blog-arc .blog-list .entry .cat-box > div.area {margin-right: 12px;}
#blog-arc .blog-list .entry .cat-box > div span {margin-right: 5px;}
#blog-arc .blog-list .entry .cat-box > div ul li {margin-right: 2px;}
#blog-arc .blog-list .entry .cat-box > div ul li a {display: block; color: #4cb3f1;}

#blog-arc .notfound {background: #eee; padding: 15px 30px;}

#blog-arc .more {display: inline-flex; align-items: center; background: #e42100; padding: 2px 16px; border: 2px solid #e42100; border-radius: 16px; float: right;}
#blog-arc .more span {color: #fff; font-size: 1.1rem; font-weight: 700;}
#blog-arc .more .desvg {width: 16px; height: 16px; margin-left: 8px;}
#blog-arc .more .desvg .st0 {fill: #fff;}
#blog-arc .more:hover {text-decoration: none; background: #fff;}
#blog-arc .more:hover span {color: #e42100;}
#blog-arc .more:hover .desvg .st0 {fill: #e42100;}

/*--------------------------------------------------------------------------
ブログ個別ページ (single-blog.php)
--------------------------------------------------------------------------*/
#blog-single .main-photo {background: url(../img/blog/blog_headline-back.jpg);}
#blog-single .main-photo img {margin: 0 auto;}

#blog-single .two-col {overflow: hidden;}
#blog-single .two-col .side-col {background: #fafaf2;}

#blog-single .blog-single-info .back {display: inline-block; color: #4cb3f1; font-weight: 700;}
#blog-single .blog-single-info h1 {font-weight: 700;}
#blog-single .blog-single-info time {display: block; font-weight: 700; text-align: right;}
#blog-single .eyecatch img {width: 100%; height: auto;}

/*エリア・タグ*/
#blog-single .two-col .main-col .cat-box > div ul li {margin-right: 6px;}
#blog-single .two-col .main-col .cat-box > div ul li a {display: block; color: #4cb3f1;}

/*サイドバー*/
#blog-single .two-col .side-col h2 {font-weight: 700;}
#blog-single .two-col .side-col .posts .posts-list {margin-top: -14px;}
#blog-single .two-col .side-col .posts .posts-list li {padding: 14px 0; border-bottom: 1px solid #cfcfcf;}
#blog-single .two-col .side-col .posts .posts-list li h3 {font-size: .95rem; font-weight: 700;}
#blog-single .two-col .side-col .posts .posts-list li .img {max-width: 84px; min-width: 84px; height: 84px; margin-right: 16px;}
#blog-single .two-col .side-col .posts .posts-list li .img img {width: 100%; height: 100%; object-fit: cover; object-position: 50%; font-family: "object-fit: cover; object-position: 50%;";}

/*--------------------------------------------------------------------------
投稿ページ・固定ページ (single.php,page.php)
--------------------------------------------------------------------------*/
#single {width: 100%; margin-bottom: 60px;}
#single * {font-size: 1rem;}

/*--見出し--*/
#single h2,#single h3,#single h4,#single h5,#single h6 {position: relative; font-weight: 700; line-height: 1.5; margin: 30px 0 20px;}

#single h2 {font-size: 1.45rem; color: #fff; padding: 15px 15px 15px 25px; background: linear-gradient(to right,#d62a18,#ff6059);}

#single h3 {font-size: 1.35rem; border-bottom: 3px solid #e42100; padding: 8px 4px;}

#single h4 {font-size: 1.25rem; padding: 9px 12px 8px 16px; background: #eee; border-radius: 5px;}
#single h4:before {content: ""; display: block; position: absolute; bottom: -12px; left: 25px; width: 0; height: 0; border-style: solid; border-width: 12px 15px 0 15px; border-color: #eee transparent transparent transparent;}

#single h5 {font-size: 1.15rem; padding-left: 10px; border-left: 5px solid #e42100;}

/*--リスト--*/
#single ul,
#single ol {margin: 0 0 30px;}
#single ul li, #single ol li {margin-left: 1.5em; line-height: 2.5;}
#single ul li:before {color: #fbb03b;}
#single ul {list-style-type: disc;}
#single ul li {list-style-type: inherit;}
#single ol {list-style-type: decimal;}
#single ol li {list-style-type: inherit;}
#single ul ul, #single ol ol, #single ul ol, #single ol ul {margin: 0 0 0 1.75em;}

/*--テーブル--*/
#single table {border-collapse: collapse; line-height: 1.5; margin: 0 0 30px; border-top: 1px solid #b3b3b3;}
#single table thead th, #single table thead td,
#single table tfoot th, #single table tfoot td {font-weight: 700;}
#single table th, #single table td {padding: 10px 20px; border-bottom: 1px solid #b3b3b3;}
#single table th {background: #f0f0f0; text-align: center!important;}

/*--画像--*/
#single img {margin: 20px 0;}
#single a:hover img {opacity: .7;}
#single .wp-caption {max-width: 100%; margin: 30px 0;}
#single .wp-caption img {margin: 0;}
#single .wp-caption .wp-caption-text {font-size: .9rem; margin: 0; padding: 2px 12px; background: #f3f3f3; border: 1px solid #ddd; border-top: none;}

/*--リンク--*/
#single a {color: #4cb3f1!important;}
#single a[href$=".pdf"],
#single a[href$=".doc"],
#single a[href$=".docx"],
#single a[href$=".xls"],
#single a[href$=".xlsx"],
#single a[href$=".zip"] {background: #0095d9; color: #fff!important; font-size: 1rem; padding: 8px 24px; border-radius: 20px;}

/*--その他--*/
#single p {word-break: break-all; line-height: 2; margin: 0 0 30px;}
#single em {font-style: italic;}
#single strong {font-weight: 700;}
#single blockquote {position: relative; font-style: italic; margin: 0 0 30px; padding: 30px 30px 0; border: 2px solid #b3b3b3;}
#single sup, #single sub {font-size: .5em;}
#single sup {vertical-align: top;}
#single sub {vertical-align: bottom;}
#single pre {margin: 30px 0;}
#single hr {border-top: 4px double #b3b3b3; margin: 30px 0;}

#single .aligncenter {display: block; margin: 0 auto; text-align: center;}
#single .alignright {float: right;}
#single .alignleft {float: left;}

/*前後記事*/
.postlink {margin-top: 10px; padding-top: 10px; border-top: 1px solid #cfcfcf;}
.postlink a {color: #797979; font-size: 1.05rem; font-weight: 700;}
.postlink a.next {float: left;}
.postlink a.prev {float: right;}

/*--------------------------------------------------------------------------
口コミ (single-review.php)
--------------------------------------------------------------------------*/
#review-single h2 {align-items: center; background: #e42100;}
#review-single h2 span {color: #fff; font-weight: 700;}
#review-single h2 .desvg * {fill: #fff;}

#review-single .two-col .side-col h2 {padding: 5px 12px;}
#review-single .two-col .side-col h2 span {margin-left: 8px;}
#review-single .two-col .side-col h2 .shop {width: 22px; height: auto;}
#review-single .two-col .side-col h2 .car {width: 24px; height: auto;}
#review-single .two-col .side-col .review-list {padding: 0 12px;}

/*コメント*/
#review-single .commets-list li .comment-meta .comment-reply-link,
#review-single .comment-respond #cancel-comment-reply-link {color: #fff; font-size: .825rem; line-height: 1; margin-left: auto; padding: 8px 12px; background: #79ad4b; border: 1px solid #79ad4b; border-radius: 4px;}
#review-single .commets-list li .comment-meta .comment-reply-link:hover,
#review-single .comment-respond #cancel-comment-reply-link:hover {color: #79ad4b; background: #fff; opacity: 1;}

#review-single .comment h3 {display: flex; align-items: center; justify-content: center; font-size: 1.25rem; font-weight: 700; letter-spacing: 4px; text-align: center;}
#review-single .commets-list {margin: 0 0 60px;}
#review-single .commets-list li {width: 100%; background: #eee; border-radius: 8px; box-sizing: border-box;}
#review-single .commets-list li .comment-meta {flex-wrap: wrap; align-items: center; margin-bottom: 14px;}
#review-single .commets-list li .comment-meta .author {font-weight: 700; margin-right: 1rem;}
#review-single .commets-list li .comment-meta .post-date {font-size: .875rem;}
#review-single .commets-list li .comment-meta .comment-reply-link {margin-left: auto;}

#review-single .comment-respond #cancel-comment-reply-link {margin-left: 15px;}
#review-single .comment-respond #cancel-comment-reply-link small {display: block;}
#review-single .comment-respond .comment-notes {font-size: .9rem; text-align: center; margin-bottom: 10px;}
#review-single .comment-respond .comment-form-input {width: 100%; margin: 0 auto 18px;}
#review-single .comment-respond .comment-form-input label {color: #828282; font-size: .975rem;}
#review-single .comment-respond .logged-in-as {text-align: center;}
#review-single .comment-form-cookies-consent {text-align: center; margin: 30px 0;}
#review-single .comment-form-cookies-consent label {font-size: .95rem;}

/*口コミ*/
.review-totals {display: flex; max-width: 100%!important;}
.review-totals .reviews-break {display: block!important; max-width: 100%!important;}
.review-totals .reviews-summary {position: relative!important; width: auto; max-width: 100%!important;}
.review-totals .reviews-summary * {font-weight: 700;}
.review-totals .reviews-summary strong * {font-size: 1.6rem!important;}

.ic_rev_review {display: flex; flex-direction: column-reverse; max-width: 100%!important; margin: 0 0 -2px!important; border-color: #ddd!important; border-width: 2px!important; border-right: none!important; border-left: none!important;}
.review-rating span {color: #f0c912;}
.review-left,
.review-right {float: none!important;}
.review-left,
.review-right {max-width: 100%!important; margin: 0!important;}
.review-right .review-rating {margin-bottom: 15px;}
.review-right .review-title {display: none!important; font-size: 1.25rem; max-height: inherit!important;}
.review-right .review-time,
.review-right .reply {font-size: .9rem; text-align: right;}
.review-right .reply .comment-reply-link {display: none; color: #fff; font-size: .75rem; line-height: 1; margin: 4px 0; padding: 4px 8px; background: #e42100; border: 1px solid #e42100; border-radius: 4px;}
.review-right .reply .comment-reply-link:hover {color: #e42100; text-decoration: none; background: #fff;}
.review-left .reviewer-name {width: 100%!important;}
.review-left .reviewer-name span {display: block!important; text-align: right;}
.review-avatar,
.comment-reply-title,
.comment-form-cookies-consent {display: none;}

/*フォーム*/
#review-single textarea,
#review-single input[type="email"],
#review-single input[type="tel"],
#review-single input[type="text"] {display: block!important; max-width: 100%!important; padding: 4px 8px!important; border: 2px solid #ddd!important; box-sizing: border-box; border-radius: 4px; resize: vertical; transition: border-color .3s;}
#review-single textarea:focus,
#review-single input[type="email"]:focus,
#review-single input[type="tel"]:focus,
#review-single input[type="text"]:focus {border-color: #ccc!important;}
#review-single input[type="submit"] {display: block; color: #fff; font-weight: 700; min-width: 240px; margin: 0 auto; padding: 18px 20px; background: #e72100; border: 2px solid #e72100; border-radius: 8px; transition: .2s ease;}
#review-single input[type="submit"]:hover {color: #e42100; background: #fff;}
#review-single .comment-form-title {display: none;}

/*--------------------------------------------------------------------------
404ページ
--------------------------------------------------------------------------*/
#notfound {display: flex; justify-content: center; align-items: center; flex-direction: column; width: 100%;}
#notfound h1 {margin-bottom: 40px;}
#notfound h1 span {display: block; text-align: center;}
#notfound h1 span.big {font-size: 2.7rem; font-weight: 700; letter-spacing: 2px; margin-bottom: 10px;}
#notfound a.link {color: #fff; font-size: 1.1rem; padding: 20px 30px; background: #e72100; border: 2px solid #e72100;}
#notfound a.link:hover {color:#e72100; text-decoration: none; background: #fff;}
