@charset "UTF-8";

.cms-style__callout {
  margin-bottom: 20px;
  padding: 20px 25px;
  background-color: #fff9e9;
}

.cms-style__callout .ttl {
  position: relative;
  margin-bottom: 11px;
  padding-left: 1.1em;
  color: #777256;
  font-weight: 600;
}

.cms-style__callout .ttl::before {
  content: "";
  display: block;
  position: absolute;
  top: 0.5em;
  left: 0;
  width: 10px;
  height: 5px;
  border-left: 3px solid #e7db86;
  border-bottom: 3px solid #e7db86;
  transform: rotate(-45deg);
}

.cms-style__callout a {
  color: #3E76CB;
  text-decoration: underline;
}

.cms-style__callout p {
  margin-bottom: 0;
}

.external-link-button {
  background-color: #333;
  border-radius: 4px;
  display: inline-flex;
  border: 1px solid #333;
  padding: 13px 40px 13px 16px;
  font-size: 14px;
  text-decoration: none;
  color: #fff;
  text-align: center;
  justify-content: center;
  position: relative;
  transition: all 0.3s ease;
}

.external-link-button:hover {
  color: #333;
  background-color: #fff;
}

.external-link-button:hover:after {
  border-right: 2px solid #333;
  border-top: 2px solid #333;
}

.external-link-button::after {
  content: "";
  width: 9px;
  height: 9px;
  display: block;
  border-right: 2px solid #fff;
  border-top: 2px solid #fff;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%) rotate(45deg);
}

/*テーブル文字サイズの統一*/

.post-context .section-container table p {
  font-size: 12px;
}

/*テーブル文字サイズの統一*/

.article-table-container table th p,
.article-table-container table td p {
  font-size: 12px;
  margin-bottom: 0;
  line-height: 1.5;
}

.article-table-container__contentall {
  position: relative;
  width: 100%;
}

.article-table-container__contentall.is-hide {
  height: 850px;
  overflow: hidden;
}

.article-table-container__af {
  /*商品名*/
  /* 一覧画像 */
  /*Amazon 楽天ボタン*/
}

.article-table-container__af th {
  vertical-align: middle;
}

.article-table-container__af th:nth-of-type(1) {
  width: 170px;
}

.article-table-container__af th:nth-of-type(1)::before {
  background-color: #ccc;
  left: -1px;
  top: 0;
}

.article-table-container__af th:nth-of-type(1)::after {
  background-color: #fff;
  right: -1px;
  top: 0;
}

.article-table-container__af th:nth-of-type(2) {
  width: 120px;
}

.article-table-container__af td {
  vertical-align: middle;
}

.article-table-container__af tr > td:nth-of-type(2) {
  padding: 5px 20px;
}

.article-table-container__af tr > td:nth-of-type(3) {
  padding: 15px 30px 20px;
}

.article-table-container__af tr > td:nth-of-type(3) ul {
  display: flex;
  justify-content: space-between;
}

.article-table-container__af tr > td:nth-of-type(3) li {
  width: 170px;
}

.article-table-container__af tr > td:nth-of-type(3) li a {
  color: #FFF;
  display: block;
  border-radius: 4px;
  padding: 12px;
  text-align: center;
  text-decoration: none;
  font-size: 14px;
  font-weight: 700;
}

.article-table-container__af tr > td:nth-of-type(3) li .af__amazonmini--button {
  box-shadow: 0 5px 0 0 #CC721F;
  background-color: #FF9900;
}

.article-table-container__af tr > td:nth-of-type(3) li .af__rakutenmini--button {
  background-color: #BF3939;
  box-shadow: 0 5px 0 0 #A13030;
}

p:has(.cta-link-button) {
  text-align: center;
}

.cta-link-button {
  background-color: #d90d0d;
  border-radius: 4px;
  display: inline-flex;
  border: 1px solid #d90d0d;
  padding: 13px 40px 13px 16px;
  font-size: 14px;
  text-decoration: none;
  color: #fff;
  text-align: center;
  justify-content: center;
  position: relative;
  transition: all 0.3s ease;
}

.cta-link-button:hover {
  color: #d90d0d;
  background-color: #fff;
  text-decoration: none;
}

.cta-link-button:hover:after {
  border-right: 2px solid #d90d0d;
  border-top: 2px solid #d90d0d;
}

.cta-link-button::after {
  content: "";
  width: 9px;
  height: 9px;
  display: block;
  border-right: 2px solid #fff;
  border-top: 2px solid #fff;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%) rotate(45deg);
}

/*ボタン選択モーダルの中身のテキストリンク*/

.text-link {
  color: #337ab7;
  text-decoration: none;
  display: inline-flex;
  width: 212px;
  height: 48px;
  align-items: center;
}

.text-link:hover {
  text-decoration: underline;
}

/*ボタン選択モーダルの中身のレイアウト*/

.modal-selectbutton {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding-bottom: 10px;
}

.modal-selectbutton label {
  margin: 10px 0;
  cursor: pointer;
}

.modal-selectbutton label span {
  margin-left: 10px;
}

.modal-selectbutton-cap {
  display: inline-block;
  margin-top: -5px;
  margin-left: 23px;
}

.article-table-container__af__button {
  background: #fff;
  border: 1px solid #24272a;
  border-radius: 4px;
  box-shadow: 0px 4px 0px 0px rgba(36, 39, 42, 0.2);
  cursor: pointer;
  display: grid;
  font-weight: 700;
  height: 64px;
  margin: 0 0 4px;
  place-items: center;
  width: 100%;
}

.article-table-container__af__buttonblock {
  align-items: flex-end;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0), rgb(255, 255, 255) 25%);
  bottom: -1px;
  display: flex;
  height: 120px;
  justify-content: center;
  padding: 0 0 8px;
  position: absolute;
  width: 100%;
}

* {
  font-family: Hiragino sans, Meiryo, "メイリオ", ArialMT, -apple-system, BlinkMacSystemFont, sans-serif, Verdana, "ＭＳ Ｐゴシック";
}

/*default layout colors*/

/*TODO bodyのiOSサファリランドスケープ対応はcommonに移植*/

body {
  color: #2d2d2d;
  -webkit-text-size-adjust: 100%;
}

a {
  color: #383838;
  text-decoration: none;
}

a:hover {
  color: #787878;
  text-decoration: underline;
}

input,
select,
button {
  outline: 0;
}

label:hover,
.wpcf7-list-item-label:hover {
  color: #787878;
}

/*TODO IE10以上のセレクトボックスデフォルト矢印の削除commonにする？*/

select::-ms-expand {
  display: none;
}

/*TODO: commonへ移植：ページトップアンカー */

.pagetop a {
  display: block;
  position: relative;
  background-color: #ffb400;
  color: #fff;
  text-align: center;
  line-height: 40px;
  text-decoration: none;
  padding: 12px 5px 0 5px;
  filter: alpha(opacity=80);
  opacity: 0.8;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  z-index: 15;
}

.pagetop a svg {
  position: absolute;
  width: 11px;
  height: 11px;
  fill: #fff;
}

.pagetop a:hover {
  filter: alpha(opacity=70);
  -moz-opacity: 1;
  opacity: 0.7;
}

.pagetop.show {
  opacity: 1;
  filter: alpha(opacity=100);
  transform: scale(1);
}

/* TODO: commonへ移動：ヘッダーメニュー開いた時の背景固定 */

.modal-open-now {
  overflow: hidden;
  height: 100%;
}

/*********************************************** for tie up speed*/

/*accent link color*/

a.default {
  color: #1e3f7e;
  text-decoration: underline;
}

a.default:visited {
  color: #7f4776;
}

/*svgアイコンカラー分類*/

.fill_n {
  fill: #9c9392 !important;
}

.fill_m {
  fill: #ffb400 !important;
}

/*ボディ*/

.con_box,
.flex_lbox,
.flex_rbox {
  padding: 0 15px;
}

.con_box::after {
  content: "";
  display: block;
  clear: both;
}

.con_lbox {
  margin-bottom: 40px;
}

/* アイコンラベル類 */

span.label {
  display: inline-block;
  cursor: default;
  text-align: center;
  vertical-align: text-top;
  line-height: 12px;
  font-size: 12px;
  min-width: 38px;
  padding: 3px 2px;
  border-radius: 3px;
  box-sizing: border-box;
}

span.label.category,
span.label.charge {
  border: 1px solid #ffb400;
  background-color: #ffb400;
  color: #fff;
  padding: 3px 2px;
}

span.label.relation,
span.label.period {
  border: 1px solid #707070;
  background-color: #707070;
  color: #fff;
}

span.label.alert {
  border: 1px solid #ff5a5d;
  background-color: #ff5a5d;
  color: #fff;
}

span.label.pr,
span.label.news {
  border: 1px solid #707070;
  background-color: #f8f8f8;
  color: #313233;
}

span.label.relation {
  cursor: pointer;
}

/*メタデータ類*/

span.post-date {
  color: #999;
  font-size: 12px;
  vertical-align: top;
  line-height: 24px;
}

span.corporate {
  color: #707070;
  font-weight: 700;
  font-size: 12px;
  vertical-align: top;
  line-height: 23px;
}

span.article-caption {
  font-weight: bold;
  font-size: 12px;
  line-height: 16px;
}

/*SNSアイコン類*/

article .t-article__sns {
  margin: 24px auto;
  display: flex;
  flex-wrap: wrap;
  width: 80%;
}

article .t-article__sns li {
  list-style: none;
  width: 20%;
  margin-left: 0;
}

article .t-article__sns li a {
  display: block;
  color: #666;
  text-decoration: none;
  line-height: 40px;
  letter-spacing: 0.05em;
  font-size: 21px;
  text-align: center;
  background-color: #fff;
  width: 42px;
  height: 42px;
  border-radius: 50px;
  padding: 4px;
  margin: 0 auto;
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);
  position: relative;
  box-sizing: border-box;
}

article .t-article__sns li a img {
  width: 21px;
  height: auto;
}

article .t-article__sns li a.line {
  padding: 6px;
}

article .t-article__sns li a.line img {
  width: 30px;
  height: auto;
}

article .t-article__sns li a:hover .icon-sns {
  position: absolute;
  z-index: -1;
  border: 1px solid #eee;
  border-radius: 100px;
  opacity: 0;
  box-shadow: 0px 0px 2px #eee, inset 0px 0px 2px #eee;
  -webkit-animation: pulsate 0.7s ease-out;
  -webkit-animation-iteration-count: infinite;
  -moz-animation: pulsate 0.7s ease-out;
  -moz-animation-iteration-count: infinite;
  /* センター揃えとリングの大きさ */
  height: 80px;
  width: 80px;
  top: -19px;
  left: -19px;
  margin: auto;
}

/*イベント用調整*/

.tie-up-event-article article .share {
  margin: 0 0 24px 0;
  fill: #666;
}

/*SVGアイコン類*/

span.camera {
  display: inline-block;
}

span.camera::before,
li.date::before,
li.area::before,
li.site::before,
li.link::before,
li.charge::before,
li.time::before,
dt.date::before,
dt.area::before,
dt.site::before,
dt.link::before,
dt.charge::before,
dt.time::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  vertical-align: sub;
  background-repeat: no-repeat;
  margin: 0 4px 0 0;
}

span.camera::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cg%3E%0A%3Cpath%20fill%3D%22%23707070%22%20d%3D%22M256%2C224.828c-34.344%2C0-62.156%2C28.078-62.156%2C62.719s27.813%2C62.719%2C62.156%2C62.719s62.156-28.078%2C62.156-62.719%20S290.344%2C224.828%2C256%2C224.828z%22%3E%3C%2Fpath%3E%0A%3Cpath%20fill%3D%22%23707070%22%20class%3D%22st0%22%20d%3D%22M478.766%2C135.75h-58.625c-13.078%2C0-24.938-7.75-30.297-19.781l-17.547-39.313%20c-5.359-12.016-17.234-19.766-30.313-19.766H170.016c-13.078%2C0-24.953%2C7.75-30.328%2C19.766l-17.531%2C39.313%20C116.797%2C128%2C104.938%2C135.75%2C91.859%2C135.75H33.234C14.875%2C135.75%2C0%2C150.766%2C0%2C169.266v252.328c0%2C18.5%2C14.875%2C33.516%2C33.234%2C33.516%20h244.25h201.281c18.344%2C0%2C33.234-15.016%2C33.234-33.516V169.266C512%2C150.766%2C497.109%2C135.75%2C478.766%2C135.75z%20M256%2C403.844%20c-63.688%2C0-115.297-52.063-115.297-116.297S192.313%2C171.234%2C256%2C171.234s115.297%2C52.078%2C115.297%2C116.313%20S319.688%2C403.844%2C256%2C403.844z%22%3E%3C%2Fpath%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E);
}

li.date::before,
dt.date::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cg%3E%0A%09%3Cpath%20fill%3D%22%23707070%22%20d%3D%22M149.193%2C103.525c15.994%2C0%2C28.964-12.97%2C28.964-28.972V28.964C178.157%2C12.97%2C165.187%2C0%2C149.193%2C0%0A%09%09C133.19%2C0%2C120.22%2C12.97%2C120.22%2C28.964v45.589C120.22%2C90.556%2C133.19%2C103.525%2C149.193%2C103.525z%22%3E%3C%2Fpath%3E%0A%09%3Cpath%20fill%3D%22%23707070%22%20d%3D%22M362.815%2C103.525c15.995%2C0%2C28.964-12.97%2C28.964-28.972V28.964C391.78%2C12.97%2C378.81%2C0%2C362.815%2C0%0A%09%09c-16.002%2C0-28.972%2C12.97-28.972%2C28.964v45.589C333.843%2C90.556%2C346.813%2C103.525%2C362.815%2C103.525z%22%3E%3C%2Fpath%3E%0A%09%3Cpath%20fill%3D%22%23707070%22%20d%3D%22M435.164%2C41.288h-17.925v33.265c0%2C30.017-24.414%2C54.431-54.423%2C54.431c-30.017%2C0-54.431-24.414-54.431-54.431%0A%09%09V41.288H203.616v33.265c0%2C30.017-24.415%2C54.431-54.423%2C54.431c-30.016%2C0-54.432-24.414-54.432-54.431V41.288H76.836%0A%09%09c-38.528%2C0-69.763%2C31.234-69.763%2C69.763v331.186C7.073%2C480.766%2C38.309%2C512%2C76.836%2C512h358.328%0A%09%09c38.528%2C0%2C69.763-31.234%2C69.763-69.763V111.051C504.927%2C72.522%2C473.692%2C41.288%2C435.164%2C41.288z%20M450.023%2C429.989%0A%09%09c0%2C17.826-14.503%2C32.328-32.329%2C32.328H94.306c-17.826%2C0-32.329-14.502-32.329-32.328V170.877h388.047V429.989z%22%3E%3C%2Fpath%3E%0A%09%3Crect%20x%3D%22220.58%22%20y%3D%22334.908%22%20fill%3D%22%23707070%22%20width%3D%2270.806%22%20height%3D%2270.798%22%3E%3C%2Frect%3E%0A%09%3Crect%20x%3D%22110.839%22%20y%3D%22334.908%22%20fill%3D%22%23707070%22%20width%3D%2270.808%22%20height%3D%2270.798%22%3E%3C%2Frect%3E%0A%09%3Crect%20x%3D%22330.338%22%20y%3D%22225.151%22%20fill%3D%22%23707070%22%20width%3D%2270.824%22%20height%3D%2270.807%22%3E%3C%2Frect%3E%0A%09%3Crect%20x%3D%22330.338%22%20y%3D%22334.908%22%20fill%3D%22%23707070%22%20width%3D%2270.824%22%20height%3D%2270.798%22%3E%3C%2Frect%3E%0A%09%3Crect%20x%3D%22220.58%22%20y%3D%22225.151%22%20fill%3D%22%23707070%22%20width%3D%2270.806%22%20height%3D%2270.807%22%3E%3C%2Frect%3E%0A%09%3Crect%20x%3D%22110.839%22%20y%3D%22225.151%22%20fill%3D%22%23707070%22%20width%3D%2270.808%22%20height%3D%2270.807%22%3E%3C%2Frect%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E);
}

