/*
 * 【はじめに】
 * 最終的には可能な限り、コメントは削除してください。
 * ここに記載しているコメントもほぼ不要です(auPay start / ecd は必要)
 * 変数の使い方
 * $ec_dir ･･･ それぞれ各ECの絶対パス(現状)
 * $ec_id ･･･ それぞれ各ECのID(CSVで設定している分)
 *
 * 例：background-image: url($ec_dir + '/img/bn_main_background_sp.jpg');
 *
 * SCSSについて
 * 例：if制御
 *  @if $shop == 1 {
 * 		#pc_header.ac img {
 *			width: initial;
 *		}
 *	}
 *
 * 今分かっている問題
 * 1.rgb()について
 *   rgba()を利用してください。うまく変換されません
 */
/* auPayについては、figureタグ等利用できないタグがあり、変換して利用する事になる
 * その変換されたタグ用にCSSを設定する必要があるので、下記コメントタグを利用し、
 * 開始・終了で閉じる事
 * また、if制御を利用して切り替えると楽
 * @if $shop == 5 {
 *	.studless .recommend > h3 > img {
 *		width: 100%;
 *	}
 * } @else {
 *	.studless .recommend > div img {
 *		width: 100%;
 *	}
 * }
 */
/*common*/
@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@400;700;900&display=swap');
.davanti {
  background-color: #000;
  color: #fff;
  font-size: 16px; }

.davanti * {
  font-family: 'M PLUS 1p', sans-serif; }

.davanti figure {
  margin: 0; }

.davanti img {
  max-width: 100%;
  height: auto;
  /*header*/ }

.davanti header .bread_crumb {
  font-size: 12px;
  padding: 0.5em; }

.davanti header .bread_crumb a {
  color: #fff;
  font-weight: 500;
  text-decoration: underline;
  margin-right: 0.5em; }

.davanti header .bread_crumb span {
  margin-right: 0.5em; }

.davanti .aw_header {
  background-color: #000;
  display: block;
  height: 32px;
  padding: 20px 0 5px;
  text-align: center; }

.davanti .aw_header img {
  width: 160px;
  position: relative;
  z-index: 1;
  margin: 0 auto;
  /*main*/ }

.davanti > main {
  width: 100%;
  background: url("/asp/photo/auction/brand/davanti/img/lrm_back.jpg");
  background-size: cover;
  padding: 20px 0;
  color: #000; }

.davanti main img {
  width: 100%; }

.davanti h1 {
  margin: 0 20px 20px;
  font-size: 1.3em; }

.davanti h1 ruby {
  color: #448a05; }

.davanti main section > div > div {
  margin: 20px; }

.davanti p {
  margin-top: 0;
  margin-bottom: 20px;
  /*フッター*/ }

footer nav {
  background-color: #eb5c05;
  text-align: center;
  padding: 20px; }

footer nav a {
  color: #fff;
  text-decoration: none; }

footer nav li {
  display: inline-block;
  margin: 10px 20px; }

footer nav li:first-child {
  padding: 5px 10px;
  background-color: #555559;
  border-radius: 5px; }

footer small {
  display: block;
  background-color: #555559;
  color: #fff;
  padding: 10px 0;
  text-align: center; }

@media screen and (min-width: 768px) {
  .davanti header, .davanti section {
    max-width: 1140px;
    margin: 0 auto;
    /*ヘッダー*/ }
    .davanti header .bread_crumb {
      font-size: 14px; }
    .davanti h1 {
      text-align: center;
      margin-bottom: 20px;
      font-size: 2em;
      line-height: 40px; }
    .davanti main img {
      width: 45%; }
    .davanti main section > div {
      display: flex;
      align-items: flex-start; }
    .davanti main section > div > div {
      margin: 0 20px;
      font-size: 0.9em; } }
