@charset "UTF-8";


/* sass */
.area-pagettl::before { background-image: url(/about/network/image/bg-pagettl-network-sp.jpg); content: ''; }

.area-pagettl .hdg-wrap .hdg-sub { font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: normal; }

.network-list .network-item { margin-top: 40px; }

.network-list .network-item .network-link { display: block; }

.network-list .network-item .network-link .network-img { margin: 0 -16px; }

.network-list .network-item .network-link .network-box { color: #333; margin-top: 15px; padding: 0; position: relative; }

.network-list .network-item .network-link .network-box::after { background: url(/shared/images/icn-link-arr.svg) no-repeat center center transparent; background-size: contain; content: ''; height: 9px; position: absolute; right: 3px; top: .5em; width: 24px; }

.network-list .network-item .network-link .network-box .ttl { font-size: 2rem; padding-right: 30px; }

.network-list .network-item .network-link .network-box .cnt { margin-top: 10px; }

.box-recommend-shop { background-color: #EDE8E1; margin: 40px -16px 0; }

.box-recommend-shop .recommend-shop-box { color: #333; display: block; padding: 24px; }

.box-recommend-shop .recommend-shop-box .ttl { font-size: 3rem; }

.box-recommend-shop .recommend-shop-box .ttl a { color: #333; }

.box-recommend-shop .recommend-shop-box .ttl a::after { background: url(/shared/images/icn-link-arr.svg) no-repeat center center transparent; background-size: contain; content: ''; display: inline-block; height: 1.5em; margin-left: 12px; vertical-align: middle; width: 24px; }

.box-recommend-shop .recommend-shop-box .icn-list { align-content: flex-start; align-items: stretch; display: flex; flex-flow: row wrap; justify-content: flex-start; margin: 0 6px; }

.box-recommend-shop .recommend-shop-box .icn-list .icn-item { margin-top: 40px; padding: 0 12px; width: calc((100% - 1px) / 3); }

.box-recommend-shop .recommend-shop-box .icn-list .icn-item a { color: #333; display: block; }

.box-recommend-shop .recommend-shop-box .icn-list .icn-item a .icn-img { box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); }

.box-recommend-shop .recommend-shop-box .icn-list .icn-item a .icn-img img { width: 100%; }

.box-recommend-shop .recommend-shop-box .icn-list .icn-item a .icn-txt { margin-top: 8px; }

@media all and (min-width: 768px) { .area-pagettl::before { background-image: url(/about/network/image/bg-pagettl-network-pc.jpg); }
  .network-list { display: flex; margin: 0 -20px; }
  .network-list .network-item { margin-top: 40px; padding: 0 20px; width: calc((100% - 1px) / 3); }
  .network-list .network-item .network-link { transition: opacity .2s ease; }
  .network-list .network-item .network-link:hover { opacity: .5; }
  .network-list .network-item .network-link .network-img { margin: 0; }
  .box-recommend-shop { align-content: flex-start; align-items: stretch; display: flex; flex-flow: row nowrap; margin: 60px 0 0; }
  .box-recommend-shop .recommend-shop-img { width: 50%; }
  .box-recommend-shop .recommend-shop-box { align-content: center; align-items: center; display: flex; flex-flow: row wrap; justify-content: center; padding: 45px; width: 50%; }
  .box-recommend-shop .recommend-shop-box .ttl { font-size: 3rem; width: 100%; }
  .box-recommend-shop .recommend-shop-box .ttl a { transition: opacity .2s ease; }
  .box-recommend-shop .recommend-shop-box .ttl a:hover { opacity: .5; }
  .box-recommend-shop .recommend-shop-box .cnt { flex-grow: 0; width: 100%; }
  .box-recommend-shop .recommend-shop-box .cnt .icn-list { align-content: flex-start; align-items: stretch; display: flex; flex-flow: row nowrap; justify-content: flex-start; margin: 0 0 0 -25px; width: calc(100% + 25px); }
  .box-recommend-shop .recommend-shop-box .cnt .icn-list .icn-item { flex-grow: 1; flex-shrink: 1; margin-left: 25px; padding: 0; width: calc(20% - 25px); }
  .box-recommend-shop .recommend-shop-box .cnt .icn-list .icn-item a { transition: opacity .2s ease; }
  .box-recommend-shop .recommend-shop-box .cnt .icn-list .icn-item a:hover { opacity: .5; } }