li.area::before,
dt.area::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cg%3E%0A%09%3Cpath%20fill%3D%22%23707070%22%20d%3D%22M256%2C0C159.969%2C0%2C82.125%2C77.859%2C82.125%2C173.906C82.125%2C269.938%2C236.797%2C512%2C256%2C512%0A%09%09c19.219%2C0%2C173.875-242.063%2C173.875-338.094C429.875%2C77.859%2C352.031%2C0%2C256%2C0z%20M256%2C240.406c-36.719%2C0-66.5-29.781-66.5-66.5%0A%09%09c0-36.75%2C29.781-66.531%2C66.5-66.531s66.516%2C29.781%2C66.516%2C66.531C322.516%2C210.625%2C292.719%2C240.406%2C256%2C240.406z%22%3E%3C%2Fpath%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E);
}

li.site::before,
dt.site::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cg%3E%0A%09%3Cpolygon%20fill%3D%22%23707070%22%20points%3D%22256%2C0%2024%2C69.344%2024%2C109.344%2040%2C109.344%2040%2C129.344%20472%2C129.344%20472%2C109.344%20488%2C109.344%20488%2C69.344%22%3E%3C%2Fpolygon%3E%0A%09%3Cpolygon%20fill%3D%22%23707070%22%20points%3D%22472%2C432%2040%2C432%2040%2C464%2024%2C464%2024%2C512%20488%2C512%20488%2C464%20472%2C464%22%3E%3C%2Fpolygon%3E%0A%09%3Cpolygon%20fill%3D%22%23707070%22%20points%3D%22384%2C397.344%20384%2C413.344%20448%2C413.344%20448%2C397.344%20440%2C397.344%20440%2C169.344%20448%2C169.344%20448%2C153.344%20%0A%09%09384%2C153.344%20384%2C169.344%20392%2C169.344%20392%2C397.344%22%3E%3C%2Fpolygon%3E%0A%09%3Cpolygon%20fill%3D%22%23707070%22%20points%3D%22277.344%2C397.344%20277.344%2C413.344%20341.344%2C413.344%20341.344%2C397.344%20333.344%2C397.344%20333.344%2C169.344%20%0A%09%09341.344%2C169.344%20341.344%2C153.344%20277.344%2C153.344%20277.344%2C169.344%20285.344%2C169.344%20285.344%2C397.344%22%3E%3C%2Fpolygon%3E%0A%09%3Cpolygon%20fill%3D%22%23707070%22%20points%3D%22170.656%2C397.344%20170.656%2C413.344%20234.656%2C413.344%20234.656%2C397.344%20226.656%2C397.344%20226.656%2C169.344%20%0A%09%09234.656%2C169.344%20234.656%2C153.344%20170.656%2C153.344%20170.656%2C169.344%20178.656%2C169.344%20178.656%2C397.344%22%3E%3C%2Fpolygon%3E%0A%09%3Cpolygon%20fill%3D%22%23707070%22%20points%3D%2264%2C397.344%2064%2C413.344%20128%2C413.344%20128%2C397.344%20120%2C397.344%20120%2C169.344%20128%2C169.344%20128%2C153.344%20%0A%09%0964%2C153.344%2064%2C169.344%2072%2C169.344%2072%2C397.344%22%3E%3C%2Fpolygon%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E);
}

li.link::before,
dt.link::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cg%3E%0A%09%3Cpath%20fill%3D%22%23707070%22%20d%3D%22M509.681%2C102.798c-4.641-24-16.344-47.141-34.875-65.578C462.462%2C24.86%2C448.087%2C15.501%2C432.79%2C9.298%0A%09%09c-22.984-9.297-48.047-11.609-72.047-7c-23.953%2C4.641-47.047%2C16.391-65.578%2C34.922l-98.578%2C98.594%0A%09%09c-0.516%2C0.484-0.984%2C1-1.438%2C1.531c0.172-0.031%2C0.328-0.094%2C0.5-0.094c28.969-5.797%2C58.734-3.094%2C86.125%2C7.828%0A%09%09c0.141%2C0.031%2C0.297%2C0.125%2C0.438%2C0.172l60.516-60.516c5.906-5.891%2C12.578-10.203%2C19.781-13.109%0A%09%09c10.719-4.375%2C22.609-5.484%2C33.922-3.266c11.359%2C2.188%2C21.984%2C7.594%2C30.813%2C16.375c5.906%2C5.906%2C10.234%2C12.578%2C13.156%2C19.766%0A%09%09c4.375%2C10.719%2C5.469%2C22.625%2C3.266%2C33.953c-2.219%2C11.344-7.594%2C21.969-16.422%2C30.797l-98.609%2C98.625%0A%09%09c-5.891%2C5.906-12.547%2C10.234-19.734%2C13.156c-10.75%2C4.359-22.672%2C5.438-33.984%2C3.266c-11.297-2.219-21.953-7.594-30.813-16.422%0A%09%09c-4.766-4.797-8.484-10.078-11.297-15.75c-0.281-0.063-0.578-0.156-0.875-0.203c-6.578-1.234-13.625-0.547-19.797%2C2.031%0A%09%09c-4.266%2C1.781-8.141%2C4.359-11.484%2C7.734l-1.922%2C1.953c-10%2C12.125-17.875%2C29.266-2.109%2C51.828%0A%09%09c12.328%2C12.297%2C26.672%2C21.656%2C42%2C27.859c22.984%2C9.328%2C47.984%2C11.609%2C71.984%2C6.969c23.969-4.609%2C47.063-16.328%2C65.594-34.891%0A%09%09l98.609-98.594c12.313-12.328%2C21.688-26.719%2C27.891-42.047C512.009%2C151.813%2C514.306%2C126.782%2C509.681%2C102.798z%22%3E%3C%2Fpath%3E%0A%09%3Cpath%20fill%3D%22%23707070%22%20d%3D%22M230.259%2C366.907c-0.188-0.094-0.313-0.125-0.469-0.188l-60.516%2C60.531%0A%09%09c-5.891%2C5.906-12.563%2C10.203-19.734%2C13.156c-10.75%2C4.375-22.641%2C5.438-33.953%2C3.266c-11.328-2.219-21.984-7.594-30.813-16.422%0A%09%09c-5.906-5.922-10.219-12.563-13.156-19.766c-4.359-10.719-5.453-22.609-3.25-33.953c2.188-11.328%2C7.578-21.953%2C16.406-30.797%0A%09%09l98.625-98.641c5.875-5.891%2C12.547-10.188%2C19.734-13.109c10.734-4.406%2C22.609-5.469%2C33.969-3.297%0A%09%09c11.313%2C2.234%2C21.953%2C7.594%2C30.781%2C16.406c4.797%2C4.781%2C8.516%2C10.109%2C11.344%2C15.781c0.266%2C0.078%2C0.563%2C0.141%2C0.859%2C0.219%0A%09%09c6.594%2C1.203%2C13.641%2C0.484%2C19.766-2.047c4.313-1.797%2C8.172-4.406%2C11.516-7.781l1.922-1.922c10-12.109%2C17.844-29.281%2C2.109-51.828%0A%09%09c-12.297-12.313-26.672-21.641-41.984-27.859c-23-9.297-48-11.609-72.031-6.984c-23.969%2C4.625-47.047%2C16.391-65.594%2C34.906%0A%09%09l-98.578%2C98.625c-12.344%2C12.266-21.719%2C26.703-27.891%2C42.031c-9.328%2C22.953-11.641%2C47.984-6.984%2C71.953%0A%09%09c4.641%2C24.047%2C16.359%2C47.094%2C34.875%2C65.594c12.328%2C12.359%2C26.719%2C21.719%2C42.031%2C27.938c22.984%2C9.313%2C48%2C11.594%2C72%2C6.953%0A%09%09c24-4.609%2C47.078-16.313%2C65.578-34.891l98.609-98.641c0.516-0.453%2C0.984-1%2C1.453-1.453c-0.156%2C0-0.344%2C0.063-0.5%2C0.063%0A%09%09C287.399%2C380.517%2C257.634%2C377.829%2C230.259%2C366.907z%22%3E%3C%2Fpath%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E);
}

li.charge::before,
dt.charge::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cg%3E%0A%09%3Cpath%20fill%3D%22%23707070%22%20d%3D%22M512%2C210.781v-60.474c0-23.885-19.362-43.247-43.243-43.247H43.242C19.361%2C107.059%2C0%2C126.421%2C0%2C150.306v60.878%0A%09%09c21.957%2C3.154%2C38.854%2C21.988%2C38.854%2C44.819S21.957%2C297.67%2C0%2C300.816v60.886c0%2C23.877%2C19.361%2C43.239%2C43.242%2C43.239h425.514%0A%09%09c23.881%2C0%2C43.243-19.362%2C43.243-43.239v-60.483c-24.026-1.124-43.173-20.907-43.173-45.215%0A%09%09C468.827%2C231.697%2C487.974%2C211.914%2C512%2C210.781z%20M121.515%2C377.656h-14.877v-38.802h14.877V377.656z%20M121.515%2C309.485h-14.877%0A%09%09v-38.801h14.877V309.485z%20M121.515%2C241.316h-14.877v-38.81h14.877V241.316z%20M121.515%2C173.147h-14.877v-38.802h14.877V173.147z%22%3E%3C%2Fpath%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E);
}

li.time::before,
dt.time::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cg%3E%0A%09%3Cpath%20fill%3D%22%23707070%22%20d%3D%22M256%2C0C114.84%2C0%2C0%2C114.844%2C0%2C256c0%2C141.164%2C114.84%2C256%2C256%2C256s256-114.836%2C256-256%0A%09%09C512%2C114.844%2C397.16%2C0%2C256%2C0z%20M256%2C451.047c-107.547%2C0-195.047-87.492-195.047-195.047c0-107.547%2C87.5-195.047%2C195.047-195.047%0A%09%09S451.047%2C148.453%2C451.047%2C256C451.047%2C363.555%2C363.547%2C451.047%2C256%2C451.047z%22%3E%3C%2Fpath%3E%0A%09%3Cpath%20fill%3D%22%23707070%22%20d%3D%22M258.434%2C115.758c-12.81%2C0-23.195%2C10.383-23.195%2C23.195v105.008l-74.047%2C74.047%0A%09%09c-9.061%2C9.054-9.061%2C23.742%2C0%2C32.804c9.058%2C9.055%2C23.744%2C9.055%2C32.804%2C0l87.635-87.633v-23.766V138.953%0A%09%09C281.631%2C126.141%2C271.246%2C115.758%2C258.434%2C115.758z%22%3E%3C%2Fpath%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E);
}

/*サムネイル上の表示アイテム*/

dl dd.thumb {
  position: relative;
  line-height: 10px;
  font-size: 11px;
}

/*サムネイルnewアイコン*/

dl dd.thumb span.label.new {
  position: absolute;
  top: 5px;
  left: 5px;
  font-size: 9px;
  border: 1px solid #ff5a5d;
  background-color: #ff5a5d;
  color: #fff;
}

/*サムネイルイベント期間フィルター*/

dl dd.thumb p {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  font-size: 11px;
  color: #fff;
  box-sizing: border-box;
}

dl dd.thumb p.duration {
  height: 30%;
  background-color: rgba(255, 90, 98, 0.8);
  padding: 8px 0;
}

dl dd.thumb p.antecedent {
  height: 30%;
  background-color: rgba(112, 112, 112, 0.8);
  padding: 14px 0;
}

dl dd.thumb p.closed {
  height: 100%;
  background-color: rgba(112, 112, 112, 0.8);
  line-height: 18px;
  padding: 30px 0;
}

/*ページネーション*/

.pager-container {
  margin: 0 auto;
  text-align: center;
  clear: both;
}

.mini_pager_left,
.mini_pager_right {
  position: relative;
  background-color: #f8f8f8;
  border: 1px solid #ebebeb;
  color: #000;
  box-sizing: border-box;
  transition: all 0.3s;
  cursor: pointer;
  border-radius: 5px;
  font-size: 12px;
  text-align: left;
}

.mini_pager_left {
  padding: 3px 12px 3px 20px;
}

.mini_pager_right {
  padding: 3px 20px 3px 12px;
}

.mini_pager_left:hover,
.mini_pager_right:hover {
  color: #000;
  text-decoration: none;
  background-color: #ebebeb;
}

.mini_pager_left::before {
  display: block;
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M4%2C12L15.9%2C0L20%2C4l-8%2C8l8%2C8l-4.1%2C4L4%2C12z%22%2F%3E%3C%2Fsvg%3E);
  top: 7px;
  left: 4px;
}

.mini_pager_left.off::before {
  display: block;
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23999%22%20d%3D%22M4%2C12L15.9%2C0L20%2C4l-8%2C8l8%2C8l-4.1%2C4L4%2C12z%22%2F%3E%3C%2Fsvg%3E);
  top: 7px;
  left: 4px;
}

.mini_pager_right::after {
  display: block;
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M8.122%2024l-4.122-4%208-8-8-8%204.122-4%2011.878%2012z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E);
  top: 7px;
  right: 4px;
}

.mini_pager_right.off::after {
  display: block;
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23999%22%20d%3D%22M8.122%2024l-4.122-4%208-8-8-8%204.122-4%2011.878%2012z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E);
  top: 7px;
  right: 4px;
}

.mini_pager_left.off,
.mini_pager_right.off {
  position: relative;
  background-color: #eee;
  border: 1px solid #ebebeb;
  box-sizing: border-box;
  transition: all 0.3s;
  border-radius: 5px;
  font-size: 12px;
  text-align: left;
}

.pager-container .off {
  color: #999;
  cursor: default;
}

.pager-container .current {
  color: #ffb400;
}

.pager-container .mini_pager_current_num {
  font-size: 12px;
}

.pager-container ul li {
  display: inline-block;
  font-weight: 700;
  font-size: 14px;
  margin: 0 4px;
}

.pager-container span {
  margin: 0 4px;
}

/*ボタンリンクベース*/

a.link-button,
a.link-button-text {
  display: block;
  width: 100%;
  padding: 8px 24px 8px 12px;
  font-size: 13px;
  font-weight: 700;
  line-height: 23px;
  text-align: center;
  border-radius: 5px;
  border-bottom: 2px solid #ddd;
  background-color: #eee;
  position: relative;
  box-sizing: border-box;
}

a.link-button::after,
a.link-button-text::after {
  position: absolute;
  content: "";
  width: 11px;
  height: 11px;
  top: 38%;
  right: 3%;
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23707070%22%20d%3D%22M8.122%2024l-4.122-4%208-8-8-8%204.122-4%2011.878%2012z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E);
}

a.link-button:hover,
a.link-button-text:hover {
  text-decoration: none;
}

/* service用ヘッダフッタ */

.service_header > div {
  float: left;
  margin: 8px 0 0 0;
}

.service_header p.total-counter {
  float: right;
  font-weight: 700;
  font-size: 13px;
  margin: 8px 0;
}

.service_header p.total-counter span {
  display: inline-block;
  margin: 0 2px;
  font-size: 18px;
  color: #ff5a5d;
}

/*hタグ小さめ接頭辞*/

span.header-prefix {
  font-size: 13px;
  line-height: 14px;
  display: block;
  font-weight: 700;
}

/*特選記事子ページボトムスライダー*/

section.recommend-choice-article {
  background-color: #f7f7f7;
  padding: 24px 0;
  margin: 0 0 32px 0;
  width: 100%;
}

section.recommend-choice-article h3 {
  font-size: 14px;
  font-weight: 700;
  margin: 0 0 8px 0;
}

section.recommend-choice-article li dl dd.thumb {
  max-width: 155px;
  min-height: 100px;
  margin: 0 0 5px 0;
}

section.recommend-choice-article li dl dd.thumb img {
  width: 100%;
}

section.recommend-choice-article li dl dd.release-date {
  text-align: right;
}

section.recommend-choice-article li dl dt {
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

/* 特選記事子ページボトムスライダー swiper over ride*/

section.recommend-choice-article .swiper-pagination-bullet-active {
  background: #787878;
}

section.recommend-choice-article .swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: -8px;
}

/*タイアップSPEED用フッター*/

section.service_footer {
  background-color: #fcfcfc;
  padding: 20px 0 0 0;
}

section.service_footer dl {
  margin: 0 0 20px 0;
}

section.service_footer dl dt {
  font-size: 14px;
  font-weight: 700;
  margin: 0 0 4px 0;
}

