@charset "UTF-8";
/* #mainImg 下層ページ
================================================ */
#news { background: #262626; }

@media screen and (min-width: 600px) { #news:before { position: absolute; top: 0; left: 0; z-index: -1; width: 100%; height: 100%; background-size: contain; content: ""; background: #262626 url(../img/common/bg_contents02_pc.png) no-repeat; background-size: 1920px; background-position: top center; } }

#contents { position: relative; }

#contents:before { position: absolute; content: ''; top: -109px; right: 0; width: 100%; height: 0; padding-top: 85.5%; background: url(../img/common/bg_contents01_sp.png) no-repeat top right; background-size: contain; z-index: -1; }

#contents:after { position: absolute; content: ''; top: calc((100% * 0.855) - 109px); right: 0; width: 100%; height: 100%; background: #262626; background-size: contain; z-index: -1; }

@media screen and (min-width: 600px) { #contents:before { display: none; }
  #contents:after { display: none; } }

/*  #pages
================================================ */
#pages { padding-bottom: 50px; margin-top: 9px; }

#pages .newsList { color: #fff; margin-bottom: 35px; }

#pages .newsList .item { border-bottom: 1px solid  #3c3c3c; padding-bottom: 16px; margin-bottom: 7px; }

#pages .newsList .item:last-of-type { margin-bottom: 0; }

#pages .newsList a { text-decoration: none; }

#pages .newsList .cate { border: 1px solid #fff; font-size: 1.2rem; min-width: 48px; display: inline-block; padding: 0 6px; text-align: center; }

#pages .newsList time { font-size: 1.4rem; color: #a7a7a7; display: inline-block; }

#pages .newsList .txt { font-size: 1.5rem; font-weight: bold; line-height: 1.6; padding-top: 4px; }

@media screen and (min-width: 600px) { #pages { padding-bottom: 120px; margin-top: 0; }
  #pages .newsList { margin-bottom: 22px; position: relative; top: -18px; }
  #pages .newsList .item { padding: 21px 0 21px 17px; margin-bottom: 0; }
  #pages .newsList .item a { display: inline-block; width: 977px; float: right; }
  #pages .newsList .cate { display: none; }
  #pages .newsList time { color: #a7a7a7; display: inline-block; padding: 0; margin: 0; border-left: 0; }
  #pages .newsList .txt { display: inline-block; padding-top: 0; }
  #pages .newsList a:hover time, #pages .newsList a:hover .txt { text-decoration: underline; } }

/*  #single
================================================ */
#single { margin-top: 17px; }

@media screen and (min-width: 600px) { #single { margin-top: 0; } }

#single .inner { background: #fff; }

#single .post { padding: 34px 0 32px; }

#single .post .cat { border: 1px solid #262626; font-size: 1.2rem; min-width: 48px; display: inline-block; padding: 1px 5px; text-align: center; }

#single .post .date { font-size: 1.4rem; color: #a7a7a7; display: inline-block; }

#single .post h1 { padding: 9px 0 15px; font-size: 2rem; line-height: 1.5; font-weight: bold; border-bottom: 1px solid #c8c8c8; }

#single .post .img img { display: block; margin: auto; max-width: 100%; max-height: 100%; width: auto; height: auto; }

#single .post .txtWrap p { padding-top: 15px; line-height: 1.85; }

#single .post .txtWrap p img { display: block; margin: auto; max-width: 100%; max-height: 100%; width: auto; height: auto; }

#single .post .txtWrap p img + img { padding-top: 10px; }

#single .post .txtWrap h2 { margin-top: 25px; padding: 8px 12px; background: #f4f5f5; border-left: 6px solid #9ecb3a; font-size: 1.7rem; font-weight: 400; line-height: 1.5; }

#single .post .txtWrap h2 + p { padding-top: 10px; }

@media all and (min-width: 600px) { #single .post { margin: 0 0 40px; padding: 80px 77px 75px; }
  #single .post .cat { padding: 2px 12px; font-size: 1.4rem; }
  #single .post .date { font-size: 1.4rem; padding: 4px 0; }
  #single .post h1 { padding: 7px 0 19px; font-size: 2.2rem; letter-spacing: .06em; }
  #single .post .txtWrap p { padding-top: 30px; font-size: 1.6rem; line-height: 1.8; letter-spacing: .06em; }
  #single .post .txtWrap h2 { margin-top: 35px; padding: 15px 25px; border-left: 7px solid #9ecb3a; font-size: 2rem; }
  #single .post .txtWrap h2 + p { padding-top: 20px; } }

#single .postBtn { background: #262626; padding: 35px 45px 50px; }

@media screen and (min-width: 600px) { #single .postBtn { padding: 0 0 120px; }
  #single .postBtn .btn a { padding-left: 0; padding-right: 0; } }
