@charset "UTF-8";
/* .mainImg
================================================ */
#mainImg { background-image: url(../img/composite/mainimg01_pc.png); }

@media screen and (max-width: 599px) { #mainImg { background-image: url(../img/composite/mainimg01_sp.png); } }

/* #composite
================================================ */
@media screen and (max-width: 599px) { .mod_inner02 { width: auto; margin: 0 15px; } }

.txt { line-height: 2.0; }

@media screen and (max-width: 599px) { .txt { font-size: 1.5rem; } }

.mod_tit03 { margin-bottom: 30px; }

@media screen and (max-width: 599px) { .mod_tit03 { margin-bottom: 20px; } }

.tit + .txt { margin-top: -10px; }

.bnrContact { overflow: hidden; background: #fff; width: 740px; border: solid 1px #64452d; margin: 0 auto; margin-top: 20px; }

.bnrContact .tit { float: left; }

.bnrContact .txtArea { float: right; width: 401px; }

.bnrContact .txt { text-align: center; padding: 25px 30px 10px; line-height: 1.8; }

.bnrContact .btn a { text-decoration: none; }

.bnrContact .btn .is_font_oswald { color: #a32626; font-size: 3.8rem; padding-left: 100px; line-height: 1; position: relative; }

.bnrContact .btn .is_font_oswald:before { position: absolute; content: ""; width: 30px; height: 30px; background: url(../img/composite/ico_tel01.png) no-repeat; background-size: contain; top: 7px; left: 65px; }

@media screen and (max-width: 599px) { .bnrContact { width: 100%; }
  .bnrContact .tit { float: none; margin-top: -1px; }
  .bnrContact .txt { padding: 15px 0 10px; }
  .bnrContact .txtArea { float: none; width: 100%; }
  .bnrContact .btn { background: #f6f6f6; margin: 0 15px 20px; border-bottom: solid 3px #d1d1d1; }
  .bnrContact .btn a { display: block; padding: 15px; }
  .bnrContact .btn .is_font_oswald { font-size: 3.6rem; padding-left: 55px; }
  .bnrContact .btn .is_font_oswald:before { top: 5px; left: 20px; }
  .bnrContact .btn .tag { font-size: 1.3rem; text-align: center; color: #25201f; background: #fff; border-radius: 24px; margin: 0 auto 10px; width: 60%; } }

@media screen and (max-width: 320px) { .bnrContact .btn .is_font_oswald { font-size: 2.9rem; padding-left: 45px; }
  .bnrContact .btn .is_font_oswald:before { width: 24px; height: 24px; top: 5px; left: 10px; } }

/* #anchor コンポジット事業部
================================================ */
#anchor { margin: 56px 0 60px; }

#anchor .btnWrap { overflow: hidden; }

#anchor .btnWrap .btn { float: left; width: 204px; height: 60px; }

#anchor .btnWrap .btn a { font-size: 1.5rem; line-height: 1.4; padding: 9px; }

#anchor .btnWrap .btn a:after { top: 47%; width: 9px; height: 6px; background: url(../img/common/ico_arrow05.png) no-repeat; }

#anchor .btnWrap .btn:first-child a { padding: 20px; }

#anchor .btnWrap .btn + .btn { margin-left: 20px; }

@media screen and (max-width: 599px) { #anchor { margin: 0 0 40px; }
  #anchor .btnWrap .btn { width: 48%; margin-bottom: 15px; }
  #anchor .btnWrap .btn a { font-size: 1.3rem; padding: 12px 20px 12px 5px; line-height: 1.4; }
  #anchor .btnWrap .btn a:after { right: 10px; }
  #anchor .btnWrap .btn + .btn { margin-left: 0; }
  #anchor .btnWrap .btn:nth-child(2n) { margin-left: 4%; } }

#intro { padding-top: 130px; margin-top: -130px; margin-bottom: 100px; }

#intro .point .itemList { overflow: hidden; }

#intro .point .itemList .item { width: 535px; margin-bottom: 30px; float: left; background: #fff; border: solid 1px #dfdede; box-sizing: border-box; position: relative; }

#intro .point .itemList .item:nth-child(2n) { margin-left: 30px; }

#intro .point .itemList .item .tag { color: #a32626; font-weight: 500; font-size: 2.4rem; background: #fff; display: block; padding: 7px 0 8px; width: 125px; text-align: center; position: absolute; top: 43px; left: 90px; }

#intro .point .itemList .item .tit { background: url(../img/composite/bg_point01.png); padding: 40px 0 40px 235px; color: #fff; font-size: 2.0rem; line-height: 1.5; }

#intro .point .itemList .item .tit + .txt { margin-top: 0; }

#intro .point .itemList .item .txt { text-align: center; padding: 25px; line-height: 1.5; }

@media screen and (max-width: 599px) { #intro { padding-top: 70px; margin-top: -70px; margin-bottom: 50px; }
  #intro .point .itemList .item { float: none; width: 100%; margin-bottom: 20px; }
  #intro .point .itemList .item:nth-child(2n) { margin-left: 0; }
  #intro .point .itemList .item .tag { top: 30px; left: 30%; width: 40%; margin: 0 auto; line-height: 1; padding: 5px 0 7px; }
  #intro .point .itemList .item .tit { padding: 75px 0 25px; text-align: center; }
  #intro .point .itemList .item .txt { text-align: left; padding: 20px 25px; } }

#about { padding-top: 130px; margin-top: -130px; margin-bottom: 100px; }

#about .imgList { overflow: hidden; }

#about .imgList .item { width: 316px; float: left; position: relative; }

#about .imgList .item .txt { text-align: center; line-height: 1.5; margin-top: 10px; }

#about .imgList .item:nth-child(2n) { margin-left: 76px; }

#about .imgList .item:nth-child(2n):before { position: absolute; content: ""; width: 40px; height: 40px; background: url(../img/composite/ico_plus01.png) no-repeat; top: 85px; left: -57px; }

#about .imgList .item:nth-child(3n) { margin-left: 76px; }

#about .imgList .item:nth-child(3n):before { position: absolute; content: ""; width: 40px; height: 40px; background: url(../img/composite/ico_equal01.png) no-repeat; top: 90px; left: -57px; }

#about .useBox { margin: 40px 0 60px; padding: 36px 30px 30px; background: url(../img/common/bg_adress.png); }

#about .useBox .tit { text-align: center; color: #a32626; font-size: 2.0rem; margin-bottom: 18px; }

#about .useBox .useList { overflow: hidden; margin-bottom: 18px; }

#about .useBox .useList .item { float: left; width: 192px; box-sizing: border-box; }

#about .useBox .useList .item + .item { margin-left: 20px; }

#about .bnrContact { margin-top: 55px; }

@media screen and (max-width: 599px) { #about { padding-top: 70px; margin-top: -70px; margin-bottom: 50px; }
  #about .imgList .item { width: 45%; }
  #about .imgList .item:nth-child(2n) { margin-left: 10%; }
  #about .imgList .item:nth-child(2n):before { width: 20px; height: 20px; background-size: contain; top: 25%; left: -17%; }
  #about .imgList .item:nth-child(3n) { margin-top: 20px; margin-left: 28%; }
  #about .imgList .item:nth-child(3n):before { width: 20px; height: 20px; background-size: contain; top: 28%; left: -17%; }
  #about .useBox { margin: 30px 0; padding: 30px 6%; }
  #about .useBox .useList .item { width: 47%; }
  #about .useBox .useList .item + .item { margin: 0; }
  #about .useBox .useList .item:nth-child(2n) { margin-left: 6%; margin-bottom: 6%; }
  #about .bnrContact { margin-top: 30px; } }

#process { padding-top: 130px; margin-top: -130px; margin-bottom: 100px; }

#process .process { margin-top: 50px; }

#process .example { overflow: hidden; margin: 40px 0 45px; padding: 36px 30px 30px; background: url(../img/common/bg_adress.png); }

#process .example .tit { text-align: center; color: #a32626; font-size: 2.0rem; margin-bottom: 18px; }

#process .example .box { float: left; width: 510px; background: #fff; padding: 10px; box-sizing: border-box; }

#process .example .box .tit { background: #a32626; color: #fff; font-size: 1.6rem; padding: 11px; }

#process .example .box + .box { margin-left: 20px; }

#process .example .box .list { margin: 0 0 10px 10px; overflow: hidden; }

#process .example .box .list .item { float: left; width: 150px; font-size: 1.5rem; position: relative; padding-left: 8px; }

#process .example .box .list .item:before { position: absolute; top: 12px; left: 0; content: ''; width: 3px; height: 3px; border-radius: 50%; background: #000; }

#process .bnrtit { color: #a32626; font-size: 2.0rem; text-align: center; }

#process .bnrContact { margin-top: 12px; }

@media screen and (max-width: 599px) { #process { padding-top: 70px; margin-top: -70px; margin-bottom: 50px; }
  #process .process { margin-top: 35px; }
  #process .example { margin: 25px 0 35px; padding: 25px; }
  #process .example .tit { margin-bottom: 10px; }
  #process .example .box { float: none; width: 100%; padding: 5px; }
  #process .example .box + .box { margin-left: 0; margin-top: 20px; }
  #process .example .box .tit { padding: 6px; margin-bottom: 5px; }
  #process .example .box .list { margin-bottom: 5px; }
  #process .example .box .list .item { font-size: 1.4rem; width: 40%; }
  #process .example .box .list .item:nth-child(2n) { width: 50%; }
  #process .example .box .list .item07 { width: 100%; } }

#flow { padding-top: 130px; margin-top: -130px; margin-bottom: 100px; }

#flow .step { overflow: hidden; margin-bottom: 50px; }

#flow .step .item { float: left; width: 268px; padding: 15px 28px 20px; border: solid 1px #a32626; background: #fff; box-sizing: border-box; position: relative; }

#flow .step .item + .item { margin-left: 9px; }

#flow .step .item + .item:before { position: absolute; content: ''; width: 0; height: 0; top: calc(50% - 27px); left: -10px; border-style: solid; border-width: 27px 0 27px 19px; border-color: transparent transparent transparent #a32626; }

#flow .step .item .tit { text-align: center; color: #a32626; font-size: 2.0rem; margin-bottom: 15px; }

#flow .step .item .tit .is_font_oswald { font-size: 2.4rem; font-weight: 500; line-height: 1; }

#flow .step .item .txt { line-height: 1.8; }

@media screen and (max-width: 599px) { #flow { padding-top: 70px; margin-top: -70px; margin-bottom: 50px; }
  #flow .step { margin-bottom: 40px; }
  #flow .step .item { float: none; width: 100%; padding: 20px 25px; }
  #flow .step .item + .item { margin-left: 0; margin-top: 10px; }
  #flow .step .item + .item:before { width: 0; height: 0; top: -11px; left: calc(50% - 30px); border-style: solid; border-width: 20px 30px 0 30px; border-color: #a32626 transparent transparent transparent; }
  #flow .step .item .tit { line-height: 1.1; margin-bottom: 20px; }
  #flow .step .item .tit .is_font_oswald { margin-right: 10px; } }

#facility { padding-top: 130px; margin-top: -130px; margin-bottom: 80px; }

#facility .imgWrap { overflow: hidden; }

#facility .imgWrap .img { width: 354px; float: left; margin-left: 19px; margin-bottom: 20px; position: relative; }

#facility .imgWrap .img .tag { width: 150px; height: 24px; font-size: 1.3rem; color: #fff; background: #a22626; text-align: center; position: absolute; bottom: 10px; left: calc(50% - 75px); }

#facility .imgWrap .img:first-child, #facility .imgWrap .img:nth-child(4), #facility .imgWrap .img:nth-child(7) { margin-left: 0; }

@media screen and (max-width: 599px) { #facility { padding-top: 70px; margin-top: -70px; margin-bottom: 30px; }
  #facility .imgWrap .img { float: none; width: 100%; margin-left: 0; } }

#info { padding-top: 130px; margin-top: -130px; }

#info .img { float: left; width: 480px; }

#info .table { float: right; width: 590px; }

@media screen and (max-width: 599px) { #info { padding-top: 70px; margin-top: -70px; }
  #info .img { float: none; width: 100%; margin-bottom: 20px; }
  #info .table { float: none; width: 100%; } }