section.service_footer dl dd {
  font-size: 12px;
  line-height: 20px;
}

/*サイドカラム広告枠*/

section.side-column .add-block {
  margin: 0 0 32px 0;
  text-align: center;
}

/*floatリストの親高さ整地*/

li.article-container::after,
ul.article-list::after {
  content: "";
  display: block;
  clear: both;
}

/***********************************************************************************記事詳細・イベント詳細画面*/

article section.landing-container {
  margin: 0 0 32px;
}

article .main-visual,
article .event-main-visual {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 256px;
  margin: 20px 0 8px 0;
}

article .main-visual img,
article .event-main-visual img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

article h1 {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
}

article .article-meta-info,
article .event-article-meta-info {
  margin: 8px 0 16px 0;
  overflow: auto;
}

article .article-meta-info span,
article .event-article-meta-info span {
  margin: 0 4px 0 0;
}

article .event-article-meta-info span:last-child {
  float: right;
}

article .event-article-meta-info span:last-child::after {
  content: "";
  display: block;
  clear: both;
}

article .share div {
  width: 20%;
  font-size: 10px;
  line-height: 24px;
}

article p {
  font-size: 16px;
  margin: 0 0 16px;
  line-height: 1.6;
}

article div.article-block {
  margin: 0 0 32px;
  font-size: 14px;
  overflow: auto;
}

/*****************cms入稿エリア(共通)*/

article section.article {
  margin: 0 0 40px 0;
}

article section.article h2 {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  border-bottom: solid 2px #333;
  padding: 10px 0;
  margin: 0 0 20px;
  clear: both;
}

/*article section.article h2::after {
  position: absolute;
  bottom: -2px;
  left: 0;
  content: "";
  width: 161px;
  height: 2px;
  background-color: #ffb400;
}*/

article section.article h3 {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
  margin: 2em 0 1em;
  border-left: solid 5px #333;
  padding: 0 0 0 10px;
  clear: both;
}

article .article.con_lbox .article-block a:not(.external-link-button),
article section.side-column dl.corp-prof a,
article section.side-column p a {
  color: #1e3f7e;
  text-decoration: underline;
}

article .article.con_lbox .article-block a:visited:not(.external-link-button),
article section.side-column dl.corp-prof a:visited,
article section.side-column p a:visited {
  color: #7f4776;
  text-decoration: underline;
}

article .article.con_lbox .article-block a.link-button {
  margin: 0 0 16px 0;
  color: #383838;
  text-decoration: none;
}

article .article.con_lbox .article-block a.link-button.gallery {
  margin: 0 0 16px 0;
  background-color: #fcfcfc;
  border-top: 1px solid #eee;
  border-right: 1px solid #eee;
  border-left: 1px solid #eee;
  color: #383838;
  text-decoration: none;
}

article .article.con_lbox .article-block a.link-button.gallery::after {
  top: 35%;
  right: 14%;
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23FFB400%22%20d%3D%22M8.122%2024l-4.122-4%208-8-8-8%204.122-4%2011.878%2012z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E);
}

article section.article address dl {
  background-color: #f8f8f8;
  padding: 24px 24px 24px 16px;
  margin: 0 0 16px 0;
  clear: both;
}

article section.article address dl:after {
  content: "";
  display: block;
  clear: both;
}

article section.article address dl .portrait {
  width: 80px;
  float: left;
  margin: 0 16px 0 0;
}

article section.article address dl .name {
  font-size: 14px;
  line-height: 18px;
  font-weight: 700;
  padding: 0 0 2px 0;
  border-bottom: 1px solid #ffb400;
  margin: 0 0 12px 0;
  overflow: auto;
}

article section.article address dl .description {
  font-size: 12px;
  line-height: 20px;
  overflow: auto;
}

article section.article .relation-car-container span {
  margin: 0 4px 0 0;
}

article section.article .relation-car-container ul::after {
  content: "";
  display: block;
  clear: both;
}

article section.article .relation-car-container ul li {
  float: left;
  margin: 0 0 4px 0;
}

article section.article .relation-car-container ul li span {
  font-weight: 500;
}

/***********イベントCMS入稿エリア*/

article ul.event-outline-list {
  width: 100%;
  margin: 0 0 16px 0;
}

article ul.event-outline-list li {
  margin: 0 0 8px 0;
}

article ul.event-outline-list li dl {
  line-height: 20px;
}

article ul.event-outline-list li dt {
  font-size: 16px;
  font-weight: 700;
}

article ul.event-outline-list li dt span {
  margin: 0 0 0 8px;
}

article ul.event-outline-list li dd {
  font-size: 16px;
}

article section.article p.event-introduction {
  margin: 0 0 40px 0;
}

article section.article .event-map {
  width: 100%;
  height: 250px;
}

.tie-up-event-article article section.article.con_lbox ul.article-list a {
  color: #383838;
  text-decoration: none;
}

.tie-up-event-article article section.article.con_lbox ul.article-list a:hover {
  color: #787878;
  text-decoration: underline;
}

/************イベントCMSサイドカラム*/

.tie-up-event-article .side-column h3 {
  font-size: 16px;
  font-weight: 700;
  margin: 0 0 12px 0;
}

article .side-column ul.event-outline-list li dt {
  font-size: 14px;
  font-weight: 700;
}

article .side-column ul.event-outline-list li dd {
  font-size: 13px;
  word-break: break-word;
}

/***************article style.cssより流用*/

/*右寄せ、左寄せ*/

article section.article div.photo-container-vertical-middle {
  margin: 0 0 16px 16px;
  float: right;
  width: 32%;
}

article section.article div.photo-container-vertical-middle-left {
  margin: 0 16px 16px 0;
  float: left;
  width: 32%;
}

article section.article div.photo-container-vertical-middle,
article section.article div.photo-container-vertical-middle-left {
  content: "";
  display: block;
  clear: both;
}

article section.article div.photo-container-vertical-middle img,
div.photo-container-vertical-middle-left img {
  width: 100%;
}

article section.article div.photo-container-vertical-middle,
article section.article div.photo-container-vertical-middle-left,
article section.article div.photo-container-horizontal::after {
  content: "";
  display: block;
  clear: both;
}

/*水平並び 最大5*/

article section.article div.photo-container-horizontal,
article section.article div.text-center {
  width: 100%;
  margin: 0 auto 16px auto;
}

article section.article div.photo-container-horizontal a,
article section.article div.text-center a {
  display: block;
  text-align: left;
}

article section.article div.photo-container-horizontal a img,
article section.article div.text-center a img {
  width: 100%;
}

/*水平並び >1*/

article section.article div.photo-container-horizontal a {
  float: left;
  margin-right: 2%;
}

article section.article div.photo-container-horizontal a:last-child {
  margin-right: 0;
}

article section.article div.photo-container-horizontal a:first-child:nth-last-child(2),
div.photo-container-horizontal a:first-child:nth-last-child(2) ~ a {
  width: 49%;
}

article section.article div.photo-container-horizontal a:first-child:nth-last-child(3),
div.photo-container-horizontal a:first-child:nth-last-child(3) ~ a {
  width: 31.6666666667%;
}

article section.article div.photo-container-horizontal a:first-child:nth-last-child(4),
div.photo-container-horizontal a:first-child:nth-last-child(4) ~ a {
  width: 23.5%;
}

article section.article div.photo-container-horizontal a:first-child:nth-last-child(5),
div.photo-container-horizontal a:first-child:nth-last-child(5) ~ a {
  width: 18.4%;
}

/*暫定処置 水平並び >1 のとき最後の画像a要素内にキャプションを入れ込むのでデザイン上キャプション文字を右寄せとする。*/

article section.article div.photo-container-horizontal a span.article-caption {
  /*  float: right;*/
}

article section.article div.youtube-container {
  position: relative;
  padding-bottom: 56.25%;
  margin: 0 0 16px;
  height: 0;
  overflow: hidden;
}

article section.article div.youtube-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*cmsクライアント情報入稿エリア TODO:ギャラリーページデザインに関し、旧デザインのオーバーライドをしています。記事面刷新後に再調整要です。*/

.ac1-container.tieupPhoto .article-block {
  float: unset;
  width: auto;
}

article section.side-column h4,
article section.side-column h3,
.ac1-container.tieupPhoto .right-container .tieup-sideNoticeArea h3,
.ac1-container.tieupPhoto .right-container .tieup-sideBannerArea h3,
.ac1-container.tieupPhoto .tieup-noticeArea h3,
.ac1-container.tieupPhoto .tieup-bannerArea h3,
.ac1-container.tieupPhoto .right-container .article-block h4,
.ac1-container.tieupPhoto .article-block h4 {
  font-size: 16px;
  line-height: 20px;
  font-weight: 700;
  width: 100%;
  border-bottom: solid 2px #eee;
  padding: 0 0 4px;
  margin: 0 0 20px;
  position: relative;
}

.ac1-container.tieupPhoto .right-container .tieup-sideNoticeArea h3,
.ac1-container.tieupPhoto .right-container .tieup-sideBannerArea h3,
.ac1-container.tieupPhoto .tieup-noticeArea h3,
.ac1-container.tieupPhoto .tieup-bannerArea h3 {
  border-left: none;
}

/*override*/

.ac1-container.tieupPhoto .right-container .tieup-sideBannerArea,
.ac1-container.tieupPhoto .right-container .tieup-sideNoticeArea,
.ac1-container.tieupPhoto .right-container .article-block,
.ac1-container.tieupPhoto .tieup-noticeArea,
.ac1-container.tieupPhoto .tieup-bannerArea,
.ac1-container.tieupPhoto .tieup-noticeArea,
.ac1-container.tieupPhoto .tieup-bannerArea {
  margin: 0 0 40px 0;
}

/*override*/

.ac1-container.tieup .right-container .tieup-sideNoticeArea {
  padding: 0;
  background: #fff;
  border: none;
}

/*override*/

.ac1-container.tieupPhoto .tieup-noticeArea,
.ac1-container.tieupPhoto .tieup-bannerArea,
.ac1-container.tieupPhoto .right-container .article-block,
.ac1-container.tieupPhoto .article-block {
  padding: 0 15px;
  text-align: left;
}

article section.side-column h4::after,
article section.side-column h3::after,
.ac1-container.tieupPhoto .right-container .tieup-sideNoticeArea h3::after,
.ac1-container.tieupPhoto .right-container .tieup-sideBannerArea h3::after,
.ac1-container.tieupPhoto .tieup-noticeArea h3::after,
.ac1-container.tieupPhoto .tieup-bannerArea h3::after,
.ac1-container.tieupPhoto .right-container .article-block h4::after,
.ac1-container.tieupPhoto .article-block h4::after {
  position: absolute;
  bottom: -2px;
  left: 0;
  content: "";
  width: 102px;
  height: 2px;
  background-color: #ffb400;
}

article section.side-column dl.corp-prof {
  font-size: 14px;
}

article section.side-column dl.corp-prof dt {
  float: left;
  width: 20%;
  margin: 0 8px 0 0;
}

article section.side-column dl.corp-prof dl::after {
  content: "";
  display: block;
  clear: both;
}

article section.side-column ul.article-list li {
  margin: 0 0 16px 0;
}

article section.side-column ul.article-list dl {
  line-height: 18px;
}

article section.side-column ul.article-list dl::after {
  content: "";
  display: block;
  clear: both;
}

article section.side-column ul.article-list dt {
  overflow: auto;
  font-size: 13px;
  font-weight: 700;
  line-height: normal;
}

article section.side-column ul.article-list dd.thumb {
  float: left;
  width: 96px;
  margin: 0 4px 0 0;
}

article section.side-column ul.article-list dd.thumb img {
  width: 100%;
  height: auto;
}

/***********イベント詳細その他*/

section.event-bottom-nav.is-fixed {
  height: 40px;
}

section.event-bottom-nav ul {
  width: 100%;
  overflow: auto;
  display: block;
  position: fixed;
  bottom: 0;
  z-index: 20;
}

section.event-bottom-nav li {
  width: 25%;
  height: 40px;
  font-size: 12px;
  color: #fff;
  line-height: 32px;
  float: left;
  padding: 4px 0;
  text-align: center;
  background-color: #707070;
  border-right: 1px solid #fff;
  box-sizing: border-box;
}

section.event-bottom-nav li:last-child {
  border-right: none;
}

section.event-bottom-nav li.is-current {
  background-color: #ffb400;
}

section.event-bottom-nav li a {
  color: #fff;
  display: inline-block;
  width: 100%;
  line-height: inherit;
  height: 100%;
}

/********************************************************************************** 記事・イベント一覧画面*/

.tie-up-article-list section.article-list-bottom,
.tie-up-event-article-list section.article-list-top {
  margin: 0 0 68px 0;
}

.tie-up-article-list .header-pager h1 {
  font-size: 20px;
  line-height: 24px;
  font-weight: 700;
}

.tie-up-article-list .footer-pager p,
.tie-up-article-list .header-pager p {
  float: right;
  font-size: 14px;
  margin: 0 0 8px 0;
}

.tie-up-article-list .footer-pager p span,
.tie-up-article-list .header-pager p span {
  font-size: 16px;
  font-weight: 700;
}

.tie-up-article-list .footer-pager ul {
  margin: 0 0 8px 0;
}

.tie-up-article-list .article-list li.article-container,
.tie-up-event-article .article-list li.article-container {
  margin: 0 0 24px 0;
}

.tie-up-article-list .article-list dl dd.thumb,
.tie-up-event-article .article-list dl dd.thumb {
  float: left;
  max-width: 40%;
  margin: 0 8px 8px 0;
}

.tie-up-event-article-list .event-article-list li dl dd.thumb {
  float: left;
  width: 36%;
  margin: 0 8px 8px 0;
}

.tie-up-article-list .article-list dl dd.thumb img,
.tie-up-event-article .article-list dl dd.thumb img {
  width: 100%;
  height: auto;
}

.tie-up-article-list .article-list dl dd.category,
.tie-up-event-article .article-list dl dd.category {
  line-height: 18px;
}

.tie-up-article-list .article-list dl dd.maker_release,
.tie-up-event-article .article-list dl dd.maker_release {
  color: #999;
  font-size: 10px;
  line-height: 18px;
}

.tie-up-article-list .article-list dl dd.maker_release span,
.tie-up-event-article .article-list dl dd.maker_release span {
  display: inline-block;
  font-weight: 700;
  margin: 0 8px 0 0;
}

.tie-up-article-list .article-list dl dt,
.tie-up-event-article .article-list dl dt {
  font-size: 0.95rem;
  line-height: 22px;
  font-weight: 700;
  color: #313233;
  margin: 0 0 2px 0;
  overflow: auto;
}

.tie-up-article-list .article-list dl dd.description,
.tie-up-event-article .article-list dl dd.description {
  clear: both;
  font-size: 13px;
  line-height: 16px;
  color: #313233;
  margin: 0 0 8px 0;
}

.tie-up-article-list .article-list dl dd .relation-car-container ul li,
.tie-up-event-article .article-list dl dd .relation-car-container ul li {
  float: left;
  line-height: 18px;
  margin: 0 4px 2px 0;
}

.tie-up-article-list .article-list dl dd .relation-car-container ul::after,
.tie-up-event-article .article-list dl dd .relation-car-container ul::after {
  content: "";
  display: block;
  clear: both;
}

/****************記事一覧（契約期間満了）*/

.article-list li.article-container.completion dl {
  line-height: 8px;
}

.article-list li.article-container.completion dl dd.thumb {
  max-width: 24%;
}

.article-list li.article-container.completion dl dd.category {
  display: inline;
}

.article-list li.article-container.completion dl dd.category .label {
  font-size: 11px;
  padding: 2px 1px;
}

.article-list li.article-container.completion dl dd.maker_release {
  display: inline-block;
  vertical-align: text-top;
  padding: 2px 0 0 0;
  line-height: 14px;
}

.article-list li.article-container.completion dl dt {
  font-size: 12px;
  line-height: 18px;
  margin: 0 0 4px 0;
  overflow: auto;
}

/******************サイドカラム*/

section.side-column {
  margin: 0 0 40px 0;
}

section.side-column .article-block,
section.side-column .article-special-block {
  margin: 0 0 40px 0;
}

/*開催中のイベント情報*/

