@charset 'UTF-8';
/* トップページ */

/* CSS読み込み */
@import url("common.css");
@import url("reset.css");

/* -----------------------------------------------------------------------------
>> header
----------------------------------------------------------------------------- */
.header {
  width: 100%;
}
.header nav {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  background-color: rgba(0,0,0,.5);
  justify-content: center;
}

.header h1 {
  background-color: #fff;
  padding: 30px 1rem;
}

.header nav .menu ul {
  align-items: center;
}

/* -----------------------------------------------------------------------------
>> main
----------------------------------------------------------------------------- */
#content {
  padding-bottom: 5vw;
  background: url("../img/parts/bg01.jpg") top left / 50% no-repeat;
}

main .title h2{
    width:100%;
    text-align:center;
    font-weight:bold;
    padding:5em 0 3em;
    background-size:cover;
    background-attachment: fixed;
    background-position:center;
    font-size:3rem;
    color:#FFF;
  text-shadow: 0 0 2px rgba(0, 0, 0, 0.75), 0 0 4px rgba(0, 0, 0, 0.75), 0 0 10px rgba(0, 0, 0, 0.5), 0 0 20px rgba(0, 0, 0, 0.3);
}

.president_name {
  max-width: 250px;
  width: 100%;
}
main > section {
  position: relative;
  padding: 0;
}
main > section > article {
  max-width: 1220px;
  padding:2.5em 10px;
  margin-left: auto;
  margin-right: auto;
}
main section article:after{
    content:"";
    display:block;
    clear:both;
}
main section img{
    max-width:100%;
}

main article p{
    margin-bottom:2em;
}

main section article:first-child {
  padding-top: 4vw;
}
main section:nth-of-type(n+2) article {
  padding-bottom: 4vw;
}
.box {
  border-top: 5px solid #cdcdcd;
  padding-top: 2rem;
}
.box2 {
  padding-top: 2rem;
}
.box.flex {
  justify-content: space-between;
}
.box.flex.nowrap {
  flex-wrap: nowrap;
}
.box2.flex.nowrap {
  flex-wrap: nowrap;
}
.nowrap img {
  width: 100%;
  height: auto;
}
.box_right {
  text-align: left;
}
.box_right figure {
  margin-bottom: 1rem;
}

.btn_link {
  border-radius: 25px;
  background-color: #189d9c;
  color: #fff;
  padding: 10px 0;
  width: 210px;
  display: block;
  text-align: center;
}
iframe {
  margin-bottom: 1rem;
}
.box_left table {
  margin-right:2em;
}
.box_left table th {
  width: 10em;
  text-align: right;
  vertical-align: top;
  border-right: 3px solid #cdcdcd;
/*  border-bottom: 1px dotted #cdcdcd;*/
  padding: 0.5em 1em 0.5em 0;
}
.box_left table td {
  text-align: left;
  padding: 0.5em 0 0.5em 1em;
  width: 550px;
/*  border-bottom: 1px dotted #cdcdcd;*/
}
.box_left table tr:last-child td {
  padding-bottom: 1rem;
}



#about #s2 .box div {
  width: 83.33%;
  margin: auto;
}
#about #s2 .box h3 + p {
  font-size: 30px;
  margin-bottom: 3rem;
}

#about #s2 .box ul {
  margin: 0 auto 2rem;
  line-height: 1.8;
  text-align: left;
  font-size: 1.875rem;
}

#about #s5 table {
  margin: auto;
  width: 100%;
}
#about #s5 table tr th,
#about #s5 table tr td {
  border-right: 1px solid #cdcdcd;
  border-bottom: 1px solid #cdcdcd;
}
#about #s5 table tr th:last-child,
#about #s5 table tr td:last-child {
  border-right: none;
}
#about #s5 table tr:last-child td {
  border-bottom: none;
}

#about #s5 table th,
#about #s5 table td {
  padding: 18px 15px;
}
#about #s5 table td {
  text-align: left;
}
#about #s5 table tr td:last-child {
  text-align: center;
  font-weight: bold;
  font-size: 1.6rem;
}

#about #s5 .box {
  text-align: left;
}
#about #s5 p {
  font-size: 1.875rem;
  width: 83%;
  margin: auto;
  line-height: 1.4;
  margin-bottom: 3rem;
}


/* -----------------------------------------------------------------------------
>> rp_
----------------------------------------------------------------------------- */
.rp_top {
  padding-top: 40px;
}
.rp_btm {
  padding-bottom: 40px;
}
img.right{
    float:right;
    margin-left:2em;
}

img.right-2{
  float:right;
  margin-left:2em;
}

.rp_list {
  display: flex;
}

.rp_list dt{
  width: 100px;
  text-align: right;
  vertical-align: top;
  border-right: 3px solid #cdcdcd;
  padding-right: 20px;
}

.rp_list dd {
  flex: 1 1 0%;
  padding-left: 30px;
  padding-bottom: 30px;
}


.list_box {
  display: flex;
  justify-content: space-between;
}

.list_box__child dt {
  border-bottom: 3px solid #cdcdcd;
  margin-bottom: 20px;
}

