@charset "UTF-8";
/** ================================================

  Responsive Settings

================================================ */
/** ================================================

  Easing Settings

================================================ */
/** ================================================

  Font Settings

================================================ */
/** ================================================

  Object Size

================================================ */
/** ================================================

  Utility

================================================ */
/** ================================================

  Responsive

================================================ */
@media all and (min-width: 768px) {
  /* メインパネル画像 */
  #diy_about_title {
    width: 920px;
    margin: 0 auto 62px;
    text-align: center;
  }
  .diy_about_line {
    display: none;
  }
  /* DIY部とは？本文 */
  #diy_about_body {
    width: 920px;
    margin: 0 auto;
  }
  #diy_about_body p {
    font-size: 14px;
    margin-bottom: 20px;
    color: #653d1a;
  }
  #diy_about_body .tit {
    display: block;
    margin-bottom: 26px;
  }
  .diy_about_body_inner01 {
    background: url(../images/content01_bg.png) no-repeat;
    padding-left: 303px;
    height: 300px;
    box-sizing: content-box;
  }
  .diy_about_body_inner02 {
    background: url(../images/content02_bg.png) no-repeat;
    padding-left: 112px;
    width: 808px;
    height: 307px;
    box-sizing: content-box;
  }
  .diy_about_body_inner03 {
    background: url(../images/content03_bg.png) no-repeat;
    padding-left: 304px;
    height: 407px;
    width: 616px;
    padding-top: 56px;
    box-sizing: content-box;
  }
  .diy_about_body_inner04 {
    background: url(../images/content04_bg.png) no-repeat;
    padding-left: 112px;
    width: 808px;
    height: 345px;
    box-sizing: content-box;
  }
  /* DIY部のおすすめ情報 */
  #diy_about_recommend {
    margin-bottom: 0;
    margin-top: -25px;
  }
  #diy_about_recommend .recommend_inner {
    background: url(../images/recommend_bg.png) repeat-x top center;
    height: 512px;
  }
  #diy_about_recommend h2 {
    width: 920px;
    margin: 0 auto;
    text-align: center;
    margin-bottom: -64px;
  }
  #diy_about_recommend .recommend_inner ul {
    padding-left: 0;
    padding-top: 81px;
    width: 920px;
    margin: 0 auto;
  }
  #diy_about_recommend .recommend_inner li {
    float: left;
    display: inline;
    position: relative;
    width: 284px;
    height: 386px;
    background: url(../images/recommend_item_bg.png);
  }
  #diy_about_recommend .recommend_inner li:nth-child(2) {
    margin: 0 34px;
  }
  #diy_about_recommend .recommend_inner li a {
    display: block;
  }
  #diy_about_recommend .recommend_inner li a:hover {
    opacity: 0.6;
    text-decoration: none;
  }
  #diy_about_recommend .recommend_inner h3 {
    margin-top: 22px;
    text-align: center;
    font-size: 0;
  }
  #diy_about_recommend .recommend_inner p {
    width: 250px;
    margin: 0 auto;
  }
  #diy_about_recommend .recommend_inner picture.img {
    display: block;
    width: 250px;
    margin: 11px auto 0;
  }
  #diy_about_recommend .recommend_inner picture.img > img {
    display: block;
  }
  #diy_about_recommend .recommend_inner p.tit_sp {
    display: none;
  }
  #diy_about_recommend .recommend_inner p.text {
    margin-top: 15px;
    font-size: 13.5px;
  }
  #diy_about_recommend .recommend_inner p.btn {
    position: absolute;
    bottom: 32px;
    left: 29px;
    border: 0;
    padding: 0;
    background-color: transparent;
    text-align: left;
  }
}
@media not all and (min-width: 768px) {
  #diy_about_title > picture,
#diy_about_title > picture > img {
    display: block;
    width: 100%;
    height: auto;
  }
  /* 区切り線 */
  .diy_about_line {
    border: none;
    background: url(../images/line_sp.png) no-repeat center top;
    background-size: auto 100%;
    height: 0.5333333333vw;
    display: block;
  }
  .diy_about_line01 {
    margin-top: 4vw;
    margin-bottom: 6.1333333333vw;
  }
  .diy_about_line02 {
    margin-top: 7.4666666667vw;
    margin-bottom: clac(6.4vw);
  }
  /* DIY部とは？本文 */
  #diy_about_body {
    margin-left: 4vw;
    margin-right: 4vw;
  }
  #diy_about_body .tit {
    display: block;
    margin-bottom: 3.4666666667vw;
  }
  #diy_about_body .tit > picture,
#diy_about_body .tit > picture > img {
    display: block;
    width: 100%;
    height: auto;
  }
  #diy_about_body .text {
    margin-bottom: 3.2vw;
    line-height: 1.4em;
    color: #653d1a;
    font-size: 3.7333333333vw;
  }
  #diy_about_body .diy_about_body_inner04 {
    margin-bottom: 10vw;
  }
  /* DIY部のおすすめ情報 */
  #diy_about_recommend {
    background: url(../images/recommend_bg_sp.png) no-repeat top center, url(../images/recommend_bg_bottom_sp.png) no-repeat bottom center, url(../images/recommend_bg_sp.png) repeat-y top center;
    background-size: 100% auto;
    padding-bottom: 8.4375%;
  }
  #diy_about_recommend h2 {
    margin-bottom: 0;
  }
  #diy_about_recommend h2 > picture,
#diy_about_recommend h2 > picture > img {
    display: block;
    width: 100%;
    height: auto;
  }
  #diy_about_recommend .recommend_inner ul {
    padding-left: 4vw;
    padding-right: 4vw;
    padding-bottom: 5%;
    margin-bottom: 0;
  }
  #diy_about_recommend .recommend_inner li {
    list-style: none;
    margin: 0 0 5%;
    background: url(../images/recommend_item_bg_01.png) no-repeat top center, url(../images/recommend_item_bg_03.png) no-repeat bottom center, url(../images/recommend_item_bg_02.png) repeat-y top center #faf7e3;
    background-size: 100%;
  }
  #diy_about_recommend .recommend_inner li:last-child {
    margin: 0;
  }
  #diy_about_recommend .recommend_inner li > a {
    display: block;
    padding: 5% 5% 6%;
    text-decoration: none !important;
  }
  #diy_about_recommend .recommend_inner h3 {
    display: none;
  }
  #diy_about_recommend .recommend_inner picture.img {
    display: block;
    width: 100%;
    height: auto;
    margin-top: 11px;
  }
  #diy_about_recommend .recommend_inner picture.img > img {
    display: block;
    width: 100%;
    height: auto;
  }
  #diy_about_recommend .recommend_inner p.tit_sp {
    font-size: 3.7333333333vw;
    font-weight: bold;
    color: #68421d;
    text-shadow: none;
    background: url(../images/recommend_item_list.png) no-repeat left 0.8vw;
    background-size: 2.2666666667vw 3.4666666667vw;
    padding: 0 0 0 4.375%;
    margin: 4.6875% 0 5.625%;
  }
  #diy_about_recommend .recommend_inner p.text {
    margin: 0;
    line-height: 1.4em;
    color: #68421d;
    font-size: 3.4666666667vw;
  }
  #diy_about_recommend .recommend_inner p.btn {
    display: none;
  }
}
/*# sourceMappingURL=about.css.map */