.event-article-list li {
  clear: both;
}

.event-article-list li dl {
  padding: 8px 0;
  border-bottom: 1px dashed #ddd;
}

.tie-up-event-article-list .event-article-list li dl {
  padding: 10px 0;
  border-bottom: none;
}

.event-article-list li:last-child dl {
  border-bottom: none;
}

.event-article-list li dl dd.thumb {
  float: left;
  margin: 0 8px 8px 0;
  max-width: 30%;
}

.event-article-list li dl dd.thumb img {
  width: 100%;
  height: auto;
}

.event-article-list li dl dd.meta-info {
  overflow: auto;
  line-height: initial;
}

.event-article-list li dl dd.description {
  overflow: auto;
  font-size: 12px;
  line-height: 16px;
}

.event-article-list li dl dd.description p {
  margin: 0 0 4px 0;
}

.event-article-list li dl dd.description ul li {
  padding: 0 0 4px 0;
}

.event-article-list li dl dd.description ul li.date {
  padding: 0 0 4px 1.6em;
  text-indent: -1.6em;
}

.event-article-list li dl dt {
  font-size: 13px;
  font-weight: 700;
  line-height: 16px;
  margin: 0 0 4px 0;
}

/******************************タイアップSPEEDトップ*/

.tie-up-index h2 {
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  margin: 0 0 16px 0;
  width: 100%;
  border-bottom: solid 2px #eee;
  padding: 0 0 4px;
  position: relative;
}

.tie-up-index h2::after {
  position: absolute;
  bottom: -2px;
  left: 0;
  content: "";
  width: 38%;
  height: 2px;
  background-color: #ffb400;
}

.tie-up-index h3,
.tie-up-index h4,
.tie-up-article-list h4 {
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  margin: 0 0 16px 0;
}

/*****カスタムパーツ最新記事*/

.tie-up-index .recent_recommend,
.tie-up-index .event,
.tie-up-index .car {
  margin: 0 0 56px 0;
}

.tie-up-index .article {
  margin: 0 0 56px 0;
  padding: 16px 8px 8px;
  background: #f7f7f7;
}

.tie-up-index section.car {
  margin: 0;
}

.tie-up-index .news {
  margin: 0 0 44px 0;
}

.tie-up-index .recent_recommend .article-list li,
.tie-up-index .news .article-list li {
  float: left;
  width: 48%;
  margin: 0 0 16px 0;
}

.tie-up-index .recent_recommend .article-list li::after,
.tie-up-index .news .article-list li::after,
.tie-up-index .article .article-list li::after {
  content: "";
  display: block;
  clear: both;
}

.tie-up-index .recent_recommend .article-list li:nth-child(odd),
.tie-up-index .news .article-list li:nth-child(odd) {
  float: left;
}

.tie-up-index .recent_recommend .article-list li:nth-child(even),
.tie-up-index .news .article-list li:nth-child(even) {
  float: right;
}

.tie-up-index .recent_recommend .article-list li dl dd.thumb img,
.tie-up-index .news .article-list li dl dd.thumb img,
.tie-up-index .article .article-list li dl dd.thumb img {
  width: 100%;
}

.tie-up-index .recent_recommend .article-list li dl dd.category {
  float: left;
  margin: 4px 4px 0 0;
  line-height: 14px;
}

.tie-up-index .article .article-list li dl dd.category {
  float: left;
}

.tie-up-index .recent_recommend .article-list li dl dd.maker_release {
  color: #999;
  font-size: 10px;
  line-height: 12px;
  display: inline-block;
  vertical-align: middle;
  margin: 4px 4px 0 0;
}

.tie-up-index .article .article-list li dl dd.maker_release {
  color: #999;
  font-size: 10px;
  line-height: 24px;
  margin: 0 0 0 8px;
  display: inline-block;
  vertical-align: top;
}

.tie-up-index .news .article-list li dl dd.maker_release {
  color: #999;
  font-size: 10px;
  line-height: 24px;
  vertical-align: middle;
  text-align: right;
}

.tie-up-index .recent_recommend .article-list li dl dt,
.tie-up-index .news .article-list li dl dt {
  clear: both;
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
  margin: 4px 0 0 0;
}

.tie-up-index .event .event-article-list {
  margin: 0 0 12px 0;
}

.tie-up-index .article p {
  font-size: 13px;
  line-height: 1.3;
  margin: 0 0 16px 0;
}

.tie-up-index .article .article-list li {
  margin: 0 0 12px 0;
}

.tie-up-index .article .article-list li dl dd.thumb {
  width: 40%;
  float: left;
  margin: 0 12px 0 0;
}

.tie-up-index .article .article-list li dl dt {
  font-size: 13px;
  line-height: 19px;
}

.tie-up-index .article .article-list li dl dt::after {
  content: "";
  display: block;
  clear: both;
}

.tie-up-index .car .article-list li {
  margin: 0 0 12px 0;
}

.tie-up-index .car .article-list li dl::after {
  content: "";
  display: block;
  clear: both;
}

.tie-up-index .car .article-list li dl dd.thumb {
  width: 32%;
  min-height: 30px;
  float: left;
  margin: 0 8px 0 0;
}

.tie-up-index .car .article-list li dl dd.thumb img {
  width: 100%;
}

.tie-up-index .car .article-list li dl dd.category {
  float: left;
}

.tie-up-index .car .article-list li dl dd.maker_release {
  color: #999;
  font-size: 10px;
  line-height: 24px;
  margin: 0 0 0 4px;
  display: inline-block;
  vertical-align: top;
}

.tie-up-index .car .article-list li dl dt {
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

.side-column .article-ranking-list,
.side-column .article-special-block {
  border-bottom: 1px solid #ddd;
  padding: 0 0 20px 0;
}

.side-column .article-ranking-list li {
  content: "";
  display: block;
  clear: both;
}

.side-column .article-ranking-list li dl,
.side-column .article-special-list li dl {
  margin: 0 0 20px 0;
}

.side-column .article-ranking-list li dl::after,
.side-column .article-special-list li dl::after {
  content: "";
  display: block;
  clear: both;
}

.side-column .article-ranking-list li dl dd.thumb {
  float: left;
  margin: 0 8px 0 0;
  max-width: 36%;
}

.side-column .article-ranking-list li dl dd.thumb img {
  width: 100%;
  height: auto;
}

.side-column .article-ranking-list li dl dd.post-info {
  margin: 0 0 4px 0;
  line-height: 14px;
}

.side-column .article-ranking-list li dl dt {
  font-size: 13px;
  line-height: 16px;
}

.side-column .article-special-block {
  margin: 0 0 36px 0;
}

.side-column .article-special-list li {
  clear: both;
  overflow: auto;
}

.side-column .article-special-list li dl::after {
  content: "";
  display: block;
  clear: both;
}

.side-column .article-special-list li dl dd.thumb {
  float: left;
  margin: 0 8px 0 0;
  max-width: 30%;
}

.side-column .article-special-list li dl dd.thumb img {
  width: 100%;
  height: auto;
}

.side-column .article-special-list li dl dt {
  font-size: 13px;
  line-height: 16px;
}

/**************************** スライダー類*/

/************ 新着スライダー */

.tie-up-index section.recent_post {
  width: 100%;
  box-sizing: border-box;
}

.tie-up-index section.recent_post .swiper-wrapper {
  margin: 0 0 28px 0;
  box-sizing: border-box;
}

.tie-up-index section.recent_post .swiper-slide a {
  display: block;
}

.tie-up-index section.recent_post .swiper-slide a img {
  width: 100%;
  display: block;
  position: relative;
}

.tie-up-index section.recent_post .swiper-slide p {
  position: initial;
  height: 72px;
  bottom: 0;
  width: 100%;
  background-color: rgba(56, 56, 56, 0.8);
  color: #fff;
  font-size: 14px;
  line-height: 20px;
  padding: 8px 4%;
  box-sizing: border-box;
}

.tie-up-index section.recent_post .swiper-slide p span {
  display: inline-block;
  position: absolute;
  bottom: 4px;
  right: 4%;
  font-size: 12px;
}

/* 新着スライダー swiper over ride*/

.tie-up-index section.recent_post .swiper-pagination-bullet-active {
  background: #787878;
}

.tie-up-index section.recent_post .swiper-container-horizontal > .swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 3px;
}

.tie-up-index section.recent_post .swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
  background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M12%200c-6.627%200-12%205.373-12%2012s5.373%2012%2012%2012%2012-5.373%2012-12-5.373-12-12-12zm-1.218%2019l-1.782-1.75%205.25-5.25-5.25-5.25%201.782-1.75%206.968%207-6.968%207z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E);
}

.tie-up-index section.recent_post .swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
  background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M8%2C16A8%2C8%2C0%2C1%2C0%2C0%2C8%2C8%2C8%2C0%2C0%2C0%2C8%2C16ZM8.81%2C3.33%2C10%2C4.5%2C6.5%2C8%2C10%2C11.5%2C8.81%2C12.67%2C4.17%2C8Z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E);
}

.tie-up-index section.recent_post .swiper-button-next,
.tie-up-index section.recent_post .swiper-button-prev {
  background-size: 20px;
  top: 40%;
}

/***************** 車種別記事スライダー*/

.tie-up-index section.car .car-swipe-head {
  font-size: 13px;
  color: #000;
}

.tie-up-index section.car .car-swipe-head .swiper-scrollbar {
  height: 3px;
  width: 96%;
}

.tie-up-index section.car .car-swipe-head .swiper-slide {
  color: #666;
  width: 120px !important;
  height: 32px;
  line-height: 32px;
  border-top: 1px solid #ddd;
  border-right: 1px solid #ddd;
  border-radius: 4px 4px 0 0;
  text-align: center;
  position: relative;
  left: 0 !important;
}

.tie-up-index section.car .car-swipe-head .swiper-slide:first-child {
  border-left: 1px solid #ddd;
}

.tie-up-index section.car .car-swipe-head .selected {
  background: #666;
  color: #fff;
  font-weight: 700;
}

.tie-up-index section.car .car-swipe-content {
  border: 1px solid #ddd;
}

.tie-up-index section.car .car-swipe-content .swiper-slide .article-list {
  padding: 16px 8px;
}

/*SPのみのレイアウト調整*/

/*******************************************************************************************************************************/

/**********************  Layout 4 PC                       *********************************************************************/

/************************************************************************************** pc向け共通部分 じゃまなので一旦とじます*/

/*ヘッダーのログイン*/

.menu__block {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-direction: row;
  width: 1020px;
  margin: auto auto 20px;
}

.menu__search {
  width: 490px;
}

.menu__account {
  width: 490px;
  margin-bottom: 20px;
}

.menu__account a:hover {
  color: #f26161;
}

.menu__details {
  margin-top: 10px;
}

.menu__summary {
  font-weight: 700;
  cursor: pointer;
}

.menu__keyword--term {
  font-weight: 700;
}

.menu__keyword--list {
  font-size: 13px;
}

.menu__keyword--item {
  display: inline;
}

.menu__keyword--item a {
  display: inline-block;
}

.menu__keyword--item a:hover {
  background-color: #efefef;
  text-decoration: none;
  transition: all 0.5s 0s ease;
}

.menu__account--term {
  font-weight: 700;
}

.menu__account--term:nth-of-type(2) {
  margin-top: 10px;
}

.menu__logout {
  margin-top: 20px;
}

.menu__logout--term {
  padding: 20px 10px;
  border: solid 1px #ccc;
  border-radius: 6px;
  text-align: center;
}

.menu__input {
  width: 100%;
  padding: 8px;
  font-size: 16px;
  border: 1px solid #ccc !important;
  border-radius: 4px !important;
  box-sizing: border-box;
}

.menu__input--keyword {
  width: calc(100% - 80px);
}

.menu__button--search {
  border-radius: 4px;
  cursor: pointer;
  width: 70px;
  background-color: #ddd;
}

.menu__button--search:hover {
  background-color: #c4c4c4;
}

.menu__button--login {
  margin-top: 10px;
  cursor: pointer;
  background-color: #ddd;
}

.menu__button--login:hover {
  background-color: #c4c4c4;
}

.menu__reminder {
  font-size: 12px;
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
}

.menu__reminder--item {
  box-sizing: border-box;
  text-align: center;
}

.menu__reminder--item br {
  display: none;
}