.list_box__child dd li {
  list-style: inside;
  font-size: 1rem;
}


.rp_img_wrap {
  display: flex;
}

.rp_img{
  max-width: 800px;
  padding-top: 30px;
  padding-top: 10px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.rp_img img {
  width: 100%;
  height: auto;
}

.rp_img figcaption {
  display: block;
}



.rp_table {
  border: 3px solid #cdcdcd;
  margin-left: auto;
  margin-right: auto;
}

.rp_table tr {
  border-bottom: 1px solid #cdcdcd;
}


.rp_table th {
  padding: 10px;
  width: 200px;
  background-color: #cdcdcd;
  border-bottom: 1px solid #fff;
  border-right: 1px solid #fff;
  padding-right: 5px;
}

.rp_table td {
  padding: 10px;
  border-right: 1px solid #cdcdcd;
}

.rp_table li {
  display: flex;
}

.rp_table li:before {
  content: "・";
  display: block;
}

.work_sec th {
  width: 140px;
}


/* -----------------------------------------------------------------------------
>> 技術紹介
----------------------------------------------------------------------------- */
body#work .title h2{
  background-image: url("../img/photo/mv_work.jpg");
}

.work_sec1 .rp_img {
  max-width: 300px;
}


/* -----------------------------------------------------------------------------
>> 応用例
----------------------------------------------------------------------------- */
body#application .title h2{
  background-image: url("../img/photo/mv_application.jpg");
}


/* -----------------------------------------------------------------------------
>> CFRP販売
----------------------------------------------------------------------------- */
body#cfrp .title h2{
  background-image: url("../img/photo/mv_cfrp.jpg");
    background-position:bottom;
}

/* 製造・販売について */
.sales {
  width: 100%;
  margin: auto;
  background: url("../img/parts/bg02.jpg") center / cover no-repeat;
  background-attachment: fixed;
}
.sales p { margin-bottom: 1rem; }
.shop_box {
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 3rem;
}
.shop_item img { width: 100%; }
.carousel .owl-stage:after {content: none !important;}
.shop_item table {
  text-align: left;
  background-color: rgb(256,256,256,0.6);
  padding: 15px;
  font-size: 1rem;
  width:100%;
}
.shop_item th {
    width:5em;
}
.shop_item th ,
.shop_item td {
    text-align:left;
    padding:0.2em 1em;
    font-family: 'Noto Sans JP';
}
.shop_item strong{
  font-size: 1.4rem;
  font-weight: bold;
}
.shop_item p {
  text-align: right;
  background-color: rgb(256,256,256,0.6);
  border-top: 10px solid #AFAFAF;
  padding: 10px 15px 10px 0px;
  font-size: 1.5rem;
  color: #B84A3C;
  font-weight: bold;
}
.order_btn {
  display: block;
  padding: 0.5em 4em;
  margin:auto;
  width: fit-content;
  color: #FFF;
  font-size: 2rem;
  font-weight: bold;
/*  background:  url("../img/icon/plus.svg") center right 20px / 30px  no-repeat #F60;*/
background:#F60;
  border-radius:2em;
  text-align:center;
  border-bottom:3px solid #af3800;
}
.carousel .owl-item {  width: 32%; }
.owl-stage {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.shop_spec{
  display: flex;
}

.shop_spec div{
  padding:20px;
  font-size: 1rem;
  text-align: left;
  width:50%;
}

.shop_spec div h5{
  font-weight: bold;
  font-size: 1.15rem;
  border-bottom:1px solid #189D9C;
}

.shop_spec-50{
  display: flex;
  flex-wrap :wrap;
}

.shop_spec-50 div{
  padding:20px;
  font-size: 1rem;
  text-align: left;
  width:50%;
}

.shop_spec-50 div ol li{
  list-style-type: decimal;
    list-style-position: outside;
    margin-left: 1.5em;
}

.shop_spec-50 div h5{
  font-weight: bold;
  font-size: 1.15rem;
  border-bottom:1px solid #189D9C;
}

/* オーダーメイド */
.order h3 {
  font-size: 2rem;
  margin-bottom: 2rem;
}
.order p,
.order img {
  width: 100%;
  margin-bottom: 1rem;
}
.jax_img {
  flex-wrap: wrap;
  justify-content: space-between  ;
}
.jax_anz {
  width: 100%;
  max-width: 440px;
}
.award {
  width: 100%;
  max-width: 620px;
}
.flex_img{
    clear:both;
    display:flex;
    margin-bottom:3em;
    padding-top:1em;
}
.flex_img figure{
    margin:1em;
}
.flex_img figure,
.flex_img figure img{
    width:100%;
}

/* -----------------------------------------------------------------------------
>> 応用例
----------------------------------------------------------------------------- */
body#service .title h2{
  background-image: url("../img/photo/mv_service.jpg");
}
body#service img.left,
body#service img.right{
    max-width:400px;
}
body#service main .flex > *{
    margin:0.5em;
}
/* -----------------------------------------------------------------------------
>> 会社案内
----------------------------------------------------------------------------- */
body#about .title h2{
  background-image: url("../img/photo/mv_about.jpg");
    background-position:bottom;
}
body#about figure {
    text-align:center;
}
body#about figure img{
    max-width:500px;
}
body#about main address{
    text-align:center;
    padding:2em;
    background-color:#EEE;
}
body#about main iframe{
    width:100%;
    height:350px;
}
/* -----------------------------------------------------------------------------
>> お問い合わせ
----------------------------------------------------------------------------- */
body#contact .title h2{
  background-image: url("../img/photo/mv_contact.jpg");
    background-position:bottom;
}