.tieup-pro {
  padding: 0;
  box-shadow: 0 4px 6px #bbb;
  background-color: #fff4dd;
  border-bottom: 3px solid;
  -o-border-image: linear-gradient(to right, #fff4dd, #ffd06c, #f7de05, #edac06, #f7de05, #ffd06c, #fff4dd) 1 100%;
  border-image: linear-gradient(to right, #fff4dd, #ffd06c, #f7de05, #edac06, #f7de05, #ffd06c, #fff4dd) 1 100%;
  border-image-slice: 1;
}

.tieup-pro .category,
.tieup-pro dt,
.tieup-pro .release-date {
  padding: 0 4px;
}

/*ヘッダー20191204*/

.header {
  border-bottom: solid 2px #333;
  padding: 20px 0 24px;
  position: relative;
}

.header a {
  color: #333;
}

.header img {
  vertical-align: middle;
  max-width: 100%;
  height: auto;
}

.header__inner {
  width: 1020px;
  margin: auto;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.8;
  display: flex;
  justify-content: space-between;
  position: relative;
  align-items: center;
}

.header__logo img {
  width: auto;
  height: 25px;
  vertical-align: middle;
}

.header__logo--main {
  display: inline-block;
}

.header__logo--sub {
  display: inline-block;
  color: #333;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  vertical-align: -8px;
}

.header__logo a {
  color: inherit;
}

.header .tmsLink {
  flex-grow: 1;
  padding: 0 0 0 10px;
}

.header__menu {
  display: flex;
  justify-content: space-between;
  width: 30px;
  height: 38px;
  cursor: pointer;
}

.header__menu--service {
  display: flex;
}

.header__menu--service a {
  text-align: center;
  display: block;
}

.header__menu--service svg {
  width: 18px;
  height: 18px;
}

.header__menu--service dl {
  width: 60px;
}

.header__menu--service dt {
  height: 20px;
}

.header__menu--service dd {
  font-size: 11px;
  font-weight: 700;
}

.header__button--search {
  cursor: pointer;
}

.header__button--search img {
  width: 26px;
  height: auto;
}

.header__search {
  display: none;
  background-color: #efefef;
}

.header__search--inner {
  width: 1020px;
  margin: auto;
  padding: 10px 0;
  box-sizing: border-box;
  text-align: right;
}

.header__search--input {
  font-size: 16px;
  padding: 4px 8px 6px;
  background-color: #fff;
  width: 600px;
}

.header__search--submit {
  font-size: 16px;
  color: #fff;
  padding: 6px 9px 8px;
  background-color: #607d8b;
  line-height: 1.3;
  vertical-align: top;
  cursor: pointer;
}

.header__search--open {
  display: block;
}

.header-modal .service-nav__inner {
  display: flex;
  flex-wrap: wrap;
}

.header-modal .service-nav__inner--list {
  font-size: 14px;
  line-height: 1;
  width: 16.6666666667%;
}

.header-modal .service-nav__inner a {
  color: #333;
  display: block;
  text-decoration: none;
  text-align: center;
  padding: 10px 0;
  margin: 4px;
  box-sizing: border-box;
  border: solid 1px #ccc;
  box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.1);
}

.header-modal-open {
  overflow: hidden;
  height: 100%;
}

.header-modal-open .header-modal {
  visibility: visible;
  opacity: 1;
  transition: all 0.5s;
}

.header-modal {
  width: 100%;
  height: 95vh;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background-color: rgba(255, 255, 255, 0.99);
  padding: 20px 20px 100px;
  box-sizing: border-box;
  z-index: 1000;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
  visibility: hidden;
  opacity: 0;
  transition: all 0.5s;
}

.header-modal__inner {
  width: 1020px;
  margin: auto;
  padding-bottom: 50px;
}

.header-modal__heading {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  padding: 0 0 8px;
  border-bottom: solid 2px #ccc;
}

.header-modal__heading--small {
  font-size: 14px;
  font-weight: 700;
  margin: 8px 0 0;
}

.header-modal__catalog {
  margin: 16px 0 0;
}

.header-modal__catalog--inner {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.header-modal__catalog__primary {
  width: 47%;
}

.header-modal__catalog__secondary {
  width: 47%;
}

.header-modal__maker {
  display: flex;
  flex-wrap: wrap;
}

.header-modal__maker li {
  width: 20%;
  margin: 0;
}

.header-modal__maker--link {
  display: block;
  text-decoration: none;
}

.header-modal__maker--logo {
  display: block;
  margin: 0 0 5px;
}

.header-modal__maker--name {
  display: block;
  text-align: center;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.3;
  height: 3em;
}

.header-modal__more-link {
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  margin: 8px 0 0;
}

.header-modal__more-link::after {
  content: "";
  clear: both;
  display: block;
}

.header-modal__more-link a {
  display: block;
  float: right;
}

.header-modal__category-list {
  font-size: 15px;
}

.header-modal__category-list--list {
  border-bottom: 1px solid #c4c4c4;
}

.header-modal__category-list--list a {
  display: block;
  width: 100%;
  padding: 12px 0;
  cursor: pointer;
  background: no-repeat 100% 50% url(data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20height%3D%2224%22%20viewBox%3D%220%200%209%2028%22%3E%3Cpath%20fill%3D%22%23F26161%22%20d%3D%22M9.297%2015c0%200.125-0.063%200.266-0.156%200.359l-7.281%207.281c-0.094%200.094-0.234%200.156-0.359%200.156s-0.266-0.063-0.359-0.156l-0.781-0.781c-0.094-0.094-0.156-0.219-0.156-0.359%200-0.125%200.063-0.266%200.156-0.359l6.141-6.141-6.141-6.141c-0.094-0.094-0.156-0.234-0.156-0.359s0.063-0.266%200.156-0.359l0.781-0.781c0.094-0.094%200.234-0.156%200.359-0.156s0.266%200.063%200.359%200.156l7.281%207.281c0.094%200.094%200.156%200.234%200.156%200.359z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E);
}

.header-modal__category-wrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.header-modal__category__primary {
  width: 25%;
}

.header-modal__category__primary .header-modal__category-list {
  margin-bottom: 18px;
}

.header-modal__category__secondary {
  width: 70%;
}

.header-modal__category__secondary--inner {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.header-modal__category__secondary .header-modal__new-car,
.header-modal__category__secondary .header-modal__car-life,
.header-modal__category__secondary .header-modal__article {
  width: 32%;
}

.header-modal__category__secondary .header-modal__news .header-modal__category-list--list {
  font-size: 16px;
  border-bottom: none;
}

.header-modal__category__secondary .header-modal__news .header-modal__category-list--list a {
  padding: 0;
}

.header__button--menu {
  width: 30px;
  height: 30px;
}

.header__button--menu::before,
.header__button--menu::after {
  position: absolute;
  content: "";
  display: block;
  width: 30px;
  border-top-style: solid;
  border-bottom-style: solid;
  transition: 0.2s;
}

.header__button--menu::before {
  top: 6px;
  border-top-width: 4px;
  border-bottom-width: 2px;
  border-color: #333;
}

.header__button--menu::after {
  top: 18px;
  border-top-width: 2px;
  border-bottom-width: 4px;
  border-color: #333;
}

.header__button--menu.header-modal-open::before,
.header__button--menu.header-modal-open::after {
  top: 16px;
  height: 0;
  transition: 0.1s transform 0.2s, 0.1s height 0s, 0.2s top 0s;
}

.header__button--menu.header-modal-open::before {
  border-top-width: 2px;
  transform: rotate(135deg);
}

.header__button--menu.header-modal-open::after {
  border-bottom-width: 2px;
  transform: rotate(45deg);
}

.menu__block {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-direction: row;
  width: 1020px;
  margin: auto;
  line-height: 1.6;
}

.menu__block .underline_large {
  border-bottom: solid 2px #ccc;
  font-size: 16px;
  font-weight: 700;
  padding: 0 0 4px;
  margin: 0 0 8px;
  cursor: default;
}

.menu__search {
  width: 490px;
}

.menu__account {
  width: 490px;
}

.menu__account a:hover {
  color: #f26161;
}

.menu__details {
  margin-top: 10px;
}

.menu__summary {
  font-weight: 700;
  cursor: pointer;
  outline: none;
}

.menu__keyword--term {
  font-size: 14px;
  font-weight: 700;
  margin: 0 0 4px;
}

.menu__keyword--list {
  font-size: 13px;
}

.menu__keyword--item {
  display: inline;
}

.menu__keyword--item a {
  display: inline-block;
  padding: 4px;
}

.menu__keyword--item a:hover {
  background-color: #efefef;
  text-decoration: none;
  transition: all 0.5s 0s ease;
}

.menu__account--term {
  font-size: 14px;
  font-weight: 700;
  margin: 0 0 4px;
}

.menu__account--term:nth-of-type(2) {
  margin-top: 10px;
}

.menu__logout {
  margin-top: 20px;
}

.menu__logout--term {
  padding: 20px 10px;
  border: solid 1px #ccc;
  border-radius: 6px;
  text-align: center;
}

.menu__input {
  width: 100%;
  padding: 8px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}

.menu__input--keyword {
  width: 410px;
}

.menu__button--search {
  border-radius: 4px;
  cursor: pointer;
  width: 70px;
  background-color: #ddd;
}

.menu__button--search:hover {
  background-color: #c4c4c4;
}

.menu__button--login {
  margin-top: 10px;
  cursor: pointer;
  background-color: #ddd;
}

.menu__button--login:hover {
  background-color: #c4c4c4;
}

.menu__reminder {
  font-size: 12px;
  margin-top: 6px;
  display: flex;
  justify-content: space-between;
}

.menu__reminder--item {
  box-sizing: border-box;
  text-align: center;
}

.menu__reminder--item br {
  display: none;
}

.navigation {
  margin: 0 0 10px;
}

.navigation .service-nav {
  margin: 0;
}

.navigation .service-nav__inner {
  display: flex;
  width: 1020px;
  margin: auto;
}

.navigation .service-nav__inner--list {
  flex-grow: 1;
  font-size: 14px;
  line-height: 1;
  border-bottom: solid 5px #f7f7f7;
}

.navigation .service-nav__inner a,
.navigation .service-nav__inner span {
  color: #333;
  display: block;
  text-decoration: none;
  text-align: center;
  padding: 10px 8px;
  box-sizing: border-box;
}

.navigation .service-nav__current {
  border-bottom-color: #c00;
}

.header-modal .service-nav__inner {
  display: flex;
  flex-wrap: wrap;
}

.header-modal .service-nav__inner--list {
  font-size: 14px;
  line-height: 1;
  width: 16.6666666667%;
}

.header-modal .service-nav__inner--list:hover {
  transition: 400ms;
  border-color: #c00;
}

.header-modal .service-nav__inner a {
  color: #333;
  display: block;
  text-decoration: none;
  text-align: center;
  padding: 10px 0;
  margin: 4px;
  box-sizing: border-box;
  border: solid 1px #ccc;
  box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.1);
}

/*旅　NEWアイコン*/

.header-modal-open .navigation .service-nav__new::before {
  display: none;
}

.service-nav__new a {
  position: relative;
}

.service-nav__new a::before {
  width: 32px;
  margin: 0 4px 0 0;
  padding: 4px 4px 3px;
  border-radius: 4px;
  background-color: #c00;
  color: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  content: "NEW";
}

.header-modal .service-nav__new::before {
  top: -16px;
  right: 0;
}

/*end*/

/* CMSタイトル画像 */

.article-block .photo-container-first-large img {
  width: 100%;
  height: auto;
  vertical-align: middle;
  max-width: 100%;
}

.article-block .photo-container-first-horizontal img {
  width: 136px;
  height: 93px;
  -o-object-fit: cover;
  object-fit: cover;
}

/* CMSタイトル画像 */

/* CMS関連記事リンク */

.t-related {
  margin: 20px 0;
}

.t-related__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  background-color: #f7f7f7;
  padding: 15px;
}

.t-related__thumbnail img {
  width: 120px;
}

.t-related__data {
  width: calc(100% - 130px);
}

.t-related__header {
  display: flex;
  flex-wrap: wrap;
}

.t-related__article--category {
  font-size: 12px;
  font-weight: 400;
  margin-right: 10px;
}

.t-related__article--update {
  font-size: 12px;
  font-weight: 400;
}

.t-related__heading {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  display: block;
  color: #1d668a !important;
  text-decoration: none !important;
}

.t-related__heading:hover {
  text-decoration: underline !important;
}

.t-related__pr {
  background-color: #aaaaaa;
  color: #fff;
  text-align: center;
  border-radius: 3px;
  padding: 3px 8px 1px 8px;
  line-height: 1em;
  font-size: 12px;
}

.t-related__head-pr {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* CMS関連記事リンク */

/* カスタムカー・カスタムショップ関連-20210430 */

.banner-area {
  width: 300px;
}

.banner-area a {
  margin: 0 0 5px;
}

/* ▼ おすすめカスタムコンテンツ */

.custom_content {
  margin: 0 0 64px;
}

.custom_content-list {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.custom_content-list li {
  width: calc((100% - 16px) / 3);
  height: auto;
  margin: 0 8px 8px 0;
  padding: 12px 8px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  background-color: #fff7e6;
  border-bottom: 2px solid #f0e0b0;
  border-radius: 4px;
  box-sizing: border-box;
}

.custom_content-list li a {
  text-decoration: none;
}

.custom_content-list li img {
  width: 90px;
  height: auto;
  display: block;
  margin: auto auto 4px;
}

.custom_content-list li span {
  display: block;
}

.copy {
  font-size: 12px;
}

.pt {
  padding: 10px 0 0;
}

/* ▼キーワードで探す */

.custom_category {
  margin: 0 0 88px;
}

.custom_category-list {
  display: inline-block;
  margin: 0 auto 20px;
}

.custom_category-list li {
  display: inline-block;
  margin: 0 10px 15px 10px;
}

.custom_category-list li a {
  padding: 5px 10px;
  border-radius: 20px;
  background-color: #eee;
  box-sizing: border-box;
  font-size: 14px;
  font-weight: 700;
}

/* 特選枠 */

.customshop {
  padding: 0px;
  box-shadow: 0 4px 6px #bbb;
  background-color: #ebfffc;
  border-bottom: 3px solid;
  -o-border-image: linear-gradient(to right, #fff4dd, #00ae96, #49d0bd, #0d8574, #49d0bd, #00ae96, #fff4dd) 1 100%;
  border-image: linear-gradient(to right, #fff4dd, #00ae96, #49d0bd, #0d8574, #49d0bd, #00ae96, #fff4dd) 1 100%;
  border-image-slice: 1;
}

.customshop .category,
.customshop dt,
.customshop .release-date {
  padding: 0 4px;
}

span.label.icon-customshop {
  border: 1px solid #00ae96;
  background-color: #00ae96;
  color: #fff;
}

/* カスタムカー・カスタムショップ関連-20210430 ここまで */

/* 車中泊仕様車＆キャンピングカー特集！-20210531 */

.campingcar {
  margin: 0 0 88px 0;
}

.campingcar h2 div {
  display: inline-block;
}

.campingcar h2 svg {
  width: 32px;
  height: auto;
  margin: 0 0 -3px;
}

.campingcar h2 .cls-1 {
  fill: #3b3b3b;
}

.tie-up-index .campingcar p {
  font-size: 14px;
  line-height: 1.3;
  margin: 0 0 16px 0;
}

.tie-up-index .campingcar .article-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.tie-up-index .campingcar .article-list li {
  width: 212px;
  margin: 0 0 16px;
}

.tie-up-index .campingcar .article-list li dt {
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
  margin: 4px 0 0 0;
}

.tie-up-index .campingcar .article-list li dl dd.thumb img {
  width: 100%;
}

.tie-up-index .campingcar .article-list li dl dd.maker_release {
  line-height: 24px;
  margin: 4px 0 0 4px;
}

.tie-up-index .campingcar .article-list li dl dd.maker_release {
  color: #999;
  font-size: 10px;
  line-height: 24px;
  vertical-align: middle;
  text-align: right;
}

/* 追加css-20210531 */

.tie-up-index .recent_recommend p {
  font-size: 14px;
  line-height: 1.3;
  margin: 0 0 16px 0;
}

/* モーダル呼び出し用ボタン-20210603 */

.tie-up-index .button-area {
  display: flex;
  justify-content: space-between;
  margin: 16px 0 0;
}

.tie-up-index .button-area .link-button {
  width: 49%;
  line-height: 1.3;
  text-align: center;
}

.tie-up-index .button-area .link-button span {
  display: block;
  position: relative;
  top: 50%;
  text-align: center;
  transform: translateY(-50%);
}

.fs12 {
  font-size: 12px;
  top: 20% !important;
}

.tie-up-index .button-area .link-button span br {
  display: none;
}

.is-sp {
  display: none;
}

/* カスタム配下導線-20210608 */

.custom_link .navi {
  position: relative;
  margin: 0 0 30px;
}

.custom_link .navi .navi__inner {
  width: 1020px;
  margin: auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  position: relative;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 20px 0;
}

.custom_link .navi__item {
  width: 49%;
  font-size: 14px;
  line-height: 1.5;
  border-radius: 4px;
  background-color: #fff;
}

.custom_link .navi .navi__item a {
  padding: 6px;
  display: block;
  background-color: rgba(0, 0, 0, 0);
  border-radius: 6px;
  box-shadow: 0 4px 0 0 rgba(0, 0, 0, 0.1);
  color: #fff;
  text-align: center;
  line-height: 1.3;
}

.custom_link .navi .shopcar a {
  background-color: #00ae96;
}

.custom_link .navi .custom a {
  background-color: #ffb400;
}

.custom_link .navi a:hover {
  text-decoration: none;
  cursor: pointer;
  opacity: 0.8;
}

.custom_link .navi .navi__item--main {
  font-size: 18px;
  font-weight: 700;
}

/* 追加css-ランキング-20210531 */

.side-column .article-ranking-list li dl {
  margin: 0 0 8px 0;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.side-column .article-ranking-list li dl dd {
  width: 60%;
}

.side-column .article-ranking-list li dl dt.thumb {
  position: relative;
  max-width: 36%;
}

.side-column .article-ranking-list li dl dt.thumb img {
  width: 100%;
  height: auto;
}

.side-column .article-ranking-list li dl dd .title {
  margin: 0 0 4px;
  font-size: 13px;
  line-height: 1.3;
  font-weight: 700;
}

.tie-up-index .recent_recommend p {
  font-size: 14px;
  line-height: 1.3;
  margin: 0 0 16px 0;
}

.article-ranking-list li dl dt {
  font-weight: 700;
}

.article-ranking-list .name {
  font-size: 11px;
  line-height: 1.3;
}

.article-ranking-list .release {
  color: #999;
  font-size: 10px;
  line-height: 1;
  text-align: right;
}

/* テーブル */

.article-table-container table {
  border-collapse: collapse;
  width: 100%;
  margin: 0 0 15px;
  font-size: 13px;
  line-height: 1.5;
}

.article-table-container table th,
.article-table-container table td {
  border: 1px solid #ccc;
  padding: 6px;
  text-align: left;
  vertical-align: middle;
  word-break: break-all;
}

.article-table-container thead th {
  background-color: #777;
  color: #fff;
  font-weight: 700;
}

@media print, screen and (min-width: 481px) {
  /* TODO: new header commonに移植する */

  header {
    width: 100%;
  }

  header .header_logo_container {
    position: relative;
    width: 100%;
    height: 58px;
    background-color: #fff;
    border-bottom: 2px solid #000;
  }

  header .header_logo_container.modal-open-now {
    position: fixed;
    z-index: 500;
  }

  header .header_inner {
    width: 1020px;
    padding: 0 15px;
    margin: 0 auto;
    position: relative;
  }

  header .header_inner .logo {
    padding: 15px 0 0 0;
    width: 500px;
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
  }

  header .header_inner .logo a:hover {
    text-decoration: none;
  }

  header .header_inner .logo svg {
    width: 100px;
    height: auto;
    fill: #231815;
  }

  header .header_inner span.current_service,
  h1.current_service {
    display: inline-block;
    margin: 0 0 0 8px;
    color: #000;
    font-weight: bold;
    font-size: 18px;
    line-height: 30px;
  }

  header .header_inner span.current_service,
  h1.current_service a {
    cursor: pointer;
  }

  header .header_inner .hamburger_bk,
  header .header_inner .hamburger {
    position: absolute;
    z-index: 500;
    display: block;
    width: 26px;
    height: 22px;
    top: 0;
    right: 23px;
    margin-top: 16px;
    transition: all 0.4s;
    box-sizing: border-box;
    cursor: pointer;
  }

  header section.service_nav {
    width: 1020px;
    margin: 0 auto;
  }

  header section.service_nav::after {
    content: "";
    display: block;
    clear: both;
  }

  header section.service_nav .header_nav_ul {
    display: -moz-flex;
    display: flex;
    margin: 0 0 10px 0;
  }

  header section.service_nav .header_nav_ul li {
    font-size: 0.8em;
    text-align: center;
    border-bottom: 5px solid #f7f7f7;
    flex-grow: 1;
  }

  header section.service_nav .header_nav_ul li.is-current {
    border-bottom: 5px solid #f90101;
  }

  header section.service_nav .header_nav_ul li a {
    display: inline-block;
    width: 100%;
    height: 100%;
    padding: 7px 0;
  }

  header section.service_nav .header_nav_ul li a:hover {
    text-decoration: none;
    color: #000;
  }

  header section.service_nav .header_nav_ul li a:visited {
    color: #000;
  }

  /*ハンバーガー内ナビゲーション*/

  #navigation {
    position: fixed;
    display: none;
    width: 100%;
    height: 100vh;
    top: 60px;
    right: 0;
    z-index: 499;
    background-color: rgba(255, 255, 255, 0.97);
    overflow-y: scroll;
    font-size: 16px;
    line-height: 26px;
  }

  #navigation h3 {
    font-size: 16px;
    font-weight: bold;
  }

  #navigation .lbox {
    width: 48%;
    float: left;
  }

  #navigation .rbox {
    width: 48%;
    float: right;
  }

  #navigation .top_nav_box {
    width: 1020px;
    margin: 24px auto 20px;
    padding: 0 15px;
  }

  #navigation .top_nav_box::after {
    content: "";
    display: block;
    clear: both;
  }

  #navigation .top_nav_box .service_nav .header_nav_ul {
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 0 0 10px 0;
  }

  #navigation .top_nav_box .service_nav .header_nav_ul li {
    border: 1px solid #c4c4c4;
    height: 44px;
    box-sizing: border-box;
    flex: 0 0 32%;
    margin: 0 2% 8px 0;
  }

  #navigation .top_nav_box .service_nav .header_nav_ul li:nth-child(3n) {
    margin-right: 0;
  }

  #navigation .top_nav_box .service_nav .header_nav_ul li a {
    padding: 0;
    display: -moz-flex;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #navigation .top_nav_box .service_nav .header_nav_ul li a:hover {
    background-color: #c4c4c4;
    color: #000;
    text-decoration: none;
    transition: all 0.5s 0s ease;
  }

  #navigation .bottom_nav_box {
    width: 1020px;
    margin: 0 auto 24px;
    padding: 0 15px 64px 15px;
    overflow: auto;
  }

  #navigation .bottom_nav_box .bottom_nav_1 {
    float: left;
    width: 25%;
  }

  #navigation .bottom_nav_box .bottom_nav_1::after {
    content: "";
    display: block;
    clear: both;
  }

  #navigation .bottom_nav_box .bottom_nav_3 {
    float: right;
    width: 71%;
  }

  #navigation .bottom_nav_box .bottom_nav_3::after {
    content: "";
    display: block;
    clear: both;
  }

  #navigation .bottom_nav_box .bottom_nav_3 h3.underline_large a {
    width: 32%;
  }

  #navigation .bottom_nav_box .bottom_nav_3 .bottom_nav_container {
    float: left;
    width: 32%;
    margin: 0 2% 0 0;
  }

  #navigation .bottom_nav_box .bottom_nav_3 .bottom_nav_container:last-child {
    margin: 0;
  }

  #navigation .underline_large {
    border-bottom: 2px solid #707070;
    font-weight: bold;
    padding: 0 0 4px 0;
    margin: 0 0 12px 0;
    cursor: default;
  }

  #navigation .underline_small {
    border-bottom: 3px solid #c4c4c4;
    font-weight: bold;
    padding: 4px 0;
    margin: 8px 0 0;
    cursor: default;
  }

  #navigation .general_lst_container a {
    display: inline-block;
    width: 100%;
    padding: 12px 0 12px 4px;
    cursor: pointer;
    background: no-repeat 98% 50% url(data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20height%3D%2224%22%20viewBox%3D%220%200%209%2028%22%3E%3Cpath%20fill%3D%22%23F26161%22%20d%3D%22M9.297%2015c0%200.125-0.063%200.266-0.156%200.359l-7.281%207.281c-0.094%200.094-0.234%200.156-0.359%200.156s-0.266-0.063-0.359-0.156l-0.781-0.781c-0.094-0.094-0.156-0.219-0.156-0.359%200-0.125%200.063-0.266%200.156-0.359l6.141-6.141-6.141-6.141c-0.094-0.094-0.156-0.234-0.156-0.359s0.063-0.266%200.156-0.359l0.781-0.781c0.094-0.094%200.234-0.156%200.359-0.156s0.266%200.063%200.359%200.156l7.281%207.281c0.094%200.094%200.156%200.234%200.156%200.359z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E);
  }

  #navigation .general_lst {
    margin: 0 0 32px 0;
  }

  #navigation .general_lst li {
    border-bottom: 1px solid #c4c4c4;
  }

  #navigation .login_box {
    padding: 12px 0;
    background: #f7f7f7;
    text-align: center;
  }

  #navigation .login_box .login_container {
    width: 1020px;
    margin: 0 auto;
  }

  #navigation .login_box .login_container li {
    width: 238px;
    display: inline-block;
    text-align: center;
    margin: 0 4px;
  }

  #navigation .login_box .login_container li a {
    display: block;
    height: 22px;
    width: 100%;
    padding: 15px 0;
    font-size: 18px;
    font-weight: bold;
  }

  #navigation .login_box .login_container li a.login {
    background-color: #f26161;
    border: 1px solid #f26161;
    color: #fff;
  }

  #navigation .login_box .login_container li a.login:hover {
    background-color: #d25151;
    text-decoration: none;
    transition: all 0.5s 0s ease;
  }

  #navigation .login_box .login_container li a.sign_up {
    background: #fff;
    border: 1px solid #707070;
  }

  #navigation .login_box .login_container li a.sign_up:hover {
    background-color: #ccc;
    color: #000;
    text-decoration: none;
  }

  #navigation .catalog_container p {
    font-size: 14px;
    overflow: auto;
  }

  #navigation .catalog_container p a {
    display: inline-block;
    float: right;
    position: relative;
    padding: 12px 0;
  }

  #navigation .catalog_container p a::before {
    display: block;
    position: absolute;
    width: 12px;
    height: 24px;
    content: "";
    left: -16px;
    background: no-repeat url(data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2210%22%20height%3D%2222%22%20viewBox%3D%220%200%209%2028%22%3E%3Cpath%20fill%3D%22%23F26161%22%20d%3D%22M9.297%2015c0%200.125-0.063%200.266-0.156%200.359l-7.281%207.281c-0.094%200.094-0.234%200.156-0.359%200.156s-0.266-0.063-0.359-0.156l-0.781-0.781c-0.094-0.094-0.156-0.219-0.156-0.359%200-0.125%200.063-0.266%200.156-0.359l6.141-6.141-6.141-6.141c-0.094-0.094-0.156-0.234-0.156-0.359s0.063-0.266%200.156-0.359l0.781-0.781c0.094-0.094%200.234-0.156%200.359-0.156s0.266%200.063%200.359%200.156l7.281%207.281c0.094%200.094%200.156%200.234%200.156%200.359z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E);
  }

  #navigation .catalog_container .maker_lst {
    display: -moz-flex;
    display: flex;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    flex-wrap: wrap;
    font-size: 12px;
    line-height: 100%;
    margin: 12px 0 0;
  }

  #navigation .catalog_container .maker_lst li {
    float: left;
    width: 90px;
    margin: 0 6px 20px 0;
    text-align: center;
  }

  #navigation .catalog_container .maker_lst li:nth-child(5n+1) {
    clear: both;
  }

  #navigation .catalog_container .maker_lst li:nth-child(n+6) {
    margin: 0 6px 0 0;
  }

  a[href^="tel:"] {
    pointer-events: none;
  }

  /*ページトップ*/

  .pagetop {
    display: none;
    position: fixed;
    bottom: 50px;
    right: 50px;
    z-index: 10;
  }

  .pagetop a svg {
    top: 24px;
    right: 24px;
  }

  .pagetop a.search {
    display: table-cell;
    font-size: 12px;
    line-height: 13px;
    vertical-align: middle;
  }

  .pagetop a.search svg {
    width: 20px;
    height: 20px;
    fill: #fff;
    top: 12px;
    right: 21px;
  }

  /* TODO: new header commonに移植する ここまで */

  /*共通ボックス*/

  .con_box {
    width: 1020px;
    margin: 0 auto;
  }

  .con_box::after {
    content: "";
    display: block;
    clear: both;
  }

  .con_box .con_lbox,
  .flex_lbox {
    float: left;
    width: 680px;
  }

  .con_box .con_rbox,
  .flex_rbox {
    float: right;
    width: 300px;
  }

  .con_box .con_rbox {
    padding: 24px 0 0 0;
  }

  .flex_lbox,
  .flex_rbox {
    padding: 0;
  }

  /* serivece用ヘッダフッタ */

  .service_header > div {
    float: left;
    margin: 8px 0 24px 0;
  }

  section.service_footer dl {
    float: left;
    margin: 0 160px 20px 0;
  }

  /*サムネイル上のアイコン pcむけ位置調整*/

  dl dd.thumb span.label.new {
    top: 8px;
    left: 8px;
  }

  dl dd.thumb p {
    font-size: 14px;
  }

  dl dd.thumb p.duration,
  dl dd.thumb p.antecedent {
    padding: 20px 0;
  }

  /*ボタンリンクPC向けサイズ*/

  a.link-button {
    font-size: 16px;
    line-height: 30px;
    padding: 12px 24px 12px 12px;
  }

  /*ボタンリンク PCではテキストにするやつ*/

  a.link-button-text {
    width: auto;
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    padding: 0 8% 0 0;
    text-align: right;
    border-radius: 0px;
    border-bottom: none;
    background-color: inherit;
  }

  a.link-button-text::after {
    top: 22%;
  }

  /***********************************************************記事・イベント記事詳細*/

  article section.landing-container {
    margin: 0 0 40px;
  }

  article .main-visual {
    width: auto;
    height: auto;
    max-width: 1020px;
    max-height: 600px;
    margin: 0 auto 26px auto;
  }

  article .event-main-visual {
    width: auto;
    height: auto;
    max-width: 680px;
    max-height: 480px;
    margin: 0 auto 16px auto;
  }

  article .main-visual img,
  article .event-main-visual img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
  }

  article h1 {
    font-size: 25px;
  }

  article .article-meta-info,
  article .event-article-meta-info {
    margin: 12px 0 16px 0;
  }

  article .share div {
    width: auto;
    min-width: 104px;
    font-size: 13px;
    line-height: 24px;
  }

  article p {
    line-height: 1.7;
  }

  article div.article-block {
    margin: 0 0 56px;
  }

  .tie-up-event-article article .share {
    -webkit-flex-pack: center;
    -moz-flex-pack: center;
    -moz-justify-content: center;
    justify-content: center;
  }

  article section.article .event-map {
    height: 400px;
  }

  /*cms入稿エリア（イベント・記事共通）*/

  article section.article {
    margin: 0 0 40px 0;
  }

  article section.article h2 {
    font-size: 22px;
  }

  /*article section.article h2::after {
    position: absolute;
    bottom: -2px;
    left: 0;
    content: "";
    width: 161px;
    height: 2px;
    background-color: #ffb400;
  }*/

  article section.article h3 {
    font-size: 20px;
  }

  article section.article a.link-button:hover {
    text-decoration: none;
  }

  article .article.con_lbox .article-block a.link-button.gallery::after {
    top: 38%;
    right: 28%;
  }

  article section.article address dl {
    background-color: #f8f8f8;
    padding: 24px 24px 24px 16px;
    margin: 0 0 16px 0;
    clear: both;
  }

  article section.article address dl:after {
    content: "";
    display: block;
    clear: both;
  }

  article section.article address dl .portrait {
    width: 80px;
    float: left;
    margin: 0 16px 0 0;
  }

  article section.article address dl .name {
    font-size: 14px;
    font-weight: 700;
    padding: 0 0 2px 0;
    border-bottom: 1px solid #ffb400;
    margin: 0 0 12px 0;
    overflow: auto;
  }

  article section.article address dl .description {
    font-size: 12px;
    line-height: 20px;
    overflow: auto;
  }

  /*article section.article .relation-car-container span {display: block;float: left;font-size: 12px;font-weight: 700;margin: 0 16px 0 0;}*/

  article section.article .relation-car-container ul::after {
    content: "";
    display: block;
    clear: both;
  }

  article section.article .relation-car-container ul li {
    float: left;
    margin: 0 0 4px 0;
  }

  article section.article .relation-car-container ul li span {
    font-weight: 500;
  }

  /*イベントCMS入稿エリア*/

  article section.article ul.event-outline-list {
    width: 100%;
  }

  article section.article ul.event-outline-list:after {
    content: "";
    display: block;
    clear: both;
  }

  article section.article ul.event-outline-list li {
    margin: 0 8px 8px 0;
  }

  article section.article ul.event-outline-list li:nth-child(2n) {
    float: left;
    width: 50%;
  }

  article section.article ul.event-outline-list li dl {
    line-height: 26px;
  }

  /*****************************article style.cssより流用*/

  /*右寄せ、左寄せ*/

  article section.article div.photo-container-vertical-middle {
    margin: 0 0 16px 16px;
    float: right;
    width: 288px;
  }

  article section.article div.photo-container-vertical-middle-left {
    margin: 0 16px 16px 0;
    float: left;
    width: 288px;
  }

  article section.article div.photo-container-vertical-middle img,
  div.photo-container-vertical-middle-left img {
    width: 100%;
  }

  article section.article div.photo-container-vertical-middle,
  article section.article div.photo-container-vertical-middle-left,
  article section.article div.photo-container-horizontal::after {
    content: "";
    display: block;
    clear: both;
  }

  /*水平並び 最大5*/

  article section.article div.photo-container-horizontal,
  article section.article div.text-center {
    width: 680px;
    margin: 0 auto 16px auto;
  }

  article section.article div.photo-container-horizontal a,
  article section.article div.text-center a {
    display: block;
    text-align: left;
  }

  article section.article div.photo-container-horizontal a img,
  article section.article div.text-center a img {
    width: 100%;
  }

  /*水平並び >1*/

  article section.article div.photo-container-horizontal a {
    float: left;
    margin-right: 8px;
  }

  article section.article div.photo-container-horizontal a:last-child {
    margin-right: 0;
  }

  article section.article div.photo-container-horizontal a:first-child:nth-last-child(2),
  div.photo-container-horizontal a:first-child:nth-last-child(2) ~ a {
    width: 49%;
  }

  article section.article div.photo-container-horizontal a:first-child:nth-last-child(3),
  div.photo-container-horizontal a:first-child:nth-last-child(3) ~ a {
    width: 32.3333333333%;
  }

  article section.article div.photo-container-horizontal a:first-child:nth-last-child(4),
  div.photo-container-horizontal a:first-child:nth-last-child(4) ~ a {
    width: 24%;
  }

  article section.article div.photo-container-horizontal a:first-child:nth-last-child(5),
  div.photo-container-horizontal a:first-child:nth-last-child(5) ~ a {
    width: 19%;
  }

  /*cmsクライアント情報入稿エリア*/

  /*サイドカラム追従*/

  article section.side-column {
    padding: 0 16px;
    position: sticky;
    top: 0;
  }

  article section.side-column h4 {
    font-size: 16px;
    line-height: 20px;
    font-weight: 700;
    width: 100%;
    border-bottom: solid 2px #eee;
    padding: 0 0 4px;
    margin: 0 0 20px;
    position: relative;
  }

  article section.side-column h4::after {
    position: absolute;
    bottom: -2px;
    left: 0;
    content: "";
    width: 102px;
    height: 2px;
    background-color: #ffb400;
  }

  article section.side-column .article-block p {
    font-size: 13px;
    line-height: 20px;
  }

  article section.side-column dl.corp-prof {
    font-size: 13px;
  }

  article section.side-column dl.corp-prof dt {
    float: left;
    width: 20%;
    margin: 0 8px 0 0;
  }

  article section.side-column dl.corp-prof dl::after {
    content: "";
    display: block;
    clear: both;
  }

  article section.side-column dl.corp-prof a {
    color: #1e3f7e;
    text-decoration: underline;
  }

  article section.side-column dl.corp-prof a[href^="tel:"] {
    pointer-events: none;
    text-decoration: none;
    color: #2d2d2d;
  }

  article section.side-column dl.corp-prof a:visited {
    color: #7f4776;
    text-decoration: underline;
  }

  /* 記事面レイアウトオーバーライド */

  .ac1-container.tieupPhoto .right-container .article-block {
    float: unset;
    width: auto;
  }

  .w970margin .pagetop {
    display: block;
    position: static;
    bottom: auto;
    right: auto;
  }

  .w970margin .pagetop a {
    display: unset;
    position: unset;
    background-color: unset;
    color: unset;
    text-align: unset;
    line-height: unset;
    text-decoration: none;
    padding: unset;
    filter: unset;
    -moz-opacity: 0.8;
    opacity: unset;
    width: unset;
    height: unset;
    border-radius: unset;
    z-index: unset;
  }

  /*********************************************************************************************************記事一覧・イベント一覧*/

  .tie-up-article-list .article-list dl dd.description,
  .tie-up-event-article-list .event-article-list dl dd.description,
  .tie-up-event-article .article-list dl dd.description {
    clear: none;
  }

  .tie-up-article-list .header-pager h1 {
    margin: 0 0 16px 0;
  }

  .tie-up-article-list .header-pager p {
    display: inline-block;
    /*float: left;*/
    margin: 0 0 8px;
  }

  .tie-up-article-list .header-pager .pager-container {
    display: inline-block;
    float: right;
    margin: 0 0 20px 0;
  }

  .tie-up-article-list .footer-pager .pager-container {
    float: right;
  }

  .tie-up-article-list .footer-pager .pager-container ul {
    display: inline-block;
  }

  .tie-up-article-list .article-list li.article-container dl dd.category,
  .tie-up-event-article .article-list li.article-container dl dd.category {
    display: inline-block;
  }

  .tie-up-article-list .article-list li.article-container dl dd.maker_release,
  .tie-up-event-article .article-list li.article-container dl dd.maker_release {
    display: inline-block;
    vertical-align: text-top;
    margin: 2px 0 0 0;
  }

  /*記事一覧契約期間満了*/

  .article-list li.article-container.completion dl dd.thumb {
    max-width: 20%;
  }

  .article-list li.article-container.completion dl dt {
    font-size: 14px;
    line-height: 20px;
  }

  /*特選記事(子ページボトム貫通）*/

  section.recommend-choice-article ul {
    display: -moz-flex;
    display: flex;
    overflow: auto;
  }

  section.recommend-choice-article li dl {
    width: 155px;
    margin: 0 12px 0 0;
  }

  section.recommend-choice-article li:last-child dl {
    margin: 0;
  }

  section.recommend-choice-article h3 {
    font-size: 16px;
  }

  /*サイドカラム側の設定*/

  .event-article-list li dl dd.description {
    clear: both;
  }

  /*********************************************************************************************************event-article-list*/

  /*イベント一覧の表調整*/

  .tie-up-event-article-list .event-article-list dl dt {
    font-size: 0.95rem;
    font-weight: 700;
    margin: 0 0 8px 0;
  }

  .tie-up-event-article-list .event-article-list dl dd.meta-info {
    margin: 0 0 4px 0;
  }

  .tie-up-event-article-list .event-article-list dl dd.description p {
    font-size: 13px;
    margin: 0 0 8px 0;
  }

  .tie-up-event-article-list .event-article-list dl dd.thumb p.closed {
    padding: 72px 0;
  }

  /********イベント詳細その他*/

  .tie-up-event-article-list .event-article-list li dl {
    padding: 12px 0;
  }

  .tie-up-event-article-list .event-article-list li dl::after {
    content: "";
    display: block;
    clear: both;
  }

  section.event-bottom-nav {
    width: 100%;
  }

  section.event-bottom-nav ul {
    width: 1020px;
    margin: 0 auto;
    display: block;
    position: fixed;
    bottom: 0;
    left: calc(50% - 510px);
  }

  section.event-bottom-nav ul.off {
    display: none;
  }

  /*****************************************************************************************************トップ*/

  /*****カスタムパーツ最新記事*/

  .tie-up-index .recent_recommend,
  .tie-up-index .event,
  .tie-up-index .car {
    margin: 0 0 88px 0;
  }

  .tie-up-index .article {
    margin: 0 0 64px 0;
  }

  .tie-up-index h2 {
    width: 100%;
    border-bottom: solid 2px #eee;
    padding: 0 0 4px;
    position: relative;
  }

  .tie-up-index h2::after {
    position: absolute;
    bottom: -2px;
    left: 0;
    content: "";
    width: 38%;
    height: 2px;
    background-color: #ffb400;
  }

  .tie-up-index .recent_recommend .article-list li,
  .tie-up-index .news .article-list li {
    width: 212px;
  }

  .tie-up-index .recent_recommend .article-list li:nth-child(even),
  .tie-up-index .news .article-list li:nth-child(even) {
    float: left;
  }

  .tie-up-index .recent_recommend .article-list li:nth-child(3n+2),
  .tie-up-index .news .article-list li:nth-child(3n+2) {
    margin: 0 22px;
  }

  .tie-up-index .recent_recommend .article-list li dl dd.maker_release {
    line-height: 24px;
    margin: 4px 0 0 4px;
  }

  .tie-up-index .event .event-article-list {
    margin: 0 0 24px 0;
  }

  .tie-up-index .event .event-article-list li {
    float: left;
    width: 48%;
    clear: none;
    box-sizing: border-box;
  }

  .tie-up-index .event .event-article-list li:nth-child(2n-1) {
    margin: 0 20px 0 0;
  }

  .tie-up-index .event .event-article-list li:nth-last-child(2) dl {
    border-bottom: none;
  }

  .tie-up-index .event .event-article-list li dl dd.thumb {
    max-width: 140px;
  }

  .tie-up-index .event .event-article-list li dl dd.description {
    clear: both;
  }

  .tie-up-index .event .event-article-list li dl dd.description li {
    float: none;
    width: 100%;
  }

  .tie-up-index .event .event-article-list li dl dd.description li:nth-child(2n-1) {
    margin: auto;
  }

  .tie-up-index .event .event-article-list li dl dd.thumb p.antecedent,
  .tie-up-index .event .event-article-list li dl dd.thumb p.duration {
    padding: 8px 0;
    line-height: 14px;
  }

  .tie-up-index .event .event-article-list::after {
    content: "";
    display: block;
    clear: both;
  }

  /*車種別記事スライダー*/

  .tie-up-index section.car .car-swipe-head .swiper-scrollbar {
    display: none;
  }

  .tie-up-index section.car .car-swipe-head .swiper-slide {
    width: 115px !important;
    cursor: pointer;
  }

  .tie-up-index .car .article-list li {
    float: left;
    width: 50%;
  }

  .tie-up-index .car .article-list li:nth-last-child(2),
  .tie-up-index .car .article-list li:last-child {
    margin: 0;
  }

  /*おすすめ編集記事*/

  .tie-up-index .article {
    background: #f7f7f7;
    padding: 20px 16px;
  }

  .tie-up-index .article .article-list li {
    float: left;
    width: 145px;
    margin: 0 0 12px 22px;
  }

  .tie-up-index .article .article-list li:nth-child(4n+1) {
    margin: 0 0 12px 0;
  }

  .tie-up-index .article .article-list li dl dd.thumb {
    float: none;
    width: 100%;
    margin: 0 0 4px 0;
  }

  .tie-up-index .article .article-list li dl dd.category {
    line-height: normal;
  }

  .tie-up-index .article .article-list li dl dd.maker_release {
    float: right;
  }

  .tie-up-index .article .article-list li dl dt {
    clear: both;
    line-height: 17px;
  }

  /*リスト折り返し*/

  .tie-up-index .recent_recommend .article-list li:nth-child(3n+1),
  .tie-up-index .event .event-article-list li:nth-child(2n+1),
  .tie-up-index .car .article-list li:nth-child(2n+1),
  .tie-up-index .article .article-list li:nth-child(4n+1),
  .tie-up-index .news .article-list li:nth-child(4) {
    clear: both;
  }

  /*サイドカラム*/

  .side-column section.recommend-choice-article {
    background-color: #fff;
  }

  .side-column section.recommend-choice-article ul {
    display: block;
  }

  .side-column section.recommend-choice-article ul li {
    margin: 0 0 18px 0;
  }

  .side-column section.recommend-choice-article ul li::after {
    content: "";
    display: block;
    clear: both;
  }

  .side-column section.recommend-choice-article li dl {
    width: 100%;
    position: relative;
  }

  .side-column section.recommend-choice-article li dl::after {
    content: "";
    display: block;
    clear: both;
  }

  .side-column section.recommend-choice-article li dl dd.thumb {
    max-width: 100%;
    max-height: unset;
    position: unset;
  }

  .side-column section.recommend-choice-article li dl dd.thumb::after {
    content: "";
    display: block;
    clear: both;
  }

  .side-column section.recommend-choice-article li dl dd.thumb::after {
    content: "";
    display: block;
    clear: both;
  }

  .side-column section.recommend-choice-article li dl dd.thumb a {
    display: block;
  }

  .side-column section.recommend-choice-article li dl dd.category {
    position: absolute;
    top: 7px;
    right: 8px;
  }

  .side-column section.recommend-choice-article li dl dd.release-date {
    position: absolute;
    bottom: 4px;
    right: 8px;
    color: #fff;
  }

  .side-column section.recommend-choice-article li dl dd.release-date span {
    color: #fff;
  }

  .side-column section.recommend-choice-article li dl.tieup-pro-side dd.release-date span {
    color: #313233;
  }

  .side-column section.recommend-choice-article li dl dt {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: left;
    bottom: 0;
    color: #fff;
    line-height: 18px;
    font-weight: 700;
  }

  .side-column section.recommend-choice-article li dl dt a {
    color: #fff;
    position: absolute;
    display: block;
    width: 92%;
    bottom: 0;
    left: 0;
    padding: 44% 4% 12% 4%;
    background-image: linear-gradient(to bottom, transparent 38%, rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0.8) 80%);
  }

  .side-column section.recommend-choice-article li dl.tieup-pro-side dt a {
    color: #313233;
    background-image: linear-gradient(to bottom, transparent 20%, #fff4dd 79%);
    border-bottom: 3px solid;
    -o-border-image: linear-gradient(to right, #fff4dd, #ffd06c, #f7de05, #edac06, #f7de05, #ffd06c, #fff4dd) 1 100%;
    border-image: linear-gradient(to right, #fff4dd, #ffd06c, #f7de05, #edac06, #f7de05, #ffd06c, #fff4dd) 1 100%;
    border-image-slice: 1;
  }

  .side-column section.recommend-choice-article li dl dt a:hover {
    text-decoration: none;
  }

  .side-column .event-article-list li dl dt {
    overflow: auto;
    line-height: 19px;
  }
}

@media screen and (min-width: 640px) {
  .navigation .service-nav__inner--list:hover {
    transition: 400ms;
    border-color: #c00;
  }

  .custom_content-list li:nth-child(3n) {
    margin-right: 0px;
  }

  .custom_content-list li .is-sp {
    display: none;
  }
}

@media screen and (max-width: 640px) {
  .external-link-button:hover {
    color: #fff;
    background-color: #333;
  }

  .external-link-button:hover:after {
    border-right: 2px solid #fff;
    border-top: 2px solid #fff;
  }

  .article-table-container__af {
    width: 100%;
    overflow-x: scroll;
  }

  .article-table-container__af table {
    width: 460px;
    overflow-x: scroll;
  }

  .article-table-container__af th:nth-of-type(1) {
    width: 130px;
    position: sticky;
    left: 0;
  }

  .article-table-container__af th:nth-of-type(1)::after,
  .article-table-container__af th:nth-of-type(1)::before {
    content: "";
    width: 1px;
    height: 100%;
    position: absolute;
  }

  .article-table-container__af th:nth-of-type(2) {
    width: 110px;
  }

  .article-table-container__af tr > td:nth-of-type(1) {
    position: sticky;
    left: 0;
    background-color: #fff;
  }

  .article-table-container__af tr > td:nth-of-type(1)::after,
  .article-table-container__af tr > td:nth-of-type(1)::before {
    content: "";
    width: 1px;
    height: 100%;
    position: absolute;
    background-color: #ccc;
  }

  .article-table-container__af tr > td:nth-of-type(1)::before {
    left: -1px;
    top: 0;
  }

  .article-table-container__af tr > td:nth-of-type(1)::after {
    right: -1px;
    top: 0;
  }

  .article-table-container__af tr > td:nth-of-type(2) {
    padding: 15px;
  }

  .article-table-container__af tr > td:nth-of-type(3) {
    padding: 15px 10px 20px;
  }

  .article-table-container__af tr > td:nth-of-type(3) ul {
    display: block;
    margin: 0 auto;
    width: 170px;
  }

  .article-table-container__af tr > td:nth-of-type(3) li a {
    padding: 6px;
  }

  .article-table-container__af tr > td:nth-of-type(3) li.af__rakutenmini {
    margin-top: 15px;
  }

  .cta-link-button:hover {
    color: #fff;
    background-color: #d90d0d;
  }

  .cta-link-button:hover:after {
    border-right: 2px solid #fff;
    border-top: 2px solid #fff;
  }

  .article-table-container__af__button {
    font-size: 15px;
    height: 50px;
    width: 93%;
  }

  .tie-up-article-list .footer-pager p,
  .tie-up-article-list .header-pager p {
    margin: 8px 0;
    float: none;
    text-align: center;
  }

  .menu__block {
    width: 100%;
    display: block;
    box-sizing: border-box;
    padding: 10px;
    margin-bottom: 0;
  }

  .menu__search {
    width: 100%;
  }

  .menu__account {
    width: 100%;
    margin-bottom: 0;
  }

  .menu__summary {
    margin-bottom: 10px;
  }

  .menu__input--keyword {
    width: calc(80% - 10px);
  }

  .menu__button--search {
    width: 20%;
  }

  .menu__reminder--item {
    width: 49%;
  }

  .menu__reminder--item br {
    display: block;
  }

  .menu__reminder--item a {
    display: block;
    padding: 5px;
    text-align: center;
    border: solid 1px #ccc;
    border-radius: 4px;
    line-height: 1.4;
  }

  .tieup-pro {
    padding: 8px 4px;
  }

  .tieup-pro .category,
  .tieup-pro dt,
  .tieup-pro .release-date {
    padding: 0;
  }

  .header {
    padding: 12px 0;
  }

  .header__inner {
    width: 100%;
    padding: 0 6px 0 10px;
    box-sizing: border-box;
  }

  .header__logo--sub {
    font-size: 13px;
  }

  .header .tmsLink {
    display: none;
  }

  .header__button--menu {
    right: 10px;
  }

  .header__search {
    background-color: #333;
  }

  .header__search--inner {
    width: 100%;
    padding: 10px;
  }

  .header__search--input {
    width: 75%;
    box-sizing: border-box;
  }

  .header__search--input::-moz-placeholder {
    line-height: 1.65;
  }

  .header__search--input::placeholder {
    line-height: 1.65;
  }

  .header__search--submit {
    width: 25%;
    box-sizing: border-box;
  }

  .header-modal {
    padding: 10px 10px 100px;
  }

  .header-modal .service-nav__inner {
    width: 100%;
    margin: 8px 0 0;
  }

  .header-modal .service-nav__inner--list {
    font-size: 13px;
    width: 50%;
  }

  .header-modal__inner {
    width: 100%;
  }

  .header-modal__heading {
    padding: 0 0 4px;
  }

  .header-modal__catalog--inner {
    display: block;
  }

  .header-modal__catalog__primary {
    width: 100%;
  }

  .header-modal__catalog__secondary {
    width: 100%;
  }

  .header-modal__category-wrap {
    display: block;
    margin-top: 20px;
  }

  .header-modal__category__primary {
    width: 100%;
  }

  .header-modal__category__secondary {
    width: 100%;
    display: block;
  }

  .header-modal__category__secondary .header-modal__new-car,
  .header-modal__category__secondary .header-modal__car-life,
  .header-modal__category__secondary .header-modal__article {
    width: 100%;
  }

  .header__button--menu {
    right: 10px;
  }

  .menu__block {
    width: 100%;
    display: block;
    box-sizing: border-box;
  }

  .menu__search {
    width: 100%;
  }

  .menu__account {
    width: 100%;
    margin: 10px 0 0;
  }

  .menu__summary {
    margin-bottom: 10px;
  }

  .menu__input--keyword {
    width: calc(80% - 10px);
  }

  .menu__button--search {
    width: 20%;
  }

  .menu__reminder--item {
    width: 49%;
  }

  .menu__reminder--item br {
    display: block;
  }

  .menu__reminder--item a {
    display: block;
    padding: 5px;
    text-align: center;
    border: solid 1px #ccc;
    border-radius: 4px;
    line-height: 1.4;
  }

  .navigation {
    margin: 0;
  }

  .navigation .service-nav {
    margin: 0;
  }

  .navigation .service-nav__inner {
    width: 100%;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    margin: 0 0 10px;
  }

  .navigation .service-nav__inner--list {
    font-size: 12px;
  }

  .navigation .service-nav__inner a {
    padding: 10px 8px;
  }

  .header-modal .service-nav__inner {
    width: 100%;
  }

  .header-modal .service-nav__inner--list {
    font-size: 13px;
    width: 50%;
  }

  .header-modal .service-nav__inner--list:nth-child(-n+5) {
    margin-top: 0;
  }

  .article-block .photo-container-first-horizontal {
    display: none;
  }

  .t-related__inner {
    padding: 8px;
  }

  .t-related__article--category {
    font-size: 11px;
    line-height: 17px;
    margin-right: 5px;
  }

  .t-related__article--update {
    font-size: 11px;
    line-height: 17px;
  }

  .t-related__heading {
    font-size: 14px;
  }

  .t-related__pr {
    padding: 2px 5px 0px 5px;
  }

  .t-related__head-pr {
    align-items: flex-end;
  }

  .banner-area {
    width: 100%;
    margin: 0 0 10px;
  }

  .banner-area img {
    width: 100%;
    height: auto;
  }

  .custom_content {
    margin: 0 0 56px;
  }

  .custom_content-list li {
    width: calc((100% - 4px) / 2);
    margin: 0 4px 4px 0;
    font-size: 12px;
  }

  .custom_content-list li:nth-child(2n) {
    margin-right: 0px;
  }

  .custom_content-list li a {
    position: relative;
    height: 70px;
  }

  .custom_content-list li .link-button span.keyword {
    vertical-align: middle;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
  }

  .custom_content-list li .is-pc {
    display: none;
  }

  br {
    display: block;
  }

  .copy {
    font-size: 11px;
  }

  .pt {
    padding: 0;
  }

  .custom_category {
    margin: 0 0 56px 0;
  }

  .custom_category-list li {
    display: inline-block;
    margin: 0 3px 15px 0;
  }

  .custom_category-list li a {
    font-size: 13px;
  }

  .customshop {
    padding: 8px 4px;
  }

  .customshop .category,
  .customshop dt,
  .customshop .release-date {
    padding: 0;
  }

  .campingcar {
    margin: 0 0 56px 0;
  }

  .tie-up-index .campingcar .article-list li {
    width: 48%;
  }

  .fs12 {
    top: 30% !important;
    font-size: 11px;
  }

  .tie-up-index .button-area .link-button span br {
    display: block;
  }

  .is-sp {
    display: block;
  }

  .custom_link .navi .navi__inner {
    width: 100%;
    margin: 8px 0 0;
    padding: 0 2%;
  }

  .custom_link .navi__item {
    font-size: 11px;
  }

  .custom_link .navi .navi__item--main {
    font-size: 14px;
  }

  div.article-container .section-container .article-table-container table {
    width: 100%;
    display: block;
    margin-bottom: 15px;
    font-size: 14px;
    overflow-y: hidden;
    overflow-x: scroll;
    white-space: nowrap;
  }

  div.article-container .section-container .article-table-container table::-webkit-scrollbar {
    height: 5px;
  }

  div.article-container .section-container .article-table-container table::-webkit-scrollbar-track {
    margin: 0 2px;
    background: #ccc;
    border-radius: 5px;
  }

  div.article-container .section-container .article-table-container table::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background: #666;
  }

  div.article-container .section-container .article-table-container table thead {
    width: 100%;
    display: table-header-group;
  }

  div.article-container .section-container .article-table-container table tbody {
    width: 100%;
    display: table-row-group;
  }
}

@media print, screen and (max-width: 480px) {
  /* TODO: new header commonに移植する */

  header {
    width: 100%;
  }

  header .header_logo_container {
    position: relative;
    background-color: #fff;
    width: 100%;
    height: 58px;
    border-bottom: 2px solid #000;
  }

  header .header_logo_container.modal-open-now {
    position: fixed;
    z-index: 500;
  }

  header .header_inner {
    width: 100%;
    padding: 0 10px;
    position: relative;
  }

  header .header_inner::after {
    content: "";
    display: block;
    clear: both;
  }

  header .header_inner .logo {
    padding: 15px 0 0 0;
    display: flex;
    justify-content: flex-start;
    width: 100%;
    align-items: stretch;
  }

  header .header_inner .logo a:hover {
    text-decoration: none;
  }

  header .header_inner .logo svg {
    width: 95px;
    height: auto;
    fill: #231815;
  }

  header .header_inner span.current_service,
  h1.current_service {
    display: inline-block;
    margin: 0 0 0 4px;
    color: #000;
    font-weight: bold;
    font-size: 14px;
    line-height: 30px;
  }

  header .header_inner .hamburger_bk,
  header .header_inner .hamburger {
    position: absolute;
    z-index: 500;
    display: block;
    width: 26px;
    height: 22px;
    top: 0;
    right: 10px;
    margin-top: 16px;
    transition: all 0.4s;
    box-sizing: border-box;
    cursor: pointer;
  }

  header section.service_nav {
    width: 100%;
    margin: 0 auto;
  }

  header section.service_nav::after {
    content: "";
    display: block;
    clear: both;
  }

  header section.service_nav .header_nav_ul {
    width: 100%;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    display: -moz-flex;
    display: flex;
  }

  header section.service_nav .header_nav_ul li {
    font-size: 0.8em;
    text-align: center;
    border-bottom: 5px solid #f7f7f7;
    flex-grow: 1;
    padding: 0 8px;
  }

  header section.service_nav .header_nav_ul li.is-current {
    border-bottom: 5px solid #f90101;
  }

  header section.service_nav .header_nav_ul li a {
    display: inline-block;
    width: 100%;
    height: 100%;
    padding: 7px 0;
  }

  header section.service_nav .header_nav_ul li a:hover {
    text-decoration: none;
    color: #000;
  }

  header section.service_nav .header_nav_ul li a:visited {
    color: #000;
  }

  /*ハンバーガー内ナビゲーション*/

  #navigation {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 52px;
    right: 0;
    z-index: 499;
    background-color: rgba(255, 255, 255, 0.97);
    overflow-y: scroll;
    font-size: 14px;
    line-height: 20px;
    -webkit-overflow-scrolling: touch;
  }

  #navigation h2 {
    font-size: 16px;
    font-weight: bold;
  }

  #navigation h3 {
    font-size: 14px;
    font-weight: bold;
  }

  #navigation .underline_large {
    border-bottom: 2px solid #707070;
    margin: 16px 0 8px;
    width: 100%;
    font-weight: 700;
  }

  #navigation .underline_small {
    border-bottom: 3px solid #c4c4c4;
    padding: 4px 0;
    width: 100%;
  }

  #navigation .general_lst {
    margin: 0 0 16px 0;
  }

  #navigation .general_lst li {
    border-bottom: 1px solid #c4c4c4;
  }

  #navigation .general_lst li a {
    padding: 12px 0 12px 4px;
  }

  #navigation .general_lst_container a {
    display: inline-block;
    width: 100%;
    padding: 12px 0;
    background: no-repeat 98% 50% url(data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20height%3D%2224%22%20viewBox%3D%220%200%209%2028%22%3E%3Cpath%20fill%3D%22%23F26161%22%20d%3D%22M9.297%2015c0%200.125-0.063%200.266-0.156%200.359l-7.281%207.281c-0.094%200.094-0.234%200.156-0.359%200.156s-0.266-0.063-0.359-0.156l-0.781-0.781c-0.094-0.094-0.156-0.219-0.156-0.359%200-0.125%200.063-0.266%200.156-0.359l6.141-6.141-6.141-6.141c-0.094-0.094-0.156-0.234-0.156-0.359s0.063-0.266%200.156-0.359l0.781-0.781c0.094-0.094%200.234-0.156%200.359-0.156s0.266%200.063%200.359%200.156l7.281%207.281c0.094%200.094%200.156%200.234%200.156%200.359z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E);
  }

  #navigation .login_box {
    padding: 12px 15px;
    background: #f7f7f7;
    text-align: center;
  }

  #navigation .login_box .login_container {
    margin: 0 auto;
  }

  #navigation .login_box .login_container li {
    width: 49%;
    display: inline-block;
    text-align: center;
  }

  #navigation .login_box .login_container li a {
    display: block;
    width: 100%;
    padding: 12px 0;
    font-size: 16px;
    line-height: 24px;
    font-weight: bold;
  }

  #navigation .login_box .login_container li a.login {
    background-color: #f26161;
    border: 1px solid #f26161;
    color: #fff;
  }

  #navigation .login_box .login_container li a.login:hover {
    background-color: #d25151;
    text-decoration: none;
  }

  #navigation .login_box .login_container li a.sign_up {
    background: #fff;
    border: 1px solid #707070;
  }

  #navigation .login_box .login_container li a.sign_up:hover {
    background-color: #ccc;
    color: #000;
    text-decoration: none;
  }

  #navigation .top_nav_box {
    width: 100%;
    margin: 0 auto;
    padding: 16px 12px 0 12px;
    display: -moz-flex;
    display: flex;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    flex-wrap: wrap;
  }

  #navigation .top_nav_box .lbox {
    width: 100%;
  }

  #navigation .top_nav_box .rbox {
    width: 100%;
  }

  #navigation .top_nav_box .service_nav .header_nav_ul {
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 0 0 10px 0;
  }

  #navigation .top_nav_box .service_nav .header_nav_ul li {
    border: 1px solid #c4c4c4;
    height: 44px;
    box-sizing: border-box;
    flex: 0 0 49%;
    margin: 0 2% 8px 0;
  }

  #navigation .top_nav_box .service_nav .header_nav_ul li:nth-child(2n) {
    margin-right: 0;
  }

  #navigation .top_nav_box .service_nav .header_nav_ul li a {
    padding: 0;
    display: -moz-flex;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #navigation .top_nav_box .service_nav .header_nav_ul li a:hover {
    background-color: #c4c4c4;
    color: #000;
    text-decoration: none;
    transition: all 0.5s 0s ease;
  }

  #navigation .top_nav_box .catalog_container .maker_lst {
    display: -moz-flex;
    display: flex;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    flex-wrap: wrap;
    font-size: 12px;
    margin: 8px 0 0;
  }

  #navigation .top_nav_box .catalog_container .maker_lst li {
    margin: 0 0 8px 0;
    width: 20%;
    text-align: center;
  }

  #navigation .top_nav_box .catalog_container .maker_lst li:nth-child(6n+1) {
    clear: both;
  }

  #navigation .top_nav_box .catalog_container p a {
    display: block;
    padding: 12px 0;
    width: 100%;
    border-top: 1px solid #c4c4c4;
    border-bottom: 1px solid #c4c4c4;
    background: no-repeat 98% 50% url(data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2212%22%20height%3D%2224%22%20viewBox%3D%220%200%209%2028%22%3E%3Cpath%20fill%3D%22%23F26161%22%20d%3D%22M9.297%2015c0%200.125-0.063%200.266-0.156%200.359l-7.281%207.281c-0.094%200.094-0.234%200.156-0.359%200.156s-0.266-0.063-0.359-0.156l-0.781-0.781c-0.094-0.094-0.156-0.219-0.156-0.359%200-0.125%200.063-0.266%200.156-0.359l6.141-6.141-6.141-6.141c-0.094-0.094-0.156-0.234-0.156-0.359s0.063-0.266%200.156-0.359l0.781-0.781c0.094-0.094%200.234-0.156%200.359-0.156s0.266%200.063%200.359%200.156l7.281%207.281c0.094%200.094%200.156%200.234%200.156%200.359z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E);
  }

  #navigation .bottom_nav_box {
    width: 100vw;
    margin: 0 auto 60px;
    padding: 0 12px;
    overflow: auto;
  }

  #navigation .bottom_nav_box .bottom_nav_container {
    margin: 0 0 16px 0;
  }

  #navigation .bottom_nav_box .bottom_nav_3 .general_lst li:first-child {
    border-bottom: 1px solid #707070;
  }

  /* TODO: new header commonに移植する ここまで */

  /*ページトップ*/

  .pagetop {
    display: none;
    position: fixed;
    bottom: 100px;
    right: 15px;
    z-index: 10;
  }

  .pagetop a {
    font-size: 15px;
    line-height: 30px;
    padding: 12px 5px 0 5px;
    width: 50px;
    height: 50px;
  }

  .pagetop a svg {
    top: 18px;
    right: 19px;
  }

  /*ページャー*/

  .tie-up-article-list .header-pager {
    margin: 20px 0 30px 0;
  }

  /*トップ 上部特選コンテンツ立て並び*/

  .recommend-choice-article.for-index ul {
    display: block;
  }

  .recommend-choice-article.for-index ul li dl {
    width: 100%;
    margin: 0 0 12px 0;
  }

  .recommend-choice-article.for-index ul li dl::after {
    content: "";
    display: block;
    clear: both;
  }

  .recommend-choice-article.for-index ul li dl dd.thumb {
    float: left;
    margin: 0 8px 0 0;
  }

  .recommend-choice-article.for-index ul li dl dt {
    font-size: 13px;
    line-height: 16px;
  }

  .tie-up-index .recent_recommend .article-list li dl {
    line-height: 24px;
  }

  /*リスト折り返し*/

  .tie-up-index .recent_recommend .article-list li:nth-child(2n+1),
  .tie-up-index .news .article-list li:nth-child(2n+1) {
    clear: both;
  }

  /*トップ 新着スライダー */

  .tie-up-index section.recent_post .swiper-slide {
    width: 100% !important;
  }

  .tie-up-index section.recent_post .swiper-slide p {
    position: initial;
    height: 84px;
  }

  /*トップ　サイドカラム特選コンテンツ横スクロール */

  .side-column section.recommend-choice-article {
    padding: 32px 16px;
  }

  .side-column section.recommend-choice-article ul {
    display: -moz-flex;
    display: flex;
    overflow: auto;
  }

  .side-column section.recommend-choice-article li dl {
    width: 155px;
    margin: 0 12px 0 0;
    padding: 4px;
  }

  .side-column section.recommend-choice-article li dl.tieup-pro-side {
    box-shadow: 0 4px 6px #bbb;
    background-color: #fff4dd;
    border-bottom: 3px solid;
    -o-border-image: linear-gradient(to right, #fff4dd, #ffd06c, #f7de05, #edac06, #f7de05, #ffd06c, #fff4dd) 1 100%;
    border-image: linear-gradient(to right, #fff4dd, #ffd06c, #f7de05, #edac06, #f7de05, #ffd06c, #fff4dd) 1 100%;
    border-image-slice: 1;
  }

  .side-column section.recommend-choice-article li:last-child dl {
    margin: 0;
  }
}