.form table { margin: auto auto 4rem; width:100%;}
.form table th b{
    color:#F60;
    font-size:0.7em;
    font-weight:bold;
}
.form table tr { border-bottom: 1px solid #ccc; }
.form table th {
  text-align: left;
  padding: 30px 10px;
}
.form table td {
text-align: left;
  padding: 0.5em;
  width: 65%;
}
input,
textarea {
  background-color: #fff;
  border: 1px solid #ccc;
  width: 100%;
  padding:0.5em;
  border-radius:3px;
}
textarea {
  height: 200px;
}
.privacy {
  height: 300px;
  overflow-y: scroll;
  margin-bottom: 60px;
  padding: 20px;
background-color: #EEE;
font-size:0.8em;
}
.privacy h4 {
  margin-bottom: 1rem;
  font-weight: bold;
}
.privacy ul,
.privacy ul li {
  margin: 1rem auto;
}
.form_btn input{
  padding: 10px 20px;
  background-color: #189D9C;
  color: #fff;
  margin: 0 20px;
  width: 25%;
  border:none;
}
/* -----------------------------------------------------------------------------
>> footer
----------------------------------------------------------------------------- */

/* -----------------------------------------------------------------------------
>> PC用
----------------------------------------------------------------------------- */
/* モニター幅960px以上 ---------------------------------------------------------- */
@media only screen and (min-width: 960px) {
  .sp_onely {
    display: none;
  }
}

/* -----------------------------------------------------------------------------
>> レシポンシブ対応
----------------------------------------------------------------------------- */
/* iPad 縦 ------------------------------------------------------------------ */
@media only screen and (max-width: 959px) {
  /* main section article {
    width: 90%;
  } */
  /* main > section:nth-of-type(odd) { padding: 15vw 0; } */
    main .title h2{
      padding:2.5em 0;
      background-attachment: initial;
      background-position:center;
    }
  main > section h2 {
    font-size: 1.6rem;
  }
  
  h2::after {
    bottom: -15px;
    left: calc(50% - 40px);
    display: block;
    width: 75px;
    height: 8px;
    background-color: #189d9c;
  }
  
  
  
  .pc_onely {
    display: none;
  }

  #content {
    padding-top:0;
    background-size: contain;
  }

  .box_left {
    margin-bottom: 1rem;
  }
  .box_left table {
    margin: 0;
  }
  .box_right img {
    width: 100%;
  }
  .box_right .btn_link {
    margin: auto;
  }
  .box.flex {
    flex-wrap: wrap;
  }
  /* フッター */
  footer.flex {
    display: block;
  }

  footer .link_list {
    margin: 0;
    padding: 1rem;
    display: block;
  }
  footer .link_list ul {
    margin-bottom: 1rem;
  }
  .address {
    margin: 1rem;
    text-align: center;
    font-size: 0.5rem;
  }
  .address img {
    width: 90%;
    margin-bottom: 1rem;
  }
  address {
    padding: 1rem 5rem;
    line-height: 1.8;
  }
}


@media only screen and (max-width:768px) {
  .rp_table {
    font-size: 1rem;

  }

  .cfrp_sec2 .rp_img_wrap {
    display: block;
  }

  .rp_list {
    display: block;
  }
  .rp_list dt {
    border-right: 0;
    border-bottom: 3px solid #cdcdcd;
    width: 100%;
    padding-right: 0;
    text-align: center;
    color: #797979;
    font-weight: bold;
  }
  .rp_list dd {
    font-size: 1rem;
    line-height: 1.8;
    padding-left: 0;
    text-align: justify;
  }

  /* 製造・販売について */
  .sales h3{ font-size: 1.7rem; }
  .sales h4{ width: 70%; }


   .shop_item dl,
   .shop_item p{background-color: #fff;}
   .shop_item dt:nth-child(n+3):nth-child(-n+9) { width: 20%; }


  
  .shop_spec{
    display: block;
  }
  
  .shop_spec div{
    width:100%;
  }
  
  .shop_spec-50{
    display: block;
  }
  
  .shop_spec-50 div{
    width:100%;
  }
  .list_box {
    display: block;
  }
  .list_box__child {
    padding-bottom: 20px;
  }
  .list_box__child:last-of-type {
    padding-bottom: 0;
  }

  .rp_img figcaption {
    font-size: 1rem;
    line-height: 1.8;
  }
  
  img.right-2{
    float:none;
    margin-left:0;
  